/* Space out content a bit */

:root {
    --primary-color: #203a58;  /* Dark Blue */
    --secondary-color: #dbcea7; /* Lite Gray */
    --tertiary-color: #f5f5f5;
    --active-link: #004bcf;
    --border: #bbbbbb;
}


/* 
var(--primary-color); 
var(--secondary-color); 
var(--tertiary-color); 
var(--active-link); 
var(--border); 
*/

#alertWrapper {display: none}

body {
    font-family: 'Arial';
    font-size: 16px;
    color: #444;
}

.row {
    margin-right: 0px;
    margin-left: 0px;
}



.ico{
    color: #de6e01;
}


.connect{
    background-color: #62a70f;
    color: #FFF;

}

.connectInner{
    max-width: 900px;
    margin: 20px auto;
}

.bkImg{
    width: 300px;
    margin: 8px;
    border: 1px solid #3398c6;
    padding: 5px;
}


.connectText{
    font-size: 24pt;
}

.buttonWrapper{
    padding: 10px 0px;
}

a.button {
    color: #fff;
    background-color: transparent;
    border: 1px solid #fff;
    border-radius: 4px;
    font-size: 19px;
    font-weight: 400;
    text-transform: uppercase;
    padding: 12px 34px;
    text-decoration: none;
    text-transform: capitalize;
}
a.button:hover {
    color: #fff;
    text-decoration: none;
    background-color: #c05f00;
    border: 1px solid #c05f00;
}
.f8{font-size: 8pt}
.f10{font-size: 10pt}
.f12{font-size: 12pt}
.f14{font-size: 14pt}
.f16{font-size: 16pt}
.f18{font-size: 18pt}
.f20{font-size: 20pt}
.f22{font-size: 22pt}
.f24{font-size: 24pt}
.f26{font-size: 26pt}
.f28{font-size: 28pt}
.f30{font-size: 30pt}
.f32{font-size: 32pt}

.bottomPhone{
    color: #666666;
}


.titleMain{
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 600;
    font-size: 46pt;
    color: #000;
    text-shadow: 0px 0px 5px #FFF;
}
.titleSub{
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 400;
    font-size: 32pt;
    color: #000;
    margin-top: 0px;
    margin-bottom: 12px;
    text-shadow: 0px 0px 5px #FFF;
}

.logoLeft{
    text-align: left;
    padding-top: 15px;
    color: #FFFFFF;
}
.logoRight{
    text-align: right;
    padding-top: 10px;
    color: #FFFFFF;
    font-family: 'Barlow Condensed', sans-serif;
}

h4{
    font-size: 12pt;
    color: #787878
}

h3{
    color: #666;
    font-weight: bold;
}

.container{
    width: 100%;
    padding-right: 0px;
    padding-left: 0px;
    margin-right: auto;
    margin-left: auto;
    border-bottom: 2px solid #C0C0C0;
}

/* Custom Header */
.header-wrapper{
    padding: 0px 20px 20px 20px;
    background-color: var(--primary-color);
}

.header{
    margin: 0px auto;
    max-width: 1400px;
}

.progText{
    text-transform: uppercase;
    font-size: 9pt;
}

#disclaimer{
    display: none;
    font-size: 8pt;
    margin: 5px;
    color: #c0c0c0;
}

/* Custom Content */
            .content-wrapper {
                width: 100%;
                min-height: 700px;
                background-image: url('../images/car-accident-attorney.png');
                background-position: center;
                background-size: cover;
                padding: 20px 20px 100px 20px;
            }

.imgWrapper img {
    width: 100%;
}

.content{
    max-width: 600px;
    margin: 0px auto;
}
hr{
    margin-top: 20px;
    margin-bottom: 20px;
    height: 1px;
    width: 90%;
    color: #8f8f8f;
}

/* Custom Content */
.stuffWrapper{
    width: 100%;
    /*padding: 20px;*/
    margin: 0px auto;
    background-color: #f0f0f0;
}

.stuff{
    max-width: 850px;
    color: #474747;
    margin: 0px auto;
}







.aWhite{
    color: #C0C0C0;
    text-decoration: none;
}












.form-wrapper{
    -webkit-box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.2);
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    /* border: 0px solid #FFFFFF;*/
    /*min-height: 400px;*/
    background-color: #FFFFFF;
    padding: 10px 10px 20px 10px;;
    margin-top: 25px;

}

.mobile{
    display: none;
}

.ui-progressbar {
    position: relative;
}

.progress-label {
    position: absolute;
    left: 50%;
    top: 4px;
    font-weight: bold;
    text-shadow: 1px 1px 0 #fff;
}



/* Custom separator */
.featured-wrapper{
    width: 100%;
    padding: 10px;
    text-align: center;
    background-color: #f0f0f0;
}

.featured{
    max-width: 800px;
    text-align: center;
    margin: 0px auto;
}


/* Custom page footer */
.footer-wrapper {
    width: 100%;
    background-color: #585858;
    border-top: 4px solid #e0a800;
    padding: 10px;
    text-align: left;
}

.footer {
    max-width: 900px;
    margin: 0px auto;
    font-size: 9pt;
    color: #C0C0C0;
}




.desktop{
    display: block;
}

.mobileTop{
    font-size: 14pt;
    margin: 3px;
}

.mobilesBottom{
    font-size: 14pt;
    margin: 3px;
}

.w100{
    width: 100%!Important;
}

.centRow{max-width: 900px;margin: 20px auto}

/* Customize container */
@media (min-width: 768px) {

}

.featuredHeader {
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 600;
    font-size: 22pt;
    color: #444;
}

.promoWrapper{
    width: 100%;
    padding: 20px 0px;
    background-color: #eee;
}
.promoRow{
    text-align: left;
    max-width: 900px;
    margin: 0px auto;
}

.imgWrapper{
    padding: 9px;
    background-color: #FFFFFF;
    border: 1px solid #d0d0d0;
}
.promoText{
    margin-top: 10px;
}
.promoHeader{
    font-family: 'Barlow Condensed', sans-serif;
    font-weight: 600;
    font-size: 22pt;
    color: #444;
}

@media screen and (max-width: 650px) {

.content-wrapper {
                min-height: 450px;
            }
    .mRow{}
    .mRow2{}
    .mHead{}
    /* Custom Header */
    .header-wrapper{
        padding: 0px 10px 10px 10px;
    }
    .centRow,.connectInner{text-align: center}
    .ico{display: none}
    .logoLeft{
        text-align: center;
    }
    .logoRight{
        text-align: center;
    }

    .titleMain{
        display: none;

    }
    .titleSub{

        font-size: 14pt;

    }


    .form-wrapper{
        margin-top: 15px;

    }
    hr {
        margin-top: 0px;
    }
    .inputWrapperRight{
        width: 100%;
        padding-left: 30px;
        padding-right: 30px;
    }
    .inputWrapperLeft{
        width: 100%;
        padding-left: 30px;
        padding-right: 30px;
    }
    .desktop{
        display: none;
    }
    .mobile{
        display: block;
    }
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {


}