/*
 *  This is the file where you put your CSS changes.
 *  You should preferrably use this and override the
 *  relevant properties you want to change here instead
 *  of customizing plone.css to survive upgrades. Writing
 *  your own plone.css only makes sense for very heavy
 *  customizations. Useful variables from Plone are
 *  documented at the bottom of this file.
 */

/* <dtml-with base_properties> (do not remove this :) */
/* <dtml-call "REQUEST.set('portal_url', portal_url())"> (not this either :) */


/* DELETE THIS LINE AND PUT YOUR CUSTOM STUFF HERE */

body {
    background: url('./++theme++posow.plone/images/background.png') repeat 0 0 transparent;
    font-family: Helvetica, Arial, sans-serif;
    color: #826c45;
}

#content a:link, .portlet a:link,
a:link, a:visited {
    color: #3385c6;
}
#portal-siteactions li a:hover {
    color: #BFCC1D;
}
#content a:hover, .portlet a:hover {
    color: #BFCC1D !important;
}
#visual-portal-wrapper {
    max-width: 1140px;
    margin: 20px auto 0;
    text-align: left;
}

.container {
    position: relative;
}

#tools {
    position: absolute;
    top: 0;
    right: 0;
}

/* ------ *
 * Header *
 * ------ */
#portal-logo-wrapper {
    background: url('./++theme++posow.plone/images/arc-header.png') no-repeat right 40px #E9E5DC;
}
#portal-logo {
    margin: 20px;
}

/* ---------- *
 * Global nav */

#globalnav-wrapper,
#portal-globalnav {
    background: rgb(137,121,95);
    background: -moz-linear-gradient(top,  rgba(137,121,95,1) 0%, rgba(120,103,73,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(137,121,95,1)), color-stop(100%,rgba(120,103,73,1)));
    background: -webkit-linear-gradient(top,  rgba(137,121,95,1) 0%,rgba(120,103,73,1) 100%);
    background: -o-linear-gradient(top,  rgba(137,121,95,1) 0%,rgba(120,103,73,1) 100%);
    background: -ms-linear-gradient(top,  rgba(137,121,95,1) 0%,rgba(120,103,73,1) 100%);
    background: linear-gradient(top,  rgba(137,121,95,1) 0%,rgba(120,103,73,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#89795f', endColorstr='#786749',GradientType=0 );
}
#globalnav-wrapper {
    -moz-box-shadow: 0px -6px 4px 0px #786749;
    -webkit-box-shadow: 0px -6px 4px 0px #786749;
    -o-box-shadow: 0px -6px 4px 0px #786749;
    box-shadow: 0px -6px 4px 0px #786749;
    margin-bottom: 2.5em;
    overflow: visible;
    border-bottom: 3px solid #c5b9a1;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#portal-globalnav {
    margin: 0;
}
#portal-globalnav li a {
    color: White;
    padding: 1em;
    background-color: transparent;
    text-align: center;
    min-width: 5em;
    /* overrides dropdown menu */
    display: inline-block;
    position: inherit;
    border-top: none;
}
#portal-globalnav > li.hover,
#portal-globalnav .selected a:hover,
#portal-globalnav .selected a, #portal-globalnav a:hover {
    background-image: url('./++theme++posow.plone/images/fleche-sousmenu.png');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-color: transparent;
    color: White;
}


/* ------------------ *
/* Dropdown overrides */
ul.submenu {
    position: absolute;
    width: 100%;
    background-color: transparent;
    border: none;
    z-index: 10000;
}
#portal-globalnav li {
    position: static;
}
#portal-globalnav ul.submenu li {
    display: inline;
    float: none;
}
#portal-globalnav ul.submenu li a {
    color: #222222;
    width: auto;
    padding: 1em;
}
#portal-globalnav ul.submenu a, #portal-globalnav ul.submenu a:hover {
    display: inline-block;
}
#portal-globalnav .selected ul.submenu a,
#portal-globalnav ul.submenu a,
#portal-globalnav li.selected ul.submenu a:hover,
#portal-globalnav ul.submenu a:hover {
    background-color: #e9e5dc;
    background-image: none;
    margin-right: -4px;
    border-right: 1px solid #FFF;
    border-top: 3px solid #c5b9a1;
}
#portal-globalnav li.selected ul.submenu a:hover,
#portal-globalnav ul.submenu a:hover  {
    background-color: #c5b9a1;
}
#portal-globalnav li:hover ul, #portal-globalnav li li:hover ul, #portal-globalnav li li li:hover ul, #portal-globalnav li li li li:hover ul,
#portal-globalnav li.sfhover ul, #portal-globalnav li li.sfhover ul, #portal-globalnav li li li.sfhover ul, #portal-globalnav li li li li.sfhover ul {
    left: 0;
}

