body {margin: 0; padding: 0; overflow-x: hidden;}
body, table, input, textarea, select {font-family: 'Karla', sans-serif; font-size: 14px; font-weight: 400; color: #757575;}
b {font-weight: 700;}

a {color:#0267b1; text-decoration: none;}
a:hover, a:focus {color: #000; text-decoration: underline; outline:none;}
a, input, textarea, button {transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; outline:none !important;}

.container {max-width: 1440px; width: 100%;}
.row.no-gutters {margin-right: 0;margin-left: 0;}
.row.no-gutters > [class^="col-"],.row.no-gutters > [class*="col-"] { padding-right: 0; padding-left: 0;}

/*  */
header {position: fixed; left: 0; right: 0; bottom: 0px; width: 100%; height: 55px; line-height: 50px; background-color: rgba(60,60,60,0.9); z-index: 1; border-top: 3px solid #fff;}
header #logo a {font-family: 'Raleway', sans-serif; font-size: 30px; font-weight: 300; color: #fff; text-transform: uppercase; text-decoration: none;}
header #logo a span {font-weight: 600; color: #2bbdee;}

/* Mobile Menu Icon */
#mobile-menu-icon {display:none; position:absolute; right:15px; top: 17px; width:30px; height:17px; z-index: 9999;}
#mobile-menu-icon span, #mobile-menu-icon span:before, #mobile-menu-icon span:after {width: 22px; height: 3px; background-color: #000; display: block; position: absolute; top: 7px; transition: all 0.3s;}
#mobile-menu-icon span:before {content: ''; top: -7px;}
#mobile-menu-icon span:after {content: ''; top: 7px;}
#mobile-menu-icon.active span {background-color: transparent;}
#mobile-menu-icon.active span:before {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); top: 0;}
#mobile-menu-icon.active span:after {-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); top: 0;}

/* Mobile Menu */
#mobile-menu {display: none;}
#mobile-menu ul {margin:0; padding: 0; list-style: none; float: none;}
#mobile-menu ul li {float: none; padding:0; margin:0; border:none; position:relative; border-bottom:1px solid #ccc;}
#mobile-menu ul li a {padding:12px 20px; display:block; color:#4d4d57; font-weight:400; text-decoration: none;}
#mobile-menu ul li ul li a {color: #4d4d57; font-size:90%; text-decoration:none;}
#mobile-menu ul li.active ul li a {color: #f0f0f0;}
#mobile-menu ul li ul li a:hover {color: #0268B2;}
#mobile-menu ul li > a:hover, #mobile-menu ul li.active > a, #mobile-menu ul li a:hover {color:#0268B2; border-bottom:none; background: none;}
#mobile-menu ul li a:focus {background-color: transparent;}
#mobile-menu ul li.changebg > a {background-color: #0268B2; color:#fff !important;}
#mobile-menu ul li:hover > a {border-bottom:none;}
#mobile-menu ul li a .submenu {position:absolute; width:42px; height:42px; right:0; top:1px; display:block; cursor:pointer; -moz-transition:transform 0.3s ease-in-out; -webkit-transition:transform 0.3s ease-in-out; transition:transform 0.3s ease-in-out;}
#mobile-menu ul li a .submenu:before,#mobile-menu ul li a .submenu:after{ content:""; background-color:#4d4d57; display:block; -moz-transition:transform 0.3s ease-in-out; -webkit-transition:transform 0.3s ease-in-out; transition:transform 0.3s ease-in-out;}
#mobile-menu ul li a:hover .submenu:before,#mobile-menu ul li a:hover .submenu:after {background-color: #0268B2;}
#mobile-menu ul li a .submenu:before {width:1px; height:15px; position:relative; left:20px; top:12px;}
#mobile-menu ul li a .submenu:after {width:15px; height:1px; position:relative; left:13px; top:4px;}
#mobile-menu ul li.changebg>a>.submenu:before { transform:rotate(-90deg); background-color: #fff;}
#mobile-menu ul li.changebg>a>.submenu:after { display:none;}

#mobile-menu ul li > ul{ padding:0; border:none;}
#mobile-menu ul li.submenu-one:hover > ul{ top:0;}
#mobile-menu ul li.submenu-one ul{margin-bottom: -1px;}
#mobile-menu ul li ul,#mobile-menu ul li:hover>ul,#mobile-menu ul li ul li ul,#mobile-menu ul li ul li:hover>ul{ width:auto; display:none; opacity:1; position:relative; left:0; top:0; visibility:visible; transition:none; box-shadow:none;}
#mobile-menu ul li ul li a{ padding:12px 30px;}
#mobile-menu ul li ul li ul li a{padding:12px 40px;}
#mobile-menu ul li ul li{ border-bottom:1px solid #bfbfbf;}
/*****/

#main-menu {line-height: 50px; display: block;}
#main-menu .navbar-nav > li {margin-left: 50px;}
#main-menu .navbar-nav > li > a {font-size: 15px; color: #fff; height: 50px; line-height: 50px; padding: 0;}
#main-menu .navbar-nav > li > a:hover, #main-menu .navbar-nav > li > a:focus {background-color: transparent; color: #2bbdee;}

footer {position: fixed; bottom: 0; width: 100%; height: 50px; line-height: 50px; background-color: #282828; color: rgba(255,255,255,0.2);}
footer a {color: rgba(255,255,255,0.2);}
footer a:hover {color: #fff;}

/* Inner Page */
.pg-bg {position: fixed; width: 100%; height: 100%; background-color: #282828; background-repeat: no-repeat;}
h1 {font-family: 'Raleway', sans-serif; font-size: 71px; font-weight: 600; color: #979797; margin: 0 0 30px; padding: 0;}
#about {background-image: url('../images/about-bg.jpg'); background-position: right top; background-size: contain;}
#about p {font-size: 114%; color: #fff; margin-bottom: 20px;}
.content {padding: 50px 0; height: calc(100vh - 150px);}
.content .scroll {min-height: 100px; max-height: 55vh;}
#contact {background-image: url('../images/contact-bg.jpg'); background-position: center top; background-repeat: no-repeat; background-size: cover;}
#contact h1 {color: #979797;}
#contact h2 {font-size: 26px; font-weight: 400; color: #fff; margin-bottom: 15px; margin-top: 0;}
#contact p {font-size: 114%; color: #fff; margin-bottom: 12px;}
#contact a {color: #2bbdee;}
#contact form {margin-top: 30px;}
#contact form .form-group .form-control {border: none; background-color: transparent; border-radius: 0; padding: 7px 5px; font-size: 16px; box-shadow: none; border-bottom: 1px solid #fff; color: #fff;}
#contact form .form-group .form-control:focus {border-color: #2bbdee;}
#contact form .form-group select.form-control option {color: #000;}
#contact form .select-style {padding: 0; margin: 0; width: 100%; overflow: hidden; position: relative;}
#contact form .select-style:after {top: 50%; right: 20px; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(0, 0, 0, 0); border-top-color: #2bbdee; border-width: 7px; margin-top: -2px; z-index: 100;}
#contact form .select-style select {padding: 5px 8px; width: 100%; border: none; box-shadow: none; background-color: transparent; background-image: none;
    -webkit-appearance: none; -moz-appearance: none; appearance: none;
}
#contact form .select-style select option:disabled {color: #999;}
#contact form .select-style select:focus {outline: none;}
#contact .scroll {height: 100vh; max-height: 100vh;}

form #imgCaptcha{border-right:1px solid #bfbfbf;}
form .refresh{cursor: pointer; width:40px; padding:10px 0; display: inline-block; vertical-align: top;}
.input-group-addon:last-child{padding:0; position: relative; top:-2px;  }


#contact form button {width: 130px; height: 40px; line-height: 40px; border: none; border-radius: 0; padding: 0; font-size: 16px; text-transform: uppercase; margin: 0 2px; position: relative; overflow: hidden;}
#contact form button[type="submit"] {background-color: #2bbdee; color: #fff;}
#contact form button:hover {background-color: #000; color: rgba(255,255,255,1);}

button.custom {position: relative; overflow: hidden;}
button.custom:before, button.custom:after, button.custom span:before, button.custom span:after {
    content: ''; position: absolute; display: block;
    transition-property: transform;
    transition-duration: .1s;
    transition-timing-function: ease-out;
    background-color: #2bbdee;
}
button.custom:before, button.custom:after {width: 100%; height: 2px; left: 0;}
button.custom:before {top: 0; transform: translate3d(-105%, 0, 0); transition-delay: .25s;}
button.custom:after {bottom: 0; transform: translate3d(105%, 0, 0); transition-delay: .15s;}

button.custom span:before, button.custom span:after {width: 2px; height: 100%; top: 0;}
button.custom span:before {left: 0; transform: translate3d(0, 105%, 0); transition-delay: .25s;}
button.custom span:after {right: 0; transform: translate3d(0, -105%, 0); transition-delay: .15s;}

button.custom:hover:before, button.custom:hover:after, 
button.custom:hover span:before, button.custom:hover span:after,
button.custom:focus:hover:before, button.custom:focus:hover:after,
button.custom:focus:hover span:before, button.custom:focus:hover span:after {
    transform: translate3d(0,0,0);
    transition-duration: .2s;
}

button.custom:hover:before, button.custom:focus:before {transition-delay: 0s;}
button.custom:hover:after, button.custom:focus:after {transition-delay: .4s;}
button.custom:hover span:after, button.custom:focus span:after {transition-delay: .2s;}
button.custom:hover span:before, button.custom span:before {transition-delay: .6s;}