@import url('https://fonts.googleapis.com/css?family=Prompt:300,400,500,600,700|Roboto:300,400,500,700,900|Source+Sans+Pro:400,700');
body { padding:0;margin: 0;background: #ffffff;font-family: 'Prompt';  color:#666 !important;
}

@media screen and (max-width:568px){

  body { overflow-x: hidden;}

}
.roboto {font-family:'Roboto',Prompt;}
.prompt {font-family:'Prompt';}
.sourcesanspro{font-family:'Source Sans Pro',Prompt,serif;}
a{ cursor: pointer; transition:all 0.5s}
a { color: #039a40;}
 a:hover { text-decoration: none;color:#ffcc00;}


/************ nav-language  str*************/


strong {font-weight:400;}

.text-indent { text-indent: 30px;}

.font-weight-300 {font-weight:300;}
 .font-weight-400 {font-weight:400;}
 .font-weight-500 {font-weight:500;}
 .font-weight-800 {font-weight:700;}
 .font-weight-800 {font-weight:800;}
 .fx015 { font-size:0.15em;}
 .fx025 { font-size:0.25em;}
 .fx05 { font-size:0.5em;}
 .fx075 { font-size:0.75em;}
 .fx08 { font-size:0.8em;}
 .fx09 { font-size:0.9em;}
 .fx1 { font-size:1em;}
 .fx125 { font-size:1.25em;}
 .fx15 { font-size:1.5em;}
 .fx2   { font-size:2em;}
 .fx25   { font-size:2.5em;}

 .fx3 {font-size:3em;}
 .fx4 {font-size:4em;}
 .fx5 {font-size:5em;}
 .fx8 {font-size:8em;}
 .fx9 {font-size:9em;}

 @media screen and (max-width:768px){
    .fx8 {font-size:4em;}
    .border-left-1 { border-left:0;}
    .fx2   { font-size:1.5em;}
    .fx25 {
      font-size: 1.5em;
  }
  .fx15 {
    font-size: 1.2em;
}
.fx125 {font-size:1em !important;}
 }

 @media screen and (max-width:468px){
    .fx8 {font-size:3em;} 
    .fx2   { font-size:1.2em;}
   .fx4 {font-size:2em;}

 }
 .max-w-800 {
    max-width:800px;
   margin: auto;} 
 .max-w-600 {
    max-width: 600px;
   margin: auto;} 
   .max-w-450 {
    max-width: 450px;
   margin: auto;}
 .max-w-400 {
    max-width: 400px;
   margin: auto;}
   .max-w-350 {
    max-width: 350px;
   margin: auto;}
.w50 { width:50% ;float: left;}
.w100 { width:100% ;}
   /*.nav-top a:link,.nav-top a:visited { color: #57c75b;}*/
    .timeNewRoman{font-family:"Times New Roman", Times, serif;}
    .font-style-normal {font-style: normal;}
    .color-yellow {color:#fad100}
    .color-l-blue {color:#24afec}
    .color-green {color:#2f9d00}
    .color-white {color:#FFF;}
    .color-grey {color: #666;}
    .color-l-grey {color: #999;}
    .color-black {color: #333;}
    .bg-yellow{background: #fad100;color:#FFF;}
    .bg-lightgrey {background:#f4f4f4;}
    .line-height{ line-height: 1;}


    .border-b { border-bottom: 1px solid #eee; margin-bottom: 20px;}

.header-bg { background-image: url(../image/header/bg.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            background-position:center ;
            position: relative;padding-bottom: 20px;
            
}

.header-bg-contact {background-image: url(../image/background/coontact-us.png);}

.header-bg-top { /*background: url(../image/header/header-top-bg.png);*/
    /*background-repeat:no-repeat; background-position: top;*/
    /*background-size:cover; min-height:133px;*/

}
.header-bg-top {background:#fff;}
@media screen and (max-width:568px){
  .header-bg-top {background:#fff;}
  .header-bg {  
    background-size: contain;
    background-position:0% 90% ;
    position: relative;padding-bottom: 20px;
    
}

}
.header-bg-bottom{
    background: url(../image/header/header-bottom-bg.png);
    background-position: 50% 102%;
    background-size: 100% auto;   
    background-repeat:no-repeat; height:60px;
    width: 100%;
    position: absolute;
    bottom: -3px;
    border-bottom: 2px solid #FFF;
     

}
.header-bg-bottom2{
    background: url(../image/header/header-bottom-bg2.png);
    background-position: 50% 102%;
    background-size: 100% auto;   
    background-repeat:no-repeat; height:60px;
    width: 100%;
    position: absolute;
    bottom: -3px;
    border-bottom: 0px solid #FFF;
     

}
@media screen and (min-width:768px){

    .bn-315{
      min-height: 315px;
      justify-content: center;
      align-items: center;
      position: relative;
      display: flex;
    }

}

@media screen and (max-width:768px){

  .header-bg{padding-bottom: 10px;}
  .header-bg-bottom{height:10px;}

}

.li-callcenter-top a { color: #999;font-size:14px;}

.li-callcenter-top a:hover { color: #24afec;}

.navbar-nav {font-family: Source Sans Pro , sans-serif;}

.navbar-nav  .nav-link {
  
  padding: .5rem 1rem;
  font-size: 22px;
  font-family: Prompt;
  
}

.nav-item.active { border-bottom: #24afec solid 2px;}

@media screen and (min-width:768px){

    .text-muted {margin-bottom: 0px;}

    .text-muted img {     
    margin-top: -40px;
    margin-bottom: 0px;
  width: 260px;}    

  

    p {font-size:20px;}
 
}
@media screen and (max-width:768px){

  .text-muted img{
        width:160px !important;
       
  }
  .text-muted { margin: auto!important;width: 100%; text-align: center;}

}


.dropdown-submenu {
    position: relative;
  }
  
  .dropdown-submenu a::after {
    transform: rotate(-90deg);
    position: absolute;
    right: 6px;
    top: .8em;
  }
  
  .dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-left: .1rem;
    margin-right: .1rem;
  }



  /* dropdown str */

  .dropdown-menu  {
       
    position: absolute;
    top: 100%;
    left: auto;
    right:-350px;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: transparent;
    background-clip: padding-box;
    border: 0px solid rgba(0,0,0,.15);
    border-radius: .25rem;
    overflow: hidden;position: relative;
    
}

.dropdown-menu:after {
    content: '';
    position: absolute;
    width: 1100%; height: 1100%;
    bottom: -100px; left: -510%;
    background: rgba(63,169,245,.9);
    transform-origin:  33.5% 0;
    transform: rotate(-45deg);
    z-index: -1;
  }

@media screen and (min-width:768px){
    .dropdown-menu  {
         width: 500px !important;
         padding: 20px 40px 40px 20px;
    }
    .dropdown-menu .border-green 
    {
        border-left:1px solid #a9d227;
    }

    .dropdown-menu .border-green  a { font-size: 16px;}
    
    .dropdown-menu a.dropdown-item { color:#fff;}
    .dropdown-menu .disabled.nav-link { color:#fff !important;font-weight:600;}


    .dropdown-item:hover {
        color: #fff;
        text-decoration: none;
        background-color: rgba(255,255,255,.3);
    }
}
@media screen and (max-width:678px){
  .dropdown-menu .disabled.nav-link {  font-size: 13px;}
  .dropdown-menu .w50 { width: 100%!important;}
}
.bg-l-g {background-color:#e6e6e6; }
  .bg-l-g:before { content:"";max-width: 956px; width: 100%;min-height: 58px; display: block; margin:0 auto; top:0;
                background-image: url(../image/background/top-g.jpg);
                background-position: top center;
                background-repeat: no-repeat;
              }
  .bg-l-g:after { content:"";max-width: 956px; width: 100%;min-height: 58px; height:auto;display: block; margin:0 auto;
    background-image: url(../image/background/bottom-g.jpg);
    background-position: bottom center;
    background-repeat: no-repeat;

  }

  @media screen and (max-width:678px){

    .bg-l-g:before,.bg-l-g:after {min-height: 18px; }

  }



.bg-l-g.stickfooter:after {  
  background-image: none;height:0 ;
}

  .bg-top-lg {
    background:#f2f2f2 url(../image/background/top-lg.jpg) no-repeat top center;
    background-size:auto 50px ;  
    

  }

  .bg-top-lg.bg-top-mg {background-image:url(../image/background/top-mg.jpg) !important; }
  /* slide-interview str */
    

    .slide-interview .card {

       box-shadow: 0 0 16px rgba(111, 111, 111, 0.3);
       text-align:center;
       margin-bottom: 20px;
       min-height:280px;
       display: flex;align-items: center;justify-content: center;

    }
    .slide-interview .card img {
            position: relative;width: 100%; margin: auto;
    }

    .slide-interview a:hover:before  {

          content:"" ; display: block; 
          position:absolute;
          z-index:8;
          background:rgba(63,169,245,.8);
          width: 100% ; height: 100%;

    }

    @media screen and (max-width:768px){
      .slide-interview .card {
          min-height: auto !important;
      }
    }

    /*.slide-interview a:hover:after{

         
     content:"\f0c1";font-family:'FontAwesome';
     display: flex;justify-content: center;
     align-items:center;color: #2f7fb8;
     z-index: 9;font-size: 110px;
     position:absolute;
     top: 0;
     width: 100%; height: 100%;
     opacity:.8;

    }  */
    .slide-interview a span{

         
      font-family:'ROBOTO';
      display:none;justify-content: center;
      align-items:center;color: #FFF;
      z-index: 9;font-size: 20px;
      position:absolute;
      top: 0;
      width: 100%; 
      height: 100%;
 
     } 

     .slide-interview a:hover span{

         
      display: flex;
 
     } 
 
  /* slide-interview end */
/* product-interview str */
    

.product-interview .card {
  
  box-shadow: 0 0 16px rgba(111, 111, 111, 0.3);
  text-align:center;
  margin-bottom: 30px;
  min-height:280px;
  display: flex;align-items: center;justify-content: center;

}
.product-interview .card img {
       position: relative;width: 80%;margin: auto;
}
.product-interview a {color:#aaa!important;position: relative;}
.product-interview a:hover:before  {

     content:"" ; display: block; 
     position:absolute;
     z-index:8;
     background:rgba(63,169,245,.8);
     width: 100% ; height: 100%;

}

.product-interview a:hover span {

  color:#FFF;  
  display:flex;justify-content: center;
  align-items:center;color: #FFF;
  z-index: 9;
  position:absolute;
  top: 0;
  width: 100%; 
  height: 100%;
}

.product-interview a:hover span .color-green {color:#FFF !important;}


.product-interview a span { bottom: 5px;position: absolute;}






/* product-interview end */
  /*  logo slide str*/

  .content-slider img{

        width: 80%;

        margin: 0 auto;

  }

  /*  logo slide end*/
  /* the3biggie str*/
  .the3biggie a img {box-shadow: 0 3px 18px #ccc ;}
    .the3biggie a:hover img {filter: brightness(110%);}

  /* the3biggie end*/
/* otherHereStr str */

.otherHereStr  img { max-width: 120px; width: 20%;}

/* otherHereStr end */

/* footer str */

.footer { background:#1a1a1a; color: #aaa;font-size:13px;}

@media screen and (min-width:768px){
 .footer-bottom p{font-size:1.2em !important;}
}

.fb-btn {background-color: #0071bc; color: #fff!important; background-image: url(../image/social/fb.png);margin-right: 5px;
background-position: left center; background-repeat: no-repeat; background-size: 25px auto; padding: 10px;padding-left: 25px; 
transition: ease-in-out all .5s;}

.fb-btn:hover {background-color: #065784;}

.line-btn {background-color: #01cf2d; color: #fff!important; padding: 10px 20px;}
 
/* footer end*/


.topic-page { padding-top: 60px;}

.topic-page-list a { color:#212529!important;font-size: 12px;} 



.list-inline li { float: left;padding:0 15px ;border-right:1px solid #A2D025;} 

.list-inline li:last-child {border-right:0px solid #FFF;}

.btn-border-l-b { border:1px solid #0071bc; color: #0071bc!important;}

.btn-border-l-b:hover { border:1px solid #0071bc; color: #fff!important; background-color:#0071bc ;}
@media screen and (max-width:568px){
  .topic-page-list a {  font-size: 9px;} 
  .list-inline li {padding:0 5px}
}
/* form str */

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-size:13px
}
::-moz-placeholder { /* Firefox 19+ */
  font-size:13px
}
:-ms-input-placeholder { /* IE 10+ */
  font-size:13px
}
:-moz-placeholder { /* Firefox 18- */
  font-size:13px
}


.btn-primary {background: url(../image/btn/sucess-btn.jpg) repeat-x ; background-size: auto 100% ;border-radius: 8px; border:1px solid #24afec;}
.btn-secondary {background: url(../image/btn/default-btn.jpg) repeat-x ; background-size: auto 100% ;border-radius: 8px; border:1px solid #ddd}

/* form end */


/* google map str*/

.map-container{
  overflow:hidden;
  padding-bottom:56.25%;
  position:relative;
  height:0;
  }
  .map-container iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute;
  }

/* google map end*/

/* footer str */

.footer-bottom { background-color: #333; color:#999;font-size: 12px;}

/* footer end  */


.col-20 { width: 18%; margin: 1%; min-height: auto;}

.col-20 .card {min-height: auto !important;margin-bottom: 0;}
