html, body
{
    margin:0;
    padding:0;
    border:0;
    font-family: 'Lato', sans-serif;
    font-weight: bold;
    letter-spacing: 1px;
}

.header-padding
{
    height:120px;
    transition: all .5s ease-in-out;
}

.header-padding.sticky
{
    height:50px;
}

.header
{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:99;
    height:120px;
    width:100%;
    background-color:#1f497d;
    letter-spacing: normal;
    transition: all .5s ease-in-out;
}

.header.sticky
{
    height:50px;
}

.header.sticky .logo-container
{
    height:50px;
}

.header.sticky .logo-container .logo
{
    height:50px;
    width:0px;
}

.header.sticky .logo-container .site-name
{
    font-size:18px;
    margin-left:0px;
    padding-top:10px;
    width:400px;
}

.header.sticky .navigation
{
    margin-top:5px;
}

.footer
{
    height:auto;
    min-height:30px;
    background-color:#1f497d;
    text-align: center;
    color:#FFF;
    font-weight:normal;
    font-size:14px;
    padding-top:10px;
}

.top-slider img
{
    height:auto;
    width:100%;
}

.top-slider
{
    max-height:600px;
    overflow:hidden;
}

.rowContent
{
    height:auto;
    width:100%;
    max-width:1200px;
    margin: auto;
    padding:0px 20px 0px 20px;
    box-sizing: border-box;
}

.rowContent.border-bottom
{
    border-bottom:1px solid #1f497d;
}

.header .logo-container
{
    height:120px;
    width:300px;
    float:left;
    transition: all .5s ease-in-out;
}

.header .site-name
{
    float:left;
    font-size:26px;
    width:200px;
    color:#FFF;
    margin-left:20px;
    padding-top:10px;
}