/* -------------- *
/* Themes submenu */

#portal-globalnav ul.submenu li#l1-volunteer-management a:hover  {
    background-color: #BFCC1D;
    color: #222222;
}
#portal-globalnav ul.submenu li#l1-oiled-shoreline-assessment a:hover  {
    background-color: #3385C6;
    color: #FFFFFF;
}
#portal-globalnav ul.submenu li#l1-oiled-shoreline-clean-up a:hover  {
    background-color: #FCDB1A;
    color: #222222;
}
#portal-globalnav ul.submenu li#l1-oiled-wildlife-response a:hover  {
    background-color: #826C45;
    color: #FFFFFF;
}
#portal-globalnav ul.submenu li#l1-response-with-local-fishermen-assistance-using-small-vessels-of-opportunity a:hover  {
    background-color: rgba(232, 88, 17, 0.8);
    color: #FFFFFF;
}
#portal-globalnav ul.submenu li#l1-oil-spill-waste-management a:hover  {
    background-color: rgba(150, 47, 80, 0.8);
    color: #FFFFFF;
}
/* --------- *
 * Searchbox */

#portal-searchbox {
    margin: 0.5em;
    padding: 0;
    font-size: 0.8em;
}

#portal-searchbox label {
    height: 0;
}
#searchGadget {
    width: 180px;
}
#searchGadget, .LSBox input.searchButton {
    height: 2em;
    font-size: 1em;
    border-radius: 0;
    border: none;
}
.LSBox input.searchButton {
    margin-left: -5px;
    padding-left: 20px;
    background: url('./++theme++posow.plone/images/search.png') no-repeat 6px 50% transparent;
}
.LSBox {
    background: rgb(230,228,221);
    background: -moz-linear-gradient(top,  rgba(230,228,221,1) 1%, rgba(201,193,174,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(230,228,221,1)), color-stop(100%,rgba(201,193,174,1)));
    background: -webkit-linear-gradient(top,  rgba(230,228,221,1) 1%,rgba(201,193,174,1) 100%);
    background: -o-linear-gradient(top,  rgba(230,228,221,1) 1%,rgba(201,193,174,1) 100%);
    background: -ms-linear-gradient(top,  rgba(230,228,221,1) 1%,rgba(201,193,174,1) 100%);
    background: linear-gradient(top,  rgba(230,228,221,1) 1%,rgba(201,193,174,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6e4dd', endColorstr='#c9c1ae',GradientType=0 );
}
.LSBox .searchSection {
    display: none;
}
#LSResult {
    margin-top: 0;
}

/* In portlet */
input.searchField {
    width: 55%;
}

/* -------- *
 * Portlets *
 * -------- */

.portlet {
    border: 3px solid #BFCC1D;
    border-radius: 3px;
    background-color: White;
}

/* --------------- *
 * Portlet navtree */

.portlet ul.navTree .navTreeCurrentItem,
.portlet header {
    background-color: transparent;
}
.portlet ul.navTree .navTreeCurrentItem {
    background-color: transparent;
    border-left-width: 0;
    margin-left: 0;
    margin-right: 0;
}

/* ------------------- *
 * Portlet static text */

.portletStaticText {
    margin-bottom: 1em;
}

/* ----------------------- *
 * Portlet static homepage */

.section-front-page #portal-column-two .portletStaticText {
    border: 0 none;
    position: relative;
    margin-bottom: 1.5em;
}
.section-front-page #portal-column-two .portletStaticText header {
    bottom: 0;
    position: absolute;
    line-height: 1em;
    color: #FFF;
    background-color: rgba(191, 204, 29, 0.8);
}
.section-front-page #portal-column-two .portlet.portletStaticText header a,
.section-front-page #portal-column-two .portlet.portletStaticText header a:hover {
    color: #FFF !important;
}
.section-front-page #portal-column-two .portletStaticText.portlet-static-oiled-shoreline-assessment header {
    background-color: rgba(51, 133, 198, 0.8);
}
.section-front-page #portal-column-two .portletStaticText.portlet-static-oiled-shoreline-cleanup header {
    background-color: rgba(252, 219, 26, 0.8);
}
.section-front-page #portal-column-two .portlet.portletStaticText.portlet-static-oiled-wildlife-response header {
    background-color: rgba(120, 121, 115, 0.8);
}
.section-front-page #portal-column-two .portlet.portletStaticText.portlet-static-local-fishermen-assistance header {
    background-color: rgba(232, 88, 17, 0.8);
}
.section-front-page #portal-column-two .portlet.portletStaticText.portlet-static-oil-spill-waste-management header {
    background-color: rgba(150, 47, 80, 0.8);
}
.section-front-page #portal-column-two .portlet.portletStaticText .portletContent,
.section-front-page #portal-column-two .portlet.portletStaticText .portletFooter{
    padding: 0;
}
.section-front-page #portal-column-two .portletStaticText p {
    margin: 0;
}

