@import url('../css/font-awesome.min.css') screen;
@import url('../css/roboto.css') screen;
@import url('../css/default.css') screen;

*:after, *:before {font-family:'FontAwesome';}

body {font-family: 'Roboto'; font-size: 14px; font-weight: 300; line-height: 1.7; color: #333;}
body a {display: inline-block;}
body img {max-width: 100%; display: block;}
body blockquote {font-family: Times New Roman; font-size: 110%; font-style: italic; padding: 0 20px; border-left: 3px solid rgba(0,0,0,0.2); display: flex;}
body code {background: #ddd; padding: 3px 7px; border-radius: 5px;}
body kbd {background: #333; padding: 3px 7px; border-radius: 5px; color: #fff;}
body input, body select, body textarea {width: 100%; display: block;}
body input, body select, body textarea, a.inputBtn {background: #fff; color: initial; font-size: 20px; padding: 10px; border-radius: 5px; box-shadow: 0 15px 10px -15px rgba(0,0,0,0.1); font-weight: 500; resize: none; text-decoration: none!important;}
body input:disabled {background: lightgray!important; cursor: default!important; transform: scale(1)!important;}
body textarea.inputTxt {height: auto; overflow-y: auto;}
body .container a {text-decoration: underline; font-weight: 500;}

/* SERVICES -h5  */
h5 {position: relative;}
h5 em {font-style: normal; font-weight: 100; font-size: 12px; margin-left: 10px; box-shadow: 3px 3px 3px rgba(0,0,0,0.02); background: #fff; padding: 3px 15px; border-radius: 20px; position: absolute;}

header.header {background: #e5f3fc; position: fixed; top: 0; right: 0; left: 0; z-index: 3;}
header.header a {text-decoration: none;}

header.header .logo {background: #fff; display: inline-block; padding: 25px 5px 10px 5px; position: relative;}
header.header .logo:after {content: ''; position: absolute; width: 100%; height: 10px; background: #EB4A4A; bottom: 0; left: 0; opacity: 0;}
header.header .logo img {width: 140px; padding: 0 10px;}

header.header .selectLang {background: rgba(0,0,0,0.15); border-radius: 30px; padding: 2px 10px 2px 3px; font-size: 12px; margin-top: 50px; margin-left: 20px;}
header.header .selectLang li {position: relative;}
header.header .selectLang li i {font-style: normal; width: 10px; height: 10px; border-radius: 100%; background: #fff; font-size: 8px; font-weight: 700; padding: 5px; vertical-align: middle; margin-right: 5px;}
header.header .selectLang li span {vertical-align: middle;}
header.header .selectLang li > span:after {content: '\f0d7'; margin-left: 10px;}
header.header .selectLang li ol {position: absolute; background: #eeeeee; top: 23px; right: 0; left: 7px; border-radius: 5px; padding: 3px; box-shadow: 0 0 20px rgba(0,0,0,0.05); transform-origin: top left; transform: scale(0); opacity: 0;}
header.header .selectLang li ol li a {padding: 5px; width: 100%; border-radius: 3px;}
header.header .selectLang li ol li a:hover {background: rgba(0,0,0,0.1);}
header.header .selectLang li:hover ol {transform: scale(1); opacity: 1;}

header.header nav.mainMenu ul li {display: inline-block; float: left;}
header.header nav.mainMenu ul li a {padding: 50px 20px 10px 20px; font-size: 16px; line-height: 47px; position: relative;}
header.header nav.mainMenu ul li a:hover {background: rgba(0,0,0,0.08);}
header.header nav.mainMenu ul li a:active {background: rgba(0,0,0,0.05);}
header.header nav.mainMenu ul li a.active {background: rgba(0,0,0,0.15);}

header.header.headerFix {top: -40px; box-shadow: 0 0 20px rgba(0,0,0,0.10);}
header.header.headerFix .logo:after {opacity: 1; bottom: -10px;}
header.header.headerBg {background: #caf2f7;}
header.header.headerBg nav.mainMenu ul li a:hover {background: rgba(0,0,0,0.05);}
header.header.headerBg nav.mainMenu ul li a:active {background: rgba(0,0,0,0.03);}
header.header.headerBg nav.mainMenu ul li a.active {background: rgba(0,0,0,0.10);}

footer.footer .logo {background: #fff; display: inline-block; padding: 20px 5px; position: relative; margin-right: 20px;}
footer.footer .logo:after {content: ''; position: absolute; width: 100%; height: 10px; background: #EB4A4A; top: -259px; left: 0; opacity: 1; z-index: 3;}
footer.footer .logo img {width: 100px; padding: 0 10px;}
footer.footer .container p {line-height: 70px; margin: 0;}

footer.footer nav.mainMenu ul li {display: inline-block; float: left;}
footer.footer nav.mainMenu ul li a {padding: 20px; font-size: 16px; line-height: 30px; position: relative; text-decoration: none;}
footer.footer nav.mainMenu ul li a:hover {background: rgba(0,0,0,0.05);}
footer.footer nav.mainMenu ul li a:active {background: rgba(0,0,0,0.03);}
footer.footer nav.mainMenu ul li a.active {background: rgba(0,0,0,0.10);}

.logoContent ul {display: block; width: 100%;}
.logoContent ul li {text-align: center;}
.logoContent ul li img {display: inline-block;}

.iconContent img {height: 80px; display: inline-block; margin-bottom: 10px;}

.waveBg {background-repeat: no-repeat; background-size: 100%; padding: 0;}
.waveBg > img {position: relative; margin-top: -7%; margin-bottom: -5%; z-index: -1; opacity: 0.5; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none;}

.parallaxBg {background-position: center; background-size: cover;}
.parallaxBg .parallaxText {color: #fff; font-size: 36px; line-height: 1.2; font-weight: 100; padding: 50px 0;}

.slideContainer {background: #eeeeee; padding: 0;}
.slideContainer .slider li {height: 480px; padding: 0; margin: 0; background-repeat: no-repeat;}
.slideContainer .slider li .container {padding-top: 150px; height: 100%;}
.slideContainer .container .slideTitle {font-size: 36px; line-height: 1.1; font-weight: 700; margin-bottom: 20px;}

.slideContainer .bx-controls {text-align: right; position: absolute; right: 0; bottom: 30px; left: 0;}
.slideContainer .bx-controls .bx-controls-direction {width: 100%; max-width: 1170px; padding: 0 10px; margin: 0 auto;}
.slideContainer .bx-controls .bx-controls-direction a {width: 40px; height: 40px; background: #005072; color: #fff; text-align: center; line-height: 40px;}
.slideContainer .bx-controls .bx-controls-direction a.bx-prev:after {content: '\f060';}
.slideContainer .bx-controls .bx-controls-direction a.bx-next:after {content: '\f061';}
.slideContainer .bx-controls .bx-controls-direction a.bx-prev {opacity: 0.8;}

.maincon {
  padding-top: 150px;
  background-color: #fbfbfb;
}

.breadcrumbs {margin-top: 10px;}
.breadcrumbs li {display: inline-block;}
.breadcrumbs li a {font-weight: 300; text-decoration: none;}
.breadcrumbs li a:hover {text-decoration: underline;} 
.breadcrumbs li:after {content: '/'; display: inline-block; margin: 0 10px; color: #ccc;}
.breadcrumbs li:last-child:after {display: none;}

.techList li div {width: 100%; padding: 80px 20px 20px 20px; transform: scale(1);}
.techList li div i {position: absolute; font-size: 300%; top: 20px; left: 0; right: 0; opacity: 0.6;}
.techList li div strong {display: block; font-size: 16px;}
.techList li:hover div {box-shadow: 0 0 30px rgba(0,0,0,0.1); transform: scale(1.1);}

.infoBtn {text-decoration: none!important; color: #999;}
.infoBtn:after {content: '\f061'; margin-left: 5px;}
.infoBtn:hover {color: #005072;}
.infoBtn:hover:after {margin-left: 8px;}
.infoBtn:active:after {margin-left: 10px;}

.contactForm .form li .inputTxt {font-size: inherit; border: 1px solid #eee; margin-bottom: 20px; padding: 5px 10px; border-radius: 0;}
.contactForm .form li .infoBtn {font-size: inherit; background: #005072; color: #fff; width: auto; font-weight: 700; border-radius: 0; cursor: pointer;}
.contactForm .form li textarea {font-weight: inherit; min-height: 150px;}
.contactForm iframe {width: 100%; height: 260px;}

.contactInfo ul li {padding: 10px 0;}
.contactInfo ul li i {display: inline-block; width: 20px; text-align: center; margin-right: 10px; font-size: 18px;}
.contactInfo ul li strong {width: 70px; display: inline-block;}
.contactInfo ul li iframe {width: 100%; height: 215px;}

.notif p {font-size: 28px; font-weight: 300!important;}

.bigNumber {font-size: 40px; font-weight: 700; padding-top: 40px;}

.footer {
  background: #e5f3fc;
}

@media (min-width: 768px) {
  .logoContent ul li img {width: 80%;}
}

@media (max-width: 991px) {
  header.header nav.mainMenu {position: fixed; top: 50px; right: 0; bottom: auto; left: 0; height: 0;}
  header.header nav.mainMenu ul {background: rgba(255,255,255,0.95); transform: scale(0); transform-origin: top right; opacity: 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0;}
  header.header nav.mainMenu ul li {width: 100%;}
  header.header nav.mainMenu ul li a {width: 100%; padding: 10px 20px;}
  header.header nav.mainMenu:after {content: '\f0c9'; position: absolute; top: -50px; right: 20px; font-size: 24px; cursor: pointer;}
  header.header nav.mainMenu:hover {height: 100%; bottom: 0;}
  header.header nav.mainMenu:hover ul {transform: scale(1); opacity: 1;}
  header.header.headerFix .logo:after {display: none;}
  header.header.header {top: -40px;}
}

@media (max-width: 767px) {
  .slideContainer .slider li {height: 400px;}
  .slideContainer .slider li .container {padding-top: 70px;  background-image: none!important;}
}