/*---------------------------------------------------------------------------------

 Theme Name:   Strander Roofing
 Theme URI:    http://www.stranderroofing.com
 Description:  LocalX Theme
 Author:       LocalX Marketing
 Author URI:   
 Template:     Divi
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html

------------------------------ ADDITIONAL CSS HERE ------------------------------*/


h1 { text-transform: uppercase; font-weight: 200; line-height: 1.07em; }
h2 { font-weight: 200; }
p { font-size: 1.19em; line-height: 1.55em; }

img { image-rendering: -webkit-optimize-contrast; }


.blocked { display: block; }
.parent-relative { position: relative; }
.child-absolute { position: absolute; }
.fixed { position: fixed; }
.flex-parent, .flex-wrap .et_pb_text_inner, .flex-wrap .et_pb_code_inner { display: flex; height: 100%; align-items: center; }
.just-flex { display: flex; }
#home-banner.flex-parent .et_pb_code_inner { margin: auto; }
.flex-child, #footer-bottom .sb_divi_fe { flex: 1; }
.flex-center, .flex-center .et_pb_code_inner { justify-content: center; }
.align-items-start { align-items: flex-start; }
.align-items-end { align-items: flex-end; }
.align-stretch { align-self: stretch; }
.flex-end { justify-content: flex-end; }
.flex-column { flex-direction: column; }
.wrap-flex { flex-wrap: wrap; }
.grid-parent { display: grid; }
.grid-column { grid-auto-flow: column; }
.inline-block { display: inline-block; }
.left { margin-right: auto; }
.right { margin-left: auto; }
.tabled { display: table; }
div#page-container .centered { margin: auto; }

.align-center { text-align: center; }
.align-left { text-align: left; }
.align-right { text-align: right; }

.disable { pointer-events: none; }
.pointer-hover > a { cursor: default; }
.hide-me { display: none; }
.phone-link { pointer-events: none; }


.red-bg { background-color: #bd2126; }
.light-grey-bg { background-color: #f7f7f7; }

.white-text { color: #FFFFFF; }
.red-text { color: #bd2126; }


#home-banner {
    /*height: 49em;*/
    height: 63em;
    /*-webkit-animation-name: zoompan; -moz-animation-name: zoompan; animation-name: zoompan;
	-webkit-animation-duration: 7.0s; -moz-animation-duration: 7.0s; animation-duration: 22.0s;
	-webkit-animation-timing-function: ease-in-out; -moz-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite;*/
}
@-webkit-keyframes zoompan {

}
@-moz-keyframes zoompan {
   
}
@keyframes zoompan {
    0% { background-size: 100%; background-position: center center; }
    50% { background-size: 117%; background-position: -3px 7px; }
    100% { background-size: 100%; background-position: center center; }
}
/*#home-banner:before {
    content: "";
    height: 34.750em;
    width: 61.313em;
    background: url(images/dogs.png) center center no-repeat;
    background-size: contain;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 1;
}*/
#home-banner .mejs-mediaelement {
    height: 63em;
    width: auto;
}
#home-banner .mejs-mediaelement mediaelementwrapper {
    display: flex;
}
#home-banner video {
    height: 100% !important;
}

#banner-form-wrap {
    height: auto;
    width: 100%;
    padding: 1.1em 0;
    bottom: 0;
    background-color: rgba(210, 33, 39, 0.87);
    filter: drop-shadow(0 17px 25px rgba(62,42,42));
}
#banner-form-wrap .et_pb_fullwidth_code.flex-wrap:before {
    content: "";
    height: 14em;
    width: 12.7em;
    background: url(images/bottom-dog.png) center bottom no-repeat;
    background-size: contain;
    position: absolute;
    bottom: -3.5em;
    left: -13.2em;
    margin: auto;
    z-index: 1;
}
#banner-form-wrap > .flex-wrap {
    margin-left: 7%;
}
.free-estimate {
    font-size: 4em;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 0.7em;
    margin-right: 0.7em;
    text-shadow: 4px 0 0px #000000, -0.063em 0 0px #000000, 0px 0.063em 0px #000000, 0px -0.063em 0px #000000, -0.063em -0.063em 0px #000000, 0.063em 0.063em 0px #000000, 0.063em -0.063em 0px #000000, -0.063em 0.063em 0px #000000;
}
.free-estimate span {
    font-size: 0.47em;
}
#banner-form-wrap .close-button {
    margin: 0 2em 0 7%;
    background: none;
    border: solid 1px #000000;
}
#banner-form-wrap .close-button:hover {
    cursor: pointer;
}
#banner-form-wrap .help-block {
    color: #FFFFFF;
}
#page-container #banner-form-wrap .caldera-grid .form-group {
    margin-bottom: 0;
}

