/*
Theme Name:         ICC Annual Report
Theme URI:          https://iccsafe.org/annualreport
Author:             ICC
Author URI:         https://iccsafe.org
Template:           iccsafe
*/

/* Typography */

@import url("https://fast.fonts.net/lt/1.css?apiType=css&c=c388ee93-6cff-4460-9fdf-9997e80e3eab&fontids=5730901,5730905,5730921");
@font-face{
    font-family:"Trade Gothic LT W01 Light";
    src:url("fonts/7dc2cb7c-19fe-40d4-970d-7d5b4805f786.eot?#iefix");
    src:url("fonts/7dc2cb7c-19fe-40d4-970d-7d5b4805f786.eot?#iefix") format("eot"),
    url("fonts/94557603-6403-4571-a92e-e7dfa6bb6375.woff2") format("woff2"),
    url("fonts/e2ec6de9-6d7f-4b65-912b-4cbe6bb5d8f4.woff") format("woff"),
    url("fonts/3125e696-1c5e-4618-9eb6-78c0c19df292.ttf") format("truetype");
}
@font-face{
    font-family:"Trade Gothic LT W01 Light Obl";
    src:url("fonts/f72dd330-694e-4b02-9bdf-70cde4739179.eot?#iefix");
    src:url("fonts/f72dd330-694e-4b02-9bdf-70cde4739179.eot?#iefix") format("eot"),
    url("fonts/c2a3b2ef-57ea-4e6d-8d55-ed1feaea4fc2.woff2") format("woff2"),
    url("fonts/c448579a-d3f8-418d-b474-7842bc9bd36e.woff") format("woff"),
    url("fonts/772232ca-e9aa-4a4a-94d8-05619d658588.ttf") format("truetype");
}
@font-face{
    font-family:"Trade Gothic LT W01 Bold No-_2";
    src:url("fonts/ce7f8719-800c-4fd0-899b-73dfccf47e72.eot?#iefix");
    src:url("fonts/ce7f8719-800c-4fd0-899b-73dfccf47e72.eot?#iefix") format("eot"),
    url("fonts/135abd30-1390-4f9c-b6a2-d843157c3468.woff2") format("woff2"),
    url("fonts/c6cfada8-1703-4760-87e6-46e9ef91beb7.woff") format("woff"),
    url("fonts/3adebc17-e2dc-4472-b19d-58208193ebfc.ttf") format("truetype");
}

/* Colors */

/* 
    $gray: #f2f2f2;
    $gray-dark: #444444;
    $green: #0b583f;
    $green-light: #48a842; 
*/

/* Global AR Styles */

body[class*="template-annual-report"] {
    background: none;
    width: 100%;
    overflow-x: hidden;
}

.ar-gray-bg,
.ar-post-grey {
    background-color: #f2f2f2;
}

.ar-green-bg {
    background-color: #0b583f;
}

.ar-dark-green-bg,
.ar-post-green {
    background-color: rgb(9, 59, 40);
}

.ar-white-text {
    color: white;
}

.ar-green-text {
    color: #0b583f;
}

.ar-light-green-text {
    color: rgb(47,130, 113);
}

.ar-small {
    font-size: 80%;
}


/* Sections */

.ar-wrapper,
.ar-wrapper p,
.ar-wrapper ul,
.ar-section-heading {
    font-family: "Trade Gothic LT W01 Light", sans-serif;
}

.ar-wrapper strong,
.ar-wrapper p strong,
.ar-stat-figure {
    font-family: "Trade Gothic LT W01 Bold No-_2", sans-serif;
    font-weight: normal;
}

.ar-wrapper h1:not(.ar-page-title),
.ar-wrapper h2:not(.ar-page-title):not(.ar-section-heading),
.ar-wrapper h3:not(.ar-section-heading),
.ar-wrapper h4,
.ar-wrapper h5,
.ar-wrapper h6 {
    font-family: "Trade Gothic LT W01 Bold No-_2", sans-serif;
    font-weight: normal;
    color: #0b583f;
}

.ar-page-title,
.ar-section-heading,
.ar-wrapper h1 {
    font-size: 60px;
}

@media screen and (max-width: 767px) {
    .ar-page-title,
    .ar-section-heading,
    .ar-wrapper h1 {
        font-size: 42px;
    }
}

.ar-header,
.ar-highlights-in-innovation-footer,
.ar-highlights-in-innovation {
    background-size: cover;
    background-repeat: no-repeat;

    /* must also update the .ar-header-icon offset if changed */
    padding: 20px 0;
}