/* ------------ *
 * Portlet news */

.portlet.portletNews {
    border: 4px #fcdb1a solid;
    margin-top: 40px;
}
.portletNews .portletHeader,
.portletNews .portletItem,
.portletNews .portletFooter {
    border: 3px #826c45 solid;
}
.portletNews .portletHeader {
    border-width: 3px 3px 0 3px;
}
.portletNews .portletItem {
    border-width: 0 3px;
}
.portletNews .portletFooter {
    border-width: 0 3px 3px 3px;
}
.portletNews header a.tile {
    text-align: center;
    margin-top: -40px;
    text-transform: uppercase;
    color: White;
    background: url('./++theme++posow.plone/images/news.png') no-repeat center center transparent;
    height: 58px;
    font: 0/0 a;
    color: transparent;
}


/* ------- *
/* Content *
 * ------- */

/* --------------- *
/* Common contents */

#portal-columns {
    clear: both; /* should be removed when header rows will be changed */
}

#portal-columns > .row {
background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
background: -ms-radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); /* IE10+ */
background: radial-gradient(center, ellipse cover,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
min-height: 350px;
}
#portal-columns .row {
    float: none;
}

#edit-bar,
#content-views,
#contentActionMenus,
#contentActionMenus dl.actionMenu a, #contentActionMenus dl.actionMenu.activated dd {
    background-color: #bfcc1d;
    border-color: #bfcc1d;
}

#portal-breadcrumbs {
    margin: 2em 0 2em 0.25em;
}
#portal-breadcrumbs ol {
    display: inline-block;
}
#portal-breadcrumbs li:after {
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
    padding: 8px 5px;
    content: " ";
    background: url('./++theme++posow.plone/images/fleche-arianne.png') no-repeat 0 0 transparent;
    vertical-align: baseline;
}
#portal-breadcrumbs li:last-of-type:after {
    content: none;
}

#portal-breadcrumbs ol:before {
    background-image: url('./++theme++posow.plone/images/home.png');
    padding: 11px 10px;
    display: inline-block;
    content: " ";
    margin: 0;
    vertical-align: middle;
}

/* -------------- *
 * TinyMCE styles */

.twocsscol {
    -moz-column-count: 2;
    columns: 2 48%;
}

/* ---------------- *
 * Homepage content */

/* ------------------ *
/* Thumbnail contents *
 * (for partners)     */

.photoAlbumEntry, .photoAlbumFolder {
    background: none;
    border: 1px solid #E9E5DC;
    margin-right: 1em;
    margin-bottom: 1em;
    padding: 0;
    height: 120px;
    width: 120px;
}
.photoAlbumEntry img {
    border: none;
    max-width: 100px;
}
.section-partners .photoAlbumEntryTitle {
    display: none;
}
#content .photoAlbum a {
    border-bottom: none;
    height: 120px;
    width: 120px;
}