#fld_7908577_1-wrap:before {
    content: "";
    height: 4.579em;
    width: 3.684em;
    background: url(images/dog-paw.svg) center center no-repeat;
    background-size: contain;
    filter: drop-shadow(2px 2px 4px #5d1c1e);
    position: absolute;
    top: 0;
    bottom: 0;
    right: -1em;
    margin: auto;
    z-index: 1;
    pointer-events: none;
    transition: .32s ease-in-out;
    opacity: 0;
    transform: scale(1.2);
}
#fld_7908577_1-wrap:hover:before { 
    content: "";
    height: 4.579em;
    width: 3.684em;
    background: url(images/dog-paw.svg) center center no-repeat;
    background-size: contain;
    opacity: 0.91;
    transform: scale(1);
}
#fld_7908577_1-wrap input {
    transition: .27s ease-out;
}
#fld_7908577_1-wrap:hover input {
    transform: scale(0.95);
}

.service-item {
    height: 16em;
    background-size: 100%;
    transition: .24s linear;
}
.service-item:hover {
    background-size: 110%;
}
.service-item:hover h2 {
    background: #bd2126;
}
.service-item .et_pb_code_inner { width: 100%; }
.service-item h2 {
    font-size: 1.7em;
    text-transform: uppercase;
    font-weight: 700;
    background: #626161;
    padding: 0.5em .5em;
    transition: .24s linear;
    z-index: 0;
}
/*.service-item h2:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8em 3.7em;
    border-color: transparent transparent #626161 transparent;
    position: absolute;
    top: 0;
    bottom: 1.25em;
    left: 0;
    right: 0;
    margin: auto;
    z-index: -1;
}*/


#main-header:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 1.5em 50vw 0 0;
    border-color: #414143 transparent transparent transparent;
    position: absolute;
    bottom: -1.5em;
    left: 0;
}
#main-header:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 50vw 1.5em 0;
    border-color: transparent #414143 transparent transparent;
    position: absolute;
    bottom: -1.5em;
    right: 0;
}
#main-header #top-menu { display: flex; align-items: center; margin-bottom: 0; }
#main-header .et_menu_container { display: flex; align-items: center; padding: 1em 1.75em; }
#et-top-navigation { padding: 0 !important; margin-left: auto; }
#main-header #top-menu-nav { margin-bottom: 0; }
#main-header #top-menu li a { font-size: 1.25em; line-height: 1.2em; }
#main-header .mobile_menu_bar { padding: 0; }
#main-header .mobile_menu_bar:before {
    color: #FFFFFF;
}
#main-header .logo_container { position: relative; flex: 0.75; display: flex; align-items: center; }
#main-header .logo_container a { display: flex; }
#main-header.et-fixed-header #top-menu li a {
    font-size: 1em;
}
#page-container #main-header.et-fixed-header #logo {
    max-height: 2.7em;
}

#top-header > .container {
    padding: 0.7em 0;
}
#top-header #et-info {
    margin-bottom: 0;
    padding-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
#top-header .callout-button {
    margin-right: 3.5em;
    font-size: 1.0em;
}
#top-header #et-info-phone {
    font-size: 1.55em;
    display: flex;
    align-items: center;
}
#top-header #et-info-phone:before {
    margin: auto;
    left: -0.55em;
    right: initial;
    top: 0;
    bottom: 0;
    display: table;
    -webkit-animation-name: shake; -moz-animation-name: shake; animation-name: shake;
	-webkit-animation-duration: 2.45s; -moz-animation-duration: 2.45s; animation-duration: 2.45s;
	-webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite;
    animation-delay: 1.5s;
}
#top-header #et-info-phone:after {
    content: "";
    height: 0.860em;
    width: 0.688em;
    background: url(images/phone-ring.svg) center center no-repeat;
    background-size: contain;
    position: absolute;
    left: 0.02em;
    top: -0.35em;
    transform: scale(0) rotate(-21deg);
    margin: auto;
    z-index: 1;
    -webkit-animation-name: ring; -moz-animation-name: ring; animation-name: ring;
	-webkit-animation-duration: 2.45s; -moz-animation-duration: 2.45s; animation-duration: 2.45s;
	-webkit-animation-timing-function: ease-in-out; -moz-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite;
}
@-webkit-keyframes ring{
    
}
@-moz-keyframes ring{
       
}
@keyframes ring{
    0% {transform: scale(0)  rotate(-21deg);}
    10% {transform: scale(1) rotate(-21deg);}
    20% {transform: scale(0) rotate(-21deg);}
    25% {transform: scale(1) rotate(-21deg);}
    30% {transform: scale(0) rotate(-21deg);}
    40% {transform: scale(1) rotate(-21deg);}
    65% {transform: scale(1) rotate(-21deg);}
    80% {transform: scale(0) rotate(-21deg);}
    100% {transform: scale(0) rotate(-21deg);}
}