.ar-header > .container {
    display: flex;
}

.ar-header p {
    margin: 0;
}

.ar-page-description {
    max-width: 750px;
}

.ar-header-icon {
    background-color: #0b583f;
    display: flex;

    /* offsets the .ar-header padding */
    margin-left: auto;
    margin-top: -20px;
    margin-bottom: -20px;
    
    padding: 0 20px;
    align-items: center;
}

.ar-section-content {
    padding: 20px 0;
}

.ar-section-content h2 {
    font-size: 32px;
}

.ar-section-content h3 {
    font-size: 24px;
}

.ar-section-content h4 {
    font-size: 18px;
}

.ar-section-content .quote {
    background-color: #f2f2f2;
    padding: 15px 25px;
}

.ar-section-content .quote blockquote {
    font-style: italic;
    color: #666;
    font-size: 24px;
    margin-bottom: 0;
}

.ar-section-content .quote blockquote p:last-of-type {
    margin-bottom: 0;
}

.ar-section-content .quote blockquote figcaption {
    color: #000;
    font-style: normal;
    font-size: 16px;
}

@media screen and (max-width: 767px) {
    .ar-section-content h2 {
        font-size: 24px;
    }
}

.ar-section-content img.alignleft {
    float: left;
    clear: left;
    margin-right: 10px;
}

.ar-section-content img.alignright {
    float: right;
    margin-left: 10px;
}

@media screen and (max-width: 767px) {
    .ar-section-content img.alignright,
    .ar-section-content img.alignleft {
        display: block;
        float: none;
        margin: 10px 0;
    }
}

/* Callout */

.ar-section-sidebar {
    margin-bottom: 20px;
}

.ar-green-callout {
    border: 15px solid #48a842;
    padding: 50px 40px;
    font-family:"Trade Gothic LT W01 Light Obl";
    font-size: 24px;
    font-style: italic;
    line-height: 1.2;
    color: #444444;
    margin-top: 20px;
}

.ar-green-callout p {
    margin: 0;
}

.ar-green-callout blockquote {
    position: relative;
    margin-top: 20px;
    margin-bottom: 30px;
}

.ar-green-callout blockquote:before,
.ar-green-callout blockquote:after {
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: 0;
    top: 0;
}

.ar-green-callout blockquote:before {
    background-image: url('img/quote-open.png');
    width: 56px;
    height: 61px;
    top: -61px;
    left: -20px;
}

.ar-green-callout blockquote:after {
    background-image: url('img/quote-close.png');
    left: auto;
    right: -20px;
    bottom: -65px;
    top: auto;
    width: 54px;
    height: 49px;
}

@media screen and (max-width: 767px) {
    .ar-green-callout {
        padding: 15px 10px;
        font-size: 16px;
        border-width: 5px;
    }

    .ar-order-second-mobile {
        order: 2;
    }

    .ar-green-callout blockquote:before,
    .ar-green-callout blockquote:after {
        display: none;
    }
}

/* Footer */

.ar-highlights-in-innovation-footer,
.ar-footer-logo-container,
.ar-highlights-in-innovation {
    background-color: #444444;
    background-image: url('img/innovation-bg.jpg');
    background-repeat: no-repeat;
    padding: 40px 0;
}

.ar-footer-logo-container {
    background-image: url('img/ar-hero-bg.jpg');
    background-size: cover;
    background-position: center center;
}

.ar-footer-logos {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-around;
}

.ar-highlights-in-innovation-footer .ar-page-title {
    margin-bottom: 40px;
}

.ar-pdf-download-footer {
    background-color: #0b583f;
}

.ar-pdf-links {
    display: flex;
    justify-content: space-around;
    text-transform: uppercase;
    padding: 20px 0;
    align-items: center;
}

.ar-pdf-links a {
    color: white;
    font-size: 18px;
    transition: all .35s;
}

.ar-pdf-links a:not(.ar-pdf-button):hover {
    color: #48a842;
}

.ar-pdf-button {
    border: 7px solid white;
    padding: 10px 15px;
    margin-right: 40px;
    flex: 1 1 auto;
}

.ar-pdf-button:hover {
    border-color: #48a842;
}

.ar-footer-link-divider {
    position: relative;
}

.ar-footer-link-divider::after {
    content: "";
    height: 12px;
    background-color: rgba(74, 168, 74);
    width: 2px;
    display: inline-block;
    margin-left: 20px;
    transform: translateY(-1px);
}

