 /* ------------------------------------------------------------------------------FLATAUCTION EBAY TEMPLATE MADE BY PIXELSAFARITemplate Name: FlatAuctionDescription: FlatAuction eBay Template by PixelsafariAuthor: Daniel KolbVersion: 2.9 1. Wrapper 2. Header & Navigation 3. Gallery (including Zoom) 4. Middle Column 5. Title & Short Description 6. Price Container & Button 7. Right Column 8. Tab Bar 9. Why Choose us 10. Cross Sellers 11. Footer MEDIA QUERIES: 12. Max width 1024px (Laptop / Tablet) 13. Max width 830px (Tablets) 14. Max width 660px (Smartphones) 15. Max width 480px (Smartphones) TOOLS: 16. Animations------------------------------------------------------------------------------ */
/** 1. Wrapper **/
 #wrapper {
     margin: 0 auto;
     padding: 50px 20px 0 20px;
     max-width: 1390px;
     font-family: 'Lato', sans-serif;
}


.mySlides {
  margin-bottom: -20px !important;
  margin-left: -40px !important;
}

 .clearer {
     clear: both;
}

.paypal-logo {
 width: 15%;
  height: 15%;
}

/** 2. Header & Navigation **/
 .header {
     margin-bottom: 50px;
}
 .logoContainer {
     margin-left: 40px;
}
 .logoContainer img {
     max-width: 280px;
     max-height: 180px;
}
 .navigationContainer {
     display: block;
     margin-top: 25px;
     height: 50px;
     border-top: 2px solid #da1610;
     border-bottom: 2px solid #da1610;
}
 .navigationContainer ul {
     margin: 0;
     padding: 0 0 0 20px;
     line-height: 50px;
}
 .navigationContainer ul li {
     display: inline-block;
     margin-left: 40px;
     color: #fff;
     text-transform: uppercase;
     font-weight: 400;
     font-size: 16px;
}
 .navigationContainer a, .navigationContainer a:visited {
     color: #fff;
     text-decoration: none;
}
 .navigationContainer ul li:hover, .navigationContainer ul li a:hover {
     cursor: pointer;
     text-decoration: underline;
}
/** 3. Gallery **/
 .gallery {
     width: 43%;
     margin-right: 2%;
     float: left;
     position: relative;
     padding-top: 630px;
}
 .bigPic {
     position: absolute;
     display: block;
     top: 0;
     left: 0;
     width: 100%;
     height: 630px;
     text-align: center;
     opacity: 0;
     background-color: #fff;
     transition: opacity 0.5s;
     margin: 0;
     z-index: -99;
}
 .bigPic img {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     margin: auto;
     max-width: 100%;
     max-height: 100%;
}
 .gallery input[type=radio]{
     visibility: hidden;
     margin: 0;
     padding: 0;
     height: 0;
     width: 0;
     position: absolute;
}
 #big-pic-1:checked ~ .bigPic:nth-of-type(1), #big-pic-2:checked ~ .bigPic:nth-of-type(2), #big-pic-3:checked ~ .bigPic:nth-of-type(3), #big-pic-4:checked ~ .bigPic:nth-of-type(4), #big-pic-5:checked ~ .bigPic:nth-of-type(5), #big-pic-6:checked ~ .bigPic:nth-of-type(6), #big-pic-7:checked ~ .bigPic:nth-of-type(7), #big-pic-8:checked ~ .bigPic:nth-of-type(8), #big-pic-9:checked ~ .bigPic:nth-of-type(9), #big-pic-10:checked ~ .bigPic:nth-of-type(10), #big-pic-11:checked ~ .bigPic:nth-of-type(11), #big-pic-12:checked ~ .bigPic:nth-of-type(12){
     opacity: 1;
     display: block;
     z-index: 10;
}
 .galleryThumb {
     position: relative;
     display: inline-block;
     margin-right: 1%;
     margin-left: -4px;
     width: 24%;
     height: 140px;
     text-align: center;
     margin-bottom: 5px;
     transition: all 0.2s;
}
 .galleryThumb:hover, .galleryThumb:visited, .galleryThumb:link {
     text-decoration: none;
}
 .galleryThumb:nth-of-type(4n+1) {
     margin-left: 0;
}
 .galleryThumb:nth-of-type(4n) {
     margin-right: 0;
}
 .galleryThumb:hover {
     opacity: 0.7;
     cursor: pointer;
     transition: all 0.2s;
}
 .galleryThumb img {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     margin: auto;
     max-width: 100%;
     max-height: 100%;
}
/** Zoom Gallery **/
 .overlay {
     background: rgba(0, 0, 0, 0.6);
     position: fixed;
     width: 100%;
     height: 100%;
     top: 0px;
     left: 0px;
     z-index: 1000;
     display: none;
}
 .zoom-bigPic {
     width: 70%;
     height: auto;
     margin: 0 auto;
     background: #fff;
     text-align: center;
     padding: 2% 2% 2% 2%;
     margin-top: 20px;
}
 .zoom-bigPic img {
     max-width: 100%;
     max-height: 600px;
}
 .overlay a.close-text {
     margin-top: 20px;
     color: #555 !important;
     text-decoration: none;
     font-size: 15px;
     clear: both;
     display: block;
     font-weight: normal;
     text-decoration: underline;
}
 .overlay a i {
     color: #555 !important;
     font-size: 40px;
     margin-bottom: 20px;
     z-index: 2000;
     float: right;
}
 #zoompic-1:target, #zoompic-2:target, #zoompic-3:target, #zoompic-4:target, #zoompic-5:target, #zoompic-6:target, #zoompic-7:target, #zoompic-8:target, #zoompic-9:target, #zoompic-10:target, #zoompic-11:target, #zoompic-12:target {
     display: block;
}
/** 4. Middle Column **/
 .midColumn {
     float: left;
     max-width: 390px;
}
/** 5. Title & Short Description **/
 .midColumn h1 {
     color: #333;
     font-weight: 400;
     font-size: 26px;
     margin-bottom: 0;
}
 .underline {
     margin: 15px 0;
     width: 20px;
     height: 3px;
     background-color: #333;
}
 .shortdescription {
     float: left;
}
 .shortdescription p, .shortdescription ul, .shortdescription li {
     color: #555;
     font-size: 16px;
     line-height: 1.5;
     margin: 0;
}
 #variationContainer {
     margin: 20px 0 0 0;
     padding-bottom: 45px;
     padding-left: 0px;
     width: 345px;
     font-family: 'montserrat', sans-serif;
}
 #variationContainer h5 {
     margin-top: 25px;
     margin-bottom: 10px;
     font-weight: 400;
     font-size: 14px;
}
 .varList1 {
     margin: 0;
     padding: 0;
     list-style: none;
}
 .varList1 li {
     display: inline-block;
     margin-right: 5px;
     margin-bottom: 5px;
     padding: 5px 10px;
     border: 1px solid #333;
     color: #333;
     font-size: 12px;
}
 .varList1 li:hover {
     background-color: #000;
     color: #fff;
     cursor: default;
}
 .varList2 {
     margin: 0;
     padding: 0;
     list-style: none;
}
 .varList2 li {
     display: inline-block;
     margin-right: 5px;
     margin-bottom: 5px;
     padding: 5px 10px;
     border: 1px solid #333;
     color: #333;
     font-size: 12px;
}
 .varList2 li:hover {
     background-color: #000;
     color: #fff;
     cursor: default;
}
/** 6. Price Container & Button **/
 .priceTagBox {
     padding: 25px 0 0 20px;
     width: 380px;
     height: 115px;
     border-radius: 5px;
     background-color: #22313F;
     position: relative;
}
 .priceTagBox h2 {
     display: inline-block;
     margin: 0;
     padding: 0;
     color: #da1610;
     font-weight: 400;
}
 .priceTagBox h3 {
     margin: 0 0 0 2px;
     padding: 0;
     color: #fff;
     font-weight: 400;
     font-size: 14px;
     position: absolute;
     left: 80px;
}
 .priceTagBox h4 {
     margin: 20px 0 0 0;
     padding-top: 15px;
     color: #fff;
     font-weight: 400;
     font-size: 14px;
}
 .priceTagBox h4 img {
     margin: 0 5px 0 4px;
     width: 12px;
     height: 12px;
}
 #askNowButton {
     display: inline-block;
     float: right;
     margin-top: 2px;
     margin-right: 20px;
     width: 185px;
     height: 35px;
     border-radius: 3px;
     background-color: #da1610;
     text-decoration: none;
     cursor: pointer;
     transition: all 0.1s;
}
 #askNowButton p {
     font-size: 14px;
     position: relative;
     margin: 0;
     line-height: 35px;
     color: #fff;
     text-transform: uppercase;
     text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
     font-size: 14px;
     left: -4px;
}
 #askNowButton i {
     position: relative;
     top: 5px;
     left: -32px;
     float: left;
     color: #ffffff;
     font-size: 24px;
}
 .innerbox {
     float: left;
     width: 40px;
     height: 35px;
     border-radius: 3px 0px 0px 3px;
     background-color: #fff;
     opacity: 0.2;
}
/** .uiButton: Deprecated **/
 .uiButton {
     display: block;
     float: left;
     margin: 10px 10px 0 0;
     width: 195px;
     height: 37px;
     border-radius: 3px;
     background-color: #2C3E50;
     box-shadow: 0px 3px 0px #22313F;
     text-decoration: none;
     cursor: pointer;
     transition: all 0.1s;
}
 .uiButton:hover {
     background-color: #da1610;
     box-shadow: 0px 3px 0px #da1610;
     transition: all 0.1s;
}
 .uiButton a, .uiButton a:hover, .uiButton a:visited {
     text-decoration: none;
}
 .uiButton i {
     position: relative;
     top: 8px;
     left: -30px;
     float: left;
     color: #ffffff;
     font-size: 22px;
}
 .uiButton p {
     position: relative;
     margin: 0;
     line-height: 40px;
     color: #fff;
     text-transform: uppercase;
     text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
     font-size: 14px;
}
/** 7. Right Column **/
 .rightColumn {
     float: right;
     padding-left: 20px;
     width: 215px;
     border-left: 1px solid #ebebeb;
   	 margin-top: 100px;
}
 .rightColumn ul {
     padding-left: 0;
}
 .rightColumn .circle {
     float: left;
     margin-right: 10px;
     width: 40px;
     height: 40px;
     border-radius: 100%;
     background-color: #da1610;
     text-align: center;
}
 .rightColumn .circle i {
     color: #ffffff;
     font-size: 18px;
     line-height: 40px;
}
 .brandContainer {
     margin: 25px 0 20px 0;
     padding-bottom: 20px;
     border-bottom: 1px solid #ebebeb;
     text-align: center;
}
 .brandContainer img {
     max-width: 150px;
     max-height: 74px;
}
 .brandContainer span {
     margin-top: 12px;
     font-size: 14px;
}
 .trustViewDescription {
     clear: both;
     margin-bottom: 15px;
     font-size: 14px;
    /** height & overflow only allow two lines **/
     height: 40px;
     overflow: hidden;
}
 .trustViewDescription a {
     color: #da1610;
     text-decoration: none;
     transition: all 0.1s;
}
 .trustViewDescription p {
     margin: 0;
     padding: 0;
     line-height: 20px;
}
/** 8. Tab Bar **/
 .tabBar {
     padding-bottom: 80px;
     margin-top: 30px;
     clear: both;
}
 #tab2, #tab3, #tab4, #tab5, #tab6 {
     display: none;
}
 .tabBar input[type=radio] {
     visibility: hidden;
     margin: 0;
     padding: 0;
     height: 0;
     width: 0;
     position: absolute;
}
 .tablinks {
     display: inline-block;
     margin-left: -4px;
     margin-right: 1%;
     padding-top: 0;
     width: 19%;
     height: 45px;
     line-height: 45px;
     background-color: #EFF0EB;
     color: #666666;
     text-align: center;
     font-size: 18px;
     transition: all 0.1s;
     margin-bottom: 10px;
   	 text-decoration: none;
}

