/* ==================================================================
   Faithful America - Actionkit CSS 
   Author: @mvattuone, Citizen Engagement Laboratory

   CSS specifically for Faithful America's Actionkit Instance
 ================================================================== */

/* ==================================================================
    Taken from Actionkit.css
================================================================== */

body.js form.ak-form,
#ak-errors,
#ak-confirmation,
#ak-error-info,
.ak-errors,
.ak-confirmation,
.ak-error-info { 
    display: none 
}
select.ak-error, textarea.ak-error { 
    background-color: rgb(255,200,200); 
    border-color: red; 
}
label.ak-error {
    color: red;
    font-weight: bold;
}
#ak-errors,
#ak-confirmation,
.ak-errors,
.ak-confirmation {
    list-style-type: none;
    font-weight: bold;
    color: white;
    padding: 7px;
    margin: 7px;
}
#ak-errors, .ak-errors {
    background-color: red;
}
#ak-confirmation, .ak-confirmation {
    background-color: green;
}
form.contains-errors #ak-errors, 
form.contains-errors #ak-error-info,
form.contains-errors .ak-errors, 
form.contains-errors .ak-error-info {
    display: block;
}
.ak-err { /* inline error */
    color: red;
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}
.ak-err-above .ak-err { margin-top: 0.5em; }
.ak-err-below .ak-err { margin-bottom: 0.5em; }
ul#ak-errors li,
ul.ak-errors li {
    padding: 0px;
    margin: 0px;
}
#known_user, .known_user {
    display: none;
}

.ak-form label {
    pointer-events:visible !important;
}

.taf_body {
    border: solid rgb(128,128,128) 1px;
    padding: 5px;
}
div.event-signup {
    zoom: 1; /* work around IE 8 content-hiding bug */
}

/* Targets */
div.target {}
a.local_toggle {}
span.local_toggle_label {font-size: 90%;font-weight:normal}
div.office {display:none;font-weight:normal}
span.office_phone {font-size:90%;color:#666;font-weight:normal}
span.office_phone_label {font-wight:bold}
span.office_fax {font-size:90%;color:#666;font-weight:normal}
span.office_fax_label {font-wight:bold}

.ak-err li {
    font-size: 11px; 
    background-color: #fff; 
    padding: 5px 8px 3px; 
    margin: 5px 0 15px;
}

.ak-required-flag { color: red; }

/* mirror the styles if RTL */
.ak-rtl { direction: rtl; }
.ak-rtl .ak-labels-before input, .ak-rtl .ak-labels-before select, .ak-rtl .ak-labels-before textarea { width: 65%; float: left; }
.ak-rtl .ak-labels-before label { float: right; text-align: left }

.taf-mailto { clear: both; }

#progress { text-align: center; position: relative; }
.progress-holder { margin-left: auto; margin-right: auto; height: 50px; width: 300px; max-width: 100%; position: relative; }
.progress-bar { position: absolute; height: 50px; z-index: 1; left: 0px; }
.progress-percent { position: relative; z-index: 2; font-weight: bold; padding-top: 10px; font-size: 20pt; line-height: 24pt; }
.progress-caption { padding-top: 2px; }


/* classic-progress: green gradient bar with images from actionkit day 1 */
.classic-progress .progress-holder { background-image: url(/samples/green-bar-0.png); }
.classic-progress .progress-bar {  background-image: url(/samples/green-bar-100.png); }

/* rounded-progress: sort of a blingy css3 rounded bar (displays square on old browsers) */
.rounded-progress .progress-holder { border: solid #aaa 2px; background-color: white; border-style: inset; border-radius: 25px; }
.rounded-progress .progress-bar { background-color: #7a7; border-radius: 23px; }

/* basic-progress: neutral-looking grey bar */
.basic-progress .progress-holder { border: solid #aaa 2px; background-color: white; background-color: rgba(255,255,255,0.2); border-radius: 5px; }
.basic-progress .progress-bar { background-color: #777; border-radius: 3px; }

/* use an "ak-continued" link to jump to explanatory content on mobile */
.ak-mobile-lead, .ak-continued { 
  /* hiding this way keeps it visible to screenreaders which could also use the link */
  position: absolute; left: -999em; 
} 
.ak-nodisplay { display: none; }



/* ==================================================================
    Custom Styles
================================================================== */

textarea#id_comment {
  height:48px;
}

#survey-questions textarea {
    font-size:18px;
    height:3em;
}

#actionsign-clergy {
    margin-top:0;
}

.action .block section {
    padding:15px 15px 20px;
    background-color:#000;
    background-size:cover;
    background-position:center center;
    background-repeat: no-repeat;
    min-height:150px;
}

.action-detail #conf-header:after {
    content:url('http://s3.faithfulamerica.org/static/img/featurearrowtop.png');
    margin: 0 auto;
    position: relative;
}

.action-detail #action-content .no-img {
    background-image:url('http://s3.faithfulamerica.org/static/img/pattern.jpg');
}

.tooltip .tool .arrow {
    background-image:url('/s3.faithfulamerica.org/static/img/tooltiparrow.png');
    background-repeat:no-repeat;
    position:absolute;
    height: 13px;
    top: -11px;
    width: 42px;
    left: 11px;
}

#bottom-footer {
    background-image: none;
}

