@import url(css/fonts.css);
/*=========================================================== Global Styles =========================================================== */
html, body { height: 100%; }

body { padding: 0px ; margin: 0px ; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #666666; position: relative; overflow-y: scroll; overflow-x: hidden; left: 0; -ms-touch-action: pan-y; }

.clearFixer { height: 0px !important; line-height: 0px !important; clear: both !important; padding: 0px !important; margin: 0px !important; }

/*=========================================================== Typography Styles =========================================================== */
/*--- Colors --- */
.grey1-text { color: #111111 !important; text-decoration: none; }

.grey2-text { color: #222222 !important; text-decoration: none; }

.grey3-text { color: #333333 !important; text-decoration: none; }

.grey4-text { color: #444444 !important; text-decoration: none; }

.grey5-text { color: #555555 !important; text-decoration: none; }

.grey6-text { color: #666666 !important; text-decoration: none; }

.grey7-text { color: #777777 !important; text-decoration: none; }

.grey8-text { color: #888888 !important; text-decoration: none; }

.grey9-text { color: #999999 !important; text-decoration: none; }

.grey0-text, .grey0-text p { color: #000 !important; text-decoration: none; }

.red-text, .red-text a, .red-text p { color: red !important; }

.black-text, .black-text a, .black-text p { color: black !important; }

.white-text, .white-text a, .white-text p { color: white !important; }

.blue-text, .blue-text a, .blue-text p { color: #01778e !important; }

.lightBlue-text, .lightBlue-text a, .lightBlue-text p { color: #99c9d2 !important; }

/*--- Sizes --- */
.font10, .font10 p { font-size: 10px !important; }

.font11, .font11 p { font-size: 11px !important; }

.font12, .font12 p { font-size: 12px !important; }

.font13, .font13 p { font-size: 13px !important; }

.font14, .font14 p { font-size: 14px !important; }

.font15, .font15 p { font-size: 15px !important; }

.font16, .font16 p { font-size: 16px !important; }

.font17, .font17 p { font-size: 17px !important; }

.font18, .font18 p { font-size: 18px !important; }

.font19, .font19 p { font-size: 19px !important; }

.font20, .font20 p { font-size: 20px !important; }

.font21, .font21 p { font-size: 21px !important; }

.font22, .font22 p { font-size: 22px !important; }

.font23, .font23 p { font-size: 23px !important; }

.font24, .font24 p { font-size: 24px !important; }

.font25, .font25 p { font-size: 25px !important; }

.font26, .font26 p { font-size: 26px !important; }

.font27, .font27 p { font-size: 27px !important; }

.font28, .font28 p { font-size: 28px !important; }

.font29, .font29 p { font-size: 29px !important; }

.font30, .font30 p { font-size: 30px !important; }

/*--- Cases --- */
.lowercaser { text-transform: lowercase !important; }

.uppercaser { text-transform: uppercase !important; }

.capitalizer { text-transform: capitalize !important; }

/*--- Alignments --- */
.left-aligned-text, .left-aligned-text p { text-align: left !important; }

.right-aligned-text, .right-aligned-text p { text-align: right !important; }

.justify-aligned-text, .justify-aligned-text p { text-align: justify !important; }

.center-aligned-text, .center-aligned-text p { text-align: center !important; }

/*--- Decorations --- */
.have-underline { text-decoration: underline !important; }

.have-overline { text-decoration: overline !important; }

.have-line-through { text-decoration: line-through !important; }

.no-decoration { text-decoration: none !important; }

/*--- fonts --- */
.arial { font-family: Arial, Helvetica, sans-serif !important; }

.roboto { font-family: "robotoregular" !important; }

/*=========================================================== Common Styles =========================================================== */
/*--- Floats --- */
.left-floater { float: left !important; }

.right-floater { float: right !important; }

.no-floater { float: none !important; }

.imager { border: #eeeeee solid 8px; }

.image-left { float: left !important; }

.image-right { float: right !important; }

.valigner { vertical-align: middle; margin: 0px 10px 0px 0px; }

.valigner0 { vertical-align: middle; }

.divider { width: 100%; height: 10px !important; line-height: 0px !important; border-top: #dddddd solid 1px; display: block; padding: 0px !important; margin: 0px 0px 10px 0px; }

.dotted-divider2 { width: 100%; height: 10px !important; line-height: 0px !important; border-top: #CCC dotted 1px; display: block; padding: 0px !important; margin: 0px 0px 10px 0px; }

.dotted-divider { width: 100%; height: 10px !important; line-height: 0px !important; border-top: #CCC dotted 2px; display: block; padding: 0px !important; margin: 0px 0px 10px 0px; }

/*=========================================================== Space limiting Styles =========================================================== */
.no-margin { margin: 0px !important; }

.no-marginR { margin-right: 0px !important; }

.no-marginB { margin-bottom: 0px !important; }

.tight-bottom { margin-bottom: 4px !important; }

.low-bottom { margin-bottom: 7px !important; }

.medium-bottom { margin-bottom: 15px !important; }

.average-bottom { margin-bottom: 25px !important; }

.high-bottom { margin-bottom: 30px !important; }

.no-padding { padding: 0px !important; }

.no-height { height: 0px !important; }

.line22 { line-height: 22px !important; }

.line20 { line-height: 20px !important; }

.line13 { line-height: 13px !important; }

.line12 { line-height: 12px !important; }

.line-normal { line-height: normal !important; }

.social-aligner { border-collapse: collapse; }
.social-aligner td { text-align: left; vertical-align: top; }

.hidden-display { display: none; }

.no-border { border: none !important; }

.placeholder-full-color ::-webkit-input-placeholder { opacity: 1; }
.placeholder-full-color :-moz-placeholder { opacity: 1; }
.placeholder-full-color ::-moz-placeholder { opacity: 1; }
.placeholder-full-color :-ms-input-placeholder { opacity: 1; }

/*=========================================================== Form Styles =========================================================== */
.text-fields { width: 300px; padding: 10px 12px; -webkit-box-sizing: border-box ; -moz-box-sizing: border-box ; box-sizing: border-box ; font-size: 14px; font-size: 1em; color: #666666; border: #cccccc solid 1px; font-family: "robotoregular"; }
@media only screen and (max-width: 640px) { .text-fields { width: 100%; -webkit-box-sizing: border-box ; -moz-box-sizing: border-box ; box-sizing: border-box ; } }

.full-text-fields { padding: 10px 12px; -webkit-box-sizing: border-box ; -moz-box-sizing: border-box ; box-sizing: border-box ; font-family: "robotoregular"; font-size: 14px; line-height: 14px; width: 100%; color: #666666; border: #d8d8d8 solid 1px; }

.text-field-100 { width: 100px !important; }

.text-field-200 { width: 200px !important; }

.text-field-250 { width: 250px !important; }

.small-text-fields { padding: 5px 6px; -webkit-box-sizing: border-box ; -moz-box-sizing: border-box ; box-sizing: border-box ; font-family: "robotoregular"; font-size: 14px; font-size: 1em; width: 100%; color: #666666; border: #cccccc solid 1px; }

.half-small-text-fields { padding: 5px 6px; -webkit-box-sizing: border-box ; -moz-box-sizing: border-box ; box-sizing: border-box ; font-family: "robotoregular"; font-size: 14px; font-size: 1em; width: 49%; color: #666666; border: #cccccc solid 1px; margin: 0 2% 0 0; }
.half-small-text-fields.last-field { margin: 0; }

.select-fields { padding: 6px 10px; -webkit-box-sizing: border-box ; -moz-box-sizing: border-box ; box-sizing: border-box ; font-family: "robotoregular"; font-size: 14px; font-size: 1em; color: #666666; border: #cccccc solid 1px; }

.full-select-fields { padding: 6px 10px; -webkit-box-sizing: border-box ; -moz-box-sizing: border-box ; box-sizing: border-box ; font-family: "robotoregular"; font-size: 14px; font-size: 1em; color: #666666; border: #cccccc solid 1px; width: 100%; }

.flat-buttons { display: inline-block; padding: 10px 16px; font-family: "robotoregular"; font-size: 14px; line-height: 14px; color: white !important; clear: both; outline: none; border: none; cursor: pointer; text-decoration: none; text-align: center; }
.flat-buttons:hover { color: white; }

a.flat-buttons { line-height: 20px; vertical-align: middle; }

.blue-button { background-color: #01778e; }

.lightBlue-button { background-color: #99c9d2; }

.grey-button { background-color: #AAA; }

/*=========================================================== Container Styles =========================================================== */
#main { width: 100%; height: auto; padding: 0px ; margin: 0px ; float: left; }

.container { width: 980px; height: auto; margin: 0px auto; position: relative; }

.wrapper { width: 100%; height: auto; float: left; position: relative; }

/*=========================================================== Common Styles =========================================================== */
#content-area { width: 100%; float: left; padding: 35px 0; }
#content-area .column1 { width: 69%; float: left; }
#content-area .column2 { width: 24%; float: left; margin: 0 0 0 7%; padding: 40px 0 0 0; }
#content-area h1 { font-family: "gasparregular"; font-size: 30px; color: #01778e; margin: 0px 0px 30px 0px; font-weight: bold; text-transform: uppercase; }
#content-area h2 { font-family: "gasparregular"; font-size: 28px; color: #01778e; margin: 0px 0px 30px 0px; font-weight: bold; text-transform: uppercase; }
#content-area h3 { font-family: "gasparregular"; font-size: 24px; line-height: 28px; color: #01778e; margin: 0px 0px 30px 0px; font-weight: bold; text-transform: uppercase; }
#content-area h4 { font-family: "gasparregular"; font-size: 22px; color: #01778e; margin: 0px 0px 25px 0px; font-weight: bold; text-transform: uppercase; }
#content-area h5 { font-family: "gasparregular"; font-size: 20px; color: #01778e; margin: 0px 0px 20px 0px; }
#content-area h6 { font-family: "gasparregular"; font-size: 18px; color: #01778e; margin: 0px 0px 20px 0px; }
#content-area p { color: #666666; font-size: 14px; font-family: "robotoregular"; line-height: 24px; margin-bottom: 17px; }
#content-area p a { color: #01778e; }
#content-area .have-border { padding: 0 0 8px 0; background: url(images/heading-border.jpg) repeat-x bottom left; display: block; }
#content-area .half-columns { width: 40%; float: left; padding: 0px 5%; }
#content-area img { max-width: 100%; height: auto; }
#content-area .quarter-columns { width: 19%; float: left; padding: 0px 3%; }

.fluid-strips, .white-strip, .grey-strip { width: 100%; height: auto; float: left; padding: 50px 0px; position: relative; }

.white-strip { background-color: white; }

.grey-strip { background-color: #f1f1f1; }

.only-in-mobile-and-tablet { display: none; }
@media only screen and (max-width: 768px) { .only-in-mobile-and-tablet { display: block; } }

@media only screen and (max-width: 480px) { .only-in-desktop-and-tablet { display: none; } }

.only-in-mobile { display: none; }
@media only screen and (max-width: 480px) { .only-in-mobile { display: block; } }

.only-in-tablet { display: none; }
@media only screen and (min-width: 640px) and (max-width: 768px) { .only-in-tablet { display: block; } }

.only-in-desktop { display: block; }
@media only screen and (max-width: 768px) { .only-in-desktop { display: none; } }

.full-mobile-img { max-width: 100%; }
@media only screen and (max-width: 640px) { .full-mobile-img { width: 100%; margin-right: 0px; } }

input[type=checkbox], input[type=radio] { vertical-align: middle; position: relative; bottom: 1px; margin-left: 0px; }

input[type=radio] { bottom: 2px; }

.error { border: #ef5151 solid 1px !important; }

.error-message { background: none repeat scroll 0 0 padding-box #ffdddc; border: 1px solid #ef5151; color: #8A1F11; padding: 8px; font-size: 1em; width: 100%; -webkit-box-sizing: border-box ; -moz-box-sizing: border-box ; box-sizing: border-box ; -webkit-border-radius: 6px ; -moz-border-radius: 6px ; border-radius: 6px ; float: left; margin: 10px 0 0 0; text-align: center; font-family: "robotoregular"; }

.success-message { background: none repeat scroll 0 0 padding-box #c7fbc2; border: 1px solid #6abd5c; color: #397626; padding: 8px; font-size: 1em; width: 100%; -webkit-box-sizing: border-box ; -moz-box-sizing: border-box ; box-sizing: border-box ; -webkit-border-radius: 6px ; -moz-border-radius: 6px ; border-radius: 6px ; float: left; margin: 10px 0 0 0; text-align: center; font-family: "robotoregular"; }

.remove-cursor { cursor: default !important; }

.cols-3 { width: 30%; float: left; margin: 0 5% 0 0; }
.cols-3.last { margin: 0 0 0 0; }

ul.menu-list { padding: 0px; margin: 0 0 14px 0; list-style-type: none; }
ul.menu-list li { display: block; padding: 0 0 7px 0; margin: 0 0 8px 0; border-bottom: #b8b8b8 dotted 1px; font-family: "robotoregular"; font-size: 14px; color: #666; }
ul.menu-list li a { border-left: #99c9d2 solid 6px; padding: 0 0 0 18px; color: #666; transition: all 0.5s ease; }
ul.menu-list li a:hover { color: #01778e; padding: 0 0 0 22px; }

ul.social-icons { list-style: none; padding: 0; margin: 0; }
ul.social-icons li { float: left; margin-right: 5px; }
ul.social-icons li :nth-child(1) { margin-left: 0; }
ul.social-icons li a { width: 38px; height: 38px; display: block; background: url("images/social-media-icons.png") no-repeat; text-indent: -9999px; }
ul.social-icons li.facebook a { background-position: 0 0; }
ul.social-icons li.facebook a:hover { background-position: 0 -38px; }
ul.social-icons li.twitter a { background-position: -38px 0; }
ul.social-icons li.twitter a:hover { background-position: -38px -38px; }
ul.social-icons li.googleplus a { background-position: -76px 0; }
ul.social-icons li.googleplus a:hover { background-position: -76px -38px; }
ul.social-icons li.linkedin a { background-position: -114px 0; }
ul.social-icons li.linkedin a:hover { background-position: -114px -38px; }
ul.social-icons li.youtube a { background-position: -266px 0; }
ul.social-icons li.youtube a:hover { background-position: -266px -38px; }
ul.social-icons li.rss a { background-position: -342px 0; }
ul.social-icons li.rss a:hover { background-position: -342px -38px; }

/*=========================================================== Header Styles =========================================================== */
#header { width: 100%; height: 85px; background: url(images/header-background-pattern.jpg) repeat top left; float: left; }
#header figure { width: 30%; float: left; position: relative; }
#header figure img { position: absolute; top: 0px; left: 0px; z-index: 100; }
#header nav { width: 70%; float: right; }
#header nav ul { padding: 0px; margin: 40px 0 0 0; list-style-type: none; display: block; float: right; }
#header nav ul li { display: block; float: left; font-size: 17px; color: #FFF; font-family: "gasparregular"; margin: 0 28px 0 0; text-transform: uppercase; }
#header nav ul li a { color: #FFF; }
#header nav ul li a:hover { color: #9ff0ff; }
#header nav ul li a.active { color: #9ff0ff; }

/*=========================================================== Banner Styles =========================================================== */
#home-banner { width: 100%; height: 530px; float: left; position: relative; overflow: hidden; background-color: #01778e; }
#home-banner #home-banner-slider { width: 100%; height: 530px; float: left; overflow: hidden; }
#home-banner #home-banner-slider img { display: block; }
#home-banner .sliderNav { position: absolute; z-index: 100; bottom: 20px; left: 50%; transform: translate(-50%, 0); margin: 0px auto; padding: 0px; }
#home-banner .sliderNav li { display: inline; list-style-type: none; }
#home-banner .sliderNav li a { display: block; float: left; text-decoration: none; background-color: #FFF; margin: 0px 0px 0px 3px; padding: 0px; line-height: 0px; width: 8px; height: 8px; -webkit-border-radius: 10px ; -moz-border-radius: 10px ; border-radius: 10px ; opacity: 0.6; }
#home-banner .sliderNav li a.activeSlide { opacity: 1; }

/*=========================================================== Homepage Styles =========================================================== */
.profile-row { padding: 0 0 60px 0; width: 100%; height: auto; float: left; }
.profile-row .cols-3 figure { margin: 0 0 15px 0; }
.profile-row .cols-3 figure img { -webkit-box-sizing: border-box ; -moz-box-sizing: border-box ; box-sizing: border-box ; max-width: 100%; }

.partners-row { padding: 0 0 55px 0; width: 100%; height: auto; float: left; position: relative; }
.partners-row .caroufredsel_wrapper { margin: 0 50px 0 0; width: 930px; overflow: hidden; }
.partners-row .caroufredsel_wrapper #partners-logo-slider { padding: 0 !important; margin: 0 0 0 50px; }
.partners-row .caroufredsel_wrapper #partners-logo-slider img { margin: 0 6px; }
.partners-row .prev { position: absolute; top: 80px; left: 0px; width: 28px; height: 28px; display: block; }
.partners-row .next { position: absolute; top: 80px; right: 0px; width: 28px; height: 28px; display: block; }

.contact-row { width: 100%; height: auto; float: left; }

.partners-box { border: solid 4px #eeeeee; text-align: center; margin: 8px 16px 8px 0; width: 198px; height: 88px; float: left; }
.partners-box:last-child { margin-right: 0; }

/*=========================================================== Inner page Styles =========================================================== */
.sidebar { width: 25%; float: left; margin-bottom: 60px; }
.sidebar ul.menu-list { margin-top: 10px; }
.sidebar ul.menu-list li a { display: inline-block; }

.inner-content-area { width: 68%; float: right; margin-bottom: 60px; }

.address-column { width: 55%; float: left; }

.form-column { width: 45%; float: right; }

.pro-sol-column { padding: 16px 0; }

/*=========================================================== Footer Styles =========================================================== */
#footer { width: 100%; height: auto; float: left; padding: 40px 0; text-align: center; background-color: #333333; }
#footer p { font-size: 13px; line-height: 13px; font-family: "robotoregular"; color: #aaaaaa; margin: 0; }
#footer p a { color: #aaaaaa; }
#footer p a:hover { color: #99c9d2; }
#footer ul.social-icons { padding: 0px ; margin: 0px ; list-style-type: none; }
#footer ul.social-icons li { display: inline-block; margin-right: 1px; }
#footer ul.social-icons li img { width: 23px; }
@media only screen and (max-width: 768px) { #footer ul.social-icons li img { width: 46px; } }
@media only screen and (max-width: 480px) { #footer ul.social-icons li img { width: 36px; } }

/* -------------------------------------------------------------- reset.css * Resets default browser CSS. -------------------------------------------------------------- */
html, body, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, fieldset, form, label, legend, caption, article, aside, dialog, figure, footer, header, hgroup, nav, section { padding: 0px ; margin: 0px ; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; vertical-align: baseline; }

input[type='text'], input[type='email'], textarea, input[type='submit'], select { margin: 0px; }

article, aside, dialog, figure, footer, header, hgroup, nav, section { display: block; }

blockquote:before, blockquote:after, q:before, q:after { content: ""; }

blockquote, q { quotes: "" ""; }

nav ul { list-style: none; }

a img { border: 0; }

html, body { font-size: 100.01%; }

body { font-size: 14px; color: #666666; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; color: #111111; }

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { margin: 0; }

p { margin: 0 0 0.5em; }

p img.left { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }

p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; }

a:focus, a:hover { color: black; }

a { color: #000099; text-decoration: none; }

blockquote { margin: 1.5em; color: #666666; font-style: italic; }

strong { font-weight: 700; }

em, dfn { font-style: italic; }

dfn { font-weight: 700; }

sup, sub { line-height: 0; }

abbr, acronym { border-bottom: 1px dotted #555555; }

address { margin: 0 0 1.5em; font-style: italic; }

del { color: #666666; }

pre { margin: 1.5em 0; white-space: pre; }

pre, code, tt { font: 1em "andale mono", "lucida console", monospace; line-height: 1.5; }

li ul, li ol { margin: 0; }

ul, ol { margin: 0 1.5em 1.5em 0; padding-left: 3.333em; }

ul { list-style-type: disc; }

ol { list-style-type: decimal; }

dl { margin: 0 0 1.5em; }

dl dt { font-weight: 700; }

dd { margin-left: 1.5em; }

abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }

table { border-collapse: collapse; border-spacing: 0; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

nav ul, header ul { list-style-type: none; }

.scrollToTop { width: 92px; height: 26px; padding: 10px; text-align: center; background: whiteSmoke; font-weight: bold; color: #8F8F8F; text-decoration: none; position: fixed; bottom: 50px; right: 40px; display: none; background: url(images/back-to-top.png) center no-repeat; font-size: 12px; z-index: 999; }

.scrollToTop:hover { text-decoration: none; color: #8F8F8F; }