.tablink {
     display: inline-block;
     margin-left: 1%;
     margin-right: 1%;
     padding-top: 0;
     min-width: 19%;
     height: 45px;
     line-height: 45px;
     background-color: #EFF0EB;
     color: #666666;
     text-align: center;
     font-size: 18px;
     transition: all 0.1s;
     margin-bottom: 10px;
   	 text-decoration: none;
}

.tablinkLast {
     display: inline-block;
  	 margin-left: 0;
  	 margin-right: 0;
     padding-top: 0;
     min-width: 19%;
     height: 45px;
     line-height: 45px;
     background-color: #EFF0EB;
     color: #666666;
     text-align: center;
     font-size: 18px;
     transition: all 0.1s;
     margin-bottom: 10px;
   	 text-decoration: none;
}

@media only screen and (max-width: 667px) {
  .tablinks, .tablink, .tablinkLast {
    font-size: 14px;
  }
}

@media only screen and (max-width: 667px) {
  .tablinkLast {
    margin-left: 1%;
  }
}

@media only screen and (max-width: 660px) {
  .tablink, .tablinkLast {
    width: 47%;
  }
}

 .tabBar label:last-of-type {
     margin-right: 0;
}
 .tablinks:hover, .tablink:hover, .tablinkLast:hover {
     background-color: #da1610;
     color: #fff;
     text-decoration: none;
     cursor: pointer;
     transition: all 0.1s;
}
 #tab1-btn:checked+.tablinks, #tab2-btn:checked+.tablinks, #tab3-btn:checked+.tablinks, #tab4-btn:checked+.tablinks, #tab5-btn:checked+.tablinks, #tab6-btn:checked+.tablinks {
     background-color: #da1610;
     color: #fff;
     text-decoration: none;
     cursor: pointer;
     transition: all 0.1s;
}
 #tab1-btn:checked~#tab1 {
     display: block;
}
 #tab1-btn:checked~#tab2, #tab1-btn:checked~#tab3, #tab1-btn:checked~#tab4, #tab1-btn:checked~#tab5, #tab1-btn:checked~#tab6 {
     display: none;
}
 #tab2-btn:checked~#tab2 {
     display: block;
}
 #tab2-btn:checked~#tab1, #tab2-btn:checked~#tab3, #tab2-btn:checked~#tab4, #tab2-btn:checked~#tab5, #tab2-btn:checked~#tab6 {
     display: none;
}
 #tab3-btn:checked~#tab3 {
     display: block;
}
 #tab3-btn:checked~#tab1, #tab3-btn:checked~#tab2, #tab3-btn:checked~#tab4, #tab3-btn:checked~#tab5, #tab3-btn:checked~#tab6 {
     display: none;
}
 #tab4-btn:checked~#tab4 {
     display: block;
}
 #tab4-btn:checked~#tab1, #tab4-btn:checked~#tab2, #tab4-btn:checked~#tab3, #tab4-btn:checked~#tab5, #tab4-btn:checked~#tab6 {
     display: none;
}
 #tab5-btn:checked~#tab5 {
     display: block;
}
 #tab5-btn:checked~#tab1, #tab5-btn:checked~#tab2, #tab5-btn:checked~#tab3, #tab5-btn:checked~#tab4, #tab5-btn:checked~#tab6 {
     display: none;
}
 #tab6-btn:checked~#tab6 {
     display: block;
}
 #tab6-btn:checked~#tab1, #tab6-btn:checked~#tab2, #tab6-btn:checked~#tab3, #tab6-btn:checked~#tab4, #tab6-btn:checked~#tab5 {
     display: none;
}
 .tabContent {
     clear: both;
     color: #222;
     text-align: left;
     overflow: auto;
     font-size: 16px;
     line-height: 1.5;
     padding-top: 0;
}
 .tabContent img {
     max-width: 100%;
}
 .tabContent p {
     margin: 0;
     padding: 0;
}
 .tabContent a, .tabContent a:visited {
     color: #da1610;
     text-decoration: none;
}
 .tabContent a:hover {
     text-decoration: underline;
     font-weight: 700;
}
 .tabContent h1, .tabBar h1, .tabContent h2, .tabBar h2 {
     font-weight: 300;
     font-size: 28px;
     transition: all 0.1s;
}
 .tabContent h1:hover, .tabBar h1:hover, .tabContent h2:hover, .tabBar h2:hover {
     color: #da1610;
     cursor: default;
     transition: all 0.1s;
}
 .tabContent ul, .tabContent ol {
     display: block;
     text-align: left;
     margin: 0;
     position: relative;
     line-height: 1.5;
}
 .tabContentFeaturesList {
     margin: 0 auto !important;
     padding: 0 0 0 20px;
     max-width: 350px;
     list-style: none;
     text-align: left;
}
 .tabContentFeaturesList li {
     margin-bottom: 10px;
}
 .tabContentFeaturesList i {
     margin-right: 8px;
}
 .descriptionFeatures {
     margin: 50px 0 70px 0;
     padding: 30px 0 60px 0;
     background-color: #f0f0f0;
     text-align: center;
     font-size: 18px;
}
 .descriptionFeatures h2 {
     font-size: 40px;
}
 .contentImgLeft {
     float: left;
     margin-top: 0;
     margin-right: 25px;
     margin-bottom: 15px;
     margin-left: 0px;
     max-width: 45%;
     height: auto;
}
 .contentImgRight {
     float: right;
     margin-top: 0;
     margin-right: 0px;
     margin-bottom: 15px;
     margin-left: 25px;
     max-width: 45%;
     height: auto;
}
 .contentImgInline {
     display: inline-block;
     vertical-align: top;
     margin: 0 0 15px 15px;
}

