h2.title{font-size:2em; text-align:center; display:block;}

body{background: url(../../images/background.png) center top no-repeat #000; background-size: cover;font-family: 'Montserrat', sans-serif; background-attachment: fixed;color:#fff;}
a:hover{text-decoration: none;}

header{display: table; width: 100%; max-width: 1200px; margin: 100px auto;}
h1{display: table; width: 90%; max-width: 350px; float: left;}
h1 a{display: table; width: 100%;}
h1 a img{display: table; width: 100%;}
.carousel_custom_holder{display: table; /* width: calc(100% - 400px); float: right;*/ margin: 0 auto;}

section{display: table; width: 100%; max-width: 1200px; margin: 0 auto;}
.thumbnail_container{display: table; width:25%; float: left; margin: 0 0 40px 0px;}
.thumbnail_content{display: table; width:calc(100% - 20px); padding-left: 10px;}
.thumbnail_content h2{display: table; width: 100%; text-align: center; color: #fff; font-size: 1.4em; font-weight: bold; letter-spacing: 1px; margin-bottom: 15px;}
.thumbnail_photo_container{display: table; width:100%; position: relative;border-radius: 5px; border:3px solid #fff; overflow: hidden; margin-bottom: 20px;transition: ease all 0.5s;}
.thumbnail_link_container{display: block; opacity: 0; transition: ease all 0.3s; background: rgba(0,0,0,0.8); position: absolute; left: -30%; margin-left:140px; width:280px; height: 170px; }
.thumbnail_photo_container:hover .thumbnail_link_container{opacity: 1; left: -50%;}
.thumbnail_link_container a{display: table; width: 50%; float: left; color: #fff; font-weight: bold; text-decoration: none; padding-top: 43px; height: 100%;}
.thumbnail_link_container a div{display: table; width: 100%; text-align: center; margin-bottom: 10px;}
.gotosite_img{display: table; width:34px; height: 34px; background: url(../../images/gotosite.png) center center no-repeat;}
.gotoagent_img{display: table; width:34px; height: 34px; background: url(../../images/gotoagent.png) center center no-repeat;}

.thumbnail_link_container a img{display: table; margin: 0 auto;}
.thumbnail_link_container a:first-child div:after{ display: block; position: absolute; content: ''; border-left: 1px solid #fff; height: 100px; left: 140px; top: 35px;}
.thumbnail_link_container a:hover{color: #FED14D}
.thumbnail_photo_container:hover{border-color:#FED14D }
nav{display: table; width: 100%; position: relative;}
nav a{display: table; width: 33.3%; float: left; text-align: center; color: #fff; text-decoration: none; font-size: 0.7em;}
nav a:after{
    display: block;
    content: '';
    position: absolute;
    border-right: 1px solid #fff;
    height: 60px;
    top: 4px;}
.windows_download:after{display: none;}
nav a span{margin-top: 40px; display: table; width: 100%;}
.thumbnail_link_container a:hover .gotosite_img{ background: url(../../images/gotosite_hover.png) center center no-repeat;}
.thumbnail_link_container a:hover .gotoagent_img{background: url(../../images/gotoagent_hover.png) center center no-repeat;}

.windows_download{display: table; background: url(../../images/windows.png) center top no-repeat; background-size: 40px;}
.apple_download{display: table; background: url(../../images/apple.png) center top no-repeat; background-size: 40px;}
.android_download{display: table; background: url(../../images/android.png) center top no-repeat; background-size: 40px;}


nav a.windows_download:hover{background: url(../../images/g_windows.png) center top no-repeat; }
nav a.apple_download:hover {background: url(../../images/g_apple.png) center top no-repeat; }
nav a.android_download:hover {background: url(../../images/g_android.png) center top no-repeat; }
nav a:hover span{color: #FED14D}


@media (max-width:500px) and (orientation:portrait){
  h1{display: table;
    width: 90%;
    max-width: 200px;
    float: none;
    margin: 0 auto 20px;}

    section {
    display: table;
    width: 100%;
    max-width: 280px;
    margin: 0 auto;
}
.carousel_custom_holder {
    display: table;
    width: 100%;
    float: right;
}

header{margin: 5em auto 2em auto}
img.logo{width:160px !important; height:auto !important}

.thumbnail_content{display: table; width:calc(100% - 0px); padding-left: 0px;}
}

@media (max-width:1366px) and (orientation:portrait){
  h1 {
      display: table;
      width: 90%;
      max-width: 260px;
      float: none;
      margin: 0 auto 20px;
  }
  .carousel_custom_holder {
      display: table;
      width: 100%;
      float: right;
  }
  section {
    display: table;
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}
}

@media (max-width:1365px) {
  h1 {
      display: table;
      width: 90%;
      max-width: 260px;
      float: none;
      margin: 0 auto 20px;
  }
  .carousel_custom_holder {
      display: table;
      width: 100%;
      float: right;
  }
  section {
    display: table;
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}
}

@media (max-width:768px) and (orientation:portrait){
  section {
    display: table;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
}
}

@media (max-width:767px) and (orientation:portrait){
  section {
    display: table;
    width: 100%;
    max-width: 280px;
    margin: 0 auto;
}
}

@media (max-width:890px) and (orientation:landscape){
  h1 {
      display: table;
      width: 90%;
      max-width: 260px;
      float: none;
      margin: 0 auto 20px;
  }
  .carousel_custom_holder {
      display: table;
      width: 100%;
      float: right;
  }
  section {
    display: table;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
}
}

.logo{float:left;}
.whatsapp{display: table; width: 100%; background: #000000; position: fixed; top: 0; left: 0; z-index: 99}
.whatsapp .inner_wrapper{display: table; max-width: 1200px; margin:0 auto; width: 95%;}
a.social{display: table; float: right; width: auto; cursor:pointer;}
.whatsapp img{display: table; width: auto; height: 43px; margin:3px;}
.contact{width: 90%; margin: 0 auto;}
.wechat_id{text-align:center; padding: 5px;}
.qrimg{width: 100%!important;}

table, th, td {  border: 1px solid #ddd;padding:3px;}
table{margin-bottom:1em;}
.hotline {float:left;}
.hotline img{display:inline; margin:3px; height: 43px;}
.hotline a{float:left; margin:5px; color: #fff !important; font-weight:600; font-size: 1.1em;}
footer{position: fixed; bottom:0; background-color: #000;}
h3{text-align: center; font-size:1em;}