/* 
  -----------------------------------
  Accordion Panel Magic
  by Project Seven Development
  www.projectseven.com
  Style Theme: 18 - Pastel Beauty
  Adapted for City of Belding, File Cabinets, 071420
  -----------------------------------
*/

.p7AP3-18 { /* container colors and settings */
    padding: 0px;
/*     margin:0px 0px 2em 1em !important; */
    width: auto;
    border-radius: 4px;
    background-color: #E1E1E1; /* border inset color around drawers */
/*     border: 1px solid; */
/*     border-color: #E1E1E1; */ /* border line color around drawers */
}

.p7AP3-18 .p7ap3-col-wrapper p {
    font-size:100%;
}
    
    
/* DECSRIPTION LIST FOR FILE CABINETS, created for City of Ionia, 021218 */

.p7AP3-18 dl {
    margin:0px;
    padding:0px;
}
.p7AP3-18 dt {
     margin-right:1em;
     margin-top:1em;
     padding-bottom:0.5em;
     border-bottom:1px dotted #777;
}
.p7AP3-18 dt:first-of-type {
     margin-top:0px;
}
.p7AP3-18 dd {
     margin:0.5em 1em 0.5em 1em;
     padding-bottom:0.5em;
     font-size:0.95em;
     line-height:1.2em;
     border-bottom:1px dotted #777;
}
.p7AP3-18 dd a {
    text-decoration:none;
    -webkit-transition: ease-in-out 0.2s;
    transition: ease-in-out 0.2s;
    border-radius:4px;
}
.p7AP3-18 dd a:hover{
    color:#7c0d1f;
    text-decoration:none;
    text-shadow: 0px 0px 0px #7c0d1f;
    background-color:#f2f4f1;
}

/* END DESCRIPTION LIST */

/*
.p7AP3-18 a:link {color:#0000BB;}
.p7AP3-18 a:hover {color:#FFFFFF;}
.p7AP3-18 a:active {color:#0000BB;}
.p7AP3-18 a:visited {color:#0000BB;}
*/