@media only screen and (max-width: 667px) {
  .contentImgInline {
    display: inline-block;
    width: 25%;
    height: 25%;
  }
}
/** 9. Why choose us **/
 .whyChooseUs {
     margin-top: 60px !important;
     padding: 30px 0;
     width: 100%;
     background-color: #da1610;
}
 .whyChooseUsBlockContainer {
     margin: 0 auto;
     text-align: center;
}
 .whyChooseUsBlock {
     display: inline-block;
     margin: 35px 2% 40px 2%;
     padding: 0 1%;
     min-height: 435px !important;
     width: 16%;
     border-radius: 5px;
     background-color: #fff;
     vertical-align: top;
     text-align: center;
     transition: all 0.2s;
}
 .whyChooseUsBlock:hover {
     color: #da1610;
     cursor: default;
     transition: all 0.2s;
}
 .whyChooseUs .circle {
     position: relative;
     top: -38px;
     display: block;
     margin: 0 auto;
     width: 76px;
     height: 76px;
     border-radius: 500px;
     background-color: #da1610;
}
 .whyChooseUs .circle i {
     margin-top: 20px;
     color: #ffffff;
     font-size: 36px;
}
 .whyChooseUs h2 {
     color: #fff;
     text-align: center;
     font-weight: 400;
     font-size: 36px;
     font-family: 'Roboto Slab', serif;
}

