@charset "UTF-8";
/* CSS Document */

@font-face {
    font-family: 'Prompt-Regular';
    src: url('./fonts/Prompt-Regular.eot');
    src: url('./fonts/Prompt-Regular.eot?#iefix') format('embedded-opentype'),
         url('./fonts/Prompt-Regular.woff2') format('woff2'),
         url('./fonts/Prompt-Regular.woff') format('woff'),
         url('./fonts/Prompt-Regular.ttf') format('truetype');
}
*,*:after,*:before {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
*{outline:none;-webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {float: left; padding:15px 15px 20px 15px;transition: all 0.3s ease 0.3s;}
.col-12 {width: 100%;}
.col-11 {width: 91.66666667%;}
.col-10 {width: 83.33333333%;}
.col-9 {width: 75%;}
.col-8 {width: 66.66666667%;}
.col-7 {width: 58.33333333%;}
.col-6 {width: 50%;}
.col-5 {width: 41.66666667%;}
.col-4 {width: 33.33333333%;}
.col-3 {width: 25%;}
.col-2 {width: 16.66666667%;}
.col-1 {width: 8.33333333%;}
@media all and (max-width: 760px){
	.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11 {float: left; width: 50%;}}
@media all and (max-width: 540px){
	.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {float: left; width: 100%;}}
.videoWrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
  }
  .videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
.mobilelink{display: none;}
@media screen and (max-width:780px){.mobilelink{display: block;position:fixed;z-index: 9999;right: 0;top: 25%;-moz-border-radius-topleft: 8px;-webkit-border-top-left-radius: 8px; border-top-left-radius: 8px;-moz-border-radius-bottomleft: 8px;-webkit-border-bottom-left-radius: 8px;border-bottom-left-radius: 8px;float: right;color: #FFF;background: #314b77;padding: 15px;font-size: 24px;line-height: 160%;-webkit-box-shadow: -3px 4px 5px 0px rgba(0, 0, 0, 0.25);
-moz-box-shadow:    -3px 4px 5px 0px rgba(0, 0, 0, 0.25);
box-shadow:         -3px 4px 5px 0px rgba(0, 0, 0, 0.25);}.mobilelink a{color: #FFF;text-decoration: none;}}
.aligncenter{text-align: center;}
.alignleft{text-align: left;}
.alignright{text-align: right;}
.iTable{  
    display:table;
    width:100%;  
    margin:auto;  
    border-collapse:collapse;  
}  
.iCaption{  
    display:table-caption; 
    caption-side:top;  
    text-align:center;  
}  
.iRow{
    display:table-row;
}  
.iTd{  
    display:table-cell;
  border-bottom:1px solid #DDD;  
    padding:5px 10px; vertical-align:middle;
}
.iTd h4{padding:0; margin:0;}

html,body{margin:0; padding:0; min-height:100%; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#333; outline:none;background: #f0f3f8;}
p{margin:0; padding:0;}
a{color:#314b77; text-decoration:none; outline:none;}
a:hover{text-decoration:underline;}
h1{font-family:'Prompt-Regular',Arial, Helvetica, sans-serif; font-size:36px; margin:0 0 20px 0; padding:0; color:#314b77;}
h2{font-family:'Prompt-Regular',Arial, Helvetica, sans-serif; font-size:28px; margin:0 0 20px 0; padding:0; font-weight:normal; color:#314b77;}
h3{font-family:'Prompt-Regular',Arial, Helvetica, sans-serif; font-size:22px; margin:0 0 15px 0; padding:0; font-weight:normal;}
.center{text-align:center;}
.thfont{font-family:'Prompt-Regular',Arial, Helvetica, sans-serif;}
img{max-width:100%; width:auto;}
.row{width:100%; padding:90px 0; float:left;}
.rownopad{width:100%; float:left;}
.bggray{background:#cad3e1;}
.bgblk{background: #1b3160;}
.bghd{background: linear-gradient(to bottom,  #314265 0%,#39507d 100%);}
.bgdark{background: #323a45; color: #f2f2f2;}
.bgdkgray{background:#35383e;}
.white{color:#FFF;}
.blue{color:#018fd5;}
.green{color:#3e8400;}
.clear{clear:both;}
.model{color:#263e6d;}
.model:hover{color:#e70000;}
.cord{color:#e70000;}
.container{width:1170px; margin:0 auto;}
@media all and (min-width: 1960px){.container{width: 80%;}}
@media screen and (max-width:960px){.container{width:96%; padding:0 2%;}}
@media screen and (max-width:760px){
h1{font-size:30px;}
h2{font-size:22px;}
h3{font-size:18px;}
}
iframe{max-width: 100%; width: auto;}
.wrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}
.wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.map-responsive{
    overflow:hidden;
    padding-bottom:36.25%;
    position:relative;
    height:0;
}
.map-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

header{width:100%; float:left; position:relative; z-index:9999; -webkit-box-shadow: 0px 4px 4px 0px rgba(50, 50, 50, 0.20); -moz-box-shadow:0px 4px 4px 0px rgba(50, 50, 50, 0.20); box-shadow: 0px 4px 4px 0px rgba(50, 50, 50, 0.20);}
header .tophead{width:100%; float:left; padding:5px 0; background:#1b3160; color:#FFF; font-size:13px;}
header .tophead .left{float:left;}
header .tophead .right{float:right;}
.tophead .right a{color: #FFF;text-decoration: none;}

header .mainhead{width:100%; float:left;background: linear-gradient(to bottom,  #314265 0%,#39507d 100%);padding: 15px 0;}
header .mainhead .logo{float:left;}
header .mainhead .logo img{border:none;width: 250px;}
header .mainhead .tel{float:right; text-align:right; color:#FFF; font-size:22px; margin:5px 0 0 0; font-weight:bold;}
header .mainhead .call{float:right; text-align:right; color:#FFF; font-size:22px; margin:8px 0 0 0; clear:right; font-weight:bold;}
header .mainhead .call .thfont{font-size: 14px; font-weight: 400;}
header .mainhead .icontel{font-size: 18px;color: #f8a247;}
header .mainhead .right{float:right;clear: right;font-size: 14px;}
header .mainhead a{color: #FFF; text-decoration: none;}

.mainmenu{width:100%; float:left; margin:0; padding:0; list-style:none; background: linear-gradient(to bottom,  #919096 0%,#a7a7ac 100%);}
.mainmenu li{float:left; margin:0; padding:0; -webkit-transition: all .15s ease-in-out; -moz-transition: all .15s ease-in-out; -o-transition: all .15s ease-in-out; transition: all .15s ease-in-out;}
.mainmenu li:hover{background:#3f567d;}
.mainmenu li a{display:block; color:#FFF; padding:8px 35px; font-family:'Prompt-Regular',Arial, Helvetica, sans-serif; font-size:16px;}
.mainmenu li:hover a{color:#FFF; text-decoration:none;}

.mainmenu li .subnav{position:absolute; display:none; background:#CCC;-webkit-box-shadow: 0px 6px 6px 0px rgba(50, 50, 50, 0.30); -moz-box-shadow:0px 6px 6px 0px rgba(50, 50, 50, 0.30); box-shadow: 0px 6px 6px 0px rgba(50, 50, 50, 0.30);}
.mainmenu li:hover .subnav{display:block; width:280px; background:#CCC; color:#000; margin:0; padding:0; position:absolute; z-index:99; float:left; list-style:none; font-size:14px;}
.mainmenu li:hover .subnav li{margin:0; padding:0; border-right:none; border-top:#CCC solid 1px; height:auto; width:100%; background:#f2f2f2;}
.mainmenu li:hover .subnav li:hover{background:#3f567d;}
.mainmenu li:hover .subnav li a{padding:8px 15px; color:#000; display:block;}
.mainmenu li:hover .subnav li a:hover{color:#FFF;}

.sticky{position:fixed; background:url(../images/bg_menu.png); -webkit-box-shadow: 0px 4px 4px 0px rgba(50, 50, 50, 0.40); -moz-box-shadow:0px 4px 4px 0px rgba(50, 50, 50, 0.40); box-shadow: 0px 4px 4px 0px rgba(50, 50, 50, 0.40);}
.sticky li{background:none;}

@media screen and (max-width:960px){.mainmenu li a{padding:7px 30px;}}
@media screen and (max-width:860px){.mainmenu li a{padding:7px 25px;}}
@media screen and (max-width:840px){header .mainhead .logo img{height: 60px;} header .tophead{text-align:center;} header header .tophead .left,header .tophead .right{width:100%;}}
@media screen and (max-width:780px){header .mainhead{} header .mainhead .call{width:100%; text-align:center; margin-top:8px;} header .mainhead .tel{ display:none;}}
@media screen and (max-width:670px){header .mainhead .logo img{height: 50px;} header .tophead{display:none;}.mainmenu li:hover .subnav li{background: #f2f2f2;} .mainmenu li:hover .subnav{display:none;}.mainmenu li a{font-size: 14px;margin:0 10px;}}
@media screen and (max-width:414px){header .mainhead .logo img{height: 50px;} .sticky{position:static;font-size: 14px;}.mainmenu li{width:50%;font-size: 14px;} .mainmenu li a{width:94%; padding:7px 3%;font-size: 14px;} header .mainhead .call{margin:12px 0 0 0;} .mainmenu li:hover .subnav{display:none;}}

.slidecontainer{width:100%; float:left;}

.mainserviesbox{width:31%; padding:0 1.16%; float:left; text-align:center; font-family:'Prompt-Regular',Arial, Helvetica, sans-serif; font-size:20px;color: #FFF;}
.mainserviesbox img{margin:0 0 15px 0; height:108px;}

@media screen and (max-width:780px){.mainserviesbox{font-size:18px;} .mainserviesbox img{height:98px;}}
@media screen and (max-width:414px){.mainserviesbox{font-size:18px;} .mainserviesbox img{height:88px;}}

.brand{width:232px; height:140px; float:left; margin:2% 2.5%; border:#b3b3b3 solid 1px; display:table; text-align:center; -webkit-transition:box-shadow .15s ease-in-out; -moz-transition:box-shadow .15s ease-in-out; -o-transition:box-shadow .15s ease-in-out; transition:box-shadow .15s ease-in-out; position:relative;}
.brand:hover{-webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.35);
-moz-box-shadow:    0px 0px 8px 0px rgba(0, 0, 0, 0.35);
box-shadow:         0px 0px 8px 0px rgba(0, 0, 0, 0.35);}
.brand p{display:table-cell; vertical-align:middle;}
.brand p img{max-height:80px; max-width:80%; width:auto;}
.brand span{display:block; width:100%; padding:5px 0; text-align:center; position:absolute;  margin:110px 0 0 0; background:#0077d3; color:#FFF; font-size:14px;}

.prods {padding: 20px;float: left;width: 25%;background-color: #FFF;display: block;transition: all 0.3s ease 0s; box-shadow: 
    1px 0 0 0 #ccc, 
    0 1px 0 0 #ccc, 
    1px 1px 0 0 #ccc,   /* Just to fix the corner */
    1px 0 0 0 #ccc inset, 
    0 1px 0 0 #ccc inset;}
.prods img{margin-bottom: 15px;}
.prods:hover{position:relative;-webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.55);
-moz-box-shadow:    0px 0px 8px 0px rgba(0, 0, 0, 0.55);
box-shadow:         0px 0px 8px 0px rgba(0, 0, 0, 0.55);}

.serv {padding: 20px;float: left;width: 100%;background-color: #FFF;display: block;transition: all 0.3s ease 0s;margin-bottom: 20px;}
.serv:hover{position:relative;-webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.55);
-moz-box-shadow:    0px 0px 8px 0px rgba(0, 0, 0, 0.55);
box-shadow:         0px 0px 8px 0px rgba(0, 0, 0, 0.55);}

.prodsleft {padding: 20px;float: left;width: 100%;background-color: #FFF;display: block;transition: all 0.3s ease 0s; box-shadow: 
    1px 0 0 0 #ccc, 
    0 1px 0 0 #ccc, 
    1px 1px 0 0 #ccc,   /* Just to fix the corner */
    1px 0 0 0 #ccc inset, 
    0 1px 0 0 #ccc inset;}

.leftnav{width:19.8%; margin:0 2% 0 0; padding:0 2% 0 0;float:left;border-right: #f2f2f2 solid 1px;}
.leftnav .brand{width:100%; height:88px;background-color: #FFF;}
.leftnav .brand img{max-height:70px; max-width:80%; width:auto;}

.productscontainer{width:76%; float:left;}
.productscontainer .listproducts{width:100%; float:left; padding:0 0 20px 0; margin:0 0 40px 0; border-bottom:#CCC solid 1px;}
.productscontainer .listproducts .picture{display:table; width:40%; float:left; margin:0 3% 0 0; text-align:center; height:auto;}
.productscontainer .listproducts .picture img{vertical-align:middle;display:table-cell; border:none; width:100%;}
.productscontainer .listproducts .shortdetail{width:57%; float:left; font-size:14px;}
.productscontainer .listproducts .shortdetail h2{font-size:22px; margin:0 0 15px 0;}
.readmore{color:#FFF; background:#314b77; border:#314b77 solid 1px; padding:6px 20px; text-align:center; display:table; font-size:16px; margin:15px 0 20px 0; -webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px; -webkit-transition:all .15s ease-in-out; -moz-transition:all .15s ease-in-out; -o-transition:all .15s ease-in-out; transition:all .15s ease-in-out;}
.readmore:hover{color:#FFF; text-decoration:none; background:#e70000; border:#e70000 solid 1px;}

@media screen and (max-width:960px){.brand{margin:1% 1.3%; width:22%;} .brand img{max-width:78%;}}
@media screen and (max-width:780px){.brand{margin:1%; width:31%;}.notm{display: none;}}
@media screen and (max-width:680px){.brand{margin:1%; width:30%;} .leftnav{display:none;} .productscontainer{width:100%;}}
@media screen and (max-width:500px){.brand{margin:1.5%; width:47%;}
.productscontainer .listproducts .picture{ width:100%;}
.productscontainer .listproducts .picture img{ max-width:100%;}
.productscontainer .listproducts .shortdetail{ width:100%;}}
@media screen and (max-width:380px){.brand{margin:1%; width:45%;}}

.articles{width:100%; float:left; margin:0 0 20px 0; padding:0 0 20px 0; border-bottom:#CCC solid 1px;}
.runno{text-align:right; width:100%; font-size:14px; display:table;}

.career{width:100%; float:left; margin:0 0 20px 0; padding:0 0 20px 0; border-bottom:#CCC solid 1px;}

.port{display:table; width:100%; margin:0; padding:0; list-style:none;}
.port section{display:table-row;}
.port li{margin:0; padding:0; display:table-cell; width:48%; padding:1%;}
.port li:hover{background:#f1f1f1;}
.port li img{width:40%; max-height:140px; float:left; margin:0 2% 0 0; border:none;}
.port li p{margin:0; padding:0; float:left; width:58%;}
.picport img{width:29.4%; padding:1%; margin:.5%; border:#CCC solid 1px; background:#FFF;}
.galpic{width: 100%; height: 300px;}

.footerabout{width:100%; float:left; background:url(../images/img_footer.jpg) left top no-repeat;}
.footerabout span{display:block; margin:40px 0 40px 50%; width:50%; color:#FFF;}

.gmap {
        position: relative;
        padding-bottom: 55%; // This is the aspect ratio
        height: 0;
        overflow: hidden;
    }
    .gmap iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
    }

.contactleft{width:50%; float:left;}
.contactright{width:50%; float:left;}

.overfoot{width: 100%;text-decoration: none;text-align: center;padding: 15px 0;color: #FFF;background: #314b77;float: left;font-size: 14px;} .overfoot a{color: #FFF;text-decoration: none;}
footer{float:left; width:100%; background:#222428; color:#FFF; padding:30px 0; font-size:14px;}
footer .logo{width: 200px;display: block;}
footer a{color:#FFF;}
footer .left{float:left;}
footer .right{float:right; text-align:right;}

@media screen and (max-width:960px){.prods{width: 25%;}}
@media screen and (max-width:780px){.footerabout span{width:50%; margin-left:300px; width:55%;}.prods .promane{font-size:22px;}.prods{width: 33.33%;}.map-responsive{padding-bottom:56.25%;}.mainmenu {padding: 0;margin: 0;width: 100%;}
.mainmenu .container{padding: 0;;margin: 0;width: 100%;}
.mainmenu li{width: 100%;clear: both;padding: 0;;margin: 0;background: linear-gradient(to bottom,  #9b9a9f 0%,#919096 100%);}
.mainmenu li a{padding:12px 25px;width: 100%;}}
@media screen and (max-width:680px){.footerabout{background:none;}.footerabout span{margin-left:0px; width:100%; text-align:center;}footer .left,footer .right{width:100%; text-align:center;}.prods{width: 50%;}
}
@media screen and (max-width:580px){.contactleft{width:100%;}
.contactright{width:100%; clear:both;}
.port li img{width:100%;  margin:0 0 2% 0; border:none;}
.port li p{margin:0; padding:0; width:100%;}
.picport img{ width:45.5%;}
}

.cd-top {
  display: inline-block;
  height: 30px;
  width: 30px;
  position: fixed;
  bottom: 60px;
  right: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: rgba(13, 128, 209, 0.8) url(../images/cd-top-arrow.svg) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
  -webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}
.no-touch .cd-top:hover {
  background-color: #0d80d1;
  opacity: 1;
}
@media only screen and (min-width: 768px) {
  .cd-top {
    right: 20px;
    bottom: 40px;
  }
}
@media only screen and (min-width: 1024px) {
  .cd-top {
    height: 45px;
    width: 45px;
    right: 30px;
    bottom: 60px;
  }
}
.closed {   position: fixed;   z-index: 9999;right: 0;top: 0; }
@media only all and (min-width: 768px) { .closed { width: auto; } }