.ar-pdf-links a:last-of-type::after {
    display: none;
}

.ar-footer-link {
    padding-left: 20px;
}

.ar-highlights-icon {
    display: block;
    background-repeat: no-repeat;
    background-position: center center;
    max-width: 335px;
    overflow: hidden;
}

.ar-highlights-icon img {
    opacity: 1;
    display: inline;
    transition: opacity .35s;
}

.ar-highlights-icon:hover img {
    opacity: 0;
}

@media screen and (min-width: 768px) {
    .ar-highlights-icon {
        background-size: contain;
    }
    .ar-pdf-button {
        background-image: url('img/pdf-download-arrow.png');
        background-repeat: no-repeat;
        background-position: center right;
        max-width: 400px;
        margin-right: auto;
    }
}


@media screen and (max-width: 767px) {
    
    .ar-footer-logos {
        flex-wrap: wrap;
        align-content: center;
        justify-content: center;
    }

    .ar-footer-logos li {
        width: 50%;
        display: flex;
        margin: 0 0 40px;
        justify-content: center;
    }

    .ar-footer-logos li img {
        max-width: 90%;
    }

    .ar-footer-link-divider::after {
        display: none;
    }

    .ar-pdf-links {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .ar-pdf-links a {
        font-size: 13px;
        margin: 0;
    }

    .ar-pdf-links a:not(.ar-pdf-button) {
        padding: 5px 0;
    }

    .ar-pdf-links a.ar-pdf-button {
        margin-bottom: 10px;
    }

    .ar-header > .container {
        flex-wrap: wrap;
    }

    .ar-header-icon {
        display: none;
    }
}




/* AR Home */

.ar-gallery-images {
    list-style-type: none;
    margin: 0;
    padding: 0 0 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    transform: translate(0, 0);
}

.ar-gallery-images li {
    padding: 7px;
}

@media screen and (max-width: 767px) {
    .ar-gallery-images li {
        flex: 1 1 50%;
    }
}

/* AR Home Map */

.ar-map {
    background-color: #ffffff;
    padding: 20px 0;
}


/* AR Home Timeline */

.ar-timeline-year {
    font-size: 48px;
}

.ar-timeline-content {
    font-size: 13px;
    padding-left: 20px;
    border-left: 2px solid rgb(47,130, 113);
    line-height: 1.2;
    padding-right: 20px;
}

.ar-timeline-slider {
    opacity: 0;
}

.ar-timeline-container {
    padding-top: 20px;
}

.ar-timeline-slider.slick-initialized {
    opacity: 1;
    transition: opacity .35s;
}

.ar-timeline-slider .slick-arrow {
    display: none !important;
}

.ar-timeline-slider .slick-slide::after {
	content: "";
	display: block;
	width: 15px;
	height: 15px;
	background: white;
	border-radius: 50%;
	position: absolute;
	left: -9px;
	bottom: -15px;
}

@media (min-width: 768px) {
    .ar-timeline-slider .slick-arrow {
        cursor: pointer;
        display: block !important;
        font-size: 0;
        background: none;
        border: 0;
        padding: 0;
        position: absolute;
        width: 31px;
        height: 39px;
        background-repeat: no-repeat;
        background-size: contain;
        background-image:url('img/timeline-arrow-left.png');
        position: absolute;
        left: -70px;
        top: 50%;
        transform: translateY(-36px);
    }

    .ar-timeline-slider .slick-arrow.slick-next {
        left: auto;
        right: -70px;
        background-image: url('img/timeline-arrow-right.png');
    }

    .ar-timeline-slider .slick-disabled {
        opacity: .15;
        cursor: default;
    }
}

@media (max-width: 767px) {
    .ar-timeline-year {
        font-size: 32px;
    }
}

.ar-hero {
    background-image:url('img/video_bg_1920w_01.jpg');
    background-position: top right;
    background-repeat: no-repeat;
    background-size: cover;
}

.ar-hero-video {
    overflow: hidden;
    z-index: 20;
    height: 800px;
    width: 100%;
    position: relative;
    margin: 0 auto;
    max-width: 1200px;
}

.ar-hero-content {
    position: absolute;
    z-index: 20;
    bottom: auto;
    top: 50%;
    left: 0;
    transform: translateY(-50%) !important;
}

.counterupJSElement {
    transform: translate(0, 0);
}

.ar-mission {
    overflow: hidden;
    width: 100%;
    transform: translate(0, 0);
    padding-top: 20px;
    padding-bottom: 20px;
}

.ar-stats {
    background-image: url('img/ar-code-bg.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    padding-top: 40px;
    padding-bottom: 40px;
}

.ar-stats div[class*="col-"] {
    margin-bottom: 20px;
}

.ar-stat-icon {
    display: block;
    margin: 0 auto 10px;
}

.ar-stat-description {
    font-size: 18px;
    padding: 0 30px;
    display: block;
}

.ar-stat-single {
    text-align: center;
    border: 13px solid #0b583f;
    background-color: #ffffff;
    height: 100%;
    justify-content: center;
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    padding: 20px;
}

.ar-stats div[class*="col-"]:nth-child(1n+4) .ar-stat-single {
    border-color:  #48a842;
}

.ar-stats div[class*="col-"]:nth-child(1n+4) .ar-stat-figure {
    color: #0b583f;
}

.ar-stat-figure {
    font-size: 48px;
    color: #48a842;
    padding: 10px 0;
}

@media (max-width: 991px) {
    .ar-stat-figure {
        font-size: 32px;
    }
    .ar-stat-description {
        padding: 0;
    }
}

/* Homepage Highlights in Innovation */

.ar-highlights-links {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.ar-highlights-row-link {
    background-repeat: no-repeat;
    background-color: rgb(33,31,33);
    display: block;
    color: white;
	background-position: center right;
    border: 2px solid white;
	margin: 0 0 30px;
	padding: 6px 12px 6px 12px;
	text-transform: uppercase;
	font-size: 24px;
    position: relative;
    transition: all .35s;
}

@media screen and (min-width: 768px) {
    .ar-highlights-row-link {
        color: rgb(72,72,72);
        border-color: transparent;
    }

    .ar-highlights-row-link:hover,
    .ar-highlights-row-link.add-highlight {
        color: white;
        background-color: transparent;
        border-color: white;
        background-image: url('img/pdf-download-arrow.png');
        transition: all .35s;
    }
}

@media screen and (max-width: 767px) {
    .ar-highlights-links,
    .ar-footer-logo-container  {
        max-width: 100%;
        overflow: hidden;
    }
}

/* Homepage Posts */

.ar-post {
    overflow: hidden;
}

.ar-home-post-single {
	display: flex;
    padding-top: 40px;
    padding-bottom: 40px;
	justify-content: center;
    align-items: center;
    flex-direction: column;
}

.ar-post:nth-of-type(2n+1) .ar-home-post-single .ar-post-content {
    order: 1;
    padding-right: 20px;
}
  
.ar-post:nth-of-type(2n+1) .ar-home-post-single .ar-post-image {
    order: 2;
}

.ar-post:nth-of-type(2n+2) .ar-home-post-single .ar-post-content {
    order: 2;
    padding-left: 20px;
}

.ar-post:nth-of-type(2n+2) .ar-home-post-single .ar-post-image {
    order: 1;
}

@media screen and (max-width: 991px) {
    .ar-post-content,
    .ar-post-image {
        width: 100%;
    }

    .ar-post-image {
        margin: 10px auto;
    }
}

@media screen and (min-width: 992px) {
    .ar-home-post-single {
        flex-direction: row;
    }
    .ar-post:nth-of-type(2n+1) .ar-home-post-single .ar-post-image {
        flex: 0 0 auto;
    }
    .ar-post:nth-of-type(2n+1) .ar-home-post-single .ar-post-content {
        flex: 1 1 auto;
    }
    .ar-post.ar-post-green:nth-of-type(2n+2) .ar-home-post-single .ar-post-image {
        max-width: 247px;
        flex: 0 0 auto;
    }
}

.ar-post-title {
    line-height: 1.2;
}

.ar-post-green .ar-post-title {
    font-size: 48px;
}

.ar-post-green .ar-post-description {
    font-size: 16px;
}

.ar-post-link {
    font-size: 24px;
    color: #444444;
    display: inline-block;
    position: relative;
    background-image: url('img/more_arrow.png');
    background-repeat: no-repeat;
    background-position: center right;
    padding-right: 30px;
    transition: all .35s;
}

.ar-post-link:hover {
    color: #48a842;
    padding-right: 40px;
}

.ar-post-green .ar-post-link {
    color: #ffffff;
}


@media screen and (min-width: 992px) {
    .ar-home-post-single {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .ar-post-green + .ar-post-grey:after,
    .ar-post-green + .ar-post-grey:before {
        content: "";
        height: 100%;
        width: 50%;
        position: absolute;
        left: -40px;
        background: white;
        display: block;
        top: 0;
        z-index: -1;
        right: auto;
    }

    .ar-post-green + .ar-post-grey:before {
        right: 0;
        background: #f7f7f7;
        left: auto;
        width: 100%;
    }

    .ar-post-green .col-md-6 .ar-home-post-single .ar-post-content {
        order: 1;
        padding-left: 0;
        padding-right: 20px;
    }
    
    .ar-post-green .col-md-6:first-of-type .ar-post-image {
        transform: translateX(-25px);
    }

    .ar-post-green {
        background-color: transparent;
        position: relative;
        border-bottom: 1px solid rgb(9, 59, 40);
        background: -moz-linear-gradient(45deg, rgba(9,60,43,1) 0%, rgba(16,83,61,0.71) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(45deg, rgba(9,60,43,1) 0%,rgba(16,83,61,0.71) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(45deg, rgba(9,60,43,1) 0%,rgba(16,83,61,0.71) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    }
    
    .ar-post-green + .ar-post-grey {
        background: transparent;
        position: relative;
    }
    
    .ar-post-green + .ar-post-grey .row {
        z-index: 20;
        position: relative;
    }

    .ar-post-green .row {
        transform: translateX(-20px);
    }
}


/* Home TOC */

.ar-toc-container {
	position: fixed;
	left: 0;
	top: 180px;
    transform: translate(-100%, 0);
    z-index: 20;
    width: 354px;
}

.ar-toc-container.is-visible {
    transform: translate(0, 0);
    transition: transform .35s;
}

.ar-toc-toggle {
	color: white;
	padding: 10px 15px;
	text-transform: uppercase;
	transform: rotate(90deg);
	display: block;
	background: rgba(0,0,0,.95);
	position: absolute;
	left: 286px;
    top: 70px;
	white-space: nowrap;
}

.ar-toc-toggle:focus,
.ar-toc-content a:focus {
    color: white;
    outline: none;
}

.ar-toc-toggle:hover {
    background-color: rgba(0,0,0,.95);
    color: white;
}

.ar-toc-content {
    background: rgba(0,0,0,.85);
    overflow: hidden;
    padding: 20px 30px 20px 50px;
    transform: translate(0, 3px);
}

.is-visible .ar-toc-content {
    width: 354px;
}

.ar-toc-content a {
	display: block;
	padding: 5px 0;
}

.ar-toc-content a.ar-toc-link-indent {
	padding-left: 20px;
}

.ar-toc-close {
    position: absolute;
    top: 14px;
    left: 0;
    cursor: pointer;
    width: 41px;
    height: 40px;
}

.ar-toc-close:before,
.ar-toc-close:after {
    content: "";
    border: 1px solid white;
    transform: rotate(-45deg);
    display: block;
    height: 20px;
    position: absolute;
    left: 24px;
    top: 6px;
}

.ar-toc-close:after {
    transform: rotate(45deg);
}

@media screen and (max-width: 767px) {
    .ar-toc-content {
        padding-right: 10px;
        padding-left: 10px;
        padding-top: 40px;
    }

    .ar-toc-content a {
        font-size: 14px;
    }

    .ar-toc-container {
        top: 140px;
    }
    
    .ar-toc-container.is-visible {
        transform: translateY(-40px);
    }

    .ar-toc-toggle {
        background-color: rgba(0,0,0,.75);
        left: 297px;
        font-size: 14px;
        padding: 8px 10px;
    }

    .is-visible .ar-toc-content {
        width: 304px;
    }

    .is-visible .ar-toc-toggle {
        left: 247px;
        top: 60px;
    }
}

html:not(.no-js) .ie [data-aos^=fade][data-aos^=fade],
.ie .ar-timeline-slider {
    opacity: 1;
    transform: none;
}

html:not(.no-js) .ie [data-aos=flip-right].aos-animate,
html:not(.no-js) .ie [data-aos^=flip][data-aos^=flip]
{
    transform: none;
}

.ie .ar-stat-icon {
    width: 50px;
    margin: 0 auto;
}

html .ie [data-aos] {
    pointer-events: painted;
}

html .ie .ar-toc-container {
    display: none;
}

html .ie .ar-header .row {
    width: 100%;
}