.donate #donate-form section.city {
    width: 45%;
}

.donate #donate-form #donate-amount #donate-amountmanual,
.donate #donate-form #donate-amount #type label[for="donation_type"] {
    color:#999;
}

.donate #donate-form #donate-amount #donate-amountmanual label,
.donate #donate-form #donate-amount #type label[for="donation_type"]  {
    font-family: 'Novecentowide-Bold', sans-serif;
    font-size: 12px;
    letter-spacing: 0.2em;
}

.donate #donate-form #step3 .privacy {
    font-size:14px;
    float:right;
}

.donate #donate-form #donate-amount #type span:nth-of-type(1) {
    margin-right:20px;
}

.action-detail #action-content header {
    min-height: 300px;
    background-position: 50%;
}

.action-detail .logged-in {
    margin-bottom:0;
}

.action-detail #action-sign {
    min-height:390px;
}

#survey-questions {
    margin: 0 0 3em 0;
}

form#unsub-form {
    margin: 0 0 3em 0;
}

form#unsub-form textarea {
    font-size:16px;
    height:2em;
}

.action-detail #action-content .action-progress .goal {
    clear: both;
    float:none;
}


@media only screen and (min-width: 701px) and (max-width: 1000px) {
    .donate .stuck {
        width: 194px;
    }

    .surveyfields {
        width:75%;
    }

    form#unsub-form {
        width:75%;
    }

}


/* ==================================================================
    Event Page
================================================================== */

.event-body .strong { font-weight: bold; }

body.js.event-body .nojs { display: none; }

.event-body .ifjs { display: none; }
body.js.event-body  div.if-js { display: block; }
body.js.event-body  span.if-js { display: inline; }
body.js.event-body  .iblock-if-js { display: inline-block; }
.event-body ul.events li.event { list-style-type: none; }
.event-body .event a, .event .event a:hover { 
    text-decoration: none; 
    color: inherit; 
    font-weight: normal;
    pointer-events: none;
}
.event-body div.event-signup, .event-body #event-attend-form {
    position: relative; /* helps with map positioning */
}

.event-body #map { 
    float: right;
    width: 300px;
    padding: 10px 10px 0 0;
}
.event-body #map img { border: solid black 1px; }
.event-body #map .caption { color: #777; font-style: italic; text-align: center; }
.event-body input[disabled] { background-color: rgb(200,200,200); }


/* ==================================================================
    Call Page
================================================================== */

.call-page #main {
    margin-bottom:20px;
}

/* ==================================================================
    Media Queries
================================================================== */

@media only screen and (min-width: 1000px) {


    .donate .stuck {
        width: 15.25%;
        max-width: 275px;
        min-width:275px;
    }

    #bottom-footer {
        box-shadow:inset 5px 0 15px rgba(0,0,0,0.05);
        background-color:#F4F3ED;
        padding:25px 0 120px;
        background-image:url('/s3.faithfulamerica.org/static/img/logowatermark.png');
        background-position:40% 25px;
        background-repeat:no-repeat;
    }

    .surveyfields {
        width:100%;
    }

    #survey-contact {
        width: 40%;
        float:left;
        display:inline;
        margin: 0 10% 0 0;
    }

    #survey-questions {
        width: 40%;
        float:left;
        display:inline;
        margin: 0 0 3em 0;
    }

    form#unsub-form {
        width:50%;
    }

}

@media only screen and (max-width: 700px) {
    
    .interior .col-1-2-30,
    .interior .col-2-2-30 {
        margin:0 14.2857143% 0 10%;
        width:75.7142857%;
        padding-left:0;
        padding-right:0;
    }

    .call-page .privacy {
        width: 100%;
    }

    .call-page .action-progress {
        padding: 8px 0 2px;
    }
    
}

@media only screen and (min-width: 701px) and (max-width: 900px) {
    

    
    .call-page .action-progress .interior {
        width: 88%;
    }
    
    .call-page .action-progress {
        padding: 8px 0 2px;
    }
    
}

@media only screen and (min-width: 1200px) {

    .donate #donate-form section.city,
    select#country {
        width: 65%;
    }

}

/* Additions for Events pages - J. Allen 2015 */

body.event_create-page #main {
    box-sizing: border-box;
    margin: 0 auto;
    max-width: 920px;
    padding: 36px;
}

body.event_create-page #main #unknown_user {

}

body.event_create-page #main fieldset {
    margin-bottom: 12px;
}

body.event_create-page #main .ak-err-below {
    margin-top: 12px;
}

body.event_create-page #main select,
body.event_create-page #main input {

}

body.event_create-page #main #id_submit {

}