.whyChooseUs h2:hover {
 	color: #fff !important; 
}
 .whyChooseUsBlock h3 {
     margin-top: 0px;
     text-align: center;
     font-weight: 400;
     font-size: 20px;
     font-family: 'Roboto Slab', serif;
}
 .whyChooseUsBlock p {
     margin-top: 25px;
     color: #666666;
     font-size: 16px;
     font-family: 'Open Sans', sans-serif;
}
/** 10. Cross Sellers **/
 .crossSellerContainer {
     clear: both;
     margin-top: 60px;
     width: 100%;
     text-align: left;
}
 #csc2 {
     margin-bottom: 80px;
}
 .crossSellerItem:hover h3, .crossSellerItem:hover p, .crossSellerItem:hover a {
     color: #da1610;
     transition: all 0.1s;
}
 .crossSellerItem:hover img {
     opacity: 0.7;
}
 .crossSellerContainer a:hover, .crossSellerContainer a:visited, .crossSellerContainer a {
     color: inherit;
     text-decoration: none;
}
 .crossSellerContainerHeading {
     padding: 0;
     border-bottom: 3px solid #333;
}
 .crossSellerContainer h2 {
     position: relative;
     top: 3px;
     display: inline-block;
     margin: 0;
     padding: 0 0 8px 0;
     border-bottom: 3px solid #da1610;
     color: #333;
     text-transform: uppercase;
     font-weight: 400;
     font-size: 24px;
}
 .crossSellerItem {
     display: inline-block;
     overflow: hidden;
     margin-top: 30px;
     margin-right: 3%;
     padding: 0;
     width: 22.2%;
     height: 320px;
     vertical-align: top;
     cursor: pointer;
     transition: all 0.2s;
}
 .crossSellerItem:last-child {
     margin-right: 0;
}
 .crossSellerItemImgContainer {
     position: relative;
     width: 100%;
     height: 230px;
     text-align: center;
     cursor: pointer;
}
 .crossSellerItem img {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     margin: auto;
     max-width: 100%;
     max-height: 100%;
     transition: all 0.5s;
}
 .crossSellerItem a {
     color: #000;
     text-decoration: none;
}
 .crossSellerItem span {
     float: left;
     margin-top: 9px;
     width: 100%;
     text-align: center;
}
 .crossSellerItem h3 {
     margin: 0;
     padding: 0;
     color: inherit;
     font-size: 16px;
     transition: all 0.2s;
}
 .crossSellerItem p {
     margin-top: 7px;
     padding: 0;
     color: inherit;
     font-size: 15px;
     transition: all 0.2s;
}
/** 11. Footer **/
 .footerContainer {
     margin: 0;
     padding-bottom: 40px;
     padding-right: 60px;
     overflow: auto;
     background-color: #22313F;
}
 .footerContainer h2 {
     margin: 0 0 26px 0;
     padding: 0 0 8px 0;
     border-bottom: 2px solid #da1610;
     color: #f0f0f0;
     text-transform: uppercase;
     font-weight: 400;
     font-size: 17px;
     font-family: 'montserrat';
}
 .footerColumn {
     float: left;
     margin-left: 4.8%;
     width: 220px;
     margin-top: 40px;
}
 .footerColumn p {
     margin: 0 0 0 0;
     margin-bottom: 0;
     padding: 0;
     color: #D6D6D6;
     font-size: 15px;
     line-height: 1.35;
}
 .footerColumn a, .footerColumn span {
     color: #da1610;
     font-weight: 300;
     text-decoration: none;
}
 .footerColumn a:hover {
     text-decoration: underline;
}
 .footerRow:first-of-type {
     padding-top: 5px;
}
 .footerRow {
     margin-bottom: 12px;
}
 .footerRow i {
     float: left;
     color: #d6d6d6;
     font-size: 20px;
     line-height: 18px;
     margin-right: 10px;
}
 .footerRow p {
     line-height: 20px;
     font-size: 14px;
}
 #copyright {
     margin-top: 12px;
     color: #D6D6D6;
     font-size: 9px;
}
 #copyright a {
     color: #ffffff;
     text-decoration: underline;
}
 @media only screen and (max-width: 1215px) {
     .gallery {
         width: 40%;
    }
}
 @media only screen and (max-width: 1135px) {
     .rightColumn {
         padding-left: 10px;
         width: 160px;
    }
}
/** 12. Max width 1024px (Laptop / Tablet) **/
 @media only screen and (max-width: 1024px) {
     .logoContainer {
         display: block;
         margin: 0 auto;
         width: 100%;
         text-align: center;
    }
     .navigationContainer {
         display: block;
         margin: 25px auto 0 auto;
         padding: 0;
         width: 100%;
         height: auto;
         background-color: #fff;
    }
     .navigationContainer ul {
         padding: 0;
    }
     .navigationContainer ul li {
         display: block;
         margin: 0 auto;
         padding: 0;
         height: auto;
         border-bottom: 1px solid #ddd;
         color: #da1610;
         text-align: center;
    }
     .navigationContainer a, .navigationContainer a:visited {
         color: #da1610;
    }
     .galleryAndShortdescriptionContainer {
         float: none;
         margin: 0 auto;
         width: 100%;
    }
     .gallery {
         display: block;
         float: none;
         margin: 0 auto;
         width: 70%;
         padding-top: 560px;
    }
     .bigPic {
         height: 530px;
    }
     .midColumn {
         float: none;
         margin: 0 auto;
         width: 100%;
    }
     .midColumn h1 {
         text-align: center;
    }
     .midColumn h2 {
         margin: 0 auto 0 auto;
         text-align: center;
    }
     .underline {
         margin: 15px auto 15px auto;
    }
     .shortdescription {
         margin: 0 auto;
         width: 410px;
         float: none;
    }
     .shortdescription p {
         text-align: center;
    }
     #variationContainer {
         width: auto;
         text-align: center;
    }
     .priceTagBox {
         margin: 0 auto;
         padding: 20px 0 0 30px;
         max-width: 380px;
    }
     #askNowButton {
         margin-left: 20px;
         min-width: 40%;
    }
     #askNowButton p, .uiButton p {
         left: -15px;
    }
     .buttonContainer {
         margin: 0 auto;
         text-align: center;
    }
     .uiButton {
         display: inline-block;
         float: none;
    }
     #questionBtn {
         margin: 10px 0 0 0;
         width: 202px;
    }
     #watchlistBtn {
         margin: 10px 0 0 0;
         width: 202px;
    }
     .rightColumn {
         float: none;
         clear: both;
         margin: 40px auto 0 auto;
         padding-top: 20px;
         max-width: 100%;
         border: none;
         border-top: 1px solid #ddd;
         border-bottom: 1px solid #ddd;
         text-align: center;
         width: auto;
    }
     .brandContainer {
         display: none;
    }
     .trustViewDescription {
         display: inline-block;
         clear: both;
         margin-right: 20px;
         width: auto;
         width: 40%;
         vertical-align: top;
         text-align: left;
    }
     .trustViewDescription p {
         margin: 0;
         vertical-align: top;
    }
     .tabBar {
         margin: 40px auto 0 auto;
         max-width: 100%;
         text-align: left;
    }
     .whyChooseUs {
         padding-right: 30px;
         max-width: 100%;
    }
     .whyChooseUsBlock {
         width: 30%;
    }
     .crossSellerContainer {
         margin: 0 auto;
         padding-top: 60px;
         padding-right: 30px;
         width: 90%;
    }
     .crossSellerContainer {
         width: 100%;
    }
     .crossSellerItem {
         width: 21%;
    }
}
/** 13. Max width 830px (Tablet) **/
 @media only screen and (max-width: 830px) {
     .bigPic {
         display: inline-block;
         width: auto;
         height: 290px;
         width: 100%;
         vertical-align: middle;
         text-align: center;
    }
     .gallery{
         padding-top: 320px;
    }
     .contentImgLeft, .contentImgRight {
         float: none;
         clear: both;
         margin: 0 auto;
         max-width: 100%;
         width: auto;
         text-align: center;
    }
     .contentImgLeft img, .contentImgRight img {
         margin-bottom: 10px;
    }
     .videoWrapperContainer {
         width: 90%;
    }
}
/** 14. Max width 660px (Smartphone) **/
 @media only screen and (max-width: 660px) {
     #wrapper {
         padding: 20px 20px 0 20px;
    }
     .tablinks {
         margin-bottom: 10px;
    }
     .tabBar label {
         width: 47%;
         margin-right: 1%;
         margin-left: 1%;
    }
     .whyChooseUs {
         padding: 30px 0;
         width: 100%;
    }
     .whyChooseUsBlock {
         width: 90%;
    }
     .crossSellerContainer {
         width: 100%;
         padding-right: 0px;
         text-align: center;
    }
     .crossSellerItem {
         display: block;
         margin: 0 auto;
         padding-top: 50px;
         width: 80%;
         text-align: center;
    }
     .crossSellerItem:last-child {
         margin-right: auto;
    }
}
/** 15. Max width 480px (Smartphones) **/
 @media only screen and (max-width: 480px) {
     .logoContainer {
         display: block;
         margin: 0 auto;
         width: 100%;
         text-align: center;
    }
     .gallery {
         display: block;
         float: none;
         margin: 0 auto;
         width: 100%;
         padding-top: 250px;
    }
     .bigPic {
         height: 230px;
    }
     .midColumn {
         display: block;
         margin: 0 auto;
         width: 100%;
    }
     .midColumn h2 {
         margin: 0 auto;
         text-align: center;
    }
     .shortdescription {
         clear: both;
         padding-left: 0px;
         width: 100%;
    }
     .priceTagBox {
         padding: 20px 0 0 0;
         width: 250px;
         height: 180px;
    }
     .priceTagBox h2 {
         margin: 0 auto;
         display: block;
    }
     .priceTagBox h3 {
         margin: 0 auto;
         text-align: center;
    }
     .priceTagBox h4 {
         margin: 0 auto;
         text-align: center;
    }
     #askNowButton {
         margin-top: 40px;
         margin-right: 26px;
         margin-bottom: 20px;
         width: 200px;
         text-align: center;
    }
     .uiButton {
         display: block;
    }
     .buttonContainer {
         text-align: center;
    }
     #watchlistBtn {
         display: inline-block;
         width: 250px;
    }
     #questionBtn {
         display: inline-block;
         margin-right: 0;
         margin-top: 10px;
         width: 250px;
    }
     #questionBtn p {
         font-size: 13px;
    }
     .trustViewDescription {
         display: block;
         margin: 0 auto 15px auto;
         width: 90%;
         height: auto;
    }
     .whyChooseUsBlock {
         display: block;
         margin: 60px auto 0 auto;
         padding: 0 1%;
         min-height: 300px;
         width: 80%;
         background-color: #fff;
    }
     .tabBar {
         display: block;
    }
     .tablinks li {
         height: 40px;
         line-height: 40px;
    }
     .footerContainer {
         padding: 0;
    }
     .footerColumn {
         text-align: center;
         margin: 60px auto;
         float: none;
    }
     .footerRow {
         text-align: left;
    }
}
 @media only screen and (max-width: 350px) {
     .bigPic {
         height: 200px;
    }
}
/** 16. ANIMATIONS **/
 .animated {
     -webkit-animation-duration: 1s;
     -moz-animation-duration: 1s;
     -o-animation-duration: 1s;
     animation-duration: 1s;
     -webkit-animation-fill-mode: both;
     -moz-animation-fill-mode: both;
     -o-animation-fill-mode: both;
     animation-fill-mode: both 
}
 @-webkit-keyframes fadeInRight {
     0% {
         opacity: 0;
         -webkit-transform: translateX(10px) 
    }
     100% {
         opacity: 1;
         -webkit-transform: translateX(0) 
    }
}
 @-moz-keyframes fadeInRight {
     0% {
         opacity: 0;
         -moz-transform: translateX(10px) 
    }
     100% {
         opacity: 1;
         -moz-transform: translateX(0) 
    }
}
 @-o-keyframes fadeInRight {
     0% {
         opacity: 0;
         -o-transform: translateX(10px) 
    }
     100% {
         opacity: 1;
         -o-transform: translateX(0) 
    }
}
 @keyframes fadeInRight {
     0% {
         opacity: 0;
         transform: translateX(10px) 
    }
     100% {
         opacity: 1;
         transform: translateX(0) 
    }
}
 .fadeInRight {
     -webkit-animation-name: fadeInRight;
     -moz-animation-name: fadeInRight;
     -o-animation-name: fadeInRight;
     animation-name: fadeInRight 
}
/*** VIDEO STYLING (OBJECTS) (DEPRECATED) ***/
 .videoWrapperContainer {
     width: 70%;
     margin: 0 auto;
}
 .videoWrapper {
     position: relative;
     padding-bottom: 56.25%;
     padding-top: 25px;
     height: 0;
}
 .videoWrapper object, .videoWrapper embed {
     position: absolute;
     margin: 20px auto 0 auto;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

.toggleBox, 
.toggleBox1, 
.toggleBox2, 
.toggleBox3,
.toggleBox4,
.toggleBox5 {
    position: relative;
    border: 1px solid #ddd;
  	overflow-y: hidden;
  	overflow-x: hidden;
}
 
/* Ausblenden des input-Feldes */
.toggleBox input, 
.toggleBox1 input, 
.toggleBox2 input, 
.toggleBox3 input,
.toggleBox4 input,
.toggleBox5 input {
    position: absolute;
    left: -99999px;
}
 
/* Gestaltung der labels */
.toggleBox label, 
.toggleBox1 label, 
.toggleBox2 label, 
.toggleBox3 label,
.toggleBox4 label,
.toggleBox5 label {
    display: block;
    background: #22313F;
    color: #fff;
  	text-align: center;
    padding: .4em;
    text-align: center;
    cursor: pointer;
}
 
.toggleBox label:hover, 
.toggleBox1 label:hover, 
.toggleBox2 label:hover, 
.toggleBox3 label:hover,
.toggleBox4 label:hover,
.toggleBox5 label:hover {
    color: #da1610;
}
 
/* Der Aufklappmechanismus */
.toggleBox input:not(:checked) ~ div, 
.toggleBox1 input:not(:checked) ~ div, 
.toggleBox2 input:not(:checked) ~ div, 
.toggleBox3 input:not(:checked) ~ div,
.toggleBox4 input:not(:checked) ~ div,
.toggleBox5 input:not(:checked) ~ div {
    opacity: 0;
    height: 0;
}
 
.toggleBox input:checked ~ div, 
.toggleBox1 input:checked ~ div, 
.toggleBox2 input:checked ~ div,
.toggleBox3 input:checked ~ div,
.toggleBox4 input:checked ~ div,
.toggleBox5 input:checked ~ div {
    opacity: 1;
    padding: .8em;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -ms-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}
 
/* Steuerung der Sichtbarkeit der labels */
.toggleBox input:not(:checked) ~ .close,
.toggleBox input:checked ~ .open, 
.toggleBox1 input:not(:checked) ~ .close, 
.toggleBox1 input:checked ~ .open,
.toggleBox2 input:not(:checked) ~ .close,
.toggleBox2 input:checked ~ .open,
.toggleBox3 input:not(:checked) ~ .close,
.toggleBox3 input:checked ~ .open,
.toggleBox4 input:not(:checked) ~ .close,
.toggleBox4 input:checked ~ .open,
.toggleBox5 input:not(:checked) ~ .close,
.toggleBox5 input:checked ~ .open {
    display: none;
}