@keyframes shake{
    0% {transform: rotate(-7deg);}
    5% {transform: rotate(21deg);}
    10% {transform: rotate(-7deg);}
    15% {transform: rotate(10deg);}
    20% {transform: rotate(-7deg);}
    25% {transform: rotate(9deg);}
    80% {transform: rotate(0deg);}
    100% {}
}




#page-container #logo { max-height: 5.5em; height: auto; width: auto; padding: 0; transition: .2s; }
.et_header_style_left #page-container .et-fixed-header #et-top-navigation, .et_header_style_split .et-fixed-header #et-top-navigation { padding-top: 20px; }



#footer-bottom {
    padding-bottom: 9em;
}


.footer-phone .et_pb_code_inner { text-align: center; }
.footer-phone a {
    font-size: 1.7em;
    font-weight: 600;
}


.logos-row {
    max-width: initial;
    width: 90%;
}
#page-container .logos-list {
    padding: 0;
}
.home-logos img {
    height: auto;
    width: auto;
    max-width: 12em;
}

#eco-friendly-wrap .et_pb_code_inner { max-width: 20em; }
#eco-friendly-wrap figure {
    margin: 0 auto 0 0;
}
#eco-friendly-wrap figure img {
    max-width: 3.4em;
}
#eco-friendly-wrap p {
    font-size: 1.35em;
    font-weight: 100;
    border-right: solid 2px #4bc867;
    padding-right: 1em;
}

#page-container .caldera-grid .form-group { margin-bottom: 1em; }
#page-container .caldera-grid .form-control {
    border: none;
    border-radius: 10em;
    box-shadow: 0 0px 0px 4px rgb(0, 0, 0);
    -webkit-box-shadow: 0 0px 0px 4px rgb(0, 0, 0);
}
#page-container .caldera-grid .form-control:focus {
    box-shadow: 0 0px 0px 0px rgb(0, 0, 0);
    -webkit-box-shadow: 0 0px 0px 0px rgb(0, 0, 0);
}
#page-container .caldera-grid textarea.form-control {
    border-radius: 1.25em;
}
#page-container .caldera-grid hr {
    border: dashed 1px #7c5c5d;
}
.app-text {
    margin-bottom: 2em;
}
.caldera-grid div.last_col {
    width: auto;
}
.callout-button, #page-container .et_pb_button, #page-container .caldera-grid .btn, body #page-container #main-content .et_pb_button_0:hover {
    background: black;
    border: none;
    color: white;
    font-size: 1.2em;
    text-transform: uppercase;
    font-weight: 700;
    border-radius: 0;
    padding: .5em 2em;
}
#CF5cab97bde566b_1-row-1 {
    display: flex;
    align-items: center;
}

/*Added by Scott*/
.custom_bullets ul {
    padding-bottom: 1.25em;
}

.custom_bullets li { 
    padding-left: 1.8em;
    padding-bottom: 0em;
    list-style-type: none;
}

.custom_bullets li::before {
    font-family: 'ETmodules';
    content: "\5a";
    color: #bd2126;
    position: absolute;
    left: .25em;
	padding-left:.8em;
	font-size:1.125em;
	
}
.custom_bullets h4{margin-top:1em;
	line-height:1em;
font-weight:600;}
.signature{
	margin-left:.5em;
	font-weight:600;
	font-size:.9em;}

#page-container .sub-page-header .header-content{
	text-align:center;}

#page-container .sub-page-header .header-content h1{
	font-size:2.5em;
	font-weight:700;}

.sub-page-header{margin-top:10.2em;
	padding-top:2em;
	padding-bottom:2em;}

.green-text{color:#029600;
font-weight:700;}

.align-center{text-align:center;}

/* make changes for contact page */ 
.page-id-120608 #page-container .caldera-grid .form-control{border:1px solid #ccc;
border-radius:0;
margin-top:.5em;
margin-bottom:.5em;}

.page-id-120608 #banner-form-wrap{
	display:none;
}
.page-id-120608 #footer-bottom {
	padding-bottom: 1em;}
/* end make changes for contact page */

.black-border-box{
	border:1px solid #000000;
	padding:1.5em;
}

/*End Added by Scott*/

/* Media Queries */

/* Larger than 1760px */
@media only screen and (min-width: 110em) {

}
/* Larger than 1488px */
@media only screen and (min-width: 93em) {

}

