﻿body {
    font-family: 'Open sans', Arial, Helvetica, sans-serif;
    font-size: 0.8rem;
}

main {
    word-break: break-word;
}

.container {
    max-width: 1200px;
}

.center-col{
    max-width:775px;
}

@media (min-width: 1200px) {
    .container {
        max-width: 1200px;
    }
}

.left-col  {
    width: 125px;
    min-width: 125px;
}

h3.block-title {
    font-size: 1.2rem;
    line-height: 1.5rem;
}

h4.block-title {
    font-size: 0.95rem;
    line-height: 1.2rem;
}

h2.section-head {
    text-transform: uppercase;
    font-family: Roboto, Arial, Helvetica,sans-serif;
    font-size: 1rem;
}

h1, h2, h3, h4 {
    font-family: Oswald;
    font-weight: 400;
    text-transform: capitalize;
    width: 100%;
    color: #597180;
}



.post-meta li, .post-category li {
    line-height: 1rem;
    font-size: 0.8rem;
    font-family: Roboto, Arial, Helvetica,sans-serif;
}


a {
    color: #657C91;
    text-decoration: none;
    transition: all 500ms;
    transition-property: color, text-decoration;
}

    a:hover {
        color: #193957;
        text-decoration: underline;
    }

.top-row,
.navbar-collapse {
    background: #e0e0e0;
}

.navbar-collapse {
    font-size: 1.3rem;
    font-family: 'Open Sans Condensed','Arial Narrow', Verdana;
    color: #333;
}

.nav.navbar-nav li {
    transition: all 500ms ease;
    transition-property: color, background-color;
}

    .nav.navbar-nav li:hover {
        background-color: #d4d4d4;
        color: #ffffff;
    }

    .nav.navbar-nav li a {
        color: #333;
        text-decoration: none;
    }

        .nav.navbar-nav li a:hover {
            color: #ffffff;
        }

.navbar-toggle {
    display: none;
}

@media(max-width:576px) {
    .navbar-toggle {
        display: inline-block;
    }
}

.form-control {
    border-radius: 0;
}

.search-form .input-group .form-control {
    height: 30px;
    width: 200px;
}

.login-form input:not([type="checkbox"]) {
    vertical-align: middle;
    max-width: 200px;
    height: 30px;
    font-size: 0.8rem;
    line-height: 1.5rem;
}

.social-media a i {
    font-size: 1.5rem;
    color: #aaa;
}

.other-news-listing:not(:last-child) {
    border-bottom: 1px dashed #cfdce6;
    margin-bottom: 0.25rem;
}

.button {
    max-width: 125px;
}


/* no takeover adjustments */
@media(min-width:1024px) {
    .left-col {
        display: block;
    }

    .bottom-buttons,
    
    .bottom-right-col {
        display: none;
    }

    .search-form {
        float: right;
    }
}
@media(max-width:1199px){
    .nav.navbar-nav li {
        font-size: 1.1rem;
        padding: 0.5rem !important;
    }
    .login-form input:not([type="checkbox"]) {
        max-width: 150px;
    }
}

#login-controls {
    flex: 0 0 60%;
    max-width: 60%;
}
#reset-controls{
    flex: 0 0 40%;
    max-width: 40%;
}

@media(max-width:1160px) {
    #login-controls {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .site-takeover #reset-controls {
        flex: 0 0 100%;
        max-width: 100%;
        padding-top: 0.25rem;
    }
}


@media(max-width:1023px) {
    .left-col, .right-col {
        display: none;
    }

    .bottom-buttons {
        display: block;
    }

        .bottom-buttons .button {
            margin-right: 0.5rem;
            display: inline-block;
        }

    .bottom-right-col {
        display: flex;
    }

    .search-form {
        clear: both;
        margin-bottom: 10px !important;
    }
    
}

@media (min-width: 992px) {
    .masthead {
        border-right: none;
    }

    .banner {
        border-left: none;
    }
}

@media (max-width: 991px) {
    .masthead {
        border-right: 1px solid #dee2e6;
        text-align: center;
    }

    .banner {
        border-left: 1px solid #dee2e6;
        text-align: center;
    }
}

@media(max-width:624px){
    .social-media {
        display: block !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0;
    }
}

/* takeover adjustments */

/* takeover */
.site-takeover {
    background-repeat: no-repeat;
    background-position: center top;
    padding: 0;
    background-attachment: fixed;
    cursor: pointer;
}
#takeover-wrapper > * {
    cursor: default;
}
    .site-takeover #takeover-wrapper {
        padding-top: 150px;
    }


    .site-takeover .left-col {
        margin-left: .25rem;
    }
    .site-takeover .right-col {
        margin-right: .25rem;
    }
@media(max-width:1800px) {
    .site-takeover .container {
        max-width: 1080px;
    }
}
@media(max-width:1680px) {
    .site-takeover .container {
        max-width: 936px;
    }
    .site-takeover #login-controls {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .site-takeover #reset-controls {
        flex: 0 0 100%;
        max-width: 100%;
        padding-top:0.25rem;
    }
}

@media(max-width:1536px) {
    .site-takeover .container {
        max-width: 940px;
    }
    .site-takeover .nav.navbar-nav li {
        font-size:1.1rem;
        padding: 0.5rem !important;
    }
}

