@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800,900&subset=latin-ext');



/* --------------------------------------------------------
    General
----------------------------------------------------------- */
body {  font-family: 'Montserrat', sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; box-sizing: border-box;} 
body {
    font-weight: 300;
    font-size: 16px;
    color: #353535;
}
.btn:focus,
:focus,
*:focus,
button:focus,
.form-control:focus,
input:focus { box-shadow: none !important; outline: none !important}

a,
a:hover { color: #353535; }

.container { position: relative; }
.container:after,
.container:before { display: table; content: " "; clear: both; }

[class^='col-md'] { position: relative; }
[class^='col-md']:after,
[class^='col-md']:before { display: table; content: " "; clear: both; }

/* heading */
.heading { position: relative;margin-bottom: 60px; }
.heading>.heading-title{ font-size: 30px;line-height: 1.5; letter-spacing: -1px; font-weight: 700;margin-bottom: 20px;color: #3f454a;}
.heading>.heading-description { font-size: 20px;line-height: 1.5; font-weight: 400;margin-bottom: 0;color: #929698; }

.box1 { position: relative; }
.box1>.box-thumb { position: relative; font-size: 50px;height: 50px;line-height: 1;margin-bottom: 16px; }
.box1>.box-thumb img { height: 100%; }
.box1>.box-body { position: relative; font-size: 14px;line-height: 1.5;}
.box1>.box-body .title {display: block; margin-bottom: 6px; font-weight: 600;font-size: 18px;}
.box1>.box-body p { padding: 0 10px;margin-bottom: 30px; }

.global-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background: #2196f399; }

.btn {border-radius: 23px;}
.btn-purple {color: #fff; background-color: #2f727d; border-color: #2f727d; }
.btn-purple:hover {color: #fff; background-color: #80425a; border-color: #80425a; }

.owl-theme .owl-item {padding: 0 10px;}
.owl-theme .owl-dots {  position: absolute; left: 0; right: 0;margin-top: 25px;}
.owl-theme .owl-dots .owl-dot span { width: 15px;height: 15px;margin: 2px;  background: #2f727d;}
.owl-theme .owl-dots .owl-dot:hover span { background: #fff; border: 1px solid #2f727d;}
.owl-theme .owl-dots .owl-dot.active span{ background: #fff;width: 16px;height: 16px; border: 1px solid #2f727d;}

/* --------------------------------------------------------
    Header
----------------------------------------------------------- */

.header { position: absolute;top: 0;left: 0;width: 100%; z-index: 2; padding:10px 0; }
.header .logo1 { display: block; text-align: left; }
.header .logo2 { display: none; padding-top: 5px;}
.nav-top { padding: 10px 0; color:#fff; border-bottom: 1px solid #ffffff3d; text-align: right;}
.nav-top div { font-size:13px; display: inline-block; color:#ffffff7a; padding: 0 25px; border-left: 1px solid #ffffff3d;}
.nav-top div a { display: inline-block; font-size:13px; color:#ffffff7a; }
.nav-top div.email { border-left:0;}
.nav-top div.social { padding-right: 15px;}
.nav-top div.social a { padding: 0 6px; font-size:18px;}

.nav-middle { padding: 25px 0 0;}
.nav-middle ul {list-style: none; padding: 0; margin: 0; text-align: right;}
.nav-middle ul li {display: inline-block; font-weight: 600;
    font-size: 14px;
    color: #353535;}
.nav-middle ul li a {display: block; color:#ffffffb0;  padding: 8px 5px; border-radius: 30px; }
.nav-middle ul li a.active {color:#fff; border: 1px solid #fff;}

.header.detail { position: relative; padding: 10px 0; background: #2f727d;}
.header.detail .nav-top { padding-top: 0; }

.menuTopFix.sticky {position: fixed; background: #fff; padding: 0; box-shadow: 0 2px 4px rgba(3, 27, 78, .1); width: 100%; top: 0; left: 0; z-index: 3; }
.menuTopFix.sticky .logo1 { display: none; }
.menuTopFix.sticky .logo2 { display: block; }
.menuTopFix.sticky .nav-top { display: none; }
.menuTopFix.sticky .nav-middle { padding: 10px 0; }
.menuTopFix.sticky ul li a {color:#444; }
.menuTopFix.sticky ul li a.active {color:#444; border: 1px solid #444;}

.mobile-header { position: relative; top: 0; left: 0; background: #fff; width: 100%; height: 60px; text-align: center; z-index: 3;  display: none;}
.mobile-header a>img { height: 38px; margin-top: 12px;}
.mobile-header a { display: block; width: 100%;}
.hamburger { padding: 8px 10px; margin-top: 6px;}
.hamburger-box { width: 33px;padding: 0px;margin-top: 4px; }
.hamburger-inner,
.hamburger-inner:after,
.hamburger-inner:before {width: 32px; height: 3px;}

.slideout-menu { position: fixed; top: 0; bottom: 0; width: 256px; background: #2f727d; min-height: 100vh; overflow-y: scroll; -webkit-overflow-scrolling: touch; z-index: 0; display: none;padding: 86px 15px 0; }
.slideout-menu-left { left: 0; }
.slideout-menu-right { right: 0; }
.slideout-panel { position: relative; z-index: 1; will-change: transform; background-color: #FFF; /* A background-color is required */ min-height: 100vh; }
.slideout-open,
.slideout-open body,
.slideout-open .slideout-panel { overflow: hidden; }
.slideout-open .slideout-menu { display: block; }
.slideout-menu h6{ font-size:18px; font-weight: 600; color:#fff;}
.slideout-menu ul{ list-style: none; padding: 0; margin: 0;}
.slideout-menu ul li { font-size:16px; padding:5px 0;}
.slideout-menu ul li a { color:#fff;}
.slideout-menu ul + h6 {margin-top: 40px;}
.slideout-menu .social { }
.slideout-menu .social a { display: inline-block; color:#fff; width: 37px; height: 36px; font-size: 24px; line-height: 36px; border: 1px solid #e6e6e6; border-radius: 10px; text-align: center; }
.dropdown-item {color:black !important;}
.dropdown-item a {color:black !important;}
ol li {margin-bottom:10px;}
/* --------------------------------------------------------
    Home
----------------------------------------------------------- */
.home-carousel .carousel-item { position: relative; height: 1000px;overflow: hidden;text-align: left;color: #fff;background-repeat: no-repeat !important;; background-size: cover !important; background-position: top !important;display: flex; align-items: center;}
.home-carousel .carousel-item:after { position: absolute; content: ''; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; overflow: hidden;}
.carousel-heading { position: relative; z-index: 2; padding: 100px 0 0;text-align: left;color: #fff;}
.carousel-heading h1 {  position:relative; font-size: 38px;font-weight: 600;line-height: 1.2;letter-spacing: -.3px;margin-bottom: 20px;}
.carousel-heading h1:before { position: absolute; content:''; left:-20px; top:5px; height:39px; width: 3px; background: #fff; }
.carousel-heading p { font-size: 20px;line-height: 1.4;margin-bottom: 30px; font-weight: 300;}
.carousel-heading .btn { font-size: 18px;line-height: 1;padding: 14px 30px;font-weight: 600;letter-spacing: -.3px;}
.carousel-indicators { z-index: 2; left: inherit; display: block; bottom: 50%;}
.carousel-indicators li { border: 0; width: 16px; height: 16px; border-radius: 50%;background: #2f727d; margin-bottom: 4px;}
.carousel-indicators .active {background: transparent; border: 1px solid #2f727d;}
.carousel-control-prev { display: none;}
.carousel-control-next { display: none;}
.mobilex{ color:black}
.mobilx{ color:#2f727d}

    @media only screen and (max-width: 767px) {
        .carousel-heading { padding-top:0; }
        .carousel-heading .carousel-title { font-size:26px; }
        .carousel-heading .carousel-description { font-size:18px; }
        .carousel-indicators { right: -50px; }
        .carousel-heading h1 { padding-right: 15px; padding-top: 10em; font-size:20px;}
        .carousel-heading p{font-size:20px;}
        .mobilex{ background-position:right !important;}
        
    }


.home-section1 { position: relative; padding: 70px 0; background-color: #f6f6f6; }
.home-section1 .container { position: relative; z-index: 1;}
.home1-box { position: relative; }
.home1-box>img { display: block; margin-bottom: 15px; }
.home1-box>h3 { font-size: 29px; font-weight: 700; margin-bottom: 20px;}
.home1-box>p { text-align:justify; }

.home-section2 { position: relative; padding: 70px 0; background-color: #fff; }
.home-section2:after { position: absolute; z-index: 0; content: ''; top: -250px; right: 50px; width: 600px; height: 537px; background: url(../img/home/home-section2-bg.png) no-repeat top right;}
.home-section2 h2 { font-size: 30px; font-weight: 700; margin-bottom: 40px; text-align: center; }
.home-section2 h1 { position: relative; display: block; width: 100%; text-align: center; font-size:32px; font-weight: 700; margin-bottom: 80px; }
.home-section2 h1:before { position: absolute; content:''; left:48%; right: 48%; bottom: -10px; height:1px; width: 50px; background: #2f727d; }
.home2-box { position: relative; text-align: center; margin-bottom: 30px; cursor: pointer;}
.home2-box>.thumb { position: relative; margin-bottom: 20px;}
.home2-box>.thumb>img { width: 100%; }
.home2-box>.title { font-size: 18px; font-weight: 600; margin-bottom: 15px;}
.home2-box>.text { font-size: 14px; }

.home-section3 { position: relative; padding: 70px 0; background-color: #fff; }
.home-section3 h1 { position: relative; display: block; width: 100%; text-align: center; font-size:32px; font-weight: 700; margin-bottom: 80px; }
.home-section3 h1:before { position: absolute; content:''; left:48%; right: 48%; bottom: -10px; height:1px; width: 50px; background: #2f727d; }
.home-section3 .nav-tabs { position: relative; z-index: 1;}
.home-section3 .nav-tabs .nav-item { margin-bottom: -1px; }
.home-section3 .nav-tabs .nav-link { padding: 25px 20px; font-size:18px; border: 1px solid #e3e3e3; border-radius: 0; }
.home-section3 .nav-tabs .nav-item.show .nav-link,
.home-section3 .nav-tabs .nav-link.active { font-weight: 600; border-radius: 0; border-left:5px solid #2f727d; background-color: #fafafa;}
.home-section3 .tab-content:before { position: absolute; content: ''; width: 610px; height: 458px; top:0; right: 0;  z-index: 0; background: url(../img/home/home-section3-bg.png) no-repeat top right;}
.home-section3 .tab-pane h3 { position: relative; font-size: 24px; font-weight: 700; margin-bottom: 30px; text-align: left; padding-left: 15px; }
.home-section3 .tab-pane h3:before { position: absolute; content:''; left:0; top:0px; height:30px; width: 3px; background: #2f727d; }
.home-section3 .tab-pane .meta { margin-bottom: 30px;}
.home-section3 .tab-pane .meta span { display: inline-block; width: 32%; font-size: 14px; color:#5a97a4;}
.home-section3 .tab-pane .meta span i { font-size:16px; padding-right: 4px;}
.home-section3 .tab-pane h4 { position: relative; font-size: 20px; font-weight: 700; margin-bottom: 15px; color:#2f727d  }
.home-section3 .tab-pane p { margin-bottom: 30px; line-height: 1.5;}
.home-section3 .tab-pane ul { list-style: none; padding: 0; margin:0 0 20px;}
.home-section3 .tab-pane ul.link1 li { position: relative; padding-bottom: 10px;}
.home-section3 .tab-pane ul.link1 li:before { font-family: FontAwesome; content: "\f00c"; display: inline-block; padding-right: 3px; font-size: 18px; vertical-align: middle; color:#2f727d }
.home-section3 .tab-pane a.btn { padding: 10px 40px; font-weight: 600; font-size: 15px;}

 ul.link2 li { position: relative; padding-bottom: 5px;}
 ul.link2 li b { float: left; width: 90px; font-weight: bold;}
 ul.link2 li span { float: right; width: 156px; font-weight: 500; }

.home-section4 { position: relative; padding: 70px 0; background-color: #f6f6f6; }
.home-section4 .thumb {  }
.home-section4 .thumb img { width: 100%; }
.home-section4 .text { padding-top: 15px; font-size: 18px; line-height: 1.5; }
.home-section4 .text p { font-weight: 300; }
.home-section4 .text h3 { position: relative; font-size: 30px; font-weight: 700; margin-bottom: 30px; text-align: left; padding-left: 15px; }
.home-section4 .text h3:before { position: absolute; content:''; left:0; top:0px; height:40px; width: 3px; background: #2f727d; }
.home-section4 .text a.btn { padding: 10px 40px; font-weight: 600; font-size: 15px;}


.home-section5 { position: relative; padding: 70px 0; background-color: #fff; }
.home5-box { position: relative; text-align: center; box-shadow: 0 5px 10px rgba(0,0,0,.12); padding-bottom: 15px; margin-bottom: 30px;}
.home5-box>.thumb{ position: relative; margin-bottom: 15px;}
.home5-box>.thumb>img{ width: 100%; }
.home5-box>.thumb>span{ position: absolute; right: 10px; top:10px; display: inline-block; line-height: 1; font-size:12px; padding: 5px 10px; background-color: #fff; }
.home5-box>.title{ position: relative; padding: 15px; font-weight: 600;}
.home5-box>.text{ position: relative; font-size:14px; padding: 0 15px 15px; }
.home5-box a.btn { padding: 10px 30px; font-weight: 600; font-size: 14px;}

/* --------------------------------------------------------
    About
----------------------------------------------------------- */
.breadcrumb { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; text-align: center; padding: .75rem 1rem; margin-bottom: 0; list-style: none; background-color: #f1f1f1; border-radius: 0;}
.breadcrumb ol { list-style: none; padding: 0; margin: 0;}
.breadcrumb-item { display: inline-block; }
.breadcrumb-item+.breadcrumb-item::before {  display: inline-block; padding-right: .5rem; padding-left: .5rem; color: #6c757d; content: "/"; }
.breadcrumb-item.active { color: #6c757d; }
.breadcrumb-item+.breadcrumb-item { padding-left: 0; }

.about { position: relative; padding: 70px 0; background-color: #fff; }
.about h1 { position: relative; display: block; width: 100%; text-align: center; font-size:32px; font-weight: 700; margin-bottom: 40px; }
.about h1:before { position: absolute; content:''; left:48%; right: 48%; bottom: -10px; height:1px; width: 50px; background: #2f727d; }
.about img { float: left; margin-right: 15px;}
.about p { font-size: 18px; line-height: 1.5; margin-bottom: 30px;}

/* --------------------------------------------------------
    Scientific
----------------------------------------------------------- */
.scientific { position: relative; padding: 70px 0; background-color: #fff; }
.scientific h1 { position: relative; display: block; width: 100%; text-align: center; font-size:32px; font-weight: 700; margin-bottom: 40px; }
.scientific h1:before { position: absolute; content:''; left:48%; right: 48%; bottom: -10px; height:1px; width: 50px; background: #2f727d; }
.scientific a.item { display: block; width: 100%; height: 100%; margin-bottom: 30px;}
.scientific a.item span { display: block; }
.scientific a.item span:first-child { margin-bottom: 10px;}
.scientific a.item span:first-child img { width: 100%; }
.scientific a.item span:last-child { padding: 0 15px; font-size:15px; text-align: center;}

.item2 { position: relative; margin-bottom: 50px; }
.item2:before { position: absolute; content:''; left:0; bottom: -10px; height:1px; width: 50px; background: #2f727d; }
.item2>p { margin: 0;}


/* --------------------------------------------------------
    Blog
----------------------------------------------------------- */
.blog { position: relative; padding: 70px 0; background-color: #fff; }
.blog h1 { position: relative; display: block; width: 100%; text-align: left; font-size:32px; font-weight: 700; margin-bottom: 60px; }
.blog h1:before { position: absolute; content:''; left:0; bottom: -10px; height:1px; width: 100%; background: #e7e7e7; }
.blog h1:after { position: absolute; content:''; right:186px; bottom: -10px; height:1px; width: 70px; background: #2f727d; }
.blog h3 { font-size:18px; font-weight: 700; margin-bottom: 20px;}
.blog .col-lg-3 { border-left: 2px solid #e7e7e7; }

.blog-item { position: relative; margin-bottom: 50px;}
.blog-item .thumb {}
.blog-item .thumb>a{display: block;}
.blog-item .thumb>a>img{ width: 100%;}
.blog-item .detail {}
.blog-item .detail .date{ font-size:13px; margin-bottom: 10px; color:#5a97a4;}
.blog-item .detail .title{ font-size: 24px; line-height: 1.2; height: 52px; margin-bottom: 10px;}
.blog-item .detail .text{ font-size:14px;height: 64px; margin-bottom: 15px;}
.blog-item .detail .more{}
.blog-item .detail .more a.btn { padding: 10px 30px; font-weight: 600; font-size: 14px;}

.relateds { position: relative; }
.related { margin-bottom: 30px; }
.related .col-lg-7 {padding-left: 0;}
.related .thumb>a{display: block;}
.related .thumb>a>img{ width: 100%;}
.related .detail .date{ font-size:11px; color:#5a97a4;}
.related .detail .title{ font-size: 13px; line-height: 1.3; margin-bottom: 6px;}

.blog-details { position: relative; margin-top: -30px;}
.blog-details .thumb {position: relative; margin-bottom: 30px;}
.blog-details .thumb>img{width: 100%;}
.blog-details .meta { min-height: 22px; margin-bottom: 15px; clear: both; }
.blog-details .meta .date{ float: left; width: 50%; font-size:13px; color:#5a97a4;}
.blog-details .meta .comment{ float: left; text-align: right; width: 50%; font-size:13px; }
.blog-details .text {  }
.blog-details .text>h3{ font-size: 18px; margin-bottom: 10px; }
.blog-details .text>p{ margin-bottom: 30px; }

.page-link { color:#656665; border:0;font-weight: 600;}
.page-link:hover { z-index: 2; color: #cccccc; text-decoration: none; background-color: transparent; border-color: #dee2e6; }
.page-item.active .page-link { z-index: 1; text-align: center; height: 36px; width: 36px; color: #656665; background-color: transparent; border-radius: 50%; border: 1px solid #cccccc; }



/* --------------------------------------------------------
    Contact
----------------------------------------------------------- */
.contact-map { position: relative; width: 100%; height: 358px; margin-top: -1px; }

.contact { position: relative; padding: 70px 0; background-color: #fff; }
.contact h1 { position: relative; display: block; width: 100%; text-align: center; font-size:32px; font-weight: 700; margin-bottom: 40px; }
.contact h1:before { position: absolute; content:''; left:48%; right: 48%; bottom: -10px; height:1px; width: 50px; background: #2f727d; }
.contact h4 { font-size: 18px; font-weight: 700; margin-bottom: 20px; }
.contact .form-control { background: #f8f8f8; font-size: 14px; border:1px solid #c7c8c7; color:#333; height: 48px; }
.contact textarea.form-control { height: 162px; }
.contact ul { list-style: none; padding: 0; margin: 0;}
.contact ul.social li { display: inline-block; }
.contact ul.social li a { width: 42px; display: inline-block; font-size: 18px; }

/* --------------------------------------------------------
    Footer
----------------------------------------------------------- */
.footer { position: relative; background: #fff; font-size:14px; color:#656665;}
.footer h4 { font-size: 18px; font-weight: 700; margin-bottom: 20px; color:#656665;}
.footer ul { list-style: none; padding: 0; margin:0; }
.footer a { color:#656665; font-size:14px;}
.footer ul.link li { padding-bottom: 4px; }
.footer ul.social li { display: inline-block; }
.footer ul.social li a { width: 42px; display: inline-block; font-size: 18px; }
.footer>.container { position: relative; border-top:2px solid #bbbbbc; padding-top: 40px;}
.footer-bottom { position: relative; text-align: center; background: #353535; padding: 15px 0; margin-top: 40px;}
.footer-bottom p { margin:0; font-style: italic; color:#fff; font-size:14px;}

/* Back to top */
#back-top { position: fixed; bottom: 80px; right: 20px; z-index: 10; }
#back-top a { width: 40px; display: block; text-align: center; font: 11px/100% Arial,Helvetica,sans-serif; text-transform: uppercase; text-decoration: none; color: #bbb; -webkit-transition: .5s; -moz-transition: .5s; transition: .5s; }
#back-top a:hover { color: #000; }
#back-top span { width: 40px; height: 40px; display: block; background: #2f727d url(../img/top_arrow.png) no-repeat center center; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; }

    @media (min-width: 768px) and (max-width: 1024px) {
        .header .col-lg-3 { text-align: center; }
        .header .logo1 { text-align: center; }
        .header .nav-top { text-align: center; }
        .header .nav-middle { text-align: center; }
        .nav-middle ul li a {padding: 8px 10px;}
        .carousel-heading { padding-top:180px; }
        .carousel-indicators { right: -90px; bottom: 40%;}
        .home1-box>p { padding-right: 0; }
        .footer ul.social li a {width: 30px; }
    }

    @media only screen and (max-width: 767px) {
        .mobile-header { display: block; }
        .header { display: none; }
        .home1-box>p { padding-right: 0; }
        .home-section3 .tab-pane { padding-top: 30px; }
        .home-section3 .tab-pane .meta span {display: block; width: 100%;margin-bottom: 8px; }
        .footer .col-lg-4 { margin-bottom: 30px; }
        .footer .link { margin-bottom: 30px; }
        .home-carousel .carousel-item{height:600px;}
        #basinvideo {padding-top:30px;}
        .heading{margin-bottom:10px;}
    }