/*
 * Reset browser styles
 */
* {margin: 0; padding: 0}
html {overflow: visible !important; min-height: 100%; padding-bottom: 1px !important}
body {overflow: visible !important; background: #e1e1e1 url("../images/bg_gradient_light.png") repeat; color: #555; font: 13px/1.5 "Square721BT", "Arial", "Helvetica", sans-serif}
p, ul, ol, dl {padding-bottom: 12px}
ul, ol {margin-left: 0; padding-left: 24px}
li ul, li ol {padding-bottom: 0}
[class] {overflow: hidden; list-style: none; padding: 0}
h1, h2, h3, h4, h5, h6 {font-size: 12px}
dt {font-weight: 700}
table {border-collapse: collapse}
hr {height: 1px; margin: 15px 0; border: 0; background: #c5c4c4}
img {border: none; vertical-align: middle}
a {color: #868484; text-decoration: none; cursor: pointer}
a:hover {text-decoration: underline}
textarea, input, select, button {font: 12px "Arial", "Helvetica", sans-serif; vertical-align: middle; box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box}
textarea[class] {overflow: auto}
button, input[type="radio"], input[type="checkbox"], input[type="submit"], input[type="button"], input[type="reset"], label[for], select {cursor: pointer}
input, select, textarea {outline: none}

html.no-scroll,
html.no-scroll body{overflow: hidden !important; height: 100%}


/*
 * Webfonts
 */
 @font-face {font-family: "Square721BT"; src: url("../fonts/square721bt-400.eot"); src: url("../fonts/square721bt-400.eot?#iefix") format("embedded-opentype"),url("../fonts/square721bt-400.woff") format("woff"),url("../fonts/square721bt-400.ttf") format("truetype")}
 @font-face {font-family: "SquareSlab711"; src: url("../fonts/squareslab711-400.eot");src: url("../fonts/squareslab711-400.eot?#iefix") format("embedded-opentype"),url("../fonts/squareslab711-400.woff") format("woff"),url("../fonts/squareslab711-400.ttf") format("truetype");}
 @font-face {font-family: 'icons'; src:url('../fonts/icons.eot?-mbm669'); src:url('../fonts/icons.eot?#iefix-mbm669') format('embedded-opentype'), url('../fonts/icons.woff?-mbm669') format('woff'), url('../fonts/icons.ttf?-mbm669') format('truetype'), url('../fonts/icons.svg?-mbm669#icomoon') format('svg'); font-weight: normal; font-style: normal;}


/*
 * Global styles
 */
.gmnoprint {overflow: visible}

.container {clear: both; max-width: 960px; margin: 0 auto; padding: 0}

.button {position: relative; display: inline-block; overflow: hidden; max-width: 100%; padding: 0 15px 1px; background: #ebe7e7; color: #777; border: 1px solid #d7d7d7; border-radius: 5px; font: 400 13px/21px "Square721BT", "Arial", "Helvetica", sans-serif; white-space: nowrap; vertical-align: middle; cursor: pointer; -webkit-transition: background 200ms ease-out; -moz-transition: background 200ms ease-out; -o-transition: background 200ms ease-out; transition: background 200ms ease-out; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box}
.button.active,
.button:hover {background: #fff; text-decoration: none}
.button.light {padding: 11px 51px 9px 20px; border: 0; border-bottom: 2px solid #e8bc64; color: #7e5701; font-size: 16px; line-height: 1; text-shadow: 1px 1px 0 #f1cd74;  text-transform: uppercase}
.button.light:after {content: ""; position: absolute; top: 50%; right: 6px; display: block; width: 35px; height: 35px; margin-top: -17px; background: transparent url('../images/icons_35x35.png') no-repeat 0 -105px}
.button.light {
    background: #eeb201;
    background: -moz-linear-gradient(top, #ffcc00 0%, #d88f02 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffcc00), color-stop(100%,#d88f02));
    background: -webkit-linear-gradient(top, #ffcc00 0%,#d88f02 100%);
    background: -o-linear-gradient(top, #ffcc00 0%,#d88f02 100%);
    background: -ms-linear-gradient(top, #ffcc00 0%,#d88f02 100%);
    background: linear-gradient(to bottom, #ffcc00 0%,#d88f02 100%);
}
.button.light:hover {
    background: #d88f02;
    background: -moz-linear-gradient(top, #d88f02 0%, #ffcc00 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d88f02), color-stop(100%,#ffcc00));
    background: -webkit-linear-gradient(top, #d88f02 0%,#ffcc00 100%);
    background: -o-linear-gradient(top, #d88f02 0%,#ffcc00 100%);
    background: -ms-linear-gradient(top, #d88f02 0%,#ffcc00 100%);
    background: linear-gradient(to bottom, #d88f02 0%,#ffcc00 100%);
    box-shadow: inset 0 2px #e8bc64
}

.plus {position: relative; z-index: 1}
.plus a {position: relative; display: block}
.plus.active a:after,
.plus a:hover:after {content: ""; position: absolute; z-index: 99; top: 50%; left: 50%; width: 78px; height: 88px; margin: -44px 0 0 -39px; background: transparent url("../images/box_plus_medium.png") no-repeat}
.plus img {position: relative; z-index: -1}
.layer.active a,
.layer a:hover {background: rgba(44, 76, 104, .65)}
.layer.active a:before,
.layer a:hover:before {content: ""; position: absolute; z-index: 10; top: 0; right: 0; bottom: 0; left: 0; background: transparent url("../images/bg_gradient_dark.png") repeat}
.plus.dark a:hover:after {width: 87px; height: 100px; background-image: url("../images/box_plus_dark.png")}
.plus.small a:hover:after {width: 43px; height: 48px; margin: -24px 0 0 -22px; background-image: url("../images/box_plus_small.png")}
.plus.cross.active a:after,
.plus.cross a:hover:after {width: 18px; height: 18px; margin: -9px 0 0 -9px; background: transparent url("../images/icons_18x18.png") no-repeat 0 -36px}
.plus.zoom a:hover:after {width: 40px; height: 46px; margin: -23px 0 0 -20px; background-image: url("../images/box_zoom.png")}

.slider>ul {position: relative; z-index: 4; list-style: none; padding: 0}
.slider>ul.gallery {overflow: visible}
.js .slider {position: relative; min-width: 960px; height: auto}
.js .slider>ul {position: relative; z-index: 4; width: 9999em}
.js .slider>ul>li {float: left; width: 1550px}
.js .slider>ul>li>div {margin: 0 auto}
.js .slider .next,
.js .slider .prev {position: absolute; z-index: 5; top: 50%; width: 40px; height: 50px; margin-top: -35px; background: transparent url('../images/arrows_40x50.png') no-repeat; text-decoration: none; text-indent: -999em}
.js .slider .prev {left: -2px}
.js .slider .prev:hover {background-position: -40px 0}
.js .slider .next {right: -7px; background-position: 0 -50px}
.js .slider .next:hover {background-position: -40px -50px}
.js .slider.inline {min-width: inherit}
.js .slider.inline>ul>li {width: auto}

.tooltip {position: relative; z-index: 1; text-decoration: none !important}
.tooltip:hover span.tooltip-titlee {display: block}
.tooltip span.tooltip-title {position: absolute; z-index: -1; overflow: visible; display: none; margin: 10px; padding: 0 10px; border: 1px solid #707070; background: #c3c2c2; color: #555; font-size: 11px; line-height: 20px}
.tooltip span.tooltip-title {
    background: -moz-linear-gradient(top, #f3f3f3 0%, #c3c2c2 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f3f3f3), color-stop(100%,#c3c2c2));
    background: -webkit-linear-gradient(top, #f3f3f3 0%,#c3c2c2 100%);
    background: -o-linear-gradient(top, #f3f3f3 0%,#c3c2c2 100%);
    background: -ms-linear-gradient(top, #f3f3f3 0%,#c3c2c2 100%);
    background: linear-gradient(to bottom, #f3f3f3 0%,#c3c2c2 100%);
}
.tooltip span.tooltip-title:before {content: ''; position: absolute; bottom: -10px; left: -1px; width: 0; height: 0; border: 5px solid transparent; border-top-color: #76726d; border-left-color: #76726d}
.tooltip span.tooltip-title:after {content: ''; position: absolute; bottom: -8px; left: 0; width: 0; height: 0; border: 4px solid transparent; border-top-color: #c3c2c2; border-left-color: #c3c2c2}
.tooltip span.tooltip-title>span {overflow: hidden}

.primary-tabs,
.tabs,
.primary-tabs li,
.tabs li {list-style: none; margin: 0; padding: 0}
.primary-tabs,
.tabs {position: relative; z-index: 3}
.primary-tabs li,
.tabs li {float: left}
.primary-tabs li a,
.tabs li a {display: block; padding: 0 30px; border: 1px solid #cfcece; border-top-left-radius: 5px; border-top-right-radius: 5px; outline: 0; color: #555; font-size: 14px; line-height: 34px; text-decoration: none}
.primary-tabs li a,
.tabs li a {
    background: #eaeaea;
    background: -moz-linear-gradient(top, #eaeaea 0%, #cccaca 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eaeaea), color-stop(100%,#cccaca));
    background: -webkit-linear-gradient(top, #eaeaea 0%,#cccaca 100%);
    background: -o-linear-gradient(top, #eaeaea 0%,#cccaca 100%);
    background: -ms-linear-gradient(top, #eaeaea 0%,#cccaca 100%);
    background: linear-gradient(to bottom, #eaeaea 0%,#cccaca 100%);
}
.primary-tabs li a.active,
.tabs li a.active {border-bottom-color: #fff; color: #666464; font-weight: 700}
.primary-tabs li a.active,
.tabs li a.active {
    background: #dfdddd;
    background: -moz-linear-gradient(top, #dfdddd 0%, #ffffff 99%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dfdddd), color-stop(99%,#ffffff));
    background: -webkit-linear-gradient(top, #dfdddd 0%,#ffffff 99%);
    background: -o-linear-gradient(top, #dfdddd 0%,#ffffff 99%);
    background: -ms-linear-gradient(top, #dfdddd 0%,#ffffff 99%);
    background: linear-gradient(to bottom, #dfdddd 0%,#ffffff 99%);
}
.tabs-items {position: relative; z-index: 2; margin: -1px 0 6px; border: 1px solid #d1cece}
.tabs-items>div {padding: 10px}
.tabs-items>div p {padding: 0 !important}
.tabs-items>div:target {background: #ffc}
.js .tabs-items>div:target {background: inherit}
.js .tab-content {display: none}

.js .fake-select {float: left; width: 245px; height: 28px; border: 1px solid #bdb9b9; color: #898989; text-align: center; cursor: pointer; box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box}
.js label.placeholder,
.js .fake-select {
    background: #fff;
    background: -moz-linear-gradient(top, #ffffff 0%, #dedee0 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#dedee0));
    background: -webkit-linear-gradient(top, #ffffff 0%,#dedee0 100%);
    background: -o-linear-gradient(top, #ffffff 0%,#dedee0 100%);
    background: -ms-linear-gradient(top, #ffffff 0%,#dedee0 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#dedee0 100%);
}

.js .fake-select>span {position: relative; z-index: 1; display: block; height: 100%}
.js .fake-select>span:after {content: ''; position: absolute; z-index: -1; top: 0; right: 0; bottom: 0; border-left: 1px solid #bdb9b9; width: 34px}
.js .fake-select>span:after {
    background: #eef1f1;
    background: -moz-linear-gradient(top, #eef1f1 0%, #c5c5c6 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eef1f1), color-stop(100%,#c5c5c6));
    background: -webkit-linear-gradient(top, #eef1f1 0%,#c5c5c6 100%);
    background: -o-linear-gradient(top, #eef1f1 0%,#c5c5c6 100%);
    background: -ms-linear-gradient(top, #eef1f1 0%,#c5c5c6 100%);
    background: linear-gradient(to bottom, #eef1f1 0%,#c5c5c6 100%);
}
.js .fake-select span.value {position: relative; display: block; height: 18px; padding: 5px 40px 5px 10px; white-space: nowrap}
.js .fake-select span.value:after {content: ''; position: absolute; top: 50%; right: 7px; bottom: 0; width: 18px; height: 18px; margin-top: -9px; background: transparent url('../images/icons_18x18.png') no-repeat 0 -18px}

.js .fake-dropdown {position: absolute; z-index: 99; display: none; width: 245px; white-space: nowrap}
.js .fake-dropdown>div {padding: 10px 0; border: 1px solid #bdb9b9; border-top: 0; background: #fff; box-shadow: inset 0 10px 20px -8px #bbb}
.js .fake-dropdown div>ul {overflow-y: auto; list-style: none; padding: 0}
.js .fake-dropdown li {position: relative; list-style: none; margin-right: 20px; padding: 2px 0 0}
.js .fake-dropdown li:first-child {display: none}
.js .fake-dropdown li a {display: block; overflow: hidden; width: 100%; padding: 2px 10px; color: #555}
.js .fake-dropdown ul a.selected,
.js .fake-dropdown ul a:hover {background: #e2e4e5; text-decoration: none}

.idevice .fake-dropdown {display: none !important}

.js label.placeholder {position: absolute; top: 1px; right: 1px; bottom: 1px; left: 1px; z-index: 30; width: 200px; padding: 0; color: #959595; font: 400 14px/26px "Square721BT", "Arial", "Helvetica", sans-serif; text-align: center; white-space: nowrap; cursor: pointer}

.magnifyarea {width: 350px !important; height: 337px !important; border: 2px solid #396487 !important}
.zoomtracker {cursor: progress}
.magnifycursor {cursor: url("../images/zoom_cursor.png") 8 8, crosshair}
.crosshair {cursor: crosshair}
.loadinggif {background: transparent url("../images/zoom_loader.gif") no-repeat center; width: 32px; height: 32px; text-indent: -999em}

.progress-disabled {float: none; display: inline}
.ajax-progress {float: none; display: inline}
.ajax-progress .throbber {float: none; display: inline-block; width: 16px; height: 16px; margin: 5px; background: transparent url('../images/throbber.gif') no-repeat}
tr .ajax-progress .throbber {margin: 0 2px}
.ajax-progress-bar {width: 16em}
section.content form#user-login button {padding: 7px 37px}
.locale-untranslated {display: block; padding: 12px 3px 7px; font-style: normal; text-decoration: none}

input, textarea {padding: 7px; background: #fdfbfb; border: 1px solid #aba9a9; box-shadow: inset 0 1px 10px -4px #90908f, inset 0 -1px 10px -4px #90908f; font: 400 14px/17px "Square721BT", "Arial", "Helvetica", sans-serif}
input:focus, textarea:focus {background: #fff}
input[class], textarea[class] {overflow: visible; padding: 7px}
textarea[class] {overflow: auto}
input.error, textarea.error {border-color: #f41605}
input[type="submit"], button, button[class] {padding: 7px; border: 1px solid #2b4861; background: #426d92; color: #fff; font: 400 14px/17px "Square721BT", "Arial", "Helvetica", sans-serif; text-shadow: 1px 1px 1px #083d6b}
input[type="submit"], button {
    background: -moz-linear-gradient(top, #4a7ba4 0%, #3b6282 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4a7ba4), color-stop(100%,#3b6282));
    background: -webkit-linear-gradient(top, #4a7ba4 0%,#3b6282 100%);
    background: -o-linear-gradient(top, #4a7ba4 0%,#3b6282 100%);
    background: -ms-linear-gradient(top, #4a7ba4 0%,#3b6282 100%);
    background: linear-gradient(to bottom, #4a7ba4 0%,#3b6282 100%);
}
input[type="submit"], button:active {
    background: #3b6282;
    background: -moz-linear-gradient(top, #3b6282 0%, #4a7ba4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3b6282), color-stop(100%,#4a7ba4));
    background: -webkit-linear-gradient(top, #3b6282 0%,#4a7ba4 100%);
    background: -o-linear-gradient(top, #3b6282 0%,#4a7ba4 100%);
    background: -ms-linear-gradient(top, #3b6282 0%,#4a7ba4 100%);
    background: linear-gradient(to bottom, #3b6282 0%,#4a7ba4 100%);
}


/*
 * Custom file input
 */
span.file-input {position: relative; display: inline-block; vertical-align: top}
span.file-input input[type="file"] {position: absolute; top: -5px; right: -5px; border: none; outline: none; font-size: 20em; vertical-align: top; cursor: pointer !important}
.idevice span.file-input input[type="file"] {display: inline-block}
span.file-input span.file-input-value {float: left; width: 187px; height: 17px; padding: 7px; background: #fdfbfb; border: 1px solid #aba9a9; box-shadow: inset 0 1px 10px -4px #90908f, inset 0 -1px 10px -4px #90908f; font: 400 14px/17px "Square721BT", "Arial", "Helvetica", sans-serif}
span.file-input span.file-input-value>span {overflow: hidden; white-space: nowrap}
span.file-input a.file-input-button {float: left; padding: 7px; border: 1px solid #2b4861; background: #426d92; color: #fff; font: 400 14px/17px "Square721BT", "Arial", "Helvetica", sans-serif; text-decoration: none; text-shadow: 1px 1px 1px #083d6b; vertical-align: middle; cursor: pointer}



/*
 * Modal
 */
div.overlay {position: fixed; z-index: 100; top: 0; right: 0; bottom: 0; left: 0}
div.overlay>div.overlay-content {position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; overflow: auto; overflow-y: scroll; padding: 0 60px; -webkit-overflow-scrolling: touch}
div.overlay>div.overlay-background {position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #1b242b}
div.modal {overflow: visible; position: relative; z-index: 1; width: 100%; height: 100%; margin: 0 auto; padding: 0; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box}


/*
 * Lightbox modal
 */
div.modal.lightbox div.fader {position: relative; z-index: 24; height: 100%; min-height: 600px; margin: 0; padding: 0}
div.modal.lightbox div.fader>ul {position: absolute; top: 0; left: 0; width: 100%; height: 100%; list-style: none; width: 100%; margin: 0; padding: 0}
div.modal.lightbox div.fader>ul>li {position: absolute; top: 0; left: -50px; width: 100%; height: 100%; padding: 0 50px; text-align: center}
div.modal.lightbox div.fader>ul>li>div {position: relative; overflow: visible; display: inline-block; max-width: 100%; max-height: 100%; margin: 0 auto}
div.modal.lightbox div.fader>ul>li div>img {position: relative; overflow: visible; height: auto; max-width: 100%; max-height: 100%; border: 1px solid #325572; box-shadow: 1px 1px 60px #1b242b}

div.modal.lightbox div.fader>ul>li div>a.close {position: absolute; top: 10px; right: 10px; width: 28px; height: 28px; background: transparent url('../images/lightbox_close.png') no-repeat 0 0; text-indent: -99em}
div.modal.lightbox div.fader>ul>li div>a.close:hover {background-position: -28px 0}
div.modal.lightbox div.fader>ul>li div>span {position: absolute; right: 0; bottom: -30px; left: 0; overflow: hidden; margin: auto; color: #fff; font: 400 16px/1 "Square721BT", sans-serif; text-align: center; white-space: nowrap}

div.modal.lightbox a.gallery-prev,
div.modal.lightbox a.gallery-next {position: fixed; z-index: 25; top: 300px; left: 50%; width: 42px; height: 155px; margin-left: -493px; padding: 20px}
div.modal.lightbox a.gallery-next {padding-left: 0}
div.modal.lightbox a.gallery-prev:after,
div.modal.lightbox a.gallery-next:after {content: ''; position: absolute; top: 20px; left: 20px; width: 42px; height: 155px; background: transparent url('../images/lightbox_arrows.png') no-repeat 0 0}
div.modal.lightbox a.gallery-next:after {left: 3px}
div.modal.lightbox a.gallery-prev:hover {background-position: -42px 0}
div.modal.lightbox a.gallery-next {margin-left: 435px}
div.modal.lightbox a.gallery-next:after {background-position: 0 -155px}
div.modal.lightbox a.gallery-next:hover:after {background-position: -42px -155px}

div.modal.lightbox a.gallery-next.disabled:hover:after,
div.modal.lightbox a.gallery-next.disabled:after {background-position: 0 -465px}

div.modal.lightbox a.gallery-prev.disabled:hover:after,
div.modal.lightbox a.gallery-prev.disabled:after {background-position: 0 -310px}

@media (max-width: 959px) {
    div.overlay > div.overlay-content {padding-top: 0}
    div.modal.lightbox a.gallery-prev,
    div.modal.lightbox a.gallery-next {top: 50%; margin-top: -82px; margin-left: 0}
    div.modal.lightbox a.gallery-prev {left: 0}
    div.modal.lightbox a.gallery-next {right: 0; left: auto}
}


/*
 * Error 404 Page
 */
section.content .error404 {width: 100%; max-width: 740px; padding-top: 32px}
section.content .error404 h2 {float: left; margin: 0; padding: 0; color: #396487; font: 400 118px/1 "Square721BT", sans-serif}
section.content .error404 p {float: left; margin: 18px 0 0 20px; padding: 10px 0 14px; max-width: 480px; border: 1px solid #88a2b7; background: #446487; color: #fff; font-size: 30px; line-height: 1.2; text-align: center}
section.content .error404 a {color: #71a9d7; text-transform: uppercase}
@media (max-width: 959px) {
    section.content .error404 p {margin-right: 20px}
}


/*
 * Contact Page
 */
section.content .contact .column-left {float: left; width: 255px; padding-left: 80px; border-right: 1px solid #dad7d7}
section.content .contact .column-right {float: left; overflow: visible; width: 320px; padding-left: 30px; padding-right: 10px}
section.content .contact h5,
section.content .contact p {padding-bottom: 14px; font: 400 14px/17px "Square721BT", sans-serif}
section.content .contact h5 { color: #4a7ba4}
section.content .contact .map {clear: both; padding: 20px 0 0 80px}
section.content .contact .map>div {position: relative; overflow: visible; margin: 0; padding: 0; border: 1px solid #a4a2a2}
section.content .contact .map>div>p {margin: 0; padding: 0}
.js section.content .contact .map>div {height: 240px}
.js section.content .contact .map>div>p {position: absolute; top: 0; right: 0; bottom: 0; left: 0}
section.content .contact .map>div:after {content: ""; position: absolute; bottom: -11px; width: 100%; height: 11px; background: transparent url("../images/map_shadow.png") no-repeat 50% 0}
section.content .contact .map>div>p>* {display: block; width: 100%; box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box}
section.content .contact .map>form {margin: 0; padding: 10px 0 20px}
section.content .contact .map>form button {width: 125px}
section.content .contact .map>form input {margin-left: 5px; width: 490px}

@media (max-width: 719px) {
    section.content .contact .column-left,
    section.content .contact .column-right {width: 48%; padding: 0}
    section.content .contact .column-right {padding-left: 10px}
    section.content .contact .map {padding-left: 0}
    section.content .contact .map > form input {width: auto; max-width: 490px}
}
@media (max-width: 479px) {
    section.content .contact .column-left,
    section.content .contact .column-right {width: 100%; padding: 0}
    section.content .contact .column-left {border-right: 0; border-bottom: 1px solid #dad7d7}
    section.content .contact .column-right {padding-top: 15px}
    section.content .contact .map > form input {width: 100%; margin: 5px 0 0}
}


/*
 * Realizations list page
 */
section.content .realizations ul {margin: 0; padding: 0 0 30px}
section.content .realizations li {margin: 0; padding: 0; font: 400 13px/18px "Square721BT", sans-serif}
section.content .realizations .map {position: relative; padding: 0 0 20px}
section.content .realizations .map>p>img {border: 1px solid #c1bfbf}
section.content .realizations .map>h3 {position: absolute; top: 30px; left: 15px; width: 230px; color: #959595; font: 24px/1 "SquareSlab711", "Arial", "Helvetica", sans-serif}
section.content .realizations .map>div {position: absolute; top: 105px; left: 15px}
section.content .realizations .map>div>p {position: relative; margin: 0 0 12px; padding: 0}
section.content .realizations .map>div>p:before,
section.content .realizations .map>div>p:after {content: " "; display: table}
section.content .realizations .map>div>p:after {clear: both}
section.content .realizations .map>div select {width: 245px; padding: 5px; background: #f0f0f1; border: 1px solid #bdb9b9; color: #959595; font-size: 14px}
section.content .realizations .map>div optgroup {font-style: normal}

@media (max-width: 719px) {
    section.content .realizations .map {min-height: 200px}
    section.content .realizations .map>p>img {display: none}
}


/*
 * Departments page
 */
section.content .departments footer {clear: both; padding-top: 50px}
section.content .departments article {overflow: hidden; padding-bottom: 50px}
section.content .departments ul,
section.content .departments li,
section.content .departments p {margin: 0; padding: 0; font-size: 14px}
section.content .departments .column-left {float: left; width: 315px}
section.content .departments .column-left li {position: relative; clear: left; margin-top: 26px; padding-top: 26px; border-top: 1px solid #e2e2e2}
section.content .departments .column-left li:first-child {margin: 0; padding: 10px 0 0; border: 0}
section.content .departments .column-left h5 {margin: 0; padding: 0 0 5px; font-size: 17px; font-weight: 400; line-height: 1}
section.content .departments .column-left .map {position: absolute; right: 0; padding-top: 5px}
section.content .departments .column-left .person {padding-top: 5px}
section.content .departments .column-left .person img {display: block; margin-bottom: 5px; border: 1px solid #396487}

section.content .departments .column-right {float: left; width: 300px; margin-left: 80px}
section.content .departments .column-right label {display: block; padding: 10px 0 15px; font: 14px/1 "Square721BT", "Arial", "Helvetica", sans-serif}
section.content .departments .column-right input,
section.content .departments .column-right textarea {width: 270px; margin-bottom: 5px}
section.content .departments .column-right textarea {height: 180px; resize: vertical}
section.content .departments .column-right button {margin-top: 20px; padding: 7px 37px; font-size: 18px}
section.content .departments .column-right label.error {overflow: visible; width: 270px; margin: 0; padding: 0; color: #d91d0e; font-size: 12px; line-height: 14px; text-align: right; text-align: right; text-transform: lowercase}

section.content .departments .checkbox-field label {font-size: 13px}
section.content .departments .checkbox-field input {float: left; width: inherit; margin: 10px 10px 0 0}

@media (max-width: 719px) {
    section.content .departments .column-left,
    section.content .departments .column-right {float: none; width: auto; margin: 0 auto}
    section.content .departments .column-right .file-input {width: 100%}
    section.content .departments .column-right input,
    section.content .departments .column-right textarea {width: 100%}
    section.content .departments .column-right input[type="radio"],
    section.content .departments .column-right input[type="checkbox"] {width: auto}
}


/*
 * Page header
 */
body>.wrapper>header {position: relative; z-index: 6}
body>.wrapper>header .sticky-header {overflow: visible}
@media (min-width: 960px) {
    body>.wrapper>header {padding-top: 113px}
    body>.wrapper>header .sticky-header {position: fixed; top: 0; left: 0; z-index: 10; width: 100%}
}
body>.wrapper>header ul,
body>.wrapper>header li {list-style: none; margin: 0; padding: 0; line-height: 1}
body>.wrapper>header h1 {max-width: 960px; height: 32px; margin: 0 auto}
body>.wrapper>header h1>a {position: relative; z-index: 9; display: block; width: 129px; height: 117px; margin-left: 10px; padding: 20px; background: #fff url("../images/logo.png") no-repeat center; text-indent: -999em}

body>.wrapper>header .locale {position: absolute; top: 0; right: 0; left: 0; min-height: 33px; background: #eaeaea; border-bottom: 1px solid #c9c9ca}
body>.wrapper>header .locale {
    alignment-adjust: background: -moz-linear-gradient(top, #eaeaea 0%, #dfdfdf 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eaeaea), color-stop(100%,#dfdfdf));
    background: -webkit-linear-gradient(top, #eaeaea 0%,#dfdfdf 100%);
    background: -o-linear-gradient(top, #eaeaea 0%,#dfdfdf 100%);
    background: -ms-linear-gradient(top, #eaeaea 0%,#dfdfdf 100%);
    background: linear-gradient(to bottom, #eaeaea 0%,#dfdfdf 100%);
}
body>.wrapper>header .locale ul {float: right; margin-right: 30px}
body>.wrapper>header .locale a.mobile-menu-opener+ul {height: 32px}
body>.wrapper>header .locale a.mobile-menu-opener.opened+ul {height: auto}
body>.wrapper>header .locale ul>li {margin: 0 2px}
body>.wrapper>header .locale ul>li>a {display: block; padding: 12px 3px 7px; color: #707070; text-decoration: none}
body>.wrapper>header .locale ul>li>a:hover,
body>.wrapper>header .locale ul>li>a.active {background: #9f9f9f; color: #fff}

body>.wrapper>header .locale,
body>.wrapper>header .locale [class] {overflow: visible;}
body>.wrapper>header .lang-switch {position: relative; z-index: 15; float: right; margin-top: 4px; margin-right: 30px; color: #707070; font-weight: 600; text-align: center; cursor: pointer;}
body>.wrapper>header .lang-switch .current-lang {display: block; width: 54px; padding: 4px; box-sizing: border-box; word-wrap: break-word;}
body>.wrapper>header .lang-switch .current-lang:after {content: ''; display: inline-block; width: 0; height: 0; margin-right: -12px; margin-left: 4px; border-style: solid; border-width: 4px 4px 0 4px; border-color: #999 transparent transparent transparent; vertical-align: middle;}
body>.wrapper>header .lang-switch ul {position: absolute; top: 0; display: none; margin-right: 0; box-sizing: border-box; width: 100%; padding-top: 27px; background: transparent; border: 1px solid #c9c9ca;}
body>.wrapper>header .lang-switch.active ul {display: block;}
body>.wrapper>header .lang-switch ul>li {margin: 0;}
body>.wrapper>header .lang-switch ul>li>a {display: block; padding: 8px 4px; background-color: #e0e0e0;}
body>.wrapper>header .lang-switch ul>li>a.active {display: none;}
body>.wrapper>header .lang-switch ul>li>a:hover {background-color: #9f9f9f; color: #555; text-decoration: none;}

@media (max-width: 959px) {
    body>.wrapper>header nav {display: none}
}
body>.wrapper>header nav {background: #fff}
body>.wrapper>header nav .container {overflow: visible; padding-top: 35px}
body>.wrapper>header nav>div:before,
body>.wrapper>header nav>div:after {content: " "; display: table}
body>.wrapper>header nav>div:after {clear: both}
body>.wrapper>header nav>div>ul {position: relative; z-index: 10; float: right; max-width: 770px; width: 770px; margin-top: 0; text-align: right}
body>.wrapper>header nav>div>ul>li {position: relative; float: none; display: inline-block; z-index: 1; margin: 0 0 0 7px}
body>.wrapper>header nav>div>ul>li[class] {overflow: visible}
body>.wrapper>header nav>div>ul>li:before {content: ""; position: absolute; top: 50%; left: -4px; width: 1px; height: 20px; margin-top: -10px; background: #d2d2d2}
body>.wrapper>header nav>div>ul>li:first-child {margin: 0}
body>.wrapper>header nav>div>ul>li:first-child:before {display: none}
body>.wrapper>header nav>div>ul>li>a {position: relative; display: block; padding: 15px !important; color: #555; font: 16px/1 "SquareSlab711", "Arial", "Helvetica", sans-serif; text-transform: uppercase;}
body>.wrapper>header nav>div>ul>li.active>a,
body>.wrapper>header nav>div>ul>li:hover {z-index: 2}

body>.wrapper>header nav>div>ul>li.active>a,
body>.wrapper>header nav>div>ul>li:hover>a {background: #47779f; color: #fff; text-decoration: none}
body>.wrapper>header nav>div>ul>li.active>a,
body>.wrapper>header nav>div>ul>li:hover>a {
    background: -moz-linear-gradient(top, #47779f 0%, #2c4961 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#47779f), color-stop(100%,#2c4961));
    background: -webkit-linear-gradient(top, #47779f 0%,#2c4961 100%);
    background: -o-linear-gradient(top, #47779f 0%,#2c4961 100%);
    background: -ms-linear-gradient(top, #47779f 0%,#2c4961 100%);
    background: linear-gradient(to bottom, #47779f 0%,#2c4961 100%);
}
body>.wrapper>header nav>div>ul>li:hover:after {content: ""; position: absolute; bottom: 0; left: 50%; width: 0; height: 0; margin: 0 0 -16px -8px; border: 8px solid transparent; border-top-color: #2b475f}
body>.wrapper>header nav>div>ul>li>ul,
body>.wrapper>header nav>div>ul>li>.submenu-container {position: absolute; left: -30px; z-index: -1; overflow: visible; min-height: 44px; visibility: hidden; display: none; padding-right: 10px !important; background: rgba(255, 255, 255, 1); white-space: nowrap}
.js>.wrapper>header nav>div>ul>li>ul,
.js>.wrapper>header nav>div>ul>li>.submenu-container {width: 770px}
body>.wrapper>header nav>div>ul>li.right>ul {left: auto; right: -30px}
body>.wrapper>header nav>div>ul>li.last>ul {right: 0}
.js>.wrapper>header nav>div>ul>li.last>ul,
.js>.wrapper>header nav>div>ul>li.right>ul {left: 0px; right: auto}
body>.wrapper>header nav>div>ul>li:hover>ul,
body>.wrapper>header nav>div>ul>li:hover>.submenu-container {visibility: visible; display: block}

.submenu-container {padding: 5px; border: 1px solid #d2d2d2}
.submenu-container>* {display: table; table-layout: fixed; width: 100%}
.submenu-container>*>* {overflow: visible; display: table-cell; width: 33.33%; text-align: left; white-space: normal; vertical-align: top}
.submenu-container img {width: 100%; height: auto}
.submenu-container .menu-text {padding: 9px 16px; border-left: 1px solid #d2d2d2; color: #888; font-size: 14px; vertical-align: middle}
.submenu-container .menu-text p {padding: 0}
.submenu-container .submenu {height: 223px}
.submenu-container .submenu:after {content: ''; clear: both; display: block}
.submenu-container .submenu li {overflow: visible; display: block; width: 100%; padding: 6px 0 6px 30px}
.submenu-container .submenu ul {height: 199px; padding-top: 4px}
.submenu-container .submenu .columns {float: left; overflow: visible; width: 50%; height: calc(100% - 15px)}
.submenu-container .submenu .columns.column-1 {position: relative}
.submenu-container .submenu .columns.column-1:after {content: ''; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background: #eee}
.submenu-container .submenu a {position: relative; display: inline-block; color: #497aa3; font-size: 13px}
.submenu-container .submenu a:hover {color: #555; text-decoration: none}
.submenu-container .submenu a:hover:before {content: ''; position: absolute; top: -8px; left: -30px; width: 15px; height: 32px; background: #497aa3}
.submenu-container .submenu a:hover:after {content: ''; position: absolute; top: 50%; left: -15px; border-style: solid; border-width: 6.5px 0 6.5px 4px; border-color: transparent transparent transparent #497aa3; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%)}
.submenu-title {padding-left: 30px; color: #888; font-size: 15px}

@media (max-width: 959px) {
    .submenu-container {display: none !important}
}

.header-contact {position: absolute; top: 33px; left: 0; width: 100%; height: 25px; padding: 6px 0 5px}
.header-contact .contact-wysiwyg {float: right}
.header-contact .contact-wysiwyg p {padding: 0}
.mobile-contact {padding: 5px 0 !important; border-bottom: 1px solid #c9c9ca}
.mobile-contact p {padding: 0}

@media (max-width: 959px) {
    .header-contact {display: none}
}

/* mobile menu */
.mobile-menu,
.mobile-menu-opener {display: none}
@media (max-width: 959px) {
    .locale.opened {z-index: 11; overflow: visible; height: 32px}
    .locale>.container>* {display: none}
    .locale>.container .mobile-menu-opener {float: right; display: block; margin: 2px 10px 0; font-size: 20px}
    .locale>.container .mobile-menu-opener:hover {text-decoration: none}
    .mobile-menu {width: 100%; margin: 0 !important; background: #fff}
    body>.wrapper>header .locale .mobile-menu ul {float: none; display: none}
    .mobile-menu li {position: relative; float: none !important}
    .mobile-menu li a {margin: 0; padding: 0 10px}
    .mobile-menu .mobile-submenu-opener {position: absolute; top: 0; right: 0}
    .mobile-menu .locale-link a {display: inline-block}

    body>.wrapper>header .locale ul.mobile-menu > li:not(.locale-link) > a {padding-bottom: 12px; color: #555; font: 16px/1 "SquareSlab711","Arial","Helvetica",sans-serif; text-transform: uppercase}
    body>.wrapper>header .locale ul.mobile-menu > li:not(.locale-link) > a:hover {background: none; color: #555}
    body>.wrapper>header .locale ul.mobile-menu > li.opened > a,
    body>.wrapper>header .locale ul.mobile-menu > li.opened > a:hover,
    body>.wrapper>header .locale ul.mobile-menu > li.active:not(.locale-link) > a,
    body>.wrapper>header .locale ul.mobile-menu > li.active:not(.locale-link) > a:hover {color: #fff}
    body>.wrapper>header .locale ul.mobile-menu > li.active:not(.locale-link) > a,
    body>.wrapper>header .locale ul.mobile-menu > li.opened > a:not(.mobile-submenu-opener) {
        background: -moz-linear-gradient(top, #47779f 0%, #2c4961 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#47779f), color-stop(100%,#2c4961));
        background: -webkit-linear-gradient(top, #47779f 0%,#2c4961 100%);
        background: -o-linear-gradient(top, #47779f 0%,#2c4961 100%);
        background: -ms-linear-gradient(top, #47779f 0%,#2c4961 100%);
        background: linear-gradient(to bottom, #47779f 0%,#2c4961 100%);
    }
    body>.wrapper>header .locale ul.mobile-menu > li.opened > a.mobile-submenu-opener {background: none}
    body>.wrapper>header .locale ul.mobile-menu > li > ul a {display: inline-block; padding: 5px 0; color: #497aa3; font-size: 14px}
    body>.wrapper>header .locale ul.mobile-menu > li.locale-link {display: inline-block}
    body>.wrapper>header .locale ul.mobile-menu > li.locale-link + li:not(.locale-link) {border-top: 1px solid #c9c9ca}
}

body>.wrapper>header nav>div>ul>li>ul>li {float: none; overflow: visible; position: relative; z-index: 1; display: block; min-width: 50px; margin: 0; padding: 0 35px; text-align: center}
body>.wrapper>header nav>div>ul>li>ul>li+li {margin-top: 5px}
/*body>.wrapper>header nav>div>ul>li>ul>li:before {content: ""; position: absolute; top: 50%; left: 0; width: 1px; height: 14px; margin-top: -7px; background: #80a6c6}*/
body>.wrapper>header nav>div>ul>li>ul>li.first-in-line {overflow: visible}
/*body>.wrapper>header nav>div>ul>li>ul>li.first-in-line:before {display: none}*/
/*body>.wrapper>header nav>div>ul>li>ul>li:first-child:before {display: none}*/
body>.wrapper>header nav>div>ul>li>ul>li a {display: block; padding: 3px 12px !important; color: #497aa3; font-size: 14px; text-align: left}
body>.wrapper>header nav>div>ul>li>ul>li a:hover {text-decoration: none}
body>.wrapper>header nav>div>ul>li>ul>li span {position: relative; display: block; padding: 0}
body>.wrapper>header nav>div>ul>li>ul>li.active {overflow: visible}
body>.wrapper>header nav>div>ul>li>ul>li:hover a,
body>.wrapper>header nav>div>ul>li>ul>li.active a {color: #555555}
body>.wrapper>header nav>div>ul>li>ul>li.active:after,
body>.wrapper>header nav>div>ul>li>ul>li:hover:after {content: ""; position: absolute; top: 50%; left: 0px; width: 9px;  height: 33px; background: #497aa3; transform: translateY(-50%)}
body>.wrapper>header nav>div>ul>li>ul>li.active:before,
body>.wrapper>header nav>div>ul>li>ul>li:hover:before {content: ""; position: absolute; top: 50%; left: 9px; width: 0px; height: 0; transform: translateY(-50%); border-style: solid; border-width: 6.5px 0 6.5px 4px; border-color: transparent transparent transparent #497aa3}
/*body>.wrapper>header nav>div>ul>li>ul>li.active span:after,*/
/*body>.wrapper>header nav>div>ul>li>ul>li:hover span:after {content: ""; position: absolute; bottom: -5px; left: 50%; margin-left: -5px; width: 0; height: 0; border: 5px solid transparent; border-bottom-color: #497aa3}*/
/*body>.wrapper>header nav>div>ul>li>ul>li.active span:before,
body>.wrapper>header nav>div>ul>li>ul>li:hover span:before {content: ""; position: absolute; bottom: -19px; right: 15px; left: 15px; height: 0; border: 5px solid transparent; border-top-color: #fcfcfb}*/
body>.wrapper>header nav>div>ul>li>ul.align-right {text-align: right}
body>.wrapper>header nav>div>ul>li>ul.align-right>li {float: none; display: block}

body>.wrapper>header .fader-container {position: relative; width: 100%; margin: 0 auto; clear: both}
body>.wrapper>header .fader-container .background {position: absolute; z-index: 4; overflow: visible; top: 0; left: 50%; width: 100%; margin-left: -475px; padding: 0}
body>.wrapper>header .fader-container .background:before {content: ""; position: absolute; right: 100%; width: 100%; height: 423px;background: #1b242b; opacity: 0.8}
body>.wrapper>header .fader-container .image img {width: 100%}
@media (max-width: 1500px) {
    body>.wrapper>header .fader-container .image img {width: auto}
}
@media (max-width: 959px) {
    body>.wrapper>header .fader-container .background {left: 0; margin-left: 100px}
}
@media (max-width: 719px) {
    body>.wrapper>header .fader-container .background {margin-left: 0}
}
body>.wrapper>header .fader-container .fader>.background {display: none}
.js>.wrapper>header .fader-container .fader>.background {display: block}
body>.wrapper>header .fader {position: relative; z-index: 0; height: 564px}
body>.wrapper>header .fader ul {float: none; margin: 0 auto}
.js>.wrapper>header .fader ul.description {position: relative; overflow: visible}
.js>.wrapper>header .fader ul.description>li {position: absolute; display: none; opacity: 0}
.js>.wrapper>header .fader ul.description>li:first-child {display: block; opacity: 1}
body>.wrapper>header .fader p {margin: 0; padding: 0}
body>.wrapper>header .fader ul>li {position: relative; float: none; min-width: 960px; width: 100%; margin: 0 auto}
body>.wrapper>header .fader ul>li .desc {position: absolute; z-index: 10; top: 0; bottom: 0; left: 50%; overflow: visible; width: 435px; margin-left: -460px}
body>.wrapper>header .fader ul>li .desc>div {position: absolute; top: 150px; width: 300px; height: 200px; padding-bottom: 39px; color: #fff}
body>.wrapper>header .fader ul>li .desc>div h3 {overflow: hidden; width: 245px; padding-bottom: 20px; font: 400 40px/1 "SquareSlab711", "Arial", "Helvetica", sans-serif; text-shadow: 1px 1px 1px #262b30; text-transform: uppercase}
body>.wrapper>header .fader ul>li .desc>div p {padding: 0; font-size: 15px; line-height: 18px}
body>.wrapper>header .fader ul>li .desc>.details {position: absolute; top: 335px}
.js>.wrapper>header .fader ul {position: relative; z-index: 4; list-style: none; padding: 0}
.js>.wrapper>header .fader ul>li {position: absolute; top: 0; list-style: none}

body>.wrapper>header .fader-control {position: absolute; overflow: visible; bottom: 0; left: 0; right: 0; height: 141px; margin: 0 auto; background: rgba(0, 0, 0, .54)}
body>.wrapper>header .fader-control>div {position: relative; overflow: visible; height: 148px; margin-top: -10px}
body>.wrapper>header .fader-control>div>div {height: 151px; margin: 0 10px 0 0; background: transparent url('../images/header_menu_bg.png') no-repeat}
body>.wrapper>header .fader-control .hide-control {position: relative; top: -12px; padding-top: 12px}
body>.wrapper>header .fader-control ul {margin: 0 15px; padding: 0; white-space: nowrap}
body>.wrapper>header .fader-control ul>li {position: relative; float: left; display: block; margin: 0 2px 0 2px; white-space: normal}
body>.wrapper>header .fader-control ul>li:after {content: ""; position: absolute; top: 50%; left: 0; width: 1px; height: 40px; margin-top: -20px; border-left: 1px solid #c9c7c7; background: #fff}
body>.wrapper>header .fader-control ul>li:first-child:after {display: none}
.js>.wrapper>header .fader-control ul>li.active:after,
body>.wrapper>header .fader-control ul>li:hover:after,
body>.wrapper>header .fader-control ul>li:hover + li:after,
.js>.wrapper>header .fader-control ul>li.active + li:after {visibility: hidden}
body>.wrapper>header .fader-control ul>li a {overflow: hidden; height: 73px; padding: 0 7px 0; border: 1px solid transparent; color: #7d7d7d; line-height: 15px; text-align: center; text-transform: uppercase; vertical-align: middle; outline: 0}
body>.wrapper>header .fader-control ul>li[class] {overflow: visible}
.js>.wrapper>header .fader-control ul>li.active a,
body>.wrapper>header .fader-control ul>li a:hover {background: #fcfcfc; border: 1px solid #9f9f9f; border-radius: 3px; box-shadow: 10px 0 10px -10px #333, -10px 0 10px -10px #333; color: #5d5c5c; text-decoration: none}
.js>.wrapper>header .fader-control ul>li.active a,
body>.wrapper>header .fader-control ul>li a:hover {
    background: -moz-linear-gradient(top, #fbfbfb 0%, #e5e5e5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#e5e5e5));
    background: -webkit-linear-gradient(top, #fbfbfb 0%,#e5e5e5 100%);
    background: -o-linear-gradient(top, #fbfbfb 0%,#e5e5e5 100%);
    background: -ms-linear-gradient(top, #fbfbfb 0%,#e5e5e5 100%);
    background: linear-gradient(to bottom, #fbfbfb 0%,#e5e5e5 100%);
}
.js>.wrapper>header .fader-control ul>li.active a:before,
body>.wrapper>header .fader-control ul>li a:hover:before {content: ""; position: absolute; top: -14px; left: 50%; margin-left: -15px; width: 35px; height: 15px; background: transparent url("../images/icons_35x35.png") no-repeat 0 -55px}
.js>.wrapper>header .fader-control ul>li.active a:after,
body>.wrapper>header .fader-control ul>li a:hover:after {content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: transparent url("../images/bg_gradient_light.png") repeat}
body>.wrapper>header .fader-control .arrows a {position: absolute; top: 16px; z-index: 9; width: 40px; height: 50px; background: transparent url('../images/arrows_40x50.png') no-repeat; text-decoration: none; text-indent: -999em}
body>.wrapper>header .fader-control a.prev {left: -6px}
body>.wrapper>header .fader-control a.prev:hover {background-position: -40px 0}
body>.wrapper>header .fader-control .arrows a.next {right: -9px; background-position: 0 -50px}
body>.wrapper>header .fader-control .arrows a.next:hover {background-position: -40px -50px}

body>.wrapper>header .fader-container.small .fader {height: 207px}
body>.wrapper>header .fader-container.small .fader-control {height: 50px}
body>.wrapper>header .fader-container.small .fader-control>div {margin-top: -7px; background-position: 0 -25px}
body>.wrapper>header .fader-container.small .fader-control .arrows a {top: 6px}
body>.wrapper>header .fader-container.small .fader ul>li .desc {margin-left: -470px}
body>.wrapper>header .fader-container.small .fader ul>li .desc>.details {top: 80px}
body>.wrapper>header .fader-container.small .fader-control>div>ul>li a {height: 46px; padding-top: 4px}
body>.wrapper>header .fader-container.small .fader-control>div>ul>li:after {margin-top: -17px}

body>.wrapper>header .fader ul>li .plus a:hover:after {margin-top: -78px}

body>.wrapper>header .fader-control .slider {position: relative; top: -20px; right: 10px; left: 35px; width: 887px; min-width: inherit; padding-top: 20px}
body>.wrapper>header .fader-control .slider ul {position: relative; z-index: 4; width: 9999em; margin: 0 5px}
body>.wrapper>header .fader-control .slider li {float: left; width: 172px}
body>.wrapper>header .fader-control .slider li a {display: block; line-height: 75px}
body>.wrapper>header .fader-control .slider li a>span {display: inline-block; overflow: hidden; padding-bottom: 5px; line-height: normal; vertical-align: middle}

body>.wrapper>header .fader-container.small .fader-control .slider li a {height: 50px; line-height: 50px}
body>.wrapper>header .fader-container.small .fader-control .slider li a>span {padding-bottom: 0}

body>.wrapper>header .fader p.slide-button {position: absolute; bottom: 0}
body>.wrapper>header .fader p.slide-button .button {margin-left: 111px; transform: translateX(-50%)}

@media (max-width: 959px) {
    body>.wrapper>header .fader ul>li .desc>div {top: 140px; height: 208px}
}


/*
 * Subheader section
 */
section.subheader {padding: 0; background: #396487; color: #fff; font: 400 14px/1.4 "Square721BT", sans-serif}
section.subheader.columns {background-color: #f5f5f5; color: #888888}
section.subheader.columns .grid:after {content: ''; clear: both; display: block}
section.subheader.columns .grid>* {float: left; width: 50%; padding: 0}
section.subheader.columns .grid * {padding-right: 0; padding-left: 0}
section.subheader.columns .grid img[style^="float: left"],
section.subheader.columns .grid img[style*="float: left"],
section.subheader.columns .grid img[style^="float: right"],
section.subheader.columns .grid img[style*="float: right"] {margin-right: 10px; margin-left: 10px}
section.subheader.columns .grid img {max-width: 100%; height: auto}
section.subheader.columns p {padding-right: 10px; padding-left: 0}
@media (max-width: 718px) {
    section.subheader.columns p {}
}
section.subheader>div {max-width: 960px; margin: 0 auto; padding: 30px 0 40px; background: transparent url("../images/header_shadow.png") no-repeat 50% 0}
section.subheader>div>* {padding-left: 90px; padding-right: 90px}
section.subheader h3 {padding-bottom: 20px; font: 400 24px/1 "SquareSlab711", "Arial", "Helvetica", sans-serif}
@media (max-width: 959px) {
    section.subheader>div * {padding-left: 10px; padding-right: 10px}
}

section.subheader.breadcrumbs {margin: 0; padding: 0; font: 400 12px/12px "Square721BT", "Arial", "Helvetica", sans-serif}
section.breadcrumbs>nav {width: 960px; margin: 0 auto; padding: 0; background: transparent url("../images/header_shadow.png") no-repeat 50% -5px}
section.breadcrumbs ul:before,
section.breadcrumbs ul:after {content: " "; display: table}
section.breadcrumbs ul:after {clear: both}
section.breadcrumbs ul,
section.breadcrumbs ul>li {list-style: none; margin: 0; padding: 0}
section.breadcrumbs ul>li {float: left; margin-left: 10px; padding: 8px 0}
section.breadcrumbs ul>li:before {content: '\203A'; float: left; padding-right: 10px; color: #a8d7ff; font-family: "Arial", "Helvetica", sans-serif; font-size: 13px; line-height: 10px}
section.breadcrumbs ul>li:first-child:before {display: none}
section.breadcrumbs a {color: #d5d4d4}
section.breadcrumbs ul>li.active a {color: #fff}
@media (max-width: 959px) {
    section.breadcrumbs>nav {width: 100%}
}

/*
 * Content section
 */
section.content {min-height: 250px; background: #fff}
section.content.shadow {background: #fff url("../images/header_shadow.png") no-repeat 50% 0}
section.content h4 {overflow: hidden; margin: 0 0 10px; padding: 7px 0; font: 400 21px/1 "SquareSlab711", "Arial", "Helvetica", sans-serif; text-align: center; text-transform: uppercase}
section.content h5 {padding: 0 0 5px; font: 400 22px/24px "SquareSlab711", sans-serif}
section.content p {font: 400 13px/18px "Square721BT", sans-serif}

section.content .grid-list {list-style: none; margin: -18px 0 0 -18px; padding: 28px 10px 60px}
section.content .grid-list>li {position: relative; float: left; width: 220px; padding: 18px 0 0 18px}
@media (max-width: 959px) {
    section.content .grid-list {text-align: center}
    section.content .grid-list>li {float: none; display: inline-block; text-align: left}
}

section.content .grid-list>li p>a {position: relative; z-index: 1; display: block; color: #555; text-decoration: none}
/*section.content .grid-list>li p>a:before {content: ''; position: absolute; top: 4px; left: 4px; z-index: -2; display: block; width: 100%; height: 100%; background-color: #71a9d7}*/
section.content .grid-list>li .image {position: relative; display: block; overflow: visible}
section.content .grid-list>li .image img {position: relative; z-index: -1; display: block}
section.content .grid-list>li .text {display: block; padding: 20px 0}

section.content .grid-list>li p>a:hover {color: #9c9a9a; text-decoration: none}
section.content .grid-list>li a:hover .image {position: relative; background: rgba(44, 76, 104, .65)}
section.content .grid-list>li a:hover .image:before {content: ""; position: absolute; z-index: 9; top: 0; right: 0; bottom: 0; left: 0; background: transparent url("../images/bg_gradient_dark.png") repeat}
section.content .grid-list>li a:hover .image:after {content: ""; position: absolute; z-index: 9; top: 50%; left: 50%; width: 78px; height: 88px; margin: -44px 0 0 -39px; background: transparent url("../images/box_plus_medium.png") no-repeat}
section.content .grid-list>li a:hover .button {background: #fff; text-decoration: none}

section.content article {position: relative; min-height: 425px; padding: 16px 10px 35px 250px}
section.content article.full-width {padding: 16px 10px 35px 10px}
section.content article p {padding-bottom: 18px; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto}
section.content article hr {clear: both; margin: 0 0 22px}
section.content article .image {float: left; margin: 0 20px 8px 0; padding: 0}
section.content article .status {margin: 0 0 10px; padding: 0; background: #d4eba4; color: #5b6644; font: 400 14px/40px "Square721BT", "Arial", "Helvetica", sans-serif; text-align: center}
section.content article .status>span {position: relative; padding-left: 40px}
section.content article .status>span:before {content: ''; position: absolute; left: 0; top: -8px; width: 35px; height: 35px; background: transparent url("../images/icons_35x35.png") no-repeat}
section.content article ul {overflow: visible; list-style: none; margin: 0; padding: 8px 0 24px}
section.content article .tabs {overflow: hidden; clear: both; padding: 0}
section.content article .tabs li {list-style: none; margin: 0; padding: 0 0 0 6px}
section.content article .tabs li:first-child {padding: 0}
section.content article li {margin: 0; line-height: 1}
section.content article>ul li {list-style: none; margin-left: 20px; padding: 7px 15px 7px 10px; line-height: 1.3}
section.content article ol li {padding: 7px 10px; line-height: 1.3}
section.content article li[class] {overflow: visible; list-style: inherit}

@media (max-width: 959px) {
    section.content article .tabs {overflow-x: auto; white-space: nowrap}
    section.content article .tabs li {float: none; display: inline-block; vertical-align: top}
}

section.content .user-content>ul li {position: relative}
section.content .user-content>ul li:before {content: "-"; position: absolute; left: -15px}
section.content .user-content>*>li:nth-child(2n+1) {background: #e0dfdf}
section.content .user-content>p>img,
section.content .user-content>img {float: left; padding: 10px 20px 10px 10px}
@media (max-width: 959px) {
    .table-container {overflow-x: scroll}
}

section.content article li.odd {background: #e0dfdf}

section.content article aside {position: absolute; top: 16px; bottom: 35px; left: 10px; width: 220px; padding-right: 10px; padding-bottom: 50px; border-right: 1px solid #e2e2e2}
section.content article aside ul,
section.content article aside li {position: relative; list-style: none; margin: 0; padding: 0; border-top: 1px solid #c5c4c4}
section.content article aside>ul {padding-bottom: 25px !important}
section.content article aside li>ul>li>a {padding-left: 30px}
section.content article aside li>ul>li:before {content: '-'; position: absolute; top: 17px; left: 10px; display: block; padding: 0 5px 0 10px; transform: translateY(-50%)}
/*section.content article aside li>ul>li:hover:before {display: none}*/
section.content article aside li>ul {border-top: 1px solid #c5c4c4}
section.content article aside li:first-child {border-top: 0}
section.content article aside li>a {position: relative; display: block; padding: 10px; color: #555; line-height: 17px}
section.content article aside li.active>a,
section.content article aside li>a:hover {color: #555555; text-decoration: none}
section.content article aside ul>li>ul>li>ul>li a {padding-left: 45px}
section.content article aside ul>li>ul>li>ul>li:before {left: 25px}

section.content article aside ul>li>ul>li.active>a:after,
section.content article aside ul>li>ul>li>a:hover:after {content: ""; position: absolute; top: 50%; left: 0px; width: 9px;  height: 33px; background: #497aa3; transform: translateY(-50%)}
section.content article aside ul>li>ul>li.active>a:before,
section.content article aside ul>li>ul>li>a:hover:before {content: ""; position: absolute; top: 50%; left: 9px; width: 0px; height: 0; transform: translateY(-50%); border-style: solid; border-width: 6.5px 0 6.5px 4px; border-color: transparent transparent transparent #497aa3}

section.content article header {overflow: hidden}
section.content article header h2 {padding: 20px 15px; color: #396487; font: 400 24px/1 "Square721BT", "Arial", "Helvetica", sans-serif; text-transform: uppercase}
section.content article header h2.image-below {float: left; padding-bottom: 10px}
section.content article header h2.image-below>img {display: block; vertical-align: middle; margin: 10px auto 0}
section.content article header h3,
section.content .departments article .title h3 {position: relative; overflow: visible; margin-bottom: 14px; padding: 43px 0 0 80px; border-bottom: 4px solid #dad7d7; color: #959595; font: 400 24px/40px "SquareSlab711", "Arial", "Helvetica", sans-serif}
section.content article header h3:before,
section.content .departments article .title h3:before {content: ""; position: absolute; left: 0; bottom: -4px; width: 60px; height: 60px; margin: 0 20px 0 0; background: transparent url("../images/icon_address.jpg") no-repeat}
section.content article header h3.no-icon,
section.content .departments article .title h3.no-icon {padding-left: 0}
section.content article header h3.no-icon:before,
section.content .departments article .title h3.no-icon:before {display: none}
section.content article header>.print {clear: both; position: relative; padding: 8px 0 12px; font: 400 11px/18px "Square721BT", "Arial", "Helvetica", sans-serif; text-align: right}
section.content article header>.print:before {content: ""; position: absolute; top: 16px; right: 0; left: 0; height: 2px; background: #c5c4c4}
section.content article header>.print a {position: relative; overflow: hidden; display: inline-block; max-width: 90%; height: 18px; padding-left: 35px; background: #fff url("../images/icons_18x18.png") no-repeat 13px 0; text-overflow: clip; text-transform: uppercase; white-space: nowrap}
@media (max-width: 959px) {
    section.content article header>.print {margin-bottom: 20px}
    section.content article header>.print a {display: none}
}
section.content article header>.print a
section.content article header>p {font-size: 14px; font-weight: 700}
section.content article header>.slider.inline {margin: 0; padding: 0}
section.content article header>.slider.inline ul {padding: 0 0 4px}

section.content article header.columns {margin-bottom: 20px; padding: 20px 0 0}
section.content article header.columns h2 {float: left; width: 50%; padding: 0 50px 0 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box}
section.content article header.columns p {font-weight: 400; font-size: 13px}
section.content article header.columns p {font-weight: 400; font-size: 13px}

section.content article .attachment,
section.content article .attachment li {list-style: none; margin: 0; padding: 0}
section.content article .attachment {padding: 10px 0}
section.content article .attachment li {height: 35px; margin-bottom: 12px; padding-left: 30px; background: transparent url("../images/icons_35x35.png") no-repeat 0 -70px; color: #868484; font-size: 12px; line-height: 35px}
section.content article .attachment a.button {margin-left: 5px; padding: 0 13px; border-radius: 3px; color: #868484; font-size: 12px; line-height: 20px; text-transform: uppercase}

section.content article .slider.inline {margin-top: 40px; padding: 0 0 20px}
section.content article .slider.inline li {float: left; margin: 0 13px; padding: 0}

@media (max-width: 959px) {
    section.content article {padding-left: 10px}
    section.content article aside {display: none}

    section.content article .slider.inline {white-space: nowrap}
    section.content article .slider.inline ul {overflow-x: scroll}
    section.content article .slider.inline li {float: none; display: inline-block; margin: 0 11px; white-space: normal}
    .js section.content article .slider > ul {width: auto}
}
@media (max-width: 719px) {
    section.content article header.columns h2,
    section.content article header.columns .teasers {width: 100%}
    section.content article header.columns .teasers {padding-top: 20px}
}

section.content .zoom-gallery {float: left; margin: 0 20px 8px 0; padding: 0 0 18px}
section.content .zoom-gallery ul {padding: 6px 0 0}
section.content .zoom-gallery ul:before,
section.content .zoom-gallery ul:after {content: " "; display: table}
section.content .zoom-gallery ul:after {clear: both}
section.content .zoom-gallery li {float: left; padding: 0 0 0 8px}
section.content .zoom-gallery li:first-child {padding: 0}
section.content .zoom-gallery .tooltip span.tooltip-title {bottom: 152px; left: 166px}
section.content .zoom-gallery .tooltip span.tooltip-title>span {display: block; max-width: 130px; max-height: 100px; overflow: hidden}
section.content .zoom-gallery p>img {position: relative; display: block; margin: auto; border-width: 0}
section.content .subpage.under {clear: both}

section.content .box-list,
section.content .box-list li {list-style: none; margin: 0; padding: 0}
section.content .box-list li {position: relative; float: left; width: 100%; max-width: 325px; padding-bottom: 35px}
section.content .box-list li.odd {padding-right: 48px; background: none}
section.content .box-list li a {position: relative; z-index: 1; display: block; color: #555; font: 400 12px/1.3 "Square721BT", sans-serif}
section.content .box-list li a:before,
section.content .box-list li a:after {content: " "; display: table}
section.content .box-list li a:after {clear: both}
section.content .box-list li .image {float: left; margin-right: 8px}
section.content .box-list li .image img {position: relative; z-index: -1}
section.content .box-list li .text {display: block; max-height: 98px; line-height: 16px; text-align: center; box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box}
section.content .box-list li .button {position: absolute; bottom: 8px; border-radius: 3px; left: 168px; display: inline-block; line-height: 20px}
section.content .box-list li .title {position: relative; z-index: 10; overflow: visible; display: block; max-height: 84px; margin-left: 160px; margin-bottom: 10px; padding: 8px 4px 8px 0; background: #396487; color: #fff; font-size: 18px; text-transform: uppercase}
section.content .box-list li .title:before {content: ""; position: absolute; top: 50%; left: -31px; width: 0; height: 0; margin: -16px 0 0 0; border: 16px solid transparent; border-right-color: #396487}
section.content .box-list li .title>strong {position: relative; display: block; overflow: hidden; max-height: 66px; font-weight: 400; text-align: center}
section.content .box-list li .title span {display: block; padding-top: 4px; color: #dad7d7; font-size: 13px; text-transform: none}
section.content .box-list li a:hover {color: #9a9999; text-decoration: none}
section.content .box-list li a:hover .image {position: relative; background: rgba(44, 76, 104, .65)}
section.content .box-list li a:hover .image:before {content: ""; position: absolute; z-index: 9; top: 0; right: 0; bottom: 0; left: 0; background: transparent url("../images/bg_gradient_dark.png") repeat}
section.content .box-list li a:hover .image:after {content: ""; position: absolute; z-index: 9; top: 50%; left: 50%; width: 78px; height: 88px; margin: -44px 0 0 -39px; background: transparent url("../images/box_plus_medium.png") no-repeat}
section.content .box-list li a:hover .button {background: #fff; text-decoration: none}
@media (max-width: 959px) {
    section.content .box-list li a {padding-bottom: 35px}
    section.content .box-list li .title,
    section.content .box-list li .title>strong {max-height: none}
}

section.content .button-list {overflow: visible; margin: 0 0 0 -20px; padding: 0 0 20px}
section.content .button-list:before,
section.content .button-list:after {content: " "; display: table}
section.content .button-list:after {clear: both}
section.content .button-list>li {position: relative; z-index: 1; float: left; margin: 0 0 20px 20px; padding: 0; border: 1px solid #c6c4c4; box-shadow: 1px 1px 8px #ccc}
section.content .button-list>li>a {position: relative; display: block; overflow: hidden; width: 218px; height: 156px; text-decoration: none; -webkit-transition: background 300ms ease-out; -moz-transition: background 300ms ease-out; -o-transition: background 300ms ease-out; transition: background 300ms ease-out}
section.content .button-list>li>a>img {position: relative; z-index: -1; width: 100%; height: 100%}
section.content .button-list>li>a>span {position: absolute; z-index: 12; top: 10px; right: 6px; bottom: 10px; left: 6px; display: none; overflow: hidden; color: #fff; font: 400 13px/16px "Square721BT", sans-serif; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto}
section.content .button-list>li>a:hover {background: rgba(44, 76, 104, .89)}
section.content .button-list>li>a:hover>span {display: block}

section.content article footer {clear: both; padding-top: 24px}
section.content article footer h3 {position: relative; padding: 0 0 12px; text-align: center; white-space: nowrap}
section.content article footer h3:before {content: ""; position: absolute; top: 20px; right: 0; left: 0; height: 1px; background: #ebe7e7}
section.content article footer h3>span {position: relative; overflow: visible; padding: 0 10px; background: #fff; padding: 0 15px; font: 400 24px/38px "SquareSlab711", "Arial", "Helvetica", sans-serif}
section.content article footer ul,
section.content article footer li {list-style: none; margin: 0; padding: 0}
section.content article footer li {display: inline-block; margin: 0 0 0 15px !important; vertical-align: middle}
section.content article footer ul {margin-left: -15px !important}
section.content article footer li>a {position: relative; display: block; width: 220px; padding: 7px 0; background: #396487; color: #fff; font: 400 24px/1 "SquareSlab711", "Arial", "Helvetica", sans-serif; text-align: center; text-transform: uppercase}
section.content article footer li>a:hover {background-image: url("../images/bg_gradient_medium.png"); background-repeat: repeat; text-decoration: none}
section.content article footer li>a:hover:before {content: ""; position: absolute; top: 50%; left: 0; width: 0; height: 0; margin: -8px 0 0; border: 8px solid transparent; border-left-color: #fff}

@media (max-width: 959px) {
    section.content .button-list {text-align: center}
    section.content .button-list>li {float: none; display: inline-block; margin-left: 17px}
    section.content .button-list>li .title {text-align: left}
}
@media (min-width: 720px) and (max-width: 959px) {
    section.content article {width: 700px; margin: 0 auto}
}
@media (max-width: 719px) {
    section.content .box-list {text-align: center}
    section.content .box-list li {float: none; display: inline-block; width: 100%; vertical-align: top}
    section.content .box-list li.odd {padding-right: 0}
    section.content .box-list li .title {font-size: 16px; text-align: left}

    section.content article footer {text-align: center}
    section.content article footer li {display: block}
    section.content article footer li + li {margin-top: 15px !important}
    section.content article footer li>a {margin: 0 auto}
}


/*
 * Footer section
 */
body>.wrapper>footer {padding: 10px 0 17px; border-top: 1px solid #c9c9ca}
body>.wrapper>footer {
    background: #dfdfdf;
    background: -moz-linear-gradient(top, #dfdfdf 0%, #dfdfdf 9%, #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dfdfdf), color-stop(9%,#dfdfdf), color-stop(100%,#ffffff));
    background: -webkit-linear-gradient(top, #dfdfdf 0%,#dfdfdf 9%,#ffffff 100%);
    background: -o-linear-gradient(top, #dfdfdf 0%,#dfdfdf 9%,#ffffff 100%);
    background: -ms-linear-gradient(top, #dfdfdf 0%,#dfdfdf 9%,#ffffff 100%);
    background: linear-gradient(to bottom, #dfdfdf 0%,#dfdfdf 9%,#ffffff 100%);
}
body>.wrapper>footer p {margin: 0; padding: 0 !important; color: #888; font: 11px "Arial", "Helvetica", sans-serif}
body>.wrapper>footer ul,
body>.wrapper>footer li {list-style: none; margin: 0; padding: 0}
body>.wrapper>footer ul {margin: 0 0 8px; padding: 0 0 8px 44px; border-bottom: 1px solid #c9c9ca}
body>.wrapper>footer ul:before,
body>.wrapper>footer ul:after {content: " "; display: table}
body>.wrapper>footer ul:after {clear: both}
body>.wrapper>footer li[class],
body>.wrapper>footer li {position: relative; float: left; margin-left: 8px; padding-left: 11px}
body>.wrapper>footer li:before {content: ""; position: absolute; left: 0; top: 50%; width: 1px; height: 15px; margin-top: -7px; background: #c9c9ca}
body>.wrapper>footer li:first-child {margin: 0; padding-left: 50px}
body>.wrapper>footer li:first-child:before {display: none}
body>.wrapper>footer li>a {color: #888; font: 11px "Arial", "Helvetica", sans-serif; text-transform: uppercase}
body>.wrapper>footer a:hover {text-decoration: underline}
body>.wrapper>footer .column-left {float: left; padding-left: 10px}
body>.wrapper>footer .column-left img {margin-right: 10px; vertical-align: -15px}
body>.wrapper>footer .column-right {float: right; padding-right: 10px}
body>.wrapper>footer .column-right p {text-align: right; line-height: 1.1}

@media (max-width: 719px) {
    body>.wrapper>footer ul {margin-left: 0; padding-left: 0}
    body>.wrapper>footer li:first-child {padding-left: 0}
    body>.wrapper>footer .column-left,
    body>.wrapper>footer .column-right {float: none}
    body>.wrapper>footer .column-right {margin-top: 20px; padding-left: 10px}
    body>.wrapper>footer .column-right p {text-align: left}
}


@-moz-document url-prefix() {
    span.file-input input[type="file"] {display: none}
}


/*
* Cookies module
*/
.popup-content.info {background: #444; color: #c9c9c9}
.popup-content.info a {color: #62a3c4; text-decoration: none; font-weight: 700}
.sliding-popup-top {background: #444}
#sliding-popup .popup-content {width: 100%}
#sliding-popup .popup-content.info #popup-text h2,
#sliding-popup .popup-content.info #popup-text p,
#sliding-popup .popup-content.info #popup-text a {font-weight: 400; font-size: 11px}
#sliding-popup .popup-content.info #popup-text {float: none; max-width: 940px; margin: 8px auto; height: auto}
#sliding-popup .popup-content.info #popup-text p {padding: 0 45px 0 10px}
#sliding-popup .popup-content #popup-buttons {position: absolute; top: 4px; right: 16px; margin: 0}
#popup-buttons a {display: inline-block; width: 23px; height: 23px; background: transparent url("../images/close.png") no-repeat 0 0; text-indent: -99999em}


@media (max-width: 959px) {
    .magnifyarea {display: none !important}
    .magnifycursor {cursor: default}
}

/*
* Banner
*/
.banner {position: relative; display: block; width: 100%; height: 485px; max-width: 1500px; margin: 0 auto; background-size: cover; background-position: center; text-align: right}
.banner.small {height: 207px}
.banner p {position: absolute; bottom: 0; right: 0; display: block; padding: 45px 275px 38px 135px; background-image: url('../images/bg_gradient_dark.png'); background-color: rgba(0,0,0,.55); color: #fff; font-family: 'SquareSlab711', sans-serif; font-size: 18px}

@media (max-width: 959px) {
    .banner p {padding: 20px 120px 20px 120px}
    .banner.small {height: auto}
    .banner.small p {position: relative; top: 0; left: 0; margin-top: 135px}
}

@media (max-width: 719px) {
    .banner {text-align: center}
    .banner p {padding: 20px}
}

/*
* Cycle
*/
.cycle {border-top: 1px solid #c9c9ca; background: #fff}
.cycle ul {overflow: hidden; display: block; width: 100%; height: 80px; padding: 0; table-layout: fixed; text-align: center}
.cycle ul li {position: relative; float: left; display: inline-block; width: 25%; height: 80px; vertical-align: middle}
.cycle ul li img {position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: block; width: 100%; max-width: 100px}

@media (max-width: 719px) {
    .cycle ul {height: 160px}
    .cycle ul li {width: 50%}
}
/*
* Recommended
*/

section.content article .recommended {clear: both; padding-top: 24px}
section.content article .recommended h3 {position: relative; padding: 0 0 12px; text-align: center; white-space: nowrap}
section.content article .recommended h3:before {content: ""; position: absolute; top: 20px; right: 0; left: 0; height: 1px; background: #ebe7e7}
section.content article .recommended h3>span {position: relative; overflow: visible; padding: 0 10px; background: #fff; padding: 0 15px; font: 400 24px/38px "SquareSlab711", "Arial", "Helvetica", sans-serif}
section.content article .recommended ul,
section.content article .recommended li {list-style: none; margin: 0; padding: 0}
section.content article .recommended li {display: inline-block; margin: 0 0 0 15px !important; vertical-align: middle}
section.content article .recommended ul {margin-left: -15px !important}
section.content article .recommended li>a {position: relative; display: block; width: 220px; color: #396487; font: 400 24px/1 "SquareSlab711", "Arial", "Helvetica", sans-serif; text-align: left}
section.content article .recommended li>a:hover {text-decoration: none}
section.content article .recommended li>a span {font: 600 14px/18px "Square721BT", sans-serif}
section.content article .recommended li>a:hover .image {position: relative}
section.content article .recommended li>a:hover .image:before {content: ""; position: absolute; z-index: 9; top: 0; right: 0; bottom: 0; left: 0; background: rgba(44, 76, 104, .65) url("../images/bg_gradient_dark.png") repeat}
section.content article .recommended li>a:hover .image:after {content: ""; position: absolute; z-index: 9; top: 50%; left: 50%; width: 78px; height: 88px; margin: -44px 0 0 -39px; background: transparent url("../images/box_plus_medium.png") no-repeat}

@media (max-width: 719px) {
    section.content article .recommended li {display: block; text-align: center}
    section.content article .recommended li>a {display: inline-block; margin-bottom: 10px; text-align: center}
}


/*
 * The End
 */
