@charset "UTF-8";
/*
Theme Name: S2S 22.1
Description: Steps 2 Success, Steve Low
Author: Renée LeBlanc
Version: 22.1
Template: generic
*/
/*-------------------------------------------------------------
//  General / Reset
--------------------------------------------------------------*/
body{font-family:"Montserrat",serif;font-size:19px;color:#777;line-height:normal;word-wrap:break-word;}
body,#wrapper,#container,header,#content,#sidebar,#footer,#primary{margin:0;padding:0;border:0;}

a{text-decoration:none;}
a,a:hover,img,.icon,.button,.button a,.button a:hover{transition:all 0.5s ease}

h1,h2,h3,h4,h5,h6{font-weight:400;margin:0;padding:0;}
h1{font-size:1.6em;}
h2{font-size:1.5em;margin-top:30px;}
h3{font-size:1.4em;}
h4{font-size:1.3em;}
h5{font-size:1.2em;}
h6{font-size:1em;}

img{width:100%;height:auto !important;}
.alignleft{margin:0 30px 30px 0;float:left}
.alignright{margin:0 0 30px 30px;float:right}
.aligncenter{display:block;margin:30px auto;clear:both}
p.wp-caption-text{font-weight:normal;font-size:.8em;font-style:italic;text-align:right;}
.wp-caption{padding:10px;}

input,input:focus,input:hover,input.submit,#search input.search-submit,#search input{outline:0;border:0;box-shadow:0;border-radius:5px;padding:10px 15px;}
#search input.search-submit,#search input{padding:2px 10px;}
textarea,p.comment-form-comment label{clear:both;float:none;width:100%;}

.button{padding:20px;text-align:center;border-radius:20px;}

blockquote{}
.quoteauthor{font-size:.9em;font-style:italic;}
.separator{}
.superscript{vertical-align:super;font-size:.5em;margin-left:2px;}

#sidebar ul,#sidebar ul li,#menu ul, #menu ul li,#comments ul,#comments ul li,#footer ul,#footer ul li{list-style:none;margin:0;padding:0;}
#content ul li{margin-bottom:15px;}

/* functions.php  numbered pagination */
.navigation{font-size:.8em;text-align:center;padding:10px 0 25px;}
.navigation li {display:inline-block;}
.navigation li a {text-decoration:none;border:1px solid #ddd;padding:10px;}
.navigation li a,li.navdots{color:#aaa;}
.navigation li a:hover,.navigation li.active a{color:#fff;}
.navigation li a:hover,.navigation li.active a{background:#bbb;}
.navigation li.disabled{background:#9b7;}
.home-nav-top .navigation{padding-bottom:5px;}
/*-------------------------------------------------------------
//   Animation
--------------------------------------------------------------*/
x{animation: bgfadein ease-in 3s both;
-webkit-animation: bgfadein ease-in 3s both;
-moz-animation: bgfadein ease-in 3s both;
-o-animation: bgfadein ease-in 3s both;
-ms-animation: bgfadein ease-in 3s both;}
@keyframes bgfadein {0% {opacity:0;} 100% {opacity:1;}}
@-moz-keyframes bgfadein {0% {opacity:0;}100% {opacity:1;}}
@-webkit-keyframes bgfadein {0% {opacity:0;}100% {opacity:1;}}
@-o-keyframes bgfadein {0% {opacity:0;}100% {opacity:1;}}
@-ms-keyframes bgfadein {0% {opacity:0;}100% {opacity:1;}}

x{animation-delay:4s;-webkit-animation-delay:4s;}
/*-------------------------------------------------------------
//  Colour
--------------------------------------------------------------*/
a{color:#798;}
a:hover{color:#9aa;}
.testimonial{color:#788;}
.fa-s2s-quotes-close.icon{color:#adf;}
#site-title a,a .button,.foot-title,#footer .social .icon{color:#fff;}
#site-description a{color:#eed;}
#site-subdescription{color:#d77424;}
a .button:hover{color:#e4cda9;}

.social .icon{color:#ccc;}
a .icon.fa-twitter:hover{color:#1da1f2}/*Twitter*/
a .icon.fa-facebook:hover{color:#3b5998;}/* Facebook */
a .icon.fa-linkedin:hover,#footer a .icon.fa-linkedin:hover{color:#0e76a8;}/* LinkedIn */
a .icon.fa-pinterest:hover{color:#e60023}/* Pinterest */
a .icon.fa-instagram:hover{color:#c13584;}/* Instagram */
a .icon.fa-facebook-messenger:hover{color:#4267b2}/* FB Messenger */
.required{color:#c00;}

.menubg{background:#998;}
.testimonial,#features .cell.one{background:#9ce;}
#features .cell.two{background:#ec9;}
#features .cell.three{background:#dce;}
#menu li.menu-book-appt a{background:#7f7f6f;}
#menu li.menu-book-appt a:hover{background:#776;}
.button{background:#d77424/*#d7b379*/;} /*golden orange*/
.bookimglayer,.imglayer{background:#333;}
#footer{background:#ddc;}

#staff.front{border:2px solid #eee;}
.titleborder{border-bottom:3px solid #ddc;}
#features .title{border-bottom:3px solid #cde;}
#blog{border-top:1px solid #ddd;}
.divider{border-right:2px solid #eee;}

x{border:1px solid aqua;}
x{border:1px solid red;}
x{border:1px solid green;}
x{border:1px solid blue;}
/*-------------------------------------------------------------
//  Structure
--------------------------------------------------------------*/
body,#wrapper,#header.site,.menubg,#footer{vmin:100%;vmax:100%;vw:100%;}
#branding,nav#menu,#container,.footbg{width:1000px;max-width:1000px;margin:0 auto;}
#content,#sidebar,#appts,#features,#staff{margin:60px 0;}
#menu{overflow:auto;}
#header.site{margin-bottom:-5px;}
#branding{top:25%;right:5%;}
#site-title{/*margin-right:15px;*/}
#site-description{margin-left:20px;}
#site-subdescription{margin:7px 0 15px;}
#content,#sidebar{display:inline-block;}
#content{width:100%;}
#content.front,#content.about{width:50%;float:left;padding-top:30px;}
#sidebar{width:40%;float:right;}
#staff,#appts,#features,#blog,#features .cell,#features .divider{display:block;clear:both;float:none;}

#header.site,.menubg,#menu,.staffimg,.titleborder,#appts,#staff{position:relative;}
#branding,.imgbg,.imglayer,.buttonlayer,#appts .button{position:absolute;}
.mastimg,.imgbg,.titleborder{z-index:1;}
.imglayer{z-index:99;}
.buttonlayer{z-index:999;}
.menubg,#menu,#branding,.button,.staffimg{z-index:999;}
.imglayer{opacity:.3;width:40%;}
.imglayer,.buttonlayer{top:0;bottom:0;left:0;right:60%;}
.buttonlayer{width:30%;left:5%;right:65%;top:150px;}
#branding{width:500px;}

#menu li.menu-book-appt a{padding:10px 20px;}

.social .icon{margin-left:25px;}

#staff .cell{display:grid;grid-template-columns:25% 70%;grid-template-rows:auto;grid-gap:5%;}
#staff .staffimg{grid-area:1/1/2/2;}
#staff .info{grid-area:1/2/2/3;padding-right:50px;}

#staff .cell .staffimg{margin-left:30px;}
#staff .cell .staffimg,#staff .cell .info{padding-top:30px;padding-bottom:30px;}
#staff .cell .info{padding-left:20px;padding-right:50px;}
#staff .cell .title{padding-top:15px;}

.cell .title{padding-bottom:5px;}
.cell .text{padding-top:10px;}
.cell .readmore{padding-top:15px;}

#appts,.imglayer,.stonesteps{min-height:250px;top:0;bottom:0;left:0;right:0;}
.imglayer{opacity:.3;}
#appts .button{top:40%;left:10%;padding:30px 20px;}

#features{padding-top:40px;}
#features .cell{width:60%;min-height:250px;padding:40px 60px;}
#features .cell.one{margin-right:auto;margin-left:auto;}
#features .cell.two{float:right;}
#features .divider{width:50%;height:50px;}

#blog{margin-top:40px;padding-top:40px;}

#footer{clear:both;float:none;overflow:auto;}
.footbg{overflow:auto;}
.copyright{float:left;}
#footer .contact{float:right;}

#search{display:none;}
#menu{width:100%;}
#menu div:first-of-type{float:right;}
#menu ul{font-size:0}
#menu ul, #menu li, #menu a{position:relative;display:inline;list-style:none;margin:0;padding:0}
#menu li.menu-item-has-children > a:after, #menu li.page_item_has_children > a:after{font-family:serif;content:' ▾'}
#menu li.current-menu-item a, #menu li.current_page_parent a{}
#menu a{display:inline-block;font-size:16px;color:#ddc;text-align:right;text-decoration:none;line-height:33px;padding:10px;margin:-1px 0 0 25px;}

#menu a:hover, #menu a:focus{color:#fff;text-decoration:none}
#menu ul.sub-menu, #menu ul.children{position:absolute;display:block;top:100%;left:-9999px;margin-top:20px;transition:unset;z-index:999999}
#menu ul.sub-menu a, #menu ul.children a{width:200px;font-size:14px;color:#333;text-align:left;line-height:20px;padding:15px;border:none;background:#eed;}
#menu ul.sub-menu a:hover, #menu ul.sub-menu a:focus, #menu ul.children a:hover, #menu ul.children a:focus{color:red;background:pink;}
#menu li.menu-item-has-children a:hover + ul.sub-menu, #menu li.menu-item-has-children a:focus + ul.sub-menu, #menu li.menu-item-has-children a + ul.sub-menu:hover, #menu li.menu-item-has-children a + ul.sub-menu:focus-within, #menu li.page_item_has_children a:hover + ul.children, #menu li.page_item_has_children a:focus + ul.children, #menu li.page_item_has_children a + ul.children:hover, #menu li.page_item_has_children a + ul.children:focus-within{left:0}
#menu .menu-toggle{display:none;color:#eed;text-align:center;padding:0;border:0;margin:0 4% 0 0;background:none;transition:unset}
#menu .menu-toggle:hover, #menu .menu-toggle:focus{color:#fff}
#menu .menu-icon{font-size:50px}

/*-------------------------------------------------------------
//  Content
--------------------------------------------------------------*/
#site-title a,.foot-title,#site-description,#site-subdescription,#menu,.button,.readmore,.cell .title{text-transform:uppercase;}
.foot-title{font-family:"Windsong",cursive;text-transform:capitalize}
#site-description,#site-subdescription,#menu,.button,.readmore,.cell .title{font-family:'Montserrat',sans-serif;}

#branding,.quotes{text-align:right;}
#site-title a{font-size:2.8em;font-weight:500;}
#site-description{font-size:1.5em;}
#site-subdescription{font-size:1.1em;font-weight:500}
.buttonlayer{font-size:1.3em;}
.button{font-weight:600;}


.entry-content{text-align: justify;}
#content.front .entry-content p:first-of-type{margin-top:-25px;}
.social .icon{font-size:1.3em;}
.fa-s2s-quotes-close{font-size:7em;}
.testimonial{padding:40px 60px;}
.testimonial-text{margin-top:-85px;font-size:.9em;}
.author{font-style:italic;text-align:right;font-size:.8em;}

#staff.front,.testimonial,#features .cell,.staffimg img{box-shadow:5px 10px 20px #ddd;}
#staff .title{font-size:1.8em;padding-botttom:15px;}
#features .title{font-size:1.5em;border:0;}
#staff .info{font-size:.9em;}
#staff .readmore{padding:20px;}
#features .readmore{text-align:right;}

#appts .button{font-size:1.3em;}

.copyright{padding-top:50px;}
#footer .contact{padding-top:40px;}
.copyright,#footer .contact{padding-bottom:70px;}
.foot-title{font-size:1.9em;padding-right:35px;}
#footer .social .icon{font-size:1.5em;}

/*-------------------------------------------------------------
//  Media
--------------------------------------------------------------*/
/********* everything larger than mobile **********************/
@media screen and (min-width:1000px){
#menu .menu-toggle{display:none;}
}
/********* mobile reset ***************************************/
@media screen and (max-width:999px) {
#branding,nav#menu,#container,.footbg{width:100%;max-width:100%;}
#branding,nav#menu,#container,.footbg{vmin:100%;vmax:100%;vw:100%;}
.buttonlayer,.button{vmin:90%;vmax:90%;vw:90%;margin:0 auto;}

.imglayer{display:none;}
.buttonlayer{width:95%;left:0;right:0;top:20px;}
.buttonlayer,#branding{display:block;float:none;clear:both;}
#branding{width:95%;padding:0;margin:50px auto 30px;text-align:center;}
#site-description{width:65%;margin:0 auto;}

#menu .menu-toggle{display:block;float:right;}
#menu div:first-of-type{padding-top:7px;}
#menu ul{padding-top:20px;}
#menu ul,#menu li.menu-item-has-children > a:after, #menu li.page_item_has_children > a:after{display:none}
#menu.toggled ul, #menu.toggled ul.sub-menu, #menu.toggled ul.children{display:block;position:relative;top:0;left:0;padding:0;margin:0;}
#menu.toggled ul.sub-menu, #menu.toggled ul.children{padding-bottom:0}
#menu.toggled a, #menu.toggled ul.sub-menu a, #menu.toggled ul.children a{display:block;margin-right:30px;}
#content,.copyright,#footer .contact{padding:5%;}
#sidebar{width:38%;padding-right:2%;}

#staff,#features,#appts,.copyright,#footer .contact{display:block;float:none;width:88%;margin:70px auto;}

#staff .cell.one{display:grid;grid-template-columns:30% 70%;}
#staff .cell.one .text{text-align:left;}
#staff .title{font-size:3.5vw;}

.copyright{display:none;}
#footer .contact{display:block;float:none;text-align:center;padding:0;margin:15px auto 50px;font-size:2em;}
.foot-title{display:block;float:none;clear:both;font-size:2.5em;margin-bottom:-30px;}

}
/********* iphone 11 PRO MAX ****************/
@media screen and (max-width:980px){

}
/********* 800px wide ****************/
@media screen and (max-width:800px){
.foot-title{font-size:1.8em;margin-bottom:-30px;}
#site-description{font-size:1.2em;}
}
/*********everything larger than ipad portrait ****************/
@media screen and (min-width:769px){

}
/****************** ipad portrait *****************************/
@media screen and (max-width:768px){


}
/******* iphone 8+ and older, pixel 2, galaxy fold landscape, surface duo portrait and landscape ****************************/
@media screen and (max-width:767px){
#branding{margin:0;padding:0;top:100px;}
#site-title{margin-right:0;}
#site-title a{font-size:8vw;}
#site-description{font-size:3vw;margin-top:0;}
#menu.toggled a, #menu.toggled ul.sub-menu a, #menu.toggled ul.children a{color:#fff;}
#content,#sidebar{display:block;float:none;clear:both;width:95%;margin:0 auto;padding:0;}
#content.front,#content.about,#sidebar{width:95%;float:none;}
#container{padding-top:40px;}

.entry-content{width:95%;margin:0 auto;padding:0;}
#staff .cell{width:100%;}
#staff .title{margin-top:30px;font-size:4.5vw;}
.testimonial{margin:40px 0;}
}
/*********** all larger than phone portrait *******************/
@media screen and (min-width:480px) {

}
/***************** phone portrait *****************************/
@media screen and (max-width:479px){
.button,.buttonlayer{border-radius:0;margin:0;padding:0;top:0;left:0;right:0;width:100%;vw:100%;}
.mastimg{margin-top:75px;}
.buttonlayer{margin-top:-75px;}
.button{padding:15px 0;text-align:center;}
#branding{padding:0;margin:0;top:35px;}
#site-description{font-size:4vw;width:80%;}

#staff .title{font-size:7vw;}
#site-subdescription{font-size:5vw;}
#staff .cell,#staff .staffimg,#staff .info,#staff .cell.one{display:block;float:none;clear:both;}
#staff .cell .staffimg{margin-left:0;}
#staff .cell .staffimg,#staff .cell .info{padding:30px;}

#features{padding-top:30px;}
#features .cell{width:80%;min-height:250px;padding:20px;}
#features .cell.one{margin-right:auto;margin-left:auto;}
#features .cell.two{float:none;}
#features .divider{width:50%;height:50px;}

#appts .button{width:70%;}

#footer .foot-title{line-height:.7em;margin:20px 0;}
}
.screen-reader-text{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden;display:none;}