/* Styles für artikel.php */


.artikelname h1 {
	font-size: 26px;
 	color: #1C3E68;
}


.untertitel {
	font-size: 16px;
	color: #202A3B; 
	margin-bottom: 15px;
}

.preis {
	display: inline;
	font-weight: bold; color: #BC0521; font-size: 120%; font-family: Tahoma, Geneva, sans-serif;
	opacity: 0.9;
}


.lieferbarkeit-gruen {
	display: inline;
	/*  font-weight: bold; color: #006400; font-size: 100%; */ 
	font-weight: bold; color: #1B721B; font-size: 100%;
}

.lieferbarkeit-orange {
	display: inline;
	font-weight: bold; color: #C86B00; font-size: 100%;
}

.lieferbarkeit-rot {
	display: inline;
	font-weight: bold; color: #BC0521; font-size: 100%;
}



.einzelbild {
	max-width: 100%;
	max-height: 350px;
}


@media (max-width: 480px) {
	.preis {
		width: 350px;
		height: auto;
	}
}

.preis-uvp {
	display: inline;
	color: #BC0521; font-size: 90%; font-family: Verdana, Arial, Helvetica, sans-serif;
	align: right;
	margin-left: 20px;
}

.varianten {margin-top: 20px;}

.neueVariante {font-weight: bold;}

.in-wk {
	margin-top: 20px;
	margin-bottom: 20px;
}


.raten-link {
	/*font-weight: bold;*/
	margin-bottom: 20px;
}

.carousel-img {
/* 	width: auto; max-height: 350px; max-width:100%;*/
    margin: 0;
    position: absolute;
    max-height: 100%;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}


#beschreibung img {
		max-width:600px;
    	height: auto;
}

@media (max-width: 670px) {
	#beschreibung img {
    	max-width: 100%;
  	}
}

#panel_beschreibung img {
    	max-width: 600px;
    	height: auto;
}

@media (max-width: 670px) {
	#panel_beschreibung img {
    	max-width: 100%;
  	}
}

.panel-body img {
    	max-width: 100%;
    	height: auto;
}

.panel-title a {text-decoration: none; font-size: 100%;}

.panel-heading {height:40px;}

.panel-heading a:after {
    font-family:'Glyphicons Halflings';
    content:"\e113";
    float: right;
    color: grey;
}

.panel-heading a.collapsed:after {
    content:"\e114";
}




/* PRODUCTLINKS Beginn ************************ */

.linkname h4 {
	font-size: 17px;
 	color: #1C3E68;
	font-weight: bold;
}

.linkuntertitel {
	color: #202A3B; 
	margin-bottom: 15px;
}



/* PRODUCTLINKS Ende   ************************ */



/* CAROUSEL Beginn ************************ */

.carousel-control.left, .carousel-control.right {
  background: none !important;
  filter: progid: none !important;
  outline: 0;
 }

.carousel .carousel-control {
  visibility: hidden;
  width: 6%; 

}

.carousel:hover .carousel-control {
  visibility: visible;
}

.carousel .item {
	background-color: #FFFFFF;
}

.thumbnails-carousel li {
	height: 50px; width: 50px; background-color: white; position: relative;
	border-right: 1px solid #333333;
}

.thumbnail-image {
	width: auto; max-height: 50px; max-width:100%; position: absolute; top: 50%; transform: translateY(-50%);
}

/* CAROUSEL Ende ************************ */



/* TABS Beginn ************************ */

/* Style the list */
ul.tab {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
}

/* Float the list items side by side */
ul.tab li {float: left;}

/* Style the links inside the list items */
ul.tab li a {
    display: inline-block;
    color: black;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 17px;
}

