/* Homepage
--------------------------------------------------------------------------------------- */

/* .vertical-titles .quicklink-panels h2 { margin-bottom: 250px; font-size: 4.8em; } */

.hero-content .image-content .left { width: 35%;}
.hero-content .image-content .right { width: 62%;}

.hero-divider { width: 120px; height: 4px; border: 0; background-color: #E40006; color: #E40006; margin: 40px 0; text-align: left;}
.hero-content h2.titles {  font-size: 7em !important; text-transform: uppercase; }
.hero-content h2.titles i { font-weight: 100 !important;}

.hero-arrow { width: 45%; position: absolute; bottom: -50px; right: 2%; z-index: 5; }

.device { position: absolute; right: 0; width: 45%; height: auto;  top: 50%; -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);  transform: translateY(-50%); }
.hp-intro { padding: 3vw 0;}

.how-panel { padding-left: 120px !important; position: relative; }
.how-count { width: 60px; height: 60px; -webkit-border-radius: 60px; -moz-border-radius: 60px; border-radius: 60px; line-height: 60px; text-align: center; font-size: 34px; position: absolute; top: 42px; left: 36px; }
.how-titles { font-size: 3em;}
.how-panel p { font-size: 1.6em; line-height: 1.3em; margin-bottom: 0 !important;}

a.btn-how { width: 32%; float: right; text-align: center; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}

.hp-place p { font-size: 4.8em; line-height: 1.4em;}

.owl-carousel-logos .item { float:left; display:inline;}

.titles { font-weight: 700 !important;}
.hero-content h2 { text-transform: uppercase;}

.platform-arrow { width: 18%; position: absolute; bottom: -6%; right: 0; z-index: 5; }

/* Secondary Pages
--------------------------------------------------------------------------------------- */


.single-member .page-hero { height: auto !important;}
.member-intro .left { width: 35%;}
.member-intro .right { width: 50%;}

.member-intro .social-media-icons { float:none; margin-left: auto; margin-right: auto; text-align: center;}
.member-intro .social-media-icons li { display: inline-block; text-align: center; float: none;}


.circles-popup-module { display: none; position: fixed; z-index: 99999; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0,0,0,.6);}
.circles-popup-wrapper { max-width: 700px;}
.circles-popup-header { border-bottom: 1px solid #ddd;}
.btn-module-close { width: 40px; display: block; position: relative; position: absolute; right: 20px; top: 50%; -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);  transform: translateY(-50%);}

/* Title
--------------------------------------------------------------------------------------- */


.circles-form-container .left { width: 35%;}
.circles-form-container .right { width: 56%;}

.circles-form-wrapper { }
.circles-form-row { margin-bottom: 10px; position: relative;}

.circles-form-wrapper .left,
.circles-form-wrapper .right { width: calc(50% - 10px);}

.circles-form-wrapper label { font-size: 1.6em; margin-bottom: 6px;  font-family: 'proxima-nova', Arial, Helvetica, sans-serif; font-weight: 600; display: block;}
.circles-form-wrapper input { width: 100%; border: 1px solid #ddd; background: #fff; padding: 12px 20px; font-size: 2em; font-family: 'proxima-nova', Arial, Helvetica, sans-serif; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}

.circles-username-wrap { position: relative;}
.username-icons { width: 24px; height: 24px; position: absolute; top: 50%; right: 15px; transform: translateY(-50%); }

svg .green { fill: #339c42;}
svg .red { fill: #df1919;}

.circles-form-message { padding: 10px; margin-bottom: 20px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}
.circles-form-message p { margin: 0 !important; text-align: center; font-size: 16px;}
.circles-form-message.error { background-color: #df1919; color: #fff;}

.error label, label .username-unavailable-text { color: #df1919;}
.error input { border-color: #df1919; background-color: #fff4f4;}

.circles-form-city-state { width: 37.5%; float:left; margin-right: 2.5%;}
.circles-form-zip { width: 20%; float:left; }

.circles-form-footer { border-top: 1px solid #ddd;}
.circles-form-wrapper input.circles-form-submit { max-width: 200px; border: 0; background-color: #339c42; color: #fff;}

/* Media Queries
--------------------------------------------------------------------------------------- */


/* Desktops and laptops ----------- */

@media only screen
and (max-height : 1440px) {


}

@media only screen
and (max-height : 1100px) {


}

@media only screen
and (max-height : 900px) {


}

@media only screen
and (max-height : 800px) {


}

@media only screen
and (max-height: 540px) {


}


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


}


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


}


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


}



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


}

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

}


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

    .image-split {width: 35%;}
    .image-split-wrap .right {width: 65%;}

}

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


}


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


}



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


}

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


}

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


}

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


}

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


}

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


}


/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {


}

@media screen and (min-width:320px) and (max-width:780px) and (orientation:landscape) {


}

@media only screen
and (max-width : 501px) and (orientation:portrait)  {
	
    .hero-content h2.titles {font-size: 5em !important;}
    .home .hero-content .image-content .left {width: 45%; float: none; position: absolute; right: -50px; top: 22vh; z-index: -1;}
    .hero-arrow {width: 68%;position: absolute;bottom: 0;right: 2%;z-index: 1;}
    .device { position: relative; right: 0; margin: 0 0 0 auto; width: 88%; height: auto;  top: 0; -webkit-transform: none !important;  -ms-transform: none !important;  transform: none !important; }
    .hp-intro .right { margin-top: 0 !important;}
    .hp-intro .section { padding-bottom: 20px !important;}

    .how-count {width: 50px;height: 50px;-webkit-border-radius: 50px;-moz-border-radius: 50px;border-radius: 50px;line-height: 50px;top: 26px;left: 26px;}
    .how-panel.pad-40 { padding-top: 30px !important; padding-left: 96px !important;}

    .pad-l-40.pad-r-40 { padding-left: 10px !important; padding-right: 10px !important;}

    a.btn-how { width: 100%; }
    .home .image-split {width: 100%; top: 80px; background-position: top center; height: 50%; display: none;}
    .image-split {width: 100%;}
    .image-split-wrap .right {width: 100%; z-index: 4;}
	.image-split-wrap .right.pad-160 { padding-top: 30px !important;}

    .platform-arrow {width: 48%;position: absolute;bottom: -6%;right: -12%;z-index: 1;}

    .content { overflow: hidden;}

    .single-member .hero-arrow {width: 48%;}
    .single-member .page-hero .pad-b-220 { padding-bottom: 80px !important;}

    .member-intro .left { width: 100%;}
    .member-intro .right { width: 100%;}

    .member-intro .social-media-icons {width: 100% !important;}

    .single-member .hp-place .section.pad-b-60 { padding-bottom: 0 !important;}
    .single-member .hp-place  .titles.bigger.marg-b-40 { margin-bottom: 0 !important;}

    .circles-popup-wrapper {max-width: 100% !important; width: 100%;}

    .circles-form-wrapper input { width: 100%; border: 1px solid #ddd; background: #fff; padding: 8px 14px; font-size: 1.62em; font-family: 'proxima-nova', Arial, Helvetica, sans-serif; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}

    .hp-place p { font-size: 2.4em !important; line-height: 1.4em;}

}

/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {


}