/*----------------------------------+
 | Site: Chicago Board of Education |
 | Part: Master styles              |
 +----------------------------------*/

/* Imports
=====================================================================*/
@import url(//fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,700italic,400italic|Open+Sans:400,400italic,700,700italic);
@import url(/content/styles/reset.css);
@import url(/content/styles/forms.css?t=1);
@import url(/content/styles/ie.css);


/* Fonts
======================================================================*/
body, .flag, input, .mute, #search-results *, select, textarea { font-family: "Open Sans", Arial, sans-serif; }
#footer .org, h1, h2, h3, h4, h5, h6 { font-family: "Source Sans Pro", Arial, sans-serif; }
input[type=password] { font-family: Arial, sans-serif; }


/* Basics
======================================================================*/
a { color: #22408e; text-decoration: none; }
a:hover { text-decoration: underline; }
address { font-style: normal; }
body { font-size: 15px; line-height: 1.4; padding-bottom: 30px; }
cite, em { font-style: italic; }
dl, ol, p, table, ul { margin-bottom: 1.4em; }
dt { margin-top: 1.4em; }
dt:first-child { margin-top: 0; }
dt, strong { font-weight: bold; }
h1 { font-size: 30px; line-height: 1.3; margin-bottom: 0.5em; }
h1, h2, h3, h4, h5, h6, strong { font-weight: bold; }
h1 span, h2 span, h3 span { font-size: 15px; font-weight: normal; margin-left: 0.5em; }
h2 { font-size: 25px; line-height: 1.1; margin-bottom: 0.5em; }
h3 { font-size: 18px; line-height: 1.2; }
hr { background: #ddd; border: 0; clear: both; color: #ddd; height: 1px; margin: 2em 0; }
img { max-width: 100%; }
li { margin-bottom: 0.3em; }
ol { list-style: decimal; margin-left: 2em; }
ol ol { list-style: lower-alpha; }
ol ol ol { list-style: lower-roman; }
table { border-collapse: collapse; }
table h2, table p { margin: 0; }
td, th { border: 1px solid #ddd; border-width: 1px 0; padding: 0.3em 15px 0.3em 0; vertical-align: top; }
td[align=center], th[align=center] { text-align: center; }
td[align=right], th[align=right] { text-align: right; }
ul { list-style: disc; margin-left: 1.5em; }

/* Stock classes */
.l { float: left; }
.r { float: right; }
.num { text-align: right; }
ul.flat { list-style: none; margin-left: 0; }
ul.flat > li { background: none; margin: 0; padding: 0; }


/* Core layout
======================================================================*/
#content-wrapper, #copyright, #features-content, #footer-content, #nav-content, #header-content { margin: 0 auto; width: 980px; }
.clear { clear: both; }

/* Columns */
.c2l, .c2r { width: 48%; }
.c2l, .c3l, .c3m { float: left; }
.c2r, .c3r { float: right; }
.c3l { margin-right: 3%; }
.c3l, .c3m, .c3r { width: 31%; }

/* Content */
#content { overflow: hidden; padding: 30px; }
#content-primary { float: left; width: 65.57%; }
#content-secondary { float: right; width: 31.15%; }
#content-wrapper { background: #fff; box-shadow: 0 2px 11px rgba(0, 0, 0, 0.32); margin-bottom: 15px; }
    
    /* Full */
    .full #colophon { background: none; padding: 0; }
    .full #content-primary { float: none; width: auto; }
    .full #content-secondary { display: none; }
    .full #footer .section, .full #footer #photos { display: none; }


/* Content
======================================================================*/

/* Action */
.action {
    background: #336ba6;
    background: -moz-linear-gradient(top, #336ba6 0%, #024691 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#336ba6), color-stop(100%,#024691));
    background: -webkit-linear-gradient(top, #336ba6 0%,#024691 100%);
    background: -o-linear-gradient(top, #336ba6 0%,#024691 100%);
    background: -ms-linear-gradient(top, #336ba6 0%,#024691 100%);
    background: linear-gradient(to bottom, #336ba6 0%,#024691 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#336ba6', endColorstr='#024691',GradientType=0 );
    border: 1px solid #024691;
    border-radius: 5px;
    color: #fff;
    font-weight: bold;
    display: inline-block;
    padding: 0.5em 1em;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

/* Attendance options */
#attend-observe { float: left; }
#attend-speak { float: right; }
#attendance-options { display: flex; justify-content: center; list-style: none; margin: 30px -1em; }

#attendance-options li {
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 50%, #e7f1fb 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%,#ffffff), color-stop(100%,#e7f1fb));
    background: -webkit-linear-gradient(top, #ffffff 50%,#e7f1fb 100%);
    background: -o-linear-gradient(top, #ffffff 50%,#e7f1fb 100%);
    background: -ms-linear-gradient(top, #ffffff 50%,#e7f1fb 100%);
    background: linear-gradient(to bottom, #ffffff 50%,#e7f1fb 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e7f1fb',GradientType=0 );
    border: 3px solid #cddaea;
    border-radius: 10px;
    padding: 25px 30px 5px;
    margin: 0 1em;
    width: 41.08%;
}

/* Bios */
    /* Header */
    .bio-header { align-items: center; display: flex; margin-bottom: 1em; }
    .bio-name { flex: 1 1 auto; }
    .bio-name h1, .bio-name p { margin: 0; }
    .bio-photo { flex: 0 0 auto; margin-right: 1em; }
    .bio-photo img { border: 5px solid #e6e6e6; border-radius: 50%; box-shadow: 3px 3px 5px #aaa; width: 118px; }
    
    /* List */
    .bios { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); row-gap: 20px; list-style: none; margin-left: 0; }
    .bios * { box-sizing: border-box; }
    .bios a { display: block; transition: all 0.1s ease-in-out; }
    .bios a:hover { opacity: 0.6; text-decoration: none; }
    .bios li { margin: 0; padding: 0; text-align: center; width: 120px !important; }
    .bios img { border: 5px solid #e6e6e6; border-radius: 50%; box-shadow: 3px 3px 5px #aaa; display: block; margin-bottom: 5px; width: 100%; height: auto; }
    .bios .name { display: block; font-size : 15px; }
    .bios .title, .district { display: block; color: #000; }

/* Board actions */
.board-actions { margin-bottom: 20px; }
.board-actions h2 { font-weight: normal; }
.board-actions h3 { margin-bottom: 0.3em; }
.board-actions table { width: 100%; }
.board-actions td { font-size: 13px; }
.board-actions td.action-code { width: 25%; }
.board-actions td.action-desc { width: 60%; }
.board-actions td.action-status { width: 15%; }

/* Boxes (highlighted areas */
.box { background: #e7f1fb; border: 2px solid #024691; border-radius: 5px; padding: 20px; }
.box, .box-secondary { margin-bottom: 30px; }
.box h3, .box-secondary h3 { margin-bottom: 0.5em; }
.box p, .box-secondary p { margin-bottom: 0.3em; }
.box-secondary { background: #e7f1fb; border-radius: 5px; padding: 15px; }
.c2l .box .mute, .c2r .box .mute { display: none; }

/* Browse */
.browse { margin-bottom: 1.5em; }
.browse ul { list-style: none; margin-left: 0; }
.browse li, .browse p, .browse ul { display: inline; margin: 0 1em 0 0; }
.browse p { font-weight: bold; }

/* Callouts */
div.call-l, img.call-l { clear: left; }
div.call-r, img.call-r { clear: right; }
dt img.call-l { margin-top: 0; }
img.call-l { margin-right: 1em; }
img.call-r { margin-left: 1em; }
.call-l { float: left; margin: 0.5em 2em 0.5em 0; }
.call-r { float: right; margin: 0.5em 0 0.5em 2em; }
.call, div.call-l, div.call-r { font-size: 0.75em; }
.call img, .call-l img, .call-r img { display: block; }
.call img.icon, .call-l img.icon, .call-r img.icon { display: inline; }
.call, .call-l p, .call-r p { margin-bottom: 0.5em; }
.credit { color: #7f8183; font-size: 0.75em; letter-spacing: 0.01em; margin-bottom: 0.5em; text-align: right; }

/* Date/time */
.datetime { font-weight: normal; }

/* Events */
    /* Calendar */
    .calendar { border-bottom: 1px solid #ddd; overflow: hidden; }
    .calendar .date { float: left; margin-left: -130px; width: 120px; }
    .calendar .date strong { display: block; }
    .calendar dd { margin-bottom: 1em; }
    .calendar dd, .calendar dt { padding-left: 130px; }
    .calendar dt { border-top: 1px solid #ddd; clear: both; font-weight: normal; margin: 0; padding-top: 1em; }
    .calendar p { margin-bottom: 0.3em; }
    .calendar .title { font-weight: bold; }
    
    /* Meetings */
    .meetings { background: #e7f1fb; margin-bottom: 30px; padding: 30px 30px 15px; }
    .meetings .calendar, .meetings .calendar dt { border-color: #c9d7ea; }
    
    /* Past meetings */
    .past-meetings { width: 100%; }
    .past-meetings .mute { display: block; white-space: normal; }
    .past-meetings td, .past-meetings th { border: 1px solid #ddd; border-width: 1px 0; padding: 0.3em 1em 0.3em 0; }
    .past-meetings th { font-weight: bold; white-space: nowrap; width: 30%; }
    
    /* Upcoming meetings */
    #upcoming-meetings ul { list-style: none; margin-left: 0; }

/* FAQs */
#faqs .faq { margin-bottom: 1em; }
#faqs h3 a { border-top: 1px solid #ddd; display: block; padding: 0.4em 0; }
#faqs h3 a:hover { background: #e7f1fb; }

/* Feature */
#feature { height: 350px; position: relative; }
#feature img { left: 0; position: absolute; top: 0; }

#feature #overlay {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 0 0 10px 10px;
    box-shadow: 0 2px 11px rgba(0, 0, 0, 0.32);
    font-size: 16px;
    padding: 15px 20px 20px;
    position: absolute;
    right: 20px;
    top: 0;
    width: 37%;
}

#feature #overlay h1 { font-size: 19px; font-weight: normal; margin: 0; }
#feature #overlay p { margin: 0; }

/* Footer */
#footer { background: #fff; border-top: 8px solid #1861b0; font-size: 13px; padding: 20px 30px; }
#footer #cps { float: right; margin-top: -3px; max-width: 123px; }
#footer #cps img { max-width: 100%; }
#footer-content { position: relative; }
#footer .section { float: left; margin-right: 2%; margin-bottom: 20px; width: 23.4%; }

    /* Colophon */
    #colophon address { display: block; margin-bottom: 0.5em; }
    #colophon .adr, #colophon .tel, #colophon .fax { margin-right: 0.7em; }
    #colophon .org { display: block; font-size: 18px; margin-bottom: 0.2em; }
    
    /* Copyright */
    #copyright { color: #7f7f7f; font-size: 11px; }
    #copyright a { margin-left: 0.7em; }
    
    /* Site credit */
    #credit { float: right; font-size: 11px; text-align: right; }
    #credit a { color: #7f7f7f; }
    #credit a strong { color: #22408e; font-weight: normal; }
    #credit a:hover strong { text-decoration: underline; }

/* Header */
#header { background: #1861b0; padding: 20px 0 18px; }
#header-secondary { float: right; text-align: right; }
    
    /* Language */
    #language { margin: -10px 0 10px; position: relative; }
    #language a { color: #fff; }
    
    /* Logo */
    #logo { display: block; float: left; }
    #logo img { display: block; }
    #logo-print { display: none; }

/* Help */
.help { background: #fffdf1; border: 5px solid #ffca00; margin: 40px 0 30px; padding: 30px 20px 20px; }
#nav-secondary + .help { border-top-width: 5px; margin-top: 0; }
.help p, .help ul { margin-bottom: 0.5em; }

/* Hidden */
.hidden { left: -999em; position: absolute; top: 0; }

/* Icons */
.icon { background-repeat: no-repeat; background-position: 0 0.4em; padding: 3px 0 3px 22px; }
.icon-cal { background-image: url(/content/images/shared/calendar.png); }
.icon-google { background-image: url(/content/images/shared/google.png); }
.icon-doc { background-image: url(/content/images/shared/doc.png); }
.icon-facebook { background-image: url(/content/images/shared/facebook.png); }
.icon-feed { background-image: url(/content/images/shared/feed.png); }
.icon-linkedin { background-image: url(/content/images/shared/linkedin.png); }
.icon-list { background-image: url(/content/images/shared/list.png); }
.icon-map { background-image: url(/content/images/shared/map.png); }
.icon-pdf { background-image: url(/content/images/shared/pdf.png); }
.icon-ppt { background-image: url(/content/images/shared/ppt.png); }
.icon-print { background-image: url(/content/images/shared/printer.png); }
.icon-search-options { background-image: url(/content/images/shared/search-options.png); }
.icon-twitter { background-image: url(/content/images/shared/twitter.png); }
.icon-xls { background-image: url(/content/images/shared/xls.png); }
.icon-youtube { background-image: url(/content/images/shared/youtube.png); }
img.icon { padding: 0; vertical-align: middle; }

/* Input validation error */
.input-validation-error { border: 2px solid #ff0000 !important; }

/* Maps */
.geo { display: none; }
.map { border: 1px solid #ddd; margin-bottom: 10px; }
.map img { max-width: none; }
        
/* Muted text */
.mute { color: #7f7f7f; font-size: 13px; font-weight: normal; }

/* Navigation */
#nav { background: #014691; font-size: 15px; text-transform: uppercase; text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5); padding: 13px 0; }
#nav a { color: #fff; }
#nav li { display: inline; margin-right: 1.5em; }
#nav li.current a { color: #f7ce32; font-weight: bold; }
#nav ul { float: left; list-style: none; margin: 0; }

    /* Registration */
    #nav-register { float: right; text-transform: none; }
    
    #nav-register #register-closed {
        background: url(/content/images/shared/time.png) no-repeat 0 50%;
        color: #cedbeb;
        padding-left: 20px;
        text-shadow: none;
    }
    
    #nav-register #register-open a {
        background: #e7f1fb url(/content/images/shared/form.png) no-repeat 10px 50%;
        border-radius: 4px;
        box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.4);
        color: #22408e;
        padding: 0.3em 0.8em 0.4em 2.2em;
        text-shadow: none;
    }
    
    #nav-register #register-open a:hover {
        background-color: #fff;
        box-shadow: 1px 1px 12px rgba(255, 255, 255, 1);
        text-decoration: none;
    }

    /* Secondary */
    #nav-secondary {
        background: #ffffff;
        border: 4px solid #dcdcdc;
        border-radius: 7px;
        font-size: 17px;
        margin-bottom: 30px;
        padding: 15px 20px;
    }
    
    #nav-secondary a:hover { text-decoration: underline; }
    #nav-secondary li { border-bottom: 1px solid #dcdcdc; margin: 0; padding: 0.5em; }
    #nav-secondary li:last-child { border-bottom: 0; }
    #nav-secondary li.current a { border: 0; display: inline; padding: 0; }
    #nav-secondary li.current > a { color: #000; font-weight: bold; }
    #nav-secondary ul { list-style: none; margin: 0; }
    #nav-secondary ul h3 { display: none; }
    #nav-secondary ul ul { font-size: 14px; margin: 0.25em 0 0.5em 0.2em; }
    #nav-secondary ul ul li { background: url(/content/images/bullet-nav.png) no-repeat 0 0.4em; border: 0; font-weight: normal; padding: 0 0 0 1em; }

/* News */
.news dt { font-weight: normal; margin-bottom: 0.2em; }
.news dt a { margin-right: 0.5em; }
.news .mute { white-space: nowrap; }

/* Next steps */
.next-steps .box { margin-top: 20px; padding: 20px 20px 10px; }
.next-steps .box p { margin-bottom: 1em; }

/* Page tools */
#page-tools { clear: both; padding-top: 30px; }

/* Paging */
.pages, .pages ul { clear: both; float: none; font-size: 16px; list-style: none; margin: 50px 0 30px; text-align: center; }
.pages li { display: inline; margin: 0 10px 0 0; }

/* Phone numbers */
.phone .number { font-size: 28px; font-weight: bold; line-height: 1.2; margin: 0.5em 0; }

/* Registration status */
.registration-status .action { float: left; margin: 0 15px 1em 0; }

/* Search results */
#search-results .gs-result .gs-title, #search-results .gs-result .gs-title * { color: #22408e; }
#search-results .gs-webResult div.gs-visibleUrl, #search-results .gs-imageResult div.gs-visibleUrl { color: #666; }
#search-results .gsc-adBlock { display: none !important; }

#search-results .gsc-control-cse,
#search-results .gsc-thumbnail-inside,
#search-results .gsc-url-top,
#search-results .gsc-webResult .gsc-result {
    padding: 0;
}

#search-results .gsc-orderby, #search-results .gcsc-branding { display: none; }
#search-results .gsc-result .gs-title { height: auto; }
#search-results .gsc-result .gs-title, #search-results .gsc-result .gs-title * { font-size: 20px; overflow: visible; text-decoration: none; }
#search-results .gsc-result .gs-title:hover { text-decoration: underline; }
#search-results .gsc-result-info { padding: 0; }
#search-results .gsc-results .gsc-cursor-box { font-size: 20px; margin: 0; text-align: center; }
#search-results .gsc-results .gsc-cursor-box .gsc-cursor-page { margin: 0; padding: 0 0.5em; }
#search-results td { border: 0; padding: 0; }

/* Tables */
.data { clear: both; width: 100%; }
.data td, .data th { border: 1px solid #d9d9d9; padding: 0.3em 0.7em; }
.data tfoot td { border-top: 3px double #ddd; }
.data th { background-color: #f2f2f2; font-size: 11px; font-weight: bold; padding: 0.3em 1em; }
.nb { white-space: nowrap; }

/* Toggling options */
.closed { display: none; }

.map-icon {
    margin-right: .5em;
    margin-bottom: 1.4em;
    max-height: 65px;
    max-width: 30px;
}