﻿#navbar-collapse-main .navbar-nav > li > .dropdown-menu > li > a.nav-csr { color: #f56423 }
    #navbar-collapse-main .navbar-nav > li > .dropdown-menu > li > a.nav-csr:hover { background-color: transparent; }

h1 { font-family: 'CalvertMTProLight'; font-size: 555%; }
.bannerText { line-height: 1.18; letter-spacing: 0.85px; font-size: 170%; font-family: 'CalvertMTProBold'; margin-top: 70px; max-width: 905px; }
.commItem { width: 25%; float: left; padding: 4px; overflow: hidden; }
    .commItem.big { width: 50%; }
.commItem1, .commItem2, .commItem3 { float: right }

.commItemInner { padding-bottom: 104.24%; background-repeat: no-repeat; background-position: center; position: relative; text-align: right; background-size: 215px; background-size: 62%; display: block; transition: all 400ms cubic-bezier(0.39, 0.43, 0.54, 0.55); -webkit-transition: all 400ms cubic-bezier(0.39, 0.43, 0.54, 0.55); color: #fff; }
.commItem:not(.banner) .commItemInner:hover, .commItem:not(.banner) .commItemInner:hover:focus { background-size: 67%; color: #F14E0E; background-color: #fff !important; font-size: 130%; }
.big .commItemInner { padding-bottom: 82.24%; text-align: left; }
.commItemContent { position: absolute; bottom: 15px; left: 20px; text-align: left; }

.itemTitle { font-size: 115%; max-width: 160px; margin: 0; font-family: 'AvenirNextLTProBold'; line-height: 1.09; letter-spacing: 1.15px; /*text-transform: uppercase;*/ }
.big .itemTitle { max-width: 270px; }
.itemLink { text-decoration: underline; font-size: 65%; font-family: 'AvenirNextLTPro'; }
.date { position: absolute; top: 20px; left: 20px; color: inherit; }
.commItemsWrapper { margin: 0; padding: 0px 4px; }
.commItem.banner { width: 100%; }
    .commItem.banner .commItemInner { background-color: #f14f0f; padding: 113px; text-align: left; color: #000; }
.commItem1 .commItemInner { background-color: #fa7c23 }
.commItem2 .commItemInner { background-color: #f48323; }
.commItem3 .commItemInner { background-color: #f45a21; }
.commItem4 .commItemInner { background-color: #fec526; }
.commItem5 .commItemInner { background-color: #f45a21; }
.commItem6 .commItemInner { background-color: #fec526; }

@media(min-width:992px) {
    .commItem1 .commItemContent, .commItem5 .commItemContent, .commItem6 .commItemContent { }
    /*.commItem3 .date { right: 20px; text-align: center; }*/
    .commItem1 .date, .commItem5 .date, .commItem6 .date { }
}

@media(max-width:991px) {
    .commItem { width: 50%; }
        .commItem.big { width: 100%; }
        .commItem .commItemContent { left: 23px; right: auto; text-align: left; }

    .date { font-size: 54%; bottom: 45px; }
    .commItem2 .date, .commItem6 .date { }
    .commItem2 .date, .commItem3 .date, .commItem5 .date, .commItem6 .date { text-align: center; right: 20px; }
    .commItemInner:hover, .commItemInner:hover:focus { background-size: 48%; }
    .commItem.banner .commItemInner { padding: 15px; }
}

@media(max-width:767px) {
    h1 { font-size: 190%; line-height: 1.04; }
    .bannerText { margin-top: 20px; font-size: 80%; line-height: normal; }
    .commItem.banner .commItemInner { padding: 22px; }
    .commItemInner { background-size: 62%; background-position: center center; }
    .itemTitle { font-size: 70%; }
}
