body {
  margin:auto;
  
}

@font-face {
  font-family: "ML-TTAathira-Bold";
  src: url("../font/merra.woff") format("woff"),;


}
.ML-TTAathira-Bold{
  font-style: 25px;
  color:#000;
  
  src: url("../font/MLAA0BTT.woff") format("woff"),;

}




ul{
position: relative;

left: 50%transform: translate(-50%, -50%);
margin: 0;
display: flex;
font-size:12px;

} 

ul li{
list-style: none;
text-align: center;
display: block;
border-right: 1 px solid rgba(0,0,0,.2);
}
ul li:last-child{
border-right: none;
}

ul li a{
text-decoration: none;
padding: 0 20px;
display: block;
}
ul li a .icon{
width: 40px;
height: 23px;
text-allign: center;

overflow: hidden;
margin: 0 auto 01px;
}

ul li a .icon .fa{
width: 100%;
height: 100%;
line-height: 40px;
font-size: 18px;
color:#aee0ff;
}
ul li a .icon .fa:last-child{

color:#fff;
}
ul li a:hover .icon .fa
{
transform: translateY(-100%);
}

ul li a .name
{
position: relative;
width: 100%;
display: block;
overflow:hidden;
}

ul li a .name{
position: relative;
display: block;
color: #aee0ff;

line-height: 20px;
transition: 0.5$;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;

}

ul li a .name :before{
content: attr(date-text);
position: absolute;
top: -100%;
left: 0;
width: 100%;
height: 100%;


}
ul li a:hover .name span:before{
transform: translateY(20px);
color: #fff;


}
.more_view{
background-color: DodgerBlue;
  border: none;
  color: #FFFFFF;
  padding: 10px 10px;
  cursor: pointer;
  font-size: 12px;


  text-align:center;
  margin:auto;

}
.more_view:hover {
  background-color:#211c5b;
  padding: 10px 10px;
  color: #FFFFFF;

  text-align:center;
  margin:auto;
}
.bg-wht{
background-color:#f8f9fa;
}
.emailtext{
font-size:15px;
  color: #FFFFFF;
  width:250px;
  text-align:right;

}
.toplogo{
font-size:13px;
  color: #211c5b;
  text-align:left;
  padding-left:15px;
  line-height:85px;
  font-weight:bold;
}
.top_right_text{
font-size:13px;
  color: #211c5b;
  text-align:right;
  line-height:85px;
  font-weight:bold;
}
.allhight{
height:50px;
width:100%;

}

.headtext{
text-align:left;
font-family:Arial, Helvetica, sans-serif;
line-height:15px;
font-size:35px;
font-weight:bold;
color:#007bff;
}
.paragtext{
text-align:justify;
font-family:Arial, Helvetica, sans-serif;
line-height:13px;
font-size:15px;
color:#333333 ;
line-height:25px;
}
.textTitle{
text-align:left;
font-family:font-family:Arial, Helvetica, sans-serif;
font-size:35px;
text-align:center;
line-height:35px;
padding-bottom:45px;
font-weight:bold;
color:#007bff;
}



.textleft{
width:100%;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
color:#000;
text-align:left;

}
.mainlogo{
width:100%;
margin:auto;
	}
	
.toprightext{
width:100%;
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
color:#000;
text-align:right;
font-weight:bold;
margin-top:30px;

}






@media (min-width: 1200px){


}
@media (max-width: 1350px){

}
@media only screen and (min-width: 992px) and (max-width: 1199px){


}

@media only screen and (min-width: 768px) and (max-width: 991px) { 
ul li a .icon{
display:none;
}

ul li a .icon .fa{
display:none;
}
ul li a:hover .name span:before{
transform: translateY(20px);
color: #fff;
border:1px solid #00CCFF;

}
.emailtext{

width:100%;
text-align:center;
}

}


@media only screen and (max-width: 767px) { 
.toplogo{
text-align:center;
margin:5px 0 0 0;
height:auto;

}
.top_right_text{
text-align:center;
margin:auto;
height:auto;
line-height:10px;
padding-bottom:30px;
font-size:25px;
}
.emailtext{

width:100%;
text-align:center;
}
ul li a .icon .fa{
display:none;
height:25px;
}
ul li a .icon{
display:none;
}

ul li a .icon .fa{
display:none;
}
.toprightext{
display:none;
}
.mainlogo{
width:100%;
margin:auto;
text-align:center;
	}
}


@media only screen and (min-width: 576px) and (max-width: 766px) {
.allhight{
height:0;
width:100%;
}
.headtext{
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:35px;
font-weight:bold;
color:#007bff;
}
.carousel-inner {
   
   height: 50px;
}
.emailtext{

width:100%;
text-align:center;
}
ul li a .icon{
display:none;
}

ul li a .icon .fa{
display:none;
}
.toprightext{
display:none;
}
.mainlogo{
width:100%;
margin:auto;
text-align:center;
	}
	
}

@media only screen and (max-width: 479px) {
.allhight{
height:0;
width:100%;
}
.mt-4, .my-4{
text-align:center;
margin-top:200px;
}
.top_right_text{
font-size:16px;
  color: #211c5b;
  text-align:center;
}
.toplogo{
font-size:13px;
  color: #211c5b;
  text-align:center;
  height:auto;
}
.emailtext{

width:100%;
text-align:center;

}
.alltext{
text-align:justify;
font-family:Arial, Helvetica, sans-serif;
line-height:13px;
font-size:15px;
color:#666666;
line-height:25px;
}

.textTitle{
text-align:left;
font-family:font-family:Arial, Helvetica, sans-serif;
font-size:25px;
text-align:center;
line-height:25px;
}

.btn-outline-success {
	width:100%;
}
.btn-outline-success:hover {
	width:100%;
	color:#000000;
	
}
.carousel-inner {
   
    height: 160px;
}
ul{


} 

ul li{

}
ul li:last-child{
border-right: none;
}

ul li a{

display: block;
}
ul li a .icon{

display:none;

}

ul li a .icon .fa{

display:none;
}
ul li a .icon .fa:last-child{

color:#fff;
}
ul li a:hover .icon .fa
{
transform: translateY(-100%);
}

ul li a .name
{

width: 100%;
display: block;


}

ul li a .name span:before{




}
ul li a:hover .name span:before{
transform: translateY(20px);
color: #fff;
border:1px solid #00CCFF;

}
.mainlogo{
width:100%;
margin:auto;
text-align:center;
	}
.toprightext{
display:none;
}

}






