

@media screen {
    /* MOBILE */    
     
    main{clear:left;width:100%;margin:0 auto;height:auto;overflow:auto;}  
        
    section{width:100%;}
    #banner{height:auto;overflow:auto;background: #fff url('/media/image/launch/interior.jpg') center no-repeat;background-size:1wv;position:relative;}
    .bannerHalfContainer{width:100%;height:480px;overflow:visible;}
    .bannerImage{width:100%;margin:0 auto;}
    .bannerImage img{width:80%;max-width:400px;margin:40px auto;transition: .5s;cursor:pointer;}
    .bannerImage img:HOVER{transform: scale(1.1);}
    .bannerSlogan{transition: bottom .5s;max-width:680px;position:relative;margin:0 30px;z-index:100;width:50%;padding:10px 40px;text-align:center;text-transform: uppercase;font-size:21px;font-style:italic;font-weight:bold;color:#fff;cursor:pointer;}
    .active{bottom:30px;background-color:rgba(190,35,38,0.8);}
    .inactive{bottom:60px;background-color:rgba(0,0,0,0.5);}
    .bannerTitle{position:absolute;bottom:440px;width:100%;height:80px;padding:25px 0;background-color:rgba(41,111,151,0.8);text-align:center;text-transform: uppercase;font-size:28px;font-style:italic;font-weight:bold;color:#fff;}
    
    #display{background-color:#fff;}
    #displayContainer{width:100%;margin:0 auto;padding:50px 0;overflow:auto;}
    .displayThird{float:left;width:33.33%;padding:0 30px;}
    .displayData{font-size:42px;font-style:italic;font-weight:bold;color:rgb(41,111,151);}
    .displayText{font-size:13px;font-style:italic;font-weight:bold;}
    
    #presentation{height:auto;background-image:url('/media/image/launch/interior-background.jpg');background-size:cover;background-position:center;overflow:auto;}
    #presentationHalfContainer{width:100%;}
    #presentationImageContainer{width:100%;max-width:680px;}
    #presentationImageContainer img{width:90%;margin:20px auto;}
    #presentationTitleContainer{display:inline-block;background-color:rgba(41,111,151,0.8);overflow:auto;}
    #presentationTitle{width:auto;padding:15px 30px;font-size:24px;font-style:italic;text-align: left;text-transform:uppercase;font-weight:bold;color:#fff;}
    #presentationTextContainer{width:100%;overflow:auto;}
    #presentationText{padding:30px 30px;font-size:15px;line-height:150%;text-align:left;}
    #presentationSloganContainer{width:100%;}
    #presentationSlogan{float:right;width:auto;}
    #presentationSlogan span{width:60%;background-color:rgba(190,35,38,0.8);padding:7px 40px;font-size:17px;font-style:italic;font-weight:bold;color:#fff;}  
    #presentationThumbContainer{width:100%;overflow:auto;padding:0 0 0 30px;}
    #presentationThumb{float:right;width:50%;padding:40px 30px 40px 0;text-align:right;border-radius:5px;} 
    
    #presentationContainer{clear:left;max-width:1360px;margin:0 auto;padding:20px;overflow:auto;} 
    .presentationBox{float:left;width:33.33%;padding:20px;text-align:center;}
    .presentationBox img{margin:10px;width:90%;}
    .presentationBox p{font-size:17px;font-style:italic;font-weight:bold;}
    
    #ambientMonobloc{height:240px;background-image:url('/media/image/launch/ambient-monobloc.jpg');background-size:cover;background-position:center;} 
    #ambientSplit{height:240px;background-image:url('/media/image/launch/ambient-split.jpg');background-size:cover;background-position:center;} 
    
    #product{background-color:#eee;padding-bottom:50px;} 
    #productContainer{max-width:1360px;margin:0 auto;position:relative;}
    #productTitle{max-width:1320px;background-color:rgba(41,111,151,0.8);position:relative;top:-30px;padding:15px 20px;z-index:100;margin-bottom:20px;}
    .switch{float:right;background-color:rgba(190,35,38,0.8);position:relative;top:5px;padding:6px 20px;font-size:13px;color:#fff;cursor:pointer;}
    #productTitle p{font-size:24px;font-style:italic;font-weight:bold;color:#fff;}
    .productSlider{width:100%;margin:0 auto;}
    .productBox{float:left;width:25%;padding:0 20px;}
    .productContent{background-color:#fff;height:auto;overflow:auto;border-radius:5px;overflow:hidden;padding:20px;}    
    .productContent:HOVER{}
    .productContent:HOVER img{transform: scale(1.05);}
    .productContent img{width:100%;display:block;transition: transform .5s;}
    .productContent .productName{margin-top:10px;padding:10px 0;height:70px;font-size:19px;font-weight:bold;font-style:italic;}
    .productContent:HOVER .productName{color:rgb(41,111,151)}
    .productContent .attribute{padding:10px 0;font-size:13px;font-style:italic;color:#aaa;border-top:1px solid #ccc;}
    .productContent .attribute span{float:right;text-align:right;}
}

@media screen and (min-width: 768px) {
    /* TABLET */
    
    #banner{width:100%;height:600px;overflow:visible;background: #fff url('/media/image/launch/interior.jpg') center no-repeat;background-size:1wv;position:relative;}
    .bannerHalfContainer{float:left;width:50%;height:600px;overflow:visible;}
    .bannerImage{width:100%;max-width:680px;}
    .bannerImage img{width:450px;margin:40px auto;transition: .5s;cursor:pointer;}
    .bannerTitle{position:absolute;bottom:0px;width:100%;height:60px;padding:15px 40px;background-color:rgba(41,111,151,0.8);text-align:center;text-transform: uppercase;font-size:28px;font-style:italic;font-weight:bold;color:#fff;}
    .bannerSlogan{transition: bottom .5s;width:100%;max-width:680px;position:relative;width:60%;padding:10px 40px;text-align:center;text-transform: uppercase;font-size:21px;font-style:italic;font-weight:bold;color:#fff;cursor:pointer;}
    .active{bottom:-40px;background-color:rgba(190,35,38,0.8);}
    .inactive{bottom:0px;background-color:rgba(0,0,0,0.5);}
    
    #displayContainer{min-width:900px;max-width:1360px;margin:0 auto;padding:50px;overflow:auto;}
    .displayThird{padding:0 30px;}
    .displayData{font-size:54px;}
    .displayText{font-size:17px;}
    
    #presentation{height:auto;background-image:url('/media/image/launch/interior-background.jpg');background-size:cover;background-position:center;overflow:auto;}
    #presentationHalfContainer{float:right;width:50%;}
    #presentationImageContainer{width:100%;max-width:680px;}
    #presentationImageContainer img{width:auto;margin:50px auto;}
    #presentationTitleContainer{width:100%;background-color:rgba(41,111,151,0.8);position:relative;top:40px;overflow:auto;}
    #presentationTitle{float:right;max-width:680px;padding:15px 40px;font-size:24px;font-style:italic;text-transform:uppercase;font-weight:bold;color:#fff;}
    #presentationTextContainer{width:100%;position:relative;top:40px;overflow:auto;}
    #presentationText{float:right;max-width:680px;padding:30px 40px;font-size:15px;text-align:right;line-height:150%;}
    #presentationSloganContainer{width:100%;position:relative;top:60px;}
    #presentationSlogan{float:right;max-width:680px;}
    #presentationSlogan span{width:60%;background-color:rgba(190,35,38,0.8);padding:7px 40px;font-size:17px;font-style:italic;font-weight:bold;color:#fff;}  
    #presentationThumbContainer{width:100%;position:relative;top:60px;overflow:auto;}
    #presentationThumb{float:right;width:auto;padding:40px 40px 40px 0;text-align:right;border-radius:5px;} 
    
    #presentationContainer{clear:both;width:100%;max-width:1360px;margin:0 auto;padding:20px;overflow:auto;} 
    .presentationBox{float:left;width:33.33%;padding:20px;text-align:center;}
    .presentationBox img{margin:10px;width:90%;}
    .presentationBox p{font-size:17px;font-style:italic;font-weight:bold;}
    
    #ambientMonobloc{height:720px;background-image:url('/media/image/launch/ambient-monobloc.jpg');background-size:cover;background-position:center;} 
    #ambientSplit{height:720px;background-image:url('/media/image/launch/ambient-split.jpg');background-size:cover;background-position:center;} 
    
    #productTitle{max-width:1320px;background-color:rgba(41,111,151,0.8);position:relative;top:-30px;left:20px;padding:15px 40px;z-index:100;margin-bottom:20px;}
    .switch{float:right;background-color:rgba(190,35,38,0.8);position:relative;top:0;padding:6px 20px;font-size:13px;color:#fff;cursor:pointer;}
    
    #presentationContainer{clear:left;max-width:1360px;margin:0 auto;padding:20px 40px 40px 40px;overflow:auto;} 
    .presentationBox{float:left;width:16.66%;padding:20px;text-align:center;}
    .presentationBox img{margin:10px;width:90%;}
    .presentationBox p{font-size:19px;font-style:italic;font-weight:bold;}
}

@media screen and (min-width: 1200px) {
    /* DESKTOP */
    

}

.blue{}
.red{color:rgba(190,35,38,1);}
.green{color:rgba(75,150,25,1);}

.monobloc{display:none;}
.split{display:block;}