/**************           *******************/
/*************** #slide *******************/
/**************           *******************/

.info_slide {
  padding-top: 75px;
}

.slider {
  margin: 0 auto;
  padding-top: 30px;
  max-width: 1170px;
  position: relative;
  
}
  
.slide_viewer {
  height: 470px;
  overflow: hidden;
  position: relative;
}
  
.slide_group {
  height: 100%;
  position: relative;
  width: 100%;
}
  
.slide {
  display: none;
  height: 100%;
  position: absolute;
  width: 100%;
}
  
.slide:first-child {
  display: block;
}
  
.slide:nth-of-type(1) {
  background: url(https://www.bkkcover.com/img/slide/headerbg1.jpg);
  background-size: cover;
  width: 100%;
  background-position: center center;
}
  
.slide:nth-of-type(2) {
  background: url(https://www.bkkcover.com/img/slide/headerbg2.jpg);
  background-size: cover;
  width: 100%;
  background-position: center center;
}
  
.slide:nth-of-type(3) {
  background: url(https://www.bkkcover.com/img/slide/headerbg3.jpg);
  background-size: cover;
  width: 100%;
  background-position: center center;
}
  
.slide:nth-of-type(4) {
  background: url(https://www.bkkcover.com/img/slide/headerbg4.jpg);
  background-size: cover;
  width: 100%;
  background-position: center center;
}

.slide:nth-of-type(5) {
  background: url(https://www.bkkcover.com/img/slide/headerbg5.jpg);
  background-size: cover;
  width: 100%;
  background-position: center center;
}

.slide:nth-of-type(6) {
  background: url(https://www.bkkcover.com/img/slide/headerbg6.jpg);
  background-size: cover;
  width: 100%;
  background-position: center center;
}

.slide:nth-of-type(7) {
  background: url(https://www.bkkcover.com/img/slide/headerbg7.jpg);
  background-size: cover;
  width: 100%;
  background-position: center center;
}

.slide:nth-of-type(8) {
  background: url(https://www.bkkcover.com/img/slide/headerbg8.jpg);
  background-size: cover;
  width: 100%;
  background-position: center center;
}

.slide:nth-of-type(9) {
  background: url(https://www.bkkcover.com/img/slide/headerbg9.jpg);
  background-size: cover;
  width: 100%;
  background-position: center center;
}

.slide:nth-of-type(10) {
  background: url(https://www.bkkcover.com/img/slide/headerbg10.jpg);
  background-size: cover;
  width: 100%;
  background-position: center center;
}

.slide_buttons {
  left: 0;
  position: absolute;
  right: 0;
  text-align: center;
}
  
a.slide_btn {
  color: #474544;
  font-size: 42px;
  margin: 0 0.175em;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
  
.slide_btn.active, .slide_btn:hover {
  color: #428CC6;
  cursor: pointer;
}
  
.directional_nav {
  margin: 0 auto;
  max-width: 1170px;
  position: relative;
  top: -270px;
  padding-bottom: 20px;
}
  
.previous_btn {
  bottom: 0;
  left: 50px;
  margin: auto;
  position: absolute;
  top: 0;
}
  
.next_btn {
  bottom: 0;
  margin: auto;
  position: absolute;
  right: 110px;
  top: 0;
}
  
.previous_btn, .next_btn {
  cursor: pointer;
  height: 0px;
  width: 0px;
  opacity: 0.2;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -ms-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}
  
.previous_btn:hover, .next_btn:hover {
  opacity: .5;
}
  

/*************                       ******************/
/************** เริ่มต้นการปรับแต่งหน้าจอ *******************/
/*************                       ******************/


/****** Kindle Fire HD 8.9" (800 x 1280) ย่อเมื่อจอน้อยกว่า 1280px******/ 
@media only screen and (max-width: 1280px){
.slide_viewer {
    height: 470px;
  }
}


/****** ย่อเมื่อจอน้อยกว่า 1200px พิเศษไม่ใช่ขนาดหน้าจอ******/
@media only screen and (max-width: 1200px){

.slide_viewer {
    height: 458px;
  }

.directional_nav {
    top: -270px;    
  }
      
}

/****** ย่อเมื่อจอน้อยกว่า 1100px พิเศษไม่ใช่ขนาดหน้าจอ******/
@media only screen and (max-width: 1100px){
  
.slide_viewer {
    height: 418px;
  }
     
.directional_nav {
    top: -250px;   
  }
}

/****** iPad Air (768 x 1024),Kindle Fire (600 x 1024) ย่อเมื่อจอน้อยกว่า 1024px*******/
@media only screen and (max-width: 1024px){

.slide_viewer {
    height: 389px;
  }
    
.directional_nav {
    top: -240px;   
  }

.previous_btn {
    left: 40px;
  }
      
.next_btn {
    right: 105px;
  }

}

/****** Galaxy Nexus 7 (603 x 966) ย่อเมื่อจอน้อยกว่า 966px*******/
@media only screen and (max-width: 966px){
    
.slide_viewer {
    height: 366px;
  }
   
.directional_nav {
    top: -230px;   
  }

.previous_btn {
    left: 38px;
  }
      
.next_btn {
    right: 100px;
  }

}

/****** ปรับจออัตโนมัติ ในช่วง 966-853 เพื่อให้สมดุล ที่ระยะ 900px *******/ 
@media only screen and (max-width: 900px){

.slide_viewer {
    height: 340px;
  }
   
.directional_nav {
    top: -215px;   
  }

.previous_btn {
    left: 33px;
  }
      
.next_btn {
    right: 98px;
  }

}

/****** Galaxy Note 4 (480 x 853),Kindle Fire HD 7" (533 x 853) ย่อเมื่อจอน้อยกว่า 853px*******/
@media only screen and (max-width: 853px){

.slide_viewer {
    height: 322px;
  }
   
.directional_nav {
    top: -210px;   
  }

.previous_btn {
    left: 30px;
  }
      
.next_btn {
    right: 95px;
  }
  
}

/****** Galaxy Tab 2 10.1 (800 x 1280),Kindle Fire HD 8.9" (800 x 1280) ย่อเมื่อจอน้อยกว่า 800px*******/
@media only screen and (max-width: 800px){

.slide_viewer {
    height: 300px;
  }
   
.directional_nav {
    top: -200px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}


/****** iPad Air (768 x 1024) ย่อเมื่อจอน้อยกว่า 768px*******/
@media only screen and (max-width: 768px){

.slide_viewer {
    height: 288px;
  }
   
.directional_nav {
    top: -190px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Iphone 6 Plus (414 x 736) ย่อเมื่อจอน้อยกว่า 736px*******/
@media only screen and (max-width: 736px){

.slide_viewer {
    height: 275px;
  }
   
.directional_nav {
    top: -185px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Nexus 6 (412 x 690) ย่อเมื่อจอน้อยกว่า 690px*******/
@media only screen and (max-width: 690px){
    
.slide_viewer {
    height: 260px;
  }
   
.directional_nav {
    top: -175px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Iphone 6 (375 x 667) ย่อเมื่อจอน้อยกว่า 667px*******/
@media only screen and (max-width: 667px){
    
.slide_viewer {
    height: 248px;
  }
   
.directional_nav {
    top: -165px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Galaxy S6 (360 x 640),Lumia 920 (384 x 640),Galaxy Note II (360 x 640) ย่อเมื่อจอน้อยกว่า 640px*******/
@media only screen and (max-width: 640px){
    
.slide_viewer {
    height: 240px;
  }
   
.directional_nav {
    top: -160px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Xperia Z3 (360 x 598),Kindle Fire (600 x 1024),Galaxy Nexus 7 (603 x 966) ย่อเมื่อจอน้อยกว่า 603px*******/
@media only screen and (max-width: 603px){
    
.slide_viewer {
    height: 225px;
  }
   
.directional_nav {
    top: -155px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Iphone 5 (320 x 568) ย่อเมื่อจอน้อยกว่า 568px*******/
@media only screen and (max-width: 568px){

.slide_viewer {
    height: 210px;
  }
   
.directional_nav {
    top: -150px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Kindle Fire HD 7" (533 x 853) ย่อเมื่อจอน้อยกว่า 533px*******/
@media only screen and (max-width: 533px){
    
.slide_viewer {
    height: 195px;
  }
   
.directional_nav {
    top: -140px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Iphone 4 (320 x 480),Galaxy Note 4 (480 x 853) ย่อเมื่อจอน้อยกว่า 480px*******/
@media only screen and (max-width: 480px){
    
.slide_viewer {
    height: 180px;
  }
   
.directional_nav {
    top: -130px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Nexus 6 (412 x 690),Iphone 6 Plus (414 x 736) ย่อเมื่อจอน้อยกว่า 414px*******/
@media only screen and (max-width: 414px){
    
.slide_viewer {
    height: 153px;
  }
   
.directional_nav {
    top: -115px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}


/****** Lumia 920 (384 x 640) ย่อเมื่อจอน้อยกว่า 384px*******/
@media only screen and (max-width: 384px){

.slide_viewer {
    height: 142px;
  }
   
.directional_nav {
    top: -110px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Iphone 6 (375 x 667) ย่อเมื่อจอน้อยกว่า 375px*******/
@media only screen and (max-width: 375px){
    
.slide_viewer {
    height: 135px;
  }
   
.directional_nav {
    top: -105px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Galaxy S6 (360 x 640),Xperia Z3 (360 x 598),Galaxy Note II (360 x 640) ย่อเมื่อจอน้อยกว่า 360px*******/
@media only screen and (max-width: 360px){

.slide_viewer {
    height: 128px;
  }
   
.directional_nav {
    top: -100px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}

/****** Iphone 5 (320 x 568),Iphone 4 (320 x 480), ย่อเมื่อจอน้อยกว่า 320px*******/
@media only screen and (max-width: 320px){
 
.slide_viewer {
    height: 115px;
  }
   
.directional_nav {
    top: -95px;   
  }

.previous_btn {
    left: 25px;
  }
      
.next_btn {
    right: 90px;
  }

}