/* ------ *
/* Footer *
 * ------ */
#footer {
    max-width: 940px;
    margin: 0 auto;
}
#portal-footer {
    background: none;
    text-align: center;
    line-height: 1.5em;
}
#portal-footer .image-left {
    margin-top: 0;
}

/* plone site setup pages */
.template-usergroup-userprefs .row,
.template-usergroup-userprefs #visual-portal-wrapper {
	max-width: none;
}

/* </dtml-with> */

/* Fix for plone 5.2 migration */

#portal-globalnav {
    list-style-image: none;
    position: relative;
    zoom: 1;
    clear: both;
    font-size: 80%;
}

#portal-globalnav li {
    float: left;
    position: static;
}

.plone-navbar-nav li .submenu {
    background-color: transparent;
}

#portal-globalnav .opener {
    display: none;
}

#content ul.select2-choices {
    margin-left: 0;
}

#edit-zone li {
    display: list-item;
}

#portal-breadcrumbs .container {
    padding: 0;
}

.portletNews .portletContent {
    padding: 0;
}

.portletNews .portletContent li.portletItem {
    padding: 1em;
    margin-bottom: 0;
}

#content nav.pagination ul,
#content ul.pagination {
    list-style-type: none;
    margin-left: 0;
    margin-top: 1em;
    display: block;
}

#content nav.pagination ul {
    float: left;
    width: 100%;
}

#content nav.pagination ul > li,
#content ul.pagination > li {
    margin: 0;
}

#content nav.pagination ul > li > span,
#content nav.pagination ul > li > a {
    position: relative;
    float: left;
    padding: 6px 12px;
    line-height: 1.42857143;
    text-decoration: none;
    color: #337ab7;
    background-color: #fff;
    border: 1px solid #ddd;
    margin-left: -1px;
}
#content nav.pagination ul > li:first-child > span,
#content nav.pagination ul > li:first-child > a {
    margin-left: 0;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
}
#content nav.pagination ul > li:last-child > span,
#content nav.pagination ul > li:last-child > a {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}

@media handheld, screen and (max-device-width: 480px) {
    /* http://www.posow.org/portal_css/mobile.css?original=1 */
    /* */
    #portal-column-one,
    #portal-column-two,
    #portal-column-content {
        clear: both;
        width: 97.75%;
    }
    #portal-logo {
        display: none;
    }
    #portal-top {
        font-size: 1.8rem;
    }
    #portal-personaltools {
        margin-bottom: 1em;
    }
    #portal-searchbox {
        font-size: 2rem;
    }
    #footer {
        font-size: 1.8rem;
    }
    #searchGadget {
        width: 300px;
    }
    .LSBox input.searchButton {
        width: 150px;
    }
    .portlet {
        font-size: 1.25rem;
    }
    #portal-globalnav {
        font-size: 2rem;
        display: flex;
        flex-direction: column;
    }
    #portal-globalnav li a {
        min-width: 3em !important;
        padding:0.5em 1.5em 1em 0.5em;
        border: none;
    }
    #portal-searchbox {
        float: none !important;
        margin: 1em 0;
        text-align: center;
    }
    #portal-searchbox input {
        font-size: 1rem !important;
    }
    #content-views a {
        font-size: 1.5rem;
        line-height: 2em !important;
        padding: 0.5em;
    }
    #content {
        font-size: 1.25rem;
    }
    #content .documentDescription, #content #description {
        font-size: 1.25rem;
    }
    #content li.formTab a {
        font-size: 1.4rem;
        line-height: 2em !important;
        padding: 0.25em;
    }
    #edit-bar {
        min-height: 5em;
    }
    #contentActionMenus a {
        width: 100%;
        line-height: 2em !important;
        font-size: 1.5rem;
    }
    input, textarea {
        font-size: 1.4rem !important;
    }
    div.managePortletsLink,
    a.managePortletsFallback {
        font-size: 1.4rem;
    }
    div.overlay {
        font-size: 1.2rem;
    }
    div.overlay-iframe,
    div.overlay-ajax {
        width: 90%;
    }
}

.subsection-allVolunteers #portal-columns > .row {
    overflow: visible;
}