.podfather-container {
    width:100%;
    margin: 20px 0 20px 0;
    background-color: #BEFFFA;
    padding:7px;
    font-size: 17px;
    font-family: museoslab-900, "helvetica neue", helvetica, arial, sans-serif;
}

.podfather-container:after {
    content:' ';
    clear:both;
    display:block;
}

form.podfather-form:after {
    content:"";
    display:table;
    clear:both;
}

.form-state {
    display:none;
    padding:10px;
}

.form-state h2 {
    font-family:'museoslab-100', sans-serif;
    margin-bottom:10px;
}

.form-state form {
    padding-top:16px;
}

.form-state form label {
    font-family:'museoslab-100', sans-serif;
    font-size:14px;
}

.form-state form label span {
    margin-bottom:3px;
    display:block;
}

.form-state form label .info-label {
    display:block;
    margin-bottom:4px;
}

.form-state form label .info-label .info-icon {
    position:relative;
    display:inline-block;
    font-style:italic;
    font-size:15px;
    font-weight:800;
    color:#BEFFFA;
    background:#444;
    width:16px;
    height:16px;
    text-align:center;
    padding:3px 3px 1px 1px;
    border-radius:10px;
    -webkit-font-smoothing:auto;
    margin-left:2px;
    vertical-align:middle;
    cursor:pointer;
}

.form-state form label .info-label .info-icon .info-popup {
    position: absolute;
    bottom: 25px;
    left: 0px;
    font-size: 13px;
    font-style: normal;
    font-family: MuseoSans-100;
    -webkit-font-smoothing: auto;
    color: #222;
    width: 310px;
    line-height: 20px;
    background: #f1f1d9;
    padding: 18px;
    border-radius: 5px;
    box-shadow: 0 2px 3px 0 rgba(0,0,0,0.2);
    text-align: justify;
    transition:opacity 0.25s linear;
    opacity:0;
    pointer-events:none;
}
.form-state form label .info-label .info-icon:hover .info-popup,
.form-state form label:focus .info-label .info-icon .info-popup {
    opacity:1;
}


.form-state form select {
    font-size:16px;
    height:33px;
    width:6em;
    box-sizing:border-box;
    background:white;
    border-color:#c0c0c0;
}

.form-state form select.date-select {
    width: 98%;
}

.form-state form input#idpc_input {

    width:150px;
    margin: 0px 8px 0 0px;

}

.form-state form button#idpc_button {

    margin-bottom:8px;

}

.form-state form select#idpc_dropdown {
    clear: both;
    float: left;
    width: 100%;
    margin-top:8px;
    margin-bottom:8px;
    font-family:'museoslab-100', sans-serif;
    font-size:14px;
}



.podfather-container .dotted-border {
    border-bottom:1px dotted #111;
}

.form-state form label.inline {
    display:inline-block;
}

.form-state form input[type="text"],
.form-state form input[type="tel"],
.form-state form input[type="password"],
.form-state form input[type="email"] {
    font-family:'MuseoSans-300', sans-serif;
    font-size:14px;
    color:black;
    padding:6px;
    width:calc(100% - 30px);
}

.form-state form .field {
    display:block;
    height:60px;
}

.form-state form .field.short { height:30px; }
.form-state form .field.medium { height:40px; }
.form-state form .field.extended { height:70px; }

.form-state form.podfather-form select {
    width:calc(100% - 15px);
}

.podfather-form-buttons {
    clear:both;
}

@media screen and (max-width:350px) {
    .podfather-form-buttons .button,
    .podfather-form-buttons a {
        display:inline-block;
        clear:both;
    }
}

.form-state form .alt-button,
.form-state form button {
    font-family:'MuseoSlab-300', sans-serif;
    color:white;
    background:#505050;
    border:0;
    font-size:20px;
    padding:5px 10px 6px;
    border-radius:3px;
    margin-top:7px;
    margin-right:10px;
    cursor: pointer;
}

.form-state form .alt-button {
    background:rgba(255,255,255,0.75);
    color:#505050;
}