@media(max-width:1440px) {
    .site-takeover .container {
        max-width: 866px;
    }
}

@media(max-width:1366px) {
    .site-takeover .container {
        max-width: 830px;
    }

    .site-takeover .right-col {
        display: none;
    }

    .site-takeover .bottom-right-col {
        display: flex;
    }

    .site-takeover .search-form {
        clear: both;
        margin-bottom: 10px !important;
    }
}

@media(max-width:1280px) {
    .site-takeover .container {
        max-width: 724px;
    }
}

/* Suppliers Guide */
.supplier-listing.basic{
    background: #efefef;
}

/* Form validation */
.fade-alert {
    color: #fff;
    border-radius: 2px;
    box-shadow: 0 17px 17px rgba(0,0,0,.15), 0 27px 55px rgba(0,0,0,.3);
    font: 18px Roboto,sans-serif;
    margin: 24px;
    max-height: calc(100% - 48px);
    max-width: 800px;
    overflow: auto;
    padding: 18px;
    position: fixed;
    z-index: 10010;
    display: none;
    top: 200px;
}


.fade-alert-danger {
    background: #d9534f;
}

.message-close {
    position: relative;
    top: -15px;
    right: -10px;
    float: right;
    cursor: pointer;
}

#warnings a {
    color: #fff;
    text-decoration: underline;
}

.danger {
    color: #DA3A35;
}

.field-validation-valid {
    display: none;
}

.field-validation-error {
    color: #DA3A35;
    padding: 6px 0;
}

.input-validation-error {
    border-color: #DA3A35;
}

@keyframes shake {
    10%, 90% {
        transform: translate3d(-1px, 0, 0);
    }

    20%, 80% {
        transform: translate3d(2px, 0, 0);
    }

    30%, 50%, 70% {
        transform: translate3d(-4px, 0, 0);
    }

    40%, 60% {
        transform: translate3d(4px, 0, 0);
    }
}

.validation-pointer {
    border: 1px solid #b94a48;
    border-radius: 4px;
    background: #b94a48;
    color: #fff !important;
    padding: 6px;
    width: 200px;
    position: absolute;
    z-index: 2000;
    left: -200px;
    box-shadow: 4px 4px 4px #ccc;
    animation: shake 0.4s ease both;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
}

.validation-arrow-right {
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 8px solid #b94a48;
    position: absolute;
    left: 199px;
}

/* end form validation */

/* suppliers guide */
.supplier-listing img, img.profile-logo {
    max-width:250px;
    max-height:80px;
}

i.contact-icon {
    color: #597180;
}
#social-media .fa-twitter-square {
    color: #00aced;
}

#social-media .fa-facebook-square {
    color: #3b5998;
}

#social-media .fa-linkedin {
    color: #007bb6;
}

#social-media .fa-google-plus-square {
    color: #dd4b39;
}

#social-media .fa-youtube-square {
    color: #bb0000;
}

#social-media .fa-vimeo-square {
    color: #1ab7ea;
}

#social-media .fa-instagram {
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
    background: -webkit-radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
    color: #fff;
    border-radius: 4px;
}
/* end suppliers guide */

/* Diary */
.diary-day {
    background-color: #d32c06;
    color: #fff;
    border: 1px solid #d32c06;
    border-radius: 3px 3px 0 0;
}

.diary-date {
    background-color: #fff;
    color: #000;
    font-weight: bold;
    font-size: 18px;
    border: 1px solid #e8e8e8;
}

.diary-month {
    background-color: #e8e8e8;
    color: #000;
    border: 1px solid #e8e8e8;
    border-radius: 0 0 3px 3px;
}
/* End Diary */

.archive-years li {
    font-size: 1.2rem;
    font-weight: 500;
    font-family: Roboto, Arial, Helvetica,sans-serif;
}
    .archive-years li.active {
        border-bottom: 3px solid #ccc;
    }

.password-eye {
    font-size: 25px;
    padding-top: 5px;
    color: #aaa;
}

#register-modal-cover{
    max-width:120px;
}

.cookie-box {
    border-radius: 2px;
    box-shadow: 0 17px 17px rgba(0,0,0,.15), 0 27px 55px rgba(0,0,0,.3);
    font: 14px/20px Roboto,sans-serif;
    max-height: calc(100% - 48px);
    max-width: calc(100% - 48px);
    position: fixed;
    z-index: 10012;
    right: 60px;
    bottom: 30px;
    transition: opacity 700ms ease; overflow: scroll;
}

.fade {
    pointer-events: none;
    opacity: 0;
}

.cookie-box-contents {
    color: #757575;
}

.cookie-button {
    color: #039be5;
    padding: 8px;
    margin: 0 8px;
    border: 0;
    border-radius: 2px;
    display: inline-block;
    font: 700 16px Roboto,sans-serif;
    min-width: 56px;
    outline: 0;
   
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: background-color .2s;
    vertical-align: middle;
    white-space: nowrap;
}

    .cookie-button:hover {
        background-color: #e1f3fc;
        text-decoration: none;
    }

.login-form .btn-sm {
    font-size: 0.75rem;
}