/* Change background color of links on hover */
ul.tab li a:hover {background-color: #ddd;}

/* Create an active/current tablink class */
ul.tab li a:focus, .active {background-color: #ccc;}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
}

/* TABS Ende ************************ */


/* VIDEOS Beginn ************************ */

.video_wrapper {
	max-width: 600px;
}

.responsive-video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.responsive-video {
	position: relative;
	padding-bottom: 56.25%; /* Default for 1600x900 videos 16:9 ratio*/
	padding-top: 0px;
	height: 0;
	overflow: hidden;
}
/* VIDEOS Ende ************************ */



/* T2 Tabellen und Zubehör Beginn ************************ */
.t2 {
	margin:0px;padding:0px;
	width: 100%;
	max-width:820px;

	border:1px solid #7c7c7c;

	-moz-border-radius-bottomleft:10px;
	-webkit-border-bottom-left-radius:10px;
	border-bottom-left-radius:10px;
	
	-moz-border-radius-bottomright:10px;
	-webkit-border-bottom-right-radius:10px;
	border-bottom-right-radius:10px;
	
	-moz-border-radius-topright:10px;
	-webkit-border-top-right-radius:10px;
	border-top-right-radius:10px;
	
	-moz-border-radius-topleft:10px;
	-webkit-border-top-left-radius:10px;
	border-top-left-radius:10px;
}.t2 table{
    	border-collapse: collapse;
        border-spacing: 0;
	width:100%;
	height:100%;
	margin:0px;padding:0px;
}
.t2 tr:last-child td:last-child {
	-moz-border-radius-bottomright:10px;
	-webkit-border-bottom-right-radius:10px;
	border-bottom-right-radius:10px;
}
.t2 table tr:first-child td:first-child {
	-moz-border-radius-topleft:10px;
	-webkit-border-top-left-radius:10px;
	border-top-left-radius:10px;
}
.t2 table tr:first-child td:last-child {
	-moz-border-radius-topright:10px;
	-webkit-border-top-right-radius:10px;
	border-top-right-radius:10px;
}
.t2 tr:last-child td:first-child{
	-moz-border-radius-bottomleft:10px;
	-webkit-border-bottom-left-radius:10px;
	border-bottom-left-radius:10px;
}

.t2 tr:nth-child(odd)	{ background-color:#e5e5e5; }
.t2 tr:nth-child(even)  { background-color:#ffffff; }

.t2 td{
	vertical-align:middle;
	
	border:1px solid #7c7c7c;
	border-width:0px 1px 1px 0px;
	text-align:left;
	padding:5px;

	font-family:Arial;
	font-weight:normal;
	color:#000000;
}

.t2 tr:last-child td{
	border-width:0px 1px 0px 0px;
}
.t2 tr td:last-child{
	border-width:0px 0px 1px 0px;
}
.t2 tr:last-child td:last-child{
	border-width:0px 0px 0px 0px;
}


.t2 tr:first-child td{
/*	background:-o-linear-gradient(bottom, #cccccc 5%, #b2b2b2 100%);	
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #cccccc), color-stop(1, #b2b2b2) );
	background:-moz-linear-gradient( center top, #cccccc 5%, #b2b2b2 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#cccccc", endColorstr="#b2b2b2");	
	background: -o-linear-gradient(top,#cccccc,b2b2b2);*/

	background:-o-linear-gradient(bottom, #EE9911 5%, #FFDD33 100%);	
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #EE9911), color-stop(1, #FFDD33) );
	background:-moz-linear-gradient( center top, #EE9911 5%, #FFDD33 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#EE9911", endColorstr="#FFDD33");	
	background: -o-linear-gradient(top,#EE9911,FFDD33); 


	background-color:#cccccc;
	border:0px solid #7c7c7c;
	text-align:left;
	border-width:0px 0px 1px 0px;
	font-size: 120%;
	font-family:Arial;
	font-weight:bold;
	color:#222222;
}

.t2 tr:first-child td:first-child{
	border-width:0px 0px 1px 0px;
}
.t2 tr:first-child td:last-child{
	border-width:0px 0px 1px 0px;
}


.zubehoer tr:last-child td{
	border-width:0px 0px 0px 0px;
}

.zubehoer td{
	vertical-align: top;
	border-width:0px 0px 1px 0px;
}

.zubehoer tr:nth-child(odd)	{ background-color:#ffffff; }
.zubehoer tr:nth-child(even)  	{ background-color:#ffffff; }
.zubehoer tr td:first-child	{ text-align: center; }

.zubehoer tr:first-child td{
	background:-o-linear-gradient(bottom, #EE9911 5%, #FFDD33 100%);	
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #EE9911), color-stop(1, #FFDD33) );
	background:-moz-linear-gradient( center top, #EE9911 5%, #FFDD33 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#EE9911", endColorstr="#FFDD33");	
	background: -o-linear-gradient(top,#EE9911,FFDD33);
	text-align: center;
}

/* T2 Tabellen und Zubehör Ende ************************ */


/* Rückgabe Hinweis Beginn ************************ */
.rueckgabe table {
	border:1px solid #7c7c7c;
	border-width: 0px 0px 0px 0px;
	padding:8px;
}

.rueckgabe tr {
	vertical-align:middle;
	text-align:left;
	
}

.rueckgabe td {color: #222222; font-size: 15px; font-family: Verdana, Arial, Helvetica, sans-serif; padding:7px; min-width:70px;}
/* Rückgabe Hinweis Ende ************************ */


/* Shaker Liste  ************************ */
.floating-box {
    	display: inline-block;
    	width: 300px;
	height: 385px; 
    	margin: 5px;
	margin-bottom: 10px;
	padding: 0px;
	border: none;
	border-bottom: solid grey;
	border-bottom-width: 1px;
}

@media screen and (min-width: 768px) {
	.no-touch .floating-box:hover {
		-webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
		-moz-box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
		box-shadow:0 0 10px rgba(0, 0, 0, 0.5);
	}
}


@media (max-width: 480px) {
	.floating-box {
	    width: 100%;
		height: auto;
		padding-bottom: 20px;
	}
}


.float_artikelname {
	color: #1C3E68; font-size: 14px; font-family: Verdana, Arial, Helvetica, sans-serif;
	height: 45px; vertical-align: top; margin-top: 10px;
}

@media (max-width: 480px) {
	.float_artikelname {
		height: auto;
	    	margin-bottom: 20px;
		font-size: 16 px;
	}
}


.float_einheit {
	color: #202A3B; font-family: Verdana, Arial, Helvetica, sans-serif;
	height: 25px;
}

.float_untertitel {
	color: #202A3B; font-size: 75%; font-family: Verdana, Arial, Helvetica, sans-serif;
	height: 50px;
}

@media (max-width: 480px) {
	.float_untertitel {
		height: auto;
	    margin-top: 20px;
	    margin-bottom: 20px;
		font-size: 90%;
	}
}


.float_preis {
	display: inline;
	font-weight: bold; color: #BC0521; font-size: 120%; font-family: Tahoma, Geneva, sans-serif;
	opacity: 0.9;
}

@media (max-width: 480px) {
	.float_preis {
		width: 350px;
		height: auto;
	}
}

.float_preis-uvp {
	display: inline;
	color: #BC0521; font-size: 80%; font-family: Verdana, Arial, Helvetica, sans-serif;
	align: right;
}

.float_artikelbild {
	position: relative;
 	display: table-cell;
	vertical-align: middle;
	width: 330px;
	height: 220px;
}

@media (max-width: 480px) {
	.float_artikelbild {
		width: 350px;
		height: auto;
	}
}
/* Shaker Liste  ************************ */


.stern {font-size: 20px; color:#f0ac00; text-shadow: 1px 1px 0px #b68200;}

.stern-leer {font-size: 20px; color:#f0c748;}

.userrating {padding: 15px; border-bottom: 1px solid #999999; max-width: 800px; line-height: 1.5;}