.session-greeting {
    display:none;
    padding:12px;
    font-size:14px;
    font-family:'museoslab-100', sans-serif;
    line-height:1.2;
    margin:12px 12px 0 12px;
    padding:0;
    padding-bottom:16px;
}

.session-greeting .reset-session {
    font-family:'MuseoSans-300', sans-serif;
    font-size:14px;
    line-height:20px;
}

.podfather-container .create_account {

    display:none;
    width:100%;
    float:left;

}

.podfather-container .error-message {

    padding:20px;
    background:#f60071;
    color:white;
    margin: 10px 0;
    display:none;
}

.podfather-container #idpc_error_message {
    padding:20px;
    background:#f60071;
    color:white;
    margin: 10px 0;
    display:block;
    width:80%;
}

div.state-get-collection-confirmation input[disabled] {

    background-color: lightcyan;

}

.ui-datepicker.ui-widget.ui-widget-content {
    font-size:150%;
    font-family:'MuseoSans-300', sans-serif;
    border:0 !important;
    padding:0.4em !important;
    box-shadow:0 0 2em 0 rgba(0,0,0,0.2);
}

.ui-datepicker .ui-datepicker-header {
    border:0;
}

.ui-datepicker td a {
    border-width:0 !important;
    padding:0.5em !important;
}

.form-state.state-confirmed form p {
    width:100% !important;
    margin:1em 0 1.5em 0 !important;
}

.check-long-label input { position:absolute; }
.check-long-label span { padding-left:16px; }
.check-long-label { margin:6px 0; }



/* more than 1024 */
@media only screen and (min-width: 1024px) {
    .lg-1 {  width: 8.33%; float:left; }
    .lg-2 {  width:16.66%; float:left; }
    .lg-3 {  width:25.00%; float:left; }
    .lg-4 {  width:33.33%; float:left; }
    .lg-5 {  width:41.66%; float:left; }
    .lg-6 {  width:50.00%; float:left; }
    .lg-7 {  width:58.33%; float:left; }
    .lg-8 {  width:66.66%; float:left; }
    .lg-9 {  width:75.00%; float:left; }
    .lg-10 { width:83.33%; float:left; }
    .lg-11 { width:91.66%; float:left; }
    .lg-12 { width:100.0%; float:left; }
}

/* less than 1024 */
@media only screen and (max-width: 1023px) {
    .podfather-container {
        width:calc(100% - 15px);
        margin-left:0;
    }
    .md-1 {  width: 8.33%; float:left; }
    .md-2 {  width:16.66%; float:left; }
    .md-3 {  width:25.00%; float:left; }
    .md-4 {  width:33.33%; float:left; }
    .md-5 {  width:41.66%; float:left; }
    .md-6 {  width:50.00%; float:left; }
    .md-7 {  width:58.33%; float:left; }
    .md-8 {  width:66.66%; float:left; }
    .md-9 {  width:75.00%; float:left; }
    .md-10 { width:83.33%; float:left; }
    .md-11 { width:91.66%; float:left; }
    .md-12 { width:100.0%; float:left; }
}

/* less than 540 */
@media only screen and (max-width: 540px) {
    .sm-1 {  width: 8.33%; float:left; }
    .sm-2 {  width:16.66%; float:left; }
    .sm-3 {  width:25.00%; float:left; }
    .sm-4 {  width:33.33%; float:left; }
    .sm-5 {  width:41.66%; float:left; }
    .sm-6 {  width:50.00%; float:left; }
    .sm-7 {  width:58.33%; float:left; }
    .sm-8 {  width:66.66%; float:left; }
    .sm-9 {  width:75.00%; float:left; }
    .sm-10 { width:83.33%; float:left; }
    .sm-11 { width:91.66%; float:left; }
    .sm-12 { width:100.0%; float:left; }

    .form-state form .alt-button,
    .form-state form button {
        font-size:15px;
    }
    .form-state form .field.medium { margin-bottom:15px; }
    .check-long-label span { padding-left:20px; }

    .form-state form label .info-label .info-icon .info-popup {
        left: -240px;
        font-size:12px;
        line-height:19px;
        width:341px;
        padding:14px;
    }
}