/* OI-Modals v0.10.2
* Copyright (c) 2016 Opportunity International
*/
/****************/
/**** Modals ****/
/****************/
img.block { height: auto; }
[data-modal] { cursor: pointer; }
body.ios-no-scroll { position: fixed; height: 100%; width: 100%; top: 0; left: 0; overflow: hidden; }
body.ios-no-scroll .ios-scroll-container { position: absolute; top: 0; left: 0; height: auto; width: 100%; }
body.no-scroll { overflow: hidden; }
.modal { display: none; position: fixed; top: 0; left: 0; right: 0; height: 100%; padding: 20px; z-index: 3; transition: background-color .3s; -webkit-transition: background-color .3s; -moz-transition: background-color .3s; }
.modal.show { background-color: rgba(0, 0, 0, 0.8); }
.modal.show .ie8-overlay { position: fixed; z-index: 0; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; filter: alpha(opacity=80); }
.modal.show .modal-container { top: 50%; opacity: 1; }
.modal.show button.close { opacity: 1; }
.modal.animate { display: block; }
.modal.animate .modal-container { display: block; }
.modal.overflow { overflow: auto; -webkit-overflow-scrolling: touch; }
.modal.overflow .modal-container { top: -25%; transform: translateY(0); -moz-transform: translateY(0); -webkit-transform: translateY(0); -ms-transform: translateY(0); }
.modal.overflow.show .modal-container { top: 0%; }
.modal.overflow.show .modal-container:after { content: ''; display: block; position: absolute; height: 20px; width: 100%; }
.modal.overflow.show .modal-container.fullscreen:after { display: none; }
.modal.loading .loading-container { display: block; }
.modal .loading-container { display: none; position: absolute; top: 50%; left: 50%; margin-top: -30px; text-align: center; margin-left: -30px; background-color: #fff; background-color: rgba(255, 255, 255, 0.8); width: 60px; height: 60px; border-radius: 5px; }
.modal .loading-container .loading-indicator { display: block; top: 50%; position: relative; margin-left: auto; margin-top: -15px; margin-right: auto; }
.modal .modal-container { display: none; position: relative; top: 25%; transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); margin: 0 auto; width: 400px; background: #fff; opacity: 0; transition: top, opacity; -moz-transition: top, opacity; -webkit-transition: top, opacity; }
.modal .modal-container.extended {height:80vh; overflow-y:scroll;}
.modal .modal-container.hide-close button.close { display: none; }
.modal .modal-container .modal-content { position: relative; }
.modal .modal-container .modal-content .iframe { height: 0; width: 100%; margin: 0; padding-bottom: 75%; position: relative; overflow: auto; -webkit-overflow-scrolling: touch; }
.modal .modal-container .modal-content .iframe iframe { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.modal .modal-container[class*="contained-"] { width: auto; }
.modal .modal-container.lightbox { width: auto; background-color: transparent; }
.modal .modal-container.lightbox .lightbox-image { position: relative; }
.modal .modal-container.lightbox button.close { background-color: #fff; background-color: rgba(255, 255, 255, 0.5); color: #555; }
.modal .modal-container.lightbox button.close:hover { color: #333; }
.modal .modal-container.lightbox button.lightbox-next, .modal .modal-container.lightbox button.lightbox-prev { position: absolute; top: 50%; margin-top: -20px; opacity: .5; color: #fff; font-size: 40px; text-shadow: 0 0 10px rgba(0, 0, 0, 0.5); -webkit-transition: opacity .3s, text-shadow .3s; transition: opacity .3s, text-shadow .3s; }
.modal .modal-container.lightbox button.lightbox-next:hover, .modal .modal-container.lightbox button.lightbox-prev:hover { text-shadow: 0 0 10px rgba(0, 0, 0, 0.25); opacity: 1; }
.modal .modal-container.lightbox button.lightbox-next { right: 0; }
.modal .modal-container.lightbox button.lightbox-prev { left: 0; }
.modal .modal-container.fullscreen { position: absolute; top: 0; left: 0; max-width: initial; width: 100%; min-height: 100%; }
.modal .modal-container.fullscreen.show { top: 0; }
.modal button.close { position: absolute; top: 0; right: 0; width: 40px; height: 40px; font-size: 24px; text-align: center; line-height: 40px; color: #8f8e8c; z-index: 1; opacity: 0; transition: opacity .3s; -webkit-transition: opacity .3s; -moz-transition: opacity .3s; -ms-transition: opacity .3s; }
.modal button.close.fixed { position: fixed; -webkit-transform: translateZ(0); transform: translateZ(0); }
.modal button.close:hover { color: #333; }
.modal.size { display: block; }
.modal.size .modal-container { display: block; visibility: hidden; }
@media (max-width: 440px) { .modal .modal-container { width: 100%; } }
/* OI-OffCanvas v0.9.1
* Copyright (c) 2015 Opportunity International
*/
body { position: relative; -webkit-transition: left .5s, right .5s; transition: left .5s, right .5s; }
.no-scroll { overflow: hidden; }
.offcanvas-overlay { position: fixed; top: 0; left: 0; right: 0; z-index: 2; height: 100%; background-color: rgba(0, 0, 0, 0.7); opacity: 0; display: none; -webkit-transition: opacity .5s; transition: opacity .5s; }
.offcanvas-overlay.show { display: block; }
.fixed { -webkit-transition: left .5s, right .5s; transition: left .5s, right .5s; }
.drawer { display: none; position: fixed; top: 0; z-index: 2; height: 100%; background-color: #fff; overflow-y: scroll; -webkit-overflow-scrolling: touch; -webkit-transition: left .5s, right .5s; transition: left .5s, right .5s; box-sizing: content-box; }
.drawer.show { display: block; }
/* slide-hammer v0.9.0
* Copyright (c) 2015 Joseph Weber
*/
.slides { margin-left: auto; margin-right: auto; }
.slide-wrapper { width: 100%; overflow: hidden; position: relative; transition: height .5s; -moz-transition: height .5s; -webkit-transition: height .5s; }
.slide-wrapper .slide-container { width: 100000px; clear: both; position: absolute; top: 0; left: 0; transition: transform .5s; -moz-transition: transform .5s; -webkit-transition: -webkit-transform .5s; }
.slide-wrapper .slide-container .slide { width: 600px; float: left; }
.slide-wrapper .slide-container .slide img { display: block; width: 100%; height: auto; pointer-events: none; }
/* OI v0.1.0
* Copyright (c) 2016
*/
/****************/
/**** Header ****/
/****************/
nav { position: fixed; top: 0; left: 0; width: 100%; z-index: 3; }
nav .nav-container { padding-left: 20px; padding-right: 0; background-color: #222; position: relative; z-index: 2; }
nav #nav-logo { position: absolute; background-image: url("../img/oi-logo-mobile-sprite-2x.png"); background-repeat: no-repeat; background-position: left 0%; display: block; width: 225px; height: 40px; bottom: 10px; background-size: auto 500%; }
nav #nav-logo.brand-purple { background-position: 0 25%; }
nav #nav-logo.brand-teal { background-position: 0 50%; }
nav #nav-logo.brand-orange { background-position: 0 75%; }
nav #nav-logo.brand-pink { background-position: 0 100%; }
nav .nav-actions, nav .nav-main { display: none; }
nav button.offcanvas-trigger { display: block; float: right; height: 40px; clear: both; color: #fff; font-size: 24px; line-height: 40px; margin-top: 10px; margin-bottom: 10px; padding-right: 20px; padding-left: 20px; }
/************************/
/**** Offcanvas menu ****/
/************************/
#offcanvas .offcanvas-header { height: 60px; position: relative; padding-left: 30px; padding-right: 30px; }
#offcanvas .offcanvas-header h2 { line-height: 60px; float: left; }
#offcanvas .offcanvas-header button { float: right; margin-top: 10px; }
#offcanvas .offcanvas-container { padding: 20px 30px 30px 30px; }
#offcanvas ul.level-1 > li { position: relative; padding-right: 40px; }
#offcanvas ul.level-1 > li .toggle { position: absolute; right: 0; font-size: 20px; width: 40px; text-align: right; line-height: 1.225em; color: #8f8e8c; }
#offcanvas ul.level-1 > li > a { color: #555; display: inline-block; text-transform: uppercase; font-size: .875em; font-weight: bold; letter-spacing: .5px; margin-bottom: 10px; }
#offcanvas ul.level-1 > li[data-class="brand-purple"] ul.level-2 li.active:before, #offcanvas ul.level-1 > li[data-class="brand-purple"] ul.level-2 li.active a { color: #4a0059; }
#offcanvas ul.level-1 > li[data-class="brand-pink"] ul.level-2 li.active:before, #offcanvas ul.level-1 > li[data-class="brand-pink"] ul.level-2 li.active a { color: #ed027e; }
#offcanvas ul.level-1 > li[data-class="brand-orange"] ul.level-2 li.active:before, #offcanvas ul.level-1 > li[data-class="brand-orange"] ul.level-2 li.active a { color: #f15b22; }
#offcanvas ul.level-1 > li[data-class="brand-teal"] ul.level-2 li.active:before, #offcanvas ul.level-1 > li[data-class="brand-teal"] ul.level-2 li.active a { color: #00abab; }
#offcanvas ul.level-2 { display: none; padding-right: 20px; padding-left: 10px; padding-bottom: 10px; }
#offcanvas ul.level-2.expanded { display: block; }
#offcanvas ul.level-2 > li.active:before { display: block; font-family: 'OI-icons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: '\e619'; position: absolute; left: -40px; }
#offcanvas ul.level-2 > li.active > a { font-weight: bold; }
#offcanvas ul.level-2 > li > a { display: block; font-size: .875em; color: #555; line-height: 1.25; padding-bottom: 10px; }
#offcanvas .offcanvas-quick-links a, #offcanvas .offcanvas-account-links a { display: block; color: #8f8e8c; font-size: .875em; line-height: 1.25; padding-bottom: 10px; }
#offcanvas .offcanvas-account-links a { text-transform: uppercase; letter-spacing: .5px; }
#offcanvas .offcanvas-account-links i { margin-right: 5px; font-size: 16px; line-height: 1.09375em; }
/*******************/
/**** Side menu ****/
/*******************/
.side-menu { position: relative; margin-bottom: 40px; max-width: 630px; margin-left: auto; margin-right: auto; border-top: solid 5px; padding-top: 40px; }
.side-menu ul.level-1 > li { padding-left: 0; position: relative; }
.side-menu ul.level-1 > li:before { content: ''; }
.side-menu ul.level-1 > li .toggle { position: absolute; right: 0; font-size: 20px; cursor: pointer; }
.side-menu ul.level-1 .active > a { font-weight: bold; }
.side-menu ul.level-2 { display: none; padding-top: 10px; padding-left: 10px; font-size: .875em; }
.side-menu h3 a { color: inherit; }
.side-menu li { padding-bottom: 10px; line-height: 1.125; }
.side-menu li:last-child { padding-bottom: 0; }
.side-menu li a { display: inline-block; color: inherit; font-size: .875em; line-height: 1.75em; }
/******************************/
/**** Mobile donate button ****/
/******************************/
#mobile-donate { position: fixed; bottom: 0; right: 0; width: 100%; z-index: 2; }
#mobile-donate button { margin-bottom: 0; }
body { padding-bottom: 45px; }
/*********************/
/**** Breadcrumbs ****/
/*********************/
.no-breadcrumbs .breadcrumbs { display: none; }
.breadcrumbs { display: none; }
/********************/
/******* Footer *****/
/********************/
footer { color: #555; }
footer a { color: #555; }
footer a:hover { color: #222; }
footer hr { margin-top: 20px; margin-bottom: 20px; height: 1px; }
footer .brand-darkgray-bg { color: #8f8e8c; }
footer .brand-darkgray-bg a { color: #8f8e8c; }
footer .brand-darkgray-bg a:hover { color: #efeeea; }
footer .brand-darkgray-bg .footer-heading { color: #efeeea; }
footer .footer-heading { text-transform: uppercase; font-size: .875em; font-weight: bold; letter-spacing: .5px; }
footer .footer-left { text-align: center; }
footer .footer-right { text-align: center; }
footer .footer-legal { font-size: .875em; margin-top: 20px; margin-bottom: 30px; }
footer .footer-legal ul li { font-weight: bold; text-transform: uppercase; letter-spacing: .5px; }
footer .social-icons { margin-bottom: 20px; }
footer .social-icons .footer-heading { line-height: 40px; vertical-align: top; }
footer .footer-international { text-align: center; }
footer .footer-international li { font-size: .875em; }
footer .footer-copyright { font-size: .875em; margin-bottom: 40px; margin-top: 20px; }
footer .footer-logos .footer-logo { display: inline-block; vertical-align: middle; }
.footer-nav ul.level-2 { display: none; }
.footer-nav .footer-nav-heading { display: inline-block; font-weight: bold; margin-bottom: 15px; text-transform: uppercase; letter-spacing: .5px; font-size: .875em; padding-right: 40px; }
.footer-nav .footer-column { width: 100%; position: relative; }
.footer-nav .footer-column li { line-height: 1.25; margin-bottom: .875em; font-size: .875em; }
.footer-nav .footer-column li a { -webkit-transition: color 0.3s; transition: color 0.3s; }
.footer-nav .footer-column li a:hover { color: #222; }
.footer-nav .toggle { position: absolute; right: 10px; top: 0; font-size: 20px; width: 40px; text-align: right; color: #8f8e8c; }
/*******************************/
/**** Temporary Weavr fixes ****/
/*******************************/
.body-copy > ul > li:before { display: inline-block; position: relative; left: -0.625em; margin-left: -0.625em; }
.brand-green-bg input[type='text'], .brand-green-bg input[type='number'], .brand-green-bg input[type='email'], .brand-green-bg input[type='password'], .brand-green-bg input[type='phone'], .brand-green-bg textarea, .brand-purple-bg input[type='text'], .brand-purple-bg input[type='number'], .brand-purple-bg input[type='email'], .brand-purple-bg input[type='password'], .brand-purple-bg input[type='phone'], .brand-purple-bg textarea, .brand-pink-bg input[type='text'], .brand-pink-bg input[type='number'], .brand-pink-bg input[type='email'], .brand-pink-bg input[type='password'], .brand-pink-bg input[type='phone'], .brand-pink-bg textarea, .brand-orange-bg input[type='text'], .brand-orange-bg input[type='number'], .brand-orange-bg input[type='email'], .brand-orange-bg input[type='password'], .brand-orange-bg input[type='phone'], .brand-orange-bg textarea, .brand-teal-bg input[type='text'], .brand-teal-bg input[type='number'], .brand-teal-bg input[type='email'], .brand-teal-bg input[type='password'], .brand-teal-bg input[type='phone'], .brand-teal-bg textarea, .brand-darkgray-bg input[type='text'], .brand-darkgray-bg input[type='number'], .brand-darkgray-bg input[type='email'], .brand-darkgray-bg input[type='password'], .brand-darkgray-bg input[type='phone'], .brand-darkgray-bg textarea { border-color: #fff; }
/*********************/
/*** Social icons ****/
/*********************/
.social-icons { margin-left: -5px; margin-right: -5px; }
.social-icon { display: inline-block; width: 40px; height: 40px; line-height: 40px; font-size: 14px; text-align: center; border-radius: 100%; margin-left: 5px; margin-right: 5px; }
.social-icon.icon-facebook { background-color: #3b5998; color: #fff; }
.social-icon.icon-twitter { background-color: #55acee; color: #fff; }
.social-icon.icon-linkedin { background-color: #0077b5; color: #fff; }
.social-icon.icon-youtube { background-color: #cd201f; color: #fff; }
.social-icon.icon-pinterest { background-color: #cb2027; color: #fff; }
.social-icon.icon-googleplus { background-color: #dd4b39; color: #fff; }
.social-icon.icon-instagram { background-color: #c13584; color: #fff; }
.slide-indicators { text-align: center; padding: 5px; }
.slide-indicators .slide-indicator { display: inline-block; width: 10px; height: 10px; margin: 0 5px; border-radius: 100%; background-color: #8f8e8c; cursor: pointer; }
.slide-indicators .slide-indicator:hover { background-color: #4a0059; }
.slide-indicators .slide-indicator.active { background-color: #4a0059; }
.body-copy.contained-9 > table { max-width: 630px; margin-left: auto; margin-right: auto; }
.relative { position: relative; }
time { font-family: "Times New Roman", Times, serif; font-style: italic; font-size: 1.125em; }
time.small { font-size: 1em; }
time + h2 { margin-top: 5px; }
#feature { height: 200px; height: 50vw; }
.sidebar { margin-top: 30px; }
/*****************/
/**** Widgets ****/
/*****************/
.widget { display: none; }
.widget .widget-head { padding: 30px; text-align: center; position: relative; }
.widget .widget-head h3 { margin-bottom: 0; }
.widget .widget-head .widget-nub { position: absolute; bottom: -1px; left: 0; width: 100%; text-align: center; }
.widget .widget-body { padding: 30px; }
.widget ul.blocklist li { display: block; margin-bottom: 40px; padding-bottom: 30px; border-bottom: solid 1px #fff; }
.widget ul.blocklist li:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
#widget-facts table { font-size: .875em; border-collapse: collapse; }
#widget-facts td { vertical-align: top; padding: 5px 0; border-bottom: solid 1px #8f8e8c; }
#widget-facts tr:last-child td { border-bottom: none; }
#widget-events { text-align: center; }
#widget-events .month { display: block; }
#widget-events .day { display: block; font-size: 2em; }
#widget-events .locations { font-size: .875em; }
#widget-downloads li p { font-size: .875em; color: #8f8e8c; }
/****************/
/**** Videos ****/
/****************/
.video-thumbnail { width: 100%; height: 0; padding-bottom: 56.25%; position: relative; overflow: hidden; }
.video-title { margin-top: .625em; font-weight: bold; color: #555; }
.inline-video-gallery .index-grid { padding: 0; }
/*********************/
/**** Index pages ****/
/*********************/
.index { overflow: hidden; }
.index .sidebar { padding-left: 30px; padding-right: 30px; }
.index .filter-params { margin-top: 40px; }
.index .pagination a { color: #8f8e8c; font-weight: bold; }
.index .pagination a:hover { color: #333; }
.index .pagination a.active { color: #333; }
.index-content { padding: 30px 30px 0; }
.index-rows .index-item:nth-child(even) { background-color: #efeeea; }
.index-rows .index-item:nth-child(even) .nub { color: #efeeea; }
.index-rows .index-item .nub { position: absolute; font-size: 30px; color: #fff; bottom: -2px; right: 0; width: 100%; text-align: center; font-family: 'OI-icons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.index-rows .index-item .nub:before { content: '\e618'; }
.index-grid { padding: 30px; }
.index-grid.no-gutter .index-item { padding: 0; }
.index-grid.bordered { margin-left: 1px; margin-top: 1px; margin-right: -1px; border: none; }
.index-grid.bordered .index-item { border: solid 1px #efeeea; margin-top: -1px; margin-left: -1px; }
.index-grid .index-item { margin-bottom: 30px; }
.index-heading { background-color: #efeeea; padding: 15px 30px; clear: left; }
.index-item { position: relative; }
.icon-overlay:before { display: none; }
/*******************************/
/******* Textfield Search *****/
/*******************************/
.search { float: right; width: 30px; height: 20px; overflow: visible; position: relative; }
.search form { width: 100%; height: 20px; position: absolute; right: 0; background-color: #222; -webkit-transition: width .3s; transition: width .3s; }
.search input[type="text"] { position: absolute; top: 0; background-color: transparent; border: none; border-color: transparent; color: #efeeea; font-size: 16px; padding: 0 10px; right: 30px; height: 22px; width: 0; -webkit-transition: width .3s, border .3s; transition: width .3s, border .3s; }
.search button.icon-search { position: absolute; right: 0; top: 0; background-color: #222; color: #8f8e8c; font-size: 20px; height: 18px; width: 30px; }
.search button.icon-search:hover { color: #fff; }
.search.show input[type="text"] { width: 100%; border-bottom: solid 1px #8f8e8c; background-color: #222; }
.search.show button.icon-search { color: #fff; }
.search.show button.icon-search:hover { color: #f15b22; }
.search.show button.icon-cross { position: absolute; left: -60px; height: 18px; width: 30px; line-height: 18px; background-color: transparent; color: #8f8e8c; font-size: 20px; }
.search.show button.icon-cross:hover { color: #fff; }
/*****************/
/**** Content ****/
/*****************/
#content { margin-top: 60px; }
/**************/
/*** Touts ****/
/**************/
.horizontal-tout { position: relative; overflow: hidden; }
.horizontal-tout .tout-content, .horizontal-tout .tout-photo { position: relative; }
.horizontal-tout .tout-content { padding: 40px 30px; }
.horizontal-tout .tout-photo { position: relative; height: 0; padding-bottom: 66.66%; }
.horizontal-tout .tout-caption { display: none; }
.horizontal-tout .tout-caption.brand-purple-decoration { border-color: #4a0059; }
.horizontal-tout .tout-caption.brand-pink-decoration { border-color: #ed027e; }
.horizontal-tout .tout-caption.brand-teal-decoration { border-color: #00abab; }
.horizontal-tout .tout-caption.brand-orange-decoration { border-color: #f15b22; }
.horizontal-tout .tout-nub { font-family: 'OI-icons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; position: absolute; bottom: -2px; left: 0; right: 0; font-size: 20px; text-align: center; }
.horizontal-tout .tout-nub:before { content: "\e618"; }
.horizontal-tout .tout-nub.large { font-size: 30px; }
.horizontal-tout .tout-nub.small { font-size: 15px; }
.contained-12.horizontal-tout .tout-content, .contained-12 .horizontal-tout .tout-content, .contained-9.horizontal-tout .tout-content, .contained-9 .horizontal-tout .tout-content, .contained-6.horizontal-tout .tout-content, .contained-6 .horizontal-tout .tout-content { padding: 30px 22.5px; }
.vertical-tout .tout-photo { position: relative; height: 0; padding-bottom: 66.66%; }
.vertical-tout .tout-photo .tout-nub { font-family: 'OI-icons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; position: absolute; bottom: -2px; right: 0; left: 0; width: 100%; text-align: center; font-size: 20px; }
.vertical-tout .tout-photo .tout-nub:before { content: "\e618"; }
.vertical-tout .tout-photo .tout-nub.large { font-size: 30px; }
.vertical-tout .tout-photo .tout-nub.small { font-size: 15px; }
.vertical-tout .tout-content { padding: 40px; }
/***************/
/**** Stats ****/
/***************/
.stat .stat-figure { font-size: 2.75em; font-weight: bold; line-height: 1.125; text-transform: uppercase; margin-bottom: 5px; }
.stat .stat-descriptor { font-family: "Times New Roman", Times, serif; font-style: italic; font-size: 1.125em; line-height: 1.125; }
.stat.small .stat-figure { font-size: 1.25em; }
.stat.small .stat-descriptor { font-size: 1em; }
@media (min-width: 480px) { /* phone */ nav .nav-container { padding-left: 40px; padding-right: 20px; } footer .social-icons { height: 40px; } footer .social-icons .footer-heading { display: inline-block; margin-right: 5px; } .sidebar { margin-top: 40px; } .widget .widget-head { padding: 40px; } .widget .widget-body { padding: 40px; } .inline-video-gallery .index-grid { margin-top: -10px; } .index .sidebar { padding-left: 40px; padding-right: 40px; } .index-content { padding: 40px 40px 0; } .index-rows .index-item .nub { font-size: 40px; } .index-grid.no-gutter { margin-left: 0; margin-right: 0; } .index-grid.bordered { margin-right: -2px; } .index-grid { margin-left: -10px; margin-right: -10px; padding: 40px; } .index-grid .index-item { float: left; padding: 10px; width: 50%; margin-bottom: auto; } .index-heading { padding: 20px 40px; } .horizontal-tout .tout-content { padding: 60px; } .contained-12.horizontal-tout .tout-content, .contained-12 .horizontal-tout .tout-content, .contained-9.horizontal-tout .tout-content, .contained-9 .horizontal-tout .tout-content, .contained-6.horizontal-tout .tout-content, .contained-6 .horizontal-tout .tout-content { padding: 40px; } }
@media (min-width: 680px) { /* big phone, small tablet */ footer .footer-international .footer-heading { display: inline-block; margin-right: 20px; } .inline-video-gallery .index-grid { margin-top: -20px; } .index-rows .index-item .nub { font-size: 60px; right: -1px; top: 50%; bottom: auto; width: auto; margin-top: -30px; }
.index-rows .index-item .nub:before { content: '\e61a'; } .index-grid.bordered { margin-right: -3px; } .index-grid { margin-right: -20px; margin-left: -20px; } .index-grid .index-item { padding: 20px; width: 33.33%; } .horizontal-tout .tout-content, .horizontal-tout .tout-photo { width: 50%; } .horizontal-tout .tout-photo { position: absolute; top: 0; height: 100%; padding-bottom: 0; } .horizontal-tout .tout-caption { display: block; position: absolute; bottom: 20px; padding: 10px 20px; font-size: .875em; font-family: "Times New Roman", Times, serif; font-style: italic; background-color: rgba(255, 255, 255, 0.9); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .horizontal-tout.photo-content .tout-nub, .horizontal-tout.content-photo .tout-nub { font-size: 60px; bottom: auto; top: 50%; margin-top: -30px; }
.horizontal-tout.photo-content .tout-nub.large, .horizontal-tout.content-photo .tout-nub.large { font-size: 80px; margin-top: -40px; }
.horizontal-tout.photo-content .tout-nub.small, .horizontal-tout.content-photo .tout-nub.small { font-size: 40px; margin-top: -20px; }
.horizontal-tout.photo-content .tout-content { left: 50%; }
.horizontal-tout.photo-content .tout-nub { left: auto; right: -1px; }
.horizontal-tout.photo-content .tout-nub:before { content: "\e61a"; }
.horizontal-tout.photo-content .tout-caption { left: 0; margin-right: 20px; border-right-style: solid; border-right-width: 5px; }
.horizontal-tout.content-photo .tout-photo { left: 50%; }
.horizontal-tout.content-photo .tout-nub { right: auto; left: -1px; }
.horizontal-tout.content-photo .tout-nub:before { content: "\e619"; }
.horizontal-tout.content-photo .tout-caption { right: 0; margin-left: 20px; border-left-style: solid; border-left-width: 5px; } }
@media (min-width: 768px) { /* tablet */ }
@media (min-width: 960px) { /* netbook */ nav .nav-container { padding-right: 40px; } nav #nav-logo { background-image: url("../img/oi-logo-sprite.png"); height: 75px; } nav .nav-actions, nav .nav-main { display: block; text-align: right; color: #8f8e8c; }
nav .nav-actions > ul, nav .nav-main > ul { margin-bottom: 0; margin-right: 10px; }
nav .nav-actions > ul > li, nav .nav-main > ul > li { font-size: 12px; line-height: 20px; letter-spacing: 1px; padding-left: 7px; padding-right: 7px; }
nav .nav-actions > ul > li a, nav .nav-main > ul > li a { text-transform: uppercase; }
nav .nav-actions > ul > li a:hover, nav .nav-main > ul > li a:hover { color: #fff; } nav .nav-actions { padding-top: 10px; height: 30px; }
nav .nav-actions a.nav-action { color: #8f8e8c; }
nav .nav-actions a.nav-action i:before { font-size: 18px; display: inline-block; margin-right: 5px; vertical-align: middle; } nav .nav-main ul.level-1 { position: relative; } nav #nav-main-items { position: relative; /* Brand & Pillar hover colors */ }
nav #nav-main-items li.level-1 { z-index: 1; }
nav #nav-main-items li.level-1 > a { color: #efeeea; line-height: 65px; display: inline-block; }
nav #nav-main-items li.level-1.active[data-class="brand-purple"] > a { color: #611171; }
nav #nav-main-items li.level-1.active[data-class="brand-teal"] > a { color: #00abab; }
nav #nav-main-items li.level-1.active[data-class="brand-orange"] > a { color: #f15b22; }
nav #nav-main-items li.level-1.active[data-class="brand-pink"] > a { color: #ed027e; }
nav #nav-main-items .dropdown > ul { margin-right: 40px; margin-bottom: 0; padding-left: 5px; vertical-align: top; max-width: 180px; float: left; }
nav #nav-main-items .dropdown > ul:last-child { margin-right: 0; }
nav #nav-main-items li.level-2 { margin-bottom: 20px; padding-left: 0; display: block; }
nav #nav-main-items li.level-2:last-child { margin-bottom: 0; }
nav #nav-main-items li.level-2 > a { color: #efeeea; margin-bottom: 7px; letter-spacing: 1px; display: block; }
nav #nav-main-items li.level-2 > a:hover { color: #fff; }
nav #nav-main-items li.level-3 { display: block; padding-left: 0; }
nav #nav-main-items li.level-3 > a { text-transform: none; display: block; line-height: 1.25; margin-bottom: 7px; }
nav #nav-main-items li.level-2.events ul{display:none;}
nav #nav-main-items [data-class='brand-teal'] li.level-3 > a { color: #b4e1e3; }
nav #nav-main-items [data-class='brand-orange'] li.level-3 > a { color: #fbbea6; }
nav #nav-main-items [data-class='brand-pink'] li.level-3 > a { color: #f7b3d1; }
nav #nav-main-items [data-class='brand-purple'] li.level-3 > a { color: #ac99b1; }
nav #nav-main-items [data-class='brand-teal'] li.level-3 > a:hover, nav #nav-main-items [data-class='brand-orange'] li.level-3 > a:hover, nav #nav-main-items [data-class='brand-pink'] li.level-3 > a:hover, nav #nav-main-items [data-class='brand-purple'] li.level-3 > a:hover { color: #efeeea; }
nav #nav-main-items li[data-class='brand-teal']:hover > a { color: #00abab; }
nav #nav-main-items li[data-class='brand-orange']:hover > a { color: #f15b22; }
nav #nav-main-items li[data-class='brand-pink']:hover > a { color: #ed027e; }
nav #nav-main-items li[data-class='brand-purple']:hover > a { color: #4a0059; } nav #nav-main-nub { position: absolute; bottom: -1px; z-index: 0; font-size: 13px; -webkit-transition: left .3s ease, color .3s; transition: left .3s ease, color .3s; } nav #nav-dropdown-bg { position: absolute; left: 0; width: 100%; z-index: 1; -webkit-transition: background-color .3s, height .3s; transition: background-color .3s, height .3s; } nav .dropdown { display: none; position: absolute; padding: 40px 0 30px; top: 65px; left: 0; z-index: 1; text-align: left; width: 300px; }
nav .dropdown li, nav .dropdown li a { line-height: 1; } nav button.offcanvas-trigger { display: none; } .side-menu { border-top: none; padding: 40px 0 40px 40px; border-left: solid 5px; } .side-menu ul.level-1 > li .toggle { display: none; } .side-menu ul.level-1 .active:before { font-family: 'OI-icons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: '\e619'; position: absolute; left: -40px; } .side-menu ul.level-2 { display: block; } .side-menu li a { display: inline; line-height: 1.125; } #mobile-donate { display: none; } body { padding-bottom: 0; } .no-breadcrumbs #content { margin-top: 95px; } .breadcrumbs { display: block; height: 40px; font-size: .875em; color: #efeeea; padding-left: 40px; padding-right: 40px; }
.breadcrumbs a { line-height: 40px; font-size: 12px; color: #efeeea; text-transform: uppercase; }
.breadcrumbs ul.inline { margin-left: -5px; margin-right: -5px; }
.breadcrumbs ul.inline li { padding-right: 5px; padding-left: 5px; }
.breadcrumbs li + li:before { content: '/'; display: inline-block; position: relative; margin-right: 10px; } footer .footer-left { text-align: left; width: 70%; float: left; } footer .footer-right { text-align: right; width: 30%; float: left; } footer .footer-legal { margin-top: 0; margin-bottom: 0; } footer .footer-legal ul li { line-height: 40px; } footer .social-icons { margin-bottom: 0; } footer .footer-copyright { margin-top: 0; margin-bottom: 0; width: 50%; } footer .footer-logos { width: 50%; } .footer-nav ul.level-2 { display: block; } .footer-nav .toggle { display: none; } .footer-nav .footer-nav-heading { padding-right: 0; } .footer-nav.footer-3-columns .footer-column { width: 33%; } .footer-nav.footer-4-columns .footer-column { width: 25%; } .footer-nav.footer-5-columns .footer-column { width: 20%; } #feature { min-height: 300px; height: 400px; height: 50vh; } .content.with-sidebar { float: left; width: calc(100% - 315px); margin-right: 40px; } .sidebar { float: left; margin-top: 0; width: 275px; } .widget { display: block; margin-bottom: 20px; } .video-title:hover { color: #333; } .index { padding: 40px; } .index .sidebar { padding-left: 0; padding-right: 0; } .index .filter-params { margin-top: 0; } .index-content { padding: 0; margin-bottom: 20px; } .index-rows .index-item:first-child { padding-top: 0; } .index-grid { padding: 0; } .icon-overlay { position: relative; }
.icon-overlay:after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; height: 100%; background-color: #4a0059; opacity: 0; -webkit-transition: opacity .3s; transition: opacity .3s; }
.icon-overlay:before { display: block; opacity: 0; font-size: 40px; color: #fff; position: absolute; left: 0; width: 100%; top: 50%; margin-top: -20px; text-align: center; z-index: 1; -webkit-transition: opacity .3s; transition: opacity .3s; }
.icon-overlay:hover:after { opacity: .8; }
.icon-overlay:hover:before { opacity: 1; } #content { margin-top: 135px; } .no-breadcrumbs #content { margin-top: 95px; } .horizontal-tout .tout-content { padding: 120px 80px; } .contained-9.horizontal-tout .tout-content, .contained-9 .horizontal-tout .tout-content { padding: 40px; } .contained-12.horizontal-tout .tout-content, .contained-12 .horizontal-tout .tout-content { padding: 60px; } }
@media (min-width: 1080px) { /* small desktop */ nav #nav-main-items .level-1 > ul { padding-left: 10px; max-width: 200px; } }
@media (min-width: 1260px) { /* desktop */ }
@media only screen and (min-width: 960px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-width: 960px) and (min-resolution: 192dpi) { nav #nav-logo { background-image: url("../img/oi-logo-sprite-2x.png"); } }
@media (min-width: 1024px) { nav .nav-actions > ul > li, nav .nav-main > ul > li { padding-left: 10px; padding-right: 10px; } }
/* OI v0.1.0
* Copyright (c) 2016
*/
/*********************************************/
/**** Custom styling for Padiact overlays ****/
/*********************************************/
.padiOverlay{position:fixed;left:0px;top:0px;padding:0px;margin:0px;visibility:visible;overflow-x:hidden;overflow-y:auto;width:100%;height:100%;z-index:4}.padiFade{zoom:1;background-color:rgba(0, 0, 0, 0.8);width:100%;height:100%;z-index:4}.padiPop4Wrap{position:absolute;visibility:visible;z-index:4;padding:10px;left:50%;margin-left:-200px;top:5%;height:auto;width:auto;max-width:400px}.padiPop4Overlay{position:static;margin:0;z-index:4;overflow:auto}.padiPop4Overlay h1.padiTitle{font-size:1.5em;color:#7bc557}.padiPop4Overlay div.padiPopupContent{position:relative;background:#fff;margin-bottom:0}.padiPop4Overlay .padiContent{padding:40px}.padiPop4Overlay .padiContent p{font-size:.875em}.padiPop4Overlay .padiForm p{font-size:16px}.padiPop4Overlay .padiCriticalMessage{border:none !important;background:#efeeea;padding:10px;font-size:.875em}.padiPop4Overlay .padiFields{width:100%;display:block;vertical-align:top;padding:0}.padiPop4Overlay .padiThanks{display:block;vertical-align:top;padding:40px}.padiClearfix:after{content:" ";visibility:hidden;display:block;height:0;clear:both}.padiPop4Overlay .padiClose{margin:0;display:block;float:right;font-size:28px;line-height:40px;color:#8f8e8c;text-decoration:none !important;border:none;width:40px;height:40px;text-align:center}.padiPop4Overlay .padiClose:hover{color:#333}.padiPop4Overlay form{position:relative;margin:0;display:block}.padiPop4Overlay form .padiField{display:block;width:100%;vertical-align:middle}.padiPop4Overlay form .padiCheck{margin:0px 4px 2px 4px;vertical-align:bottom}.padiPop4Overlay p.padiErrorMessage{color:#ce1500}.padiPop4Overlay form .padiButton{display:inline-block;text-align:center;color:#fff;text-transform:uppercase;font-size:.75em;letter-spacing:1px;font-weight:bold;font-family:"proxima-nova", Arial, sans-serif;box-shadow:none;-webkit-transition:box-shadow 0.6s ease-out 0s;transition:box-shadow 0.6s ease-out 0s;line-height:1.5;cursor:pointer;padding:1.125em 1.6666666em;border:none;outline:none;background-color:#7bc557;box-shadow:inset 0 100px 0 0 #7bc557;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.padiPop4Overlay form .padiButton:hover{box-shadow:0 0 0 0 #6fbc49 inset}.padiPop4Overlay form .padiSLabel{font-size:12px;display:block;margin:5px 0}.padiPop4Overlay form label input[type="checkbox"]{position:relative;left:0}.padiPop4Overlay .privacy{font-size:.75em;font-style:italic;font-family:"Times New Roman", Times, serif;color:#8f8e8c;line-height:1.5;margin-top:0}.padiPreload{display:inline-block;position:absolute;bottom:0;right:inherit;padding:3px}
/* OI-HelloBar v0.0.1
*/
.hello-bar{display:none;position:fixed;top:0;left:0;width:100%;height:0;z-index:3;color:#fff;text-align:center}.hello-bar + nav.fixed{top:0}.hello-bar p{display:inline-block;margin:1em 0 1em}.hello-bar a{color:#fff}.hello-bar .btn{display:inline-block;margin:1em}.hello-bar .closer{position:absolute;top:1rem;right:0;width:2em;height:2em}.hello-bar.active{display:block;height:4rem;-webkit-transition:height 500ms ease;-moz-transition:height 500ms ease;-ms-transition:height 500ms ease;-o-transition:height 500ms ease;transition:height 500ms ease}.hello-bar.active + nav.fixed{top:4rem;-webkit-transition:top 500ms ease;-moz-transition:top 500ms ease;-ms-transition:top 500ms ease;-o-transition:top 500ms ease;transition:top 500ms ease}