/* 1690px */
@media screen and (max-device-width: 105.625em), screen and (max-width: 105.625em) {
    #et_mobile_nav_menu { display: block; }
    #top-menu-nav { display: none; }
}

/* 1456px */
@media screen and (max-device-width: 91em), screen and (max-width: 91em) {
    #main-header .logo_container {  }
    #main-header #top-menu > li {  }
    #main-header #top-menu > li > a {  }
}

/* 1366px */
@media screen and (max-device-width: 85.375em), screen and (max-width: 85.375em) {
    #banner-form-wrap { font-size: 72%; }
}

/* 1168px */
@media screen and (max-device-width: 73em), screen and (max-width: 73em) {
    #main-header #top-menu > li > a {  }
}

/* 980px */ /* Setting the breakpoint of the mobile menu */
@media screen and (max-device-width: 61.250em), screen and (max-width: 61.250em) {
    .flex-parent { flex-direction: column; display: block; }
    .flex-child { width: 100%; margin: 1em auto; text-align: center; }
    
    p { font-size: 1.1em; }
    #main-content h1 {  }
    #main-content h2 {  }
    #main-content h3 {  }
    .large-text { font-size: 1em; }
    #page-container { padding-top: 0 !important; }
    #page-container .no-padding .full-width { padding: 2.5em 1em; margin: auto !important; }
    .mobile_menu_bar { width: 100%; margin: auto; text-align: center; }
    .et_mobile_menu { border: none; }
    .phone-link { pointer-events: initial; }
    #page-container #main-header, #page-container #top-header { position: fixed; }
    #page-container #logo { height: 100%; max-height: 4.8em; width: auto; max-width: initial; }
    #top-header #et-info { padding: 0; justify-content: center; }

    
    .entry-content .et_pb_row, #page-container .full-width { width: 90% !important; margin: auto; }
    .et_pb_post a img { max-width: 55%; }
    #home-banner, #home-banner .mejs-mediaelement { height: 46em; }
    #banner-form-wrap .caldera-grid #CF5cab97bde566b_1-row-1 > div { width: 100%; }
    .free-estimate { font-size: 2.5em; }
    #banner-form-wrap .close-button { margin-left: 1%; }
    #banner-form-wrap .et_pb_fullwidth_code.flex-wrap:before { font-size: 55%; }
    .sub-page-header { margin-top: 9em; }
}

/* 848px */
@media screen and (max-device-width: 53em), screen and (max-width: 53em) {

}

/* 767px */
@media screen and (max-device-width: 47.938em), screen and (max-width: 47.938em) {
    #top-header #et-info { display: flex; }
    #top-header #et-info-phone { margin: auto 0 auto auto; }
    #top-header #et-info { font-size: 78%; }
    #top-header > .container { width: 95%; margin: auto; }
}


/* 752px */
@media screen and (max-device-width: 47em), screen and (max-width: 47em) {

    

}

/* Phone 600px */
@media screen and (max-device-width: 37.500em), screen and (max-width: 37.500em) {
    #main-content h1 {  }
    #main-content h3 {  }
    #main-content h5 {  }
    #main-content h6 {  }

    #page-container .caldera-grid .form-control { font-size: 1em; }
	#page-container .sub-page-header .header-content h1{
	font-size:1.875em;
	font-weight:600;}
    #main-header .et_menu_container { width: 97%; padding: 1em 0; }
    
    #home-banner, #home-banner .mejs-mediaelement { height: 27em; }
    #CF5cab97bde566b_1-row-1 { flex-direction: column; flex-wrap: wrap; }
    #banner-form-wrap .caldera-grid #CF5cab97bde566b_1-row-1>div { margin: 0.5em 0; }
    .free-estimate + div { width: 100%; }
    #banner-form-wrap .et_pb_fullwidth_code.flex-wrap:before { display: none; }
    #banner-form-wrap>.flex-wrap { margin-left: 2em; }
}

/* Phone 480px */
@media screen and (max-device-width: 30em), screen and (max-width: 30em) {
    #main-content h1 {  }
    #main-content h2 {  }
    #main-content h3 {  }
    #main-content h4 {  }
    #top-header #et-info { flex-direction: column; }
    #top-header .callout-button { margin: auto; }
    #top-header #et-info-phone { margin: 0.5em auto 0; }
    
    
    #eco-friendly-wrap { font-size: 80%; }
    #page-container #logo { max-height: 3em; }
    .sub-page-header { margin-top: 7em; }
}

/* 384px */
@media screen and (max-device-width: 24em), screen and (max-width: 24em) {
    
}