﻿	.header{
		line-height:1.5;
	}
	.header1{
		font-size:18px;
		padding-left:20px;
		
	}
	.navbar .nav-item .nav-link:hover {
    color: rgba(255,96,41,.75);
}
	.btn{border:1px solid #ff6029;background:transparent;color:#ff6029;}
	.btn:hover{
              background-color:#ff6029;
               color:white ; 		
}
	.header2{
		background-color:#2a2a32;
	}
	.text{
		background-color: rgba(255,255,255,0.0)
	}
	 .footer{
           float:left;
           width:33%;
           }
    .footer1{
            color:#ff6029;
            font-size:36px;
		margin-top:20px;
            }
    .footer2{
            color:#d8d8d8; 
            padding-left:20px;
            }
	 .text1::first-letter{
                   color:#d8d8d8;
                   font-size: xx-large;
                   }
	
	.icontext4{
              color:#d8d8d8; 
              padding-right:40px;
              }
	.faa:hover{
		color:#3b5998;
	}
	.faa1:hover{
		color:#0084b4;
	}
	.faa2:hover{
		color:#c8232c;
	}
	.faa3:hover{
		color:#db4a39;
	}
	.picture{
		margin-top:45px;
	}
	 .box3{
         
         height:100%;
         border:2px dashed;
		 border-color:black;
		 
		
         
         }
	.box4{
         
         height:100%;
         border:2px solid;
		 border-color:black;
		
		
         
         }
	.box5{
         
         height:100%;
         
         border:2px solid;
		 border-color:black;
		
		
         
         }
    
	.icontext1{
              font-size:50px;
              padding-top:15px;
              color:#ff6029;
              }
	  .icontext2{
              font-size:25px;
              color:#919191;
              }
	.icontext3{
              color:black;
              font-size:20px;
              padding-left:10px;
              }
	.text2::first-line{
                   color:#ff6029;
                   
                   }
	body,html{
		overflow-x: hidden;
	}
	
	.image-hover * {-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.image-hover {position:relative;display:inline-block;overflow:hidden;
box-shadow:0px 2px 3px rgba(0, 0, 0, 0.3);-moz-box-shadow:0px 2px 3px rgba(0, 0, 0, 0.3);-webkit-box-shadow:0px 2px 3px rgba(0, 0, 0, 0.3)}
.image-hover a {text-decoration:none}
.image-hover .img {margin:-100px 0px 0px -100px}


/*** effect zoom in ***/

.img-zoom-in img 
{
transition:all .2s ease-in-out;
-webkit-transition:all .2s ease-in-out;
-moz-transition:all .2s ease-in-out;
-ms-transition:all .2s ease-in-out;
-o-transition:all .2s ease-in-out;
}

.img-zoom-in:hover img 
{
transform:scale(1.2);
-webkit-transform:scale(1.2);
-moz-transform:scale(1.2);
-ms-transform:scale(1.2);
-o-transform:scale(1.2)
}
	.overlay{position: absolute;
	top:50%;
	left:30%;
	 font-size:50px;
	color:white;}	
	
	.overlay1{position: absolute;
	top:50%;
	left:35%;
	 font-size:50px;
	color:white;}	
	
	.overlay2{position: absolute;
	top:50%;
	left:6%;
	 font-size:50px;
	color:white;}	
	
	.overlay3{position: absolute;
	top:50%;
	left:24%;
	 font-size:50px;
	color:white;}
	
	.overlay4{position: absolute;
	top:50%;
	left:35%;
	 font-size:50px;
	color:white;}	
	 
	 
	::selection{
		color:#2a2a32;
		background-color:#ff6029;
	}
	
	::-moz-selection{
		color:#2a2a32;
		background-color:#ff6029;
	}
	  
	 
	 @media only screen and (max-width: 1024px){
		
		.t{
			
			transform: scale(0.6);
			margin-left:-70px;
		}
		
	}

@media only screen and (max-width: 800px){
		
		.ic{
			
			font-size:10px;
			margin-left:10px;
			
		}
		
	}

@media only screen and (max-width: 800px){
		
		.icc{
			
		display:none;
			
		}
		
	}

@media only screen and (max-width: 414px){
		
		.pics{
			
		margin-left:45px;
			
		}
		
	}

	
	.logo{
		
		width:200px;
		height:80px;
       padding-left:18px;
	}	
	
	
	.body{
		
		margin:0px;
		padding:0px;
	}
	
	.name{
		
		color:white;
		font-size:54px;
		font-weight:bold;
	}
	
	.footerr{
		
		height:100%;
		width:100%;
		background-color:#2a2a32;
		margin-top:50px;
		text-align:justify;
		font-family: Kanit, sans-serif;
	}
	
	.title{
		
		font-size:40px;
		color:#ff6029;
		margin-top:150px;
		font-family: Kanit, sans-serif;
	}
	
	.para{
		
		font-size:20px;
		text-align:justify;
		font-family: Kanit, sans-serif;
	}


.space{
	padding-right:20px;
}

.space1{
	
	padding-right:15px;
}

.caroname{
	
	color:#ff6029;
}

.para1{
	margin-top:60px;
}

.book{
	color:white; 
	font-size:30px;
}

.book1{
	
	margin-top:10px;
}

.vid{
	margin-top:30px;
}
.fot{
	
	background-color:#2a2a32;
}

.icstyle{
	color:#ff6029;  
	margin-top:15px;
}

.ictstyle{
	
	color:#d8d8d8;
	padding-left:10px; 
	font-family: Kanit, sans-serif;
}
.sic{
	margin-top:25px;
	font-size:40px;
}

.cop{
	color:#d8d8d8; 
	padding-right:32px;
	margin-top:20px;
}
.pictures{
	margin-top:50px;
}


.searchbar{
    margin-bottom: auto;
    margin-top: auto;
    height: 60px;
    background-color: #353b48;
    border-radius: 30px;
    padding: 10px;
    }

    .search_input{
    color: white;
    border: 0;
    outline: 0;
    background: none;
    width: 0;
    caret-color:transparent;
    line-height: 40px;
    transition: width 0.4s linear;
    }

    .searchbar:hover > .search_input{
    padding: 0 10px;
    width: 230px;
    caret-color:red;
    transition: width 0.4s linear;
		text-decoration:none;
    }

    .searchbar:hover > .search_icon{
    background: white;
    color: #e74c3c;
		text-decoration:none;
    }

    .search_icon{
    height: 40px;
    width: 40px;
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    color:#ff6029;
    }



.box8{
         width:500px;
         height:50px;
         border:2px solid #2a2a32 ;
        
         background-color:#2a2a32;
	margin-bottom:40px;
		
         }