.p7AP3:after {
/*
    content: "\0020";
    font-size: 0px;
    display: inline;
    overflow: hidden;
    line-height: 1;
*/
}
.p7AP3trig.p7ap3-theme-18 {
    margin: 0px;
}
.p7AP3trig.p7ap3-theme-18 h3, .p7AP3trig.p7ap3-theme-18 h4, .p7AP3trig.p7ap3-theme-18 p {
    margin: 0;
    padding: 0;
    letter-spacing: normal;
    font-size: 1.05em;
}
.p7AP3trig.p7ap3-theme-18 a {
    display: block;
    text-decoration: none;
    padding: 10px 20px;
    background-color: #004F59; /* tab-closed bg color. See also line 117 for hover color. */
    color: #FFFFFF; /* tab-closed text color */
    background-image: url(img/p7ap3Plus_white.gif);
    background-repeat: no-repeat;
    background-position: left center;
    font-weight: normal;
    box-shadow: inset 0px 60px 10px rgba(255,255,255,.1);
    -webkit-transition: all ease-in-out 0.25s 0.1s;
    transition: all ease-in-out 0.35s 0.1s;
    border-bottom: 2px solid #E1E1E1; /* spacer color between drawers */
}
.p7AP3trig.p7ap3-theme-18 .p7AP3_ext, .p7AP3trig.p7ap3-theme-18 .p7AP3_ext.p7AP3trig_down {
    background-image: url(img/p7AP3_page_black.gif);
    background-color: #C7C7C7;
    letter-spacing: normal;
}
.p7AP3trig.p7ap3-theme-18 .p7AP3_ext:hover {
    background-image: url(img/p7AP3_page_black.gif);
    background-color: #A2A2A2;
    border-color: #FFF;
    color: #000000;
    box-shadow: inset 0px 40px 40px rgba(255,255,255,.25);
}
.p7AP3trig.p7ap3-theme-18 a:hover {
    color: #FFFFFF; /* tab-closed text hover color */
    background-color: #007180; /* tab-closed bg hover color (set lighter or darker than tab-closed main color, line 92) */
    background-image: url(img/p7ap3_south_white.gif);
}
.p7AP3trig.p7ap3-theme-18 a:focus {}
.p7AP3trig.p7ap3-theme-18 .p7AP3trig_down {
    background-image: url(img/p7ap3Minus_white.gif);
    background-repeat: no-repeat;
    color: #FFFFFF; /* tab-open no-hover tab text color */
    background-color: #007180; /* tab-open bg color, like line 92 */
}
.p7AP3trig.p7ap3-theme-18 .p7AP3trig_down:hover {
    background-color: #007180; /* tab-open bg hover color (see tab-open bg color line 117, same or lighter or darker) */
    color: #FFFFFF; /* tab-open hover text color */
}
.p7AP3cwrapper.p7ap3-theme-18 {
    position: relative;
}
.p7ap3-theme-18 a.ap3first {
    border-radius: 4px 4px 0px 0px;
}
.p7ap3-theme-18 a.ap3last {
    border-radius: 0px 0px 5px 5px;
    border-bottom: none;
}
.p7ap3-theme-18 a.ap3first.ap3last {
    border-radius: 4px 4px 4px 4px;
}
.p7ap3-theme-18 a.ap3last.p7AP3trig_down {
    border-radius: 0px 0px 0px 0px;
}
.p7ap3-theme-18 a.ap3first.ap3last.p7AP3trig_down {
    border-radius: 4px 4px 0px 0px;
}
.p7AP3panelcontent.p7ap3-theme-18 { /* panel content colors, text and bg */
    line-height: 1.5em;
    color: #222222;
    background-color: #E1E1E1;
    margin: 0px;
    padding:2vw;
}
.p7AP3panelcontent.p7ap3-theme-18 h1,
.p7AP3panelcontent.p7ap3-theme-18 h2,
.p7AP3panelcontent.p7ap3-theme-18 h3,
.p7AP3panelcontent.p7ap3-theme-18 h4 {
    margin: 0px;
}
.p7AP3content.p7ap3-theme-18 p {
    margin: 0.5em 0px;
}
.p7AP3trig.p7ap3-theme-18 a.current_mark {
    font-weight: bold;
}
.p7AP3trig.p7ap3-theme-18 .p7AP3_ext.current_mark, 
.p7AP3trig.p7ap3-theme-18 .p7AP3_ext.current_mark:hover {
    background-image: url(img/p7AP3_page_black.gif) !important;
    background-color: #C6C6C6 !important;
    color: #000 !important;
}
.p7AP3panelcontent.p7ap3-theme-18 .current_mark {
    font-weight: bold;
}

.responsive .ap3-toolbar {display: none;}

@media only screen and (min-width: 0px) and (max-width: 768px) {
.p7AP3-18.responsive .ap3-toolbar {
    display: block;
    padding: 0px 10px;
    text-align: right;
    cursor: pointer;
}
.p7AP3-18.responsive .ap3-toolbar a {
    font-size: 2em;
    font-weight: bold;
    color: #999;
    text-decoration: none;
    display: block;
}
.p7AP3-18.responsive .ap3-toolbar a:hover {
    color: #000;
}
.responsive .toggle-text a:before {
    position: relative;
    top: -.25em;
}
.p7AP3-18.responsive .toggle-text.closed a:before {
    content: "Show Menu \0020";
    font-size: .5em;
}
.p7AP3-18.responsive .toggle-text.opened a:before {
    content: "Hide Menu \0020";
    font-size: .5em;
}
.p7AP3root-wrapper.closed {
    height: 0px;
    overflow:hidden;    
}
.p7AP3root-wrapper.opened {
    height: auto;
    overflow: hidden;   
}

}