.header .logo
{
    height:120px;
    width:80px;
    background-image:url(../content/logo.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
    float:left;
}

.navigation
{
    float:right;
    height:40px;
    margin-top:35px;
    width:620px;
    text-align:right;
    transition: all .5s ease-in-out;
}

.navigation a
{
    text-decoration: none;
    color: inherit;
}

.navigation a.active span
{
    border: 2px solid #FFF;
}

.navigation a:hover span
{
    background-color:rgba(255,255,255,0.1);
}

.navigation span
{
    color:#FFF;
    display:inline-block;
    height:40px;
    padding:5px 10px 5px 10px;
    font-weight: normal;
    font-size:24px;
    line-height:25px;
    border: 2px solid transparent;
    border-radius: 2px;
    box-sizing: border-box;
    transition: all .5s ease-in-out;
}

.section
{
    position:relative;
    padding-top:40px;
    padding-bottom:50px;
}

.section-title
{
    position:absolute;
    top:-20px;
    height:40px;
    width:100%;
    text-align: center;
    z-index:9;
}

.section-title span
{
    font-size:30px;
    line-height: 40px;
    padding:10px 15px 10px 15px;
    color:#FFF;
    background-color: #1f497d;
    text-align: center;
}

.section-text
{
    color: #1f497d;
    font-size:18px;
    line-height: 24px;
}

.vacancy-text
{
    color: #1f497d;
    font-size:18px;
    box-sizing: border-box;
    padding-right:25%;
    position:relative;
}

.vacancy-text .question-mark
{
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    width:25%;
    height:100%;
    display: table;

}

.vacancy-text .question-mark span
{
    display: table-cell;
    vertical-align: middle;
    font-size:200px;
    text-align: center;
}

.section-text h2
{
    font-weight: bolder;
    font-size:24px;
}

.section-text h3
{
    font-size:28px;
    font-weight: bold;
}

.vacancy-text h3
{
    font-size:28px;
    font-weight: bold;
}

.vacancy-text h3:before
{
    content:'\f192\ ';
    font-family: 'FontAwesome';
    font-weight: normal;
}

.vacancy-text h3:last-child:before
{
    content: '';
}

.google-maps
{
    width:100%;
    height:500px;
}

.contact-container
{
    height:auto;
    overflow: auto;
}

.contact-container .column
{
    width:calc(50% - 10px);
    height:auto;
    float:left;
}

.contact-container .column:last-child
{
    margin-left:20px;
}

.contact-container .column .title
{
    width:100%;
    border-bottom:1px solid #1f497d;
    color: #1f497d;
    font-size:32px;
    box-sizing: border-box;
    padding:5px 20px 10px 20px;
}

.user-details
{
    padding:20px 20px 0px 20px;
    color: #1f497d;
}

.user-details .name
{
    font-size:24px;
}

.user-details .name:before
{
    content: '\f21d\ ';
    font-family: 'FontAwesome';
}

.user-details .role
{
    padding-left:28px;
    padding-top:4px;
    font-size:16px;
}

.user-details .address-top, .user-details .address-line
{
    font-size:18px;
    padding-left: 28px;
    padding-top:4px;
}

.user-details .address-top:before
{
    content: '\f041\ ';
    font-family: 'FontAwesome';
}

.user-details .address-line
{
    padding-left: 44px;
}

.user-details .telephone, .user-details .email
{
    font-size:18px;
    padding-left:24px;
    padding-top:4px;
}

.user-details .telephone:before
{
    content: '\f095\ ';
    font-family: 'FontAwesome';
}

.user-details .email:before
{
    content: '\f003\ ';
    font-family: 'FontAwesome';
    font-size:16px;
}

.contact-form
{
    padding:20px 20px 0px 20px;
}

.contact-form input, .contact-form textarea
{
    height:42px;
    box-sizing: border-box;
    border:2px solid #1f497d;
    display: block;
    font-size:16px;
    font-family: 'Lato';
    font-weight: normal;
    color: #1f497d;
    padding-left:10px;
    outline: none;
}

.contact-form input
{
    line-height: 38px;
}

::-webkit-input-placeholder {color: #1f497d;}
::-moz-placeholder {color: #1f497d;}
:-ms-input-placeholder {color: #1f497d;}
::-ms-input-placeholder {color: #1f497d;}
:-moz-placeholder {color: #1f497d;}
::-moz-placeholder {color: #1f497d;}

.contact-form .half-field
{
    width:calc(50% - 8px);
    float:left;
}

.contact-form .half-field:last-child
{
    margin-left:16px;
}

.contact-form .full-field
{
    width:100%;
}

.contact-form .full-field.textarea
{
    height:200px;
    min-height:150px;
    min-width:100%;
    max-width:100%;
    padding-top:8px;
}

.contact-form input[type="submit"]
{
    background-color: #1f497d;
    color:#FFF;
    text-align: center;
    width:100%;
}

.contact-form .row
{
    min-height:42px;
    margin-bottom:16px;
}

.no-news
{
    height:200px;
    box-sizing: border-box;
    padding-top:50px;
    text-align: center;
}

.news-item
{
    height:auto;
    overflow:auto;
    clear:both;
    position:relative;
    min-height:150px;
    width:100%;
    padding-left:140px;
    box-sizing: border-box;
    border: 1px solid #1f497d;
    transition: all .5s ease-in-out;
    margin-top:10px;
    margin-bottom:10px;
}

.section-text img
{
    display:block;
    box-sizing: border-box;
    border:5px solid #1f497d;
    width:25% !important;
    margin-left:20px;
    margin-bottom:5px;
}

.news-item.small .read-more:hover
{
    cursor: pointer;
}

.news-item.small .read-more:hover:before
{
    color: #FFF;
}

.news-item.small .read-more:hover ~ .read-more-fill
{
    width:140px;
}

.news-item .button
{
    position:absolute;
    height:100%;
    width:120px;
    background-color: #1f497d;
    color: #FFF;
    top:0;
    bottom:0;
    left:0;
    transition: all .5s ease-in-out;
}

.news-item.large
{
    padding-left:30px;
}

.news-item.large .button
{
    width:10px;
}

.news-item.large .button span
{
    opacity: 0;
}

.news-item .button span
{
    height:20px;
    position:absolute;
    width:100%;
    top:0;
    bottom:0;
    margin:auto;
    opacity: 1;
    text-align: center;
    transition: all .5s ease-in-out;
}

.news-item.large .news-container
{
    width:calc(100% - 120px);
}

.news-item .news-container
{
    height:auto;
    width:calc(100% - 140px);
    transition: all .5s ease-in-out;
    color: #1f497d;
}

.news-item .read-more
{
    position:absolute;
    height:100%;
    width:140px;
    top:0;
    bottom:0;
    right:0;
    z-index:2;
    transition: all .5s ease-in-out;
}

.news-item.large .read-more
{
    width:100px;
}

.news-item.large .read-more:before
{
    content: '\f062';
    color: #FFF;
    font-family: 'FontAwesome';
    font-size:20px;
}

.news-item .read-more:before 
{
    content: 'Read More';
    position: absolute;
    height:20px;
    width:100%;
    top:0;
    bottom:0;
    margin:auto;
    color: #1f497d;
    text-align: center;
    transition: all .5s ease-in-out;
}

.news-item.large .read-more-fill
{
    width:100px;
}

.news-item .read-more-fill
{
    position:absolute;
    height:100%;
    width:10px;
    top:0;
    bottom:0;
    right:0;
    background-color: #1f497d;
    z-index: 1;
    transition: all .5s ease-in-out;
}

.news-item .news-title
{
    font-size:30px;
    padding-top:14px;
    color: #1f497d;
}

.news-item .small-description
{
    height:auto;
    overflow:hidden;
    font-size:18px;
    padding-top:8px;
    color: #1f497d;
    padding-bottom:10px;
    transition: all .5s ease-in-out;
}

.news-item .image
{
    height:auto;
    overflow:hidden;
    max-height:0px;
    width:calc(100% + 40px);
    transition: all .5s ease-in-out;
    margin-left:-20px;
    margin-right:-20px;
    display:block;
}

.news-item.large .image
{
    max-height:800px;
}

.news-item .large-description, .news-item .date-posted, .news-item .document, .news-item .document-title
{
    max-height: 0px;
    opacity: 0;
    transition: all .5s ease-in-out;
    overflow: hidden;
}

.news-item.large .large-description, .news-item.large .date-posted, .news-item.large .document, .news-item.large .document-title
{
    opacity: 1;
    max-height: none;
}

.news-item.large .small-description
{
    opacity: 0;
    max-height:0px;
    padding:0;
}

.news-item.large .document-title
{
    font-size:14px;
    margin-bottom:5px;
}

.news-item.large .document
{
    margin-bottom:20px;
}

.news-item.large .document:before
{
    content: '\f019\ ';
    font-family: 'FontAwesome';
}

.news-item a
{
    text-decoration: none;
    color:inherit;
}

.news-item a:hover
{
    text-decoration: underline;
}

/* Responsive */
@media screen and (max-width: 1080px)
{
    .header .navigation {width: 480px; margin-top:45px;}
    .header .navigation span {padding:5px; font-size:20px; line-height:20px; height:34px;}
}

@media screen and (max-width: 930px)
{
    /* Disable Sticky Header */
    .header {position:relative;}
    .header-padding {height:0;}
    .header-padding.sticky {height:0;}
    .header.sticky {height:120px;}
    .header.sticky .logo-container {width:300px; height:120px;}
    .header.sticky .logo-container .site-name {width:200px; margin-left:20px;}
    .header.sticky .navigation {margin-top:45px;}
    .header.sticky .logo-container .site-name {font-size:24px;}
    .header.sticky .logo-container .logo {width:80px; height:120px;}
}

@media screen and (max-width: 880px)
{
    .header .logo-container .logo {width:0px;}
    .header.sticky .logo-container .logo {width:0px;}
    .header .logo-container, .header.sticky .logo-container {width:200px;}
    .header .logo-container .site-name, .header.sticky .logo-container .site-name {margin-left:0px;}
}

@media screen and (max-width: 850px)
{
    .header {transition:none;}
    .header .navigation {transition:none;}

    .section-title.location span {visibility: hidden; text-align: center;}
    .section-title.location span:after {content: 'Location'; visibility: visible; position:absolute; height:40px; background-color: #1f497d; font-size:30px; line-height:40px; padding:10px 15px 10px 15px;
    color: #fff; text-align: center; margin:auto; display: block; top:0;
    left: 50%; width:123px; margin-left:-76px;}

    .news-item {padding-left:100px;}
    .news-item .button {width:80px;}
    .news-item .button span {font-size:14px;}
    .news-item .read-more {width:80px;}
    .news-item .read-more:before {height:40px;}
    .news-item.small .read-more:hover ~ .read-more-fill {width:80px;}
    .news-item .news-container {width: calc(100% - 80px);}
    .news-item.large .news-container {width: calc(100% - 100px);}
    .news-item .news-title {font-size:26px;}
    .news-item.large .read-more {width:80px;}
    .news-item.large .read-more-fill {width:80px;}
    .news-item.large .date-posted {font-size:12px;}
    .news-item.large .large-description {font-size:14px;}
    .news-item.large .document-title {font-size:12px;}
    .news-item .small-description {font-size:15px;}
    
}

@media screen and (max-width: 820px)
{
    /* Contact */
    .contact-container .column {width:100%; float:none; margin-bottom:20px;}
    .contact-container .column:last-child {margin-left:0;}
}

@media screen and (max-width: 760px)
{
    .header .navigation {display:none;}
}

@media screen and (max-width: 680px)
{
    .footer span {display:block;width:100%; text-align: center; height:30px; line-height:normal; height:auto;}
    .news-item .news-title {font-size:20px;}
    .footer span:nth-child(2) {display:none;}
}

@media screen and (max-width: 600px)
{
    .vacancy-text .question-mark {display:none;}
    .vacancy-text {font-size:16px; padding-right:0;}
}

@media screen and (max-width: 530px)
{
    .news-item .button {height:5px; width:100%;}
    .news-item .button span {display:none;}
    .news-item .read-more {height:40px; width:100%; bottom:0; top: initial; z-index:2;}
    .news-item .read-more:before {height:40px; line-height: 40px;}
    .news-item .read-more-fill {height:5px; width:100%; bottom:0; top: initial; z-index:1;}
    .news-item .news-container { width:calc(100% - 20px);}
    .news-item {padding-left:20px; padding-top:5px; padding-bottom:40px;}
    .news-item.small .read-more:hover ~ .read-more-fill {width:100%; height:40px;}
    .news-item.large .button {width:100%;}
    .news-item.large .read-more {height:0px; width:100%;}
    .news-item.large .read-more:before {display:none;}
    .news-item.large .read-more-fill {height:5px; width:100%;}
    .news-item.large {padding-left:10px; padding-bottom:10px;}
    .news-item.large .news-container {width:calc(100% - 10px);}
    .news-item.large .image {margin-left:-10px; margin-right:-10px; width:calc(100% + 20px); display:block;}
}

@media screen and (max-width: 430px)
{
    .contact-container .column .title {padding-left:0; padding-right:0;}
    .user-details {padding-left:0; padding-right:0;}
    .user-details .name {font-size:20px;}
    .user-details .role {font-size:12px;}
    .user-details .address-top, .user-details .address-line, .user-details .telephone, .user-details .email {font-size:14px;}
    .user-details .address-line {padding-left:42px;}
    .contact-form {padding-left:0;padding-right:0;}

    .section-text {font-size:14px;}
    .section-text h2 {font-size:20px;}
    .vacancy-text {font-size:14px;}
    .vacancy-text h3 {font-size:22px;}
}