/*
  Theme Name: Empathysites
  Theme URI: http://empathysites.com
  Version: 1.0
  Description: A theme for Empathysites website 
  Author: Empathysites
  Author URI: http://empathysites.com
  Template: bb-theme
*/


/* Empathysites Styles and Classes ------------------------------------ */

/* Make images stay contained */
img{
  max-width: 100%;
}

/* Image Hoverstate */
a img:hover{
    opacity: 0.85;
}

/* Increase paragraph margin */
p{
  margin:0 0 30px;
}


/* Add class for row reverse */
@media screen and (max-width: 993px) {
  .es-grid-switcher .fl-col-group{
      display: flex;
      flex-wrap: wrap-reverse;
  }
}

/* Your account is now active page */

.wp-activate-container {
    margin: 0 auto;
    max-width: 750px;
    padding: 40px;
}

.wp-activate-container h2{
  padding-bottom:20px;
}

#signup-welcome span.h3{
  font-weight: normal;
  padding:0;
}


/* Reduce padding on mobile style */
/* Add to rows to reduce padding on screens smaller than 900px */

@media screen and (max-width: 380px){
    .es-responsive-pad .fl-row-content-wrap,
    .es-responsive-pad .fl-col-content{
        padding-top: 20px;
        padding-bottom: 20px;
    }
}

@media screen and (min-width:380px) and (max-width: 700px){
    .es-responsive-pad .fl-row-content-wrap,
    .es-responsive-pad .fl-col-content{
        padding-top: 70px;
        padding-bottom: 70px;
    }
}

@media screen and (min-width:700px) and (max-width: 900px){
    .es-responsive-pad .fl-row-content-wrap,
    .es-responsive-pad .fl-col-content{
        padding-top: 100px;
        padding-bottom: 100px;
    }
}

/* After Post Area */
.fl-post-cats-tags{
  padding-bottom: 10px;
  margin-bottom: 20px;
}

.give-it-shadow{
  -webkit-box-shadow: 0px 7px 50px 0px rgba(38, 50, 56, 0.15);
  -moz-box-shadow:   0px 7px 50px 0px rgba(38, 50, 56, 0.15);
  box-shadow:    0px 7px 50px 0px rgba(38, 50, 56, 0.15);
  border: none;
}


/* Theme Specific Styles ------------------------------------ */

/* Increase letter spacing */
body {
    letter-spacing: 0.28px;
}

h1,h2,h3,h4,h5,h6{
  letter-spacing: 0.3px;
  margin-bottom: 16px;
}


/* Borders */

.fl-page-bar,
.fl-page-nav-wrap,
.fl-page-nav-right .fl-page-header-wrap,
.fl-page-footer,
.fl-page-footer-widgets,
.fl-builder-pagination li a.page-numbers,
.fl-builder-pagination li span.page-numbers,
.fl-content-left,
.fl-content-right,
.fl-post-grid-post {
    border: none;
}

.fl-page-nav .navbar-nav > li > a {
    padding-top: 20px;
    padding-bottom: 20px;
}

.fl-post-feed-post,
.fl-post-cats-tags {
    border-bottom: 1px solid #ededed;
}

.fl-post-meta-bottom,
.fl-post-nav {
    border-top: 1px solid #ededed;
}

.fl-post-feed-post {
    border-bottom: 1px solid #ededed;
}

.fl-post-meta-bottom,
.fl-post-nav {
    border-top: 1px solid #ededed;
}

/* Lists */

ul, ol {
    margin-bottom: 30px;
}

ol > li {
    list-style-type: decimal;
}
ol li ol li{
    list-style-type: lower-alpha;     
}
ol li ol li ol li{
    list-style-type: lower-roman;
}

/* Blockquote */

blockquote{
  display:block;
  border:none;
  padding: 15px 20px 15px 50px;
  margin: 0 0 20px;
  position: relative;
  font-style: italic;
}

blockquote p{
  margin: 0;  
}

blockquote::before{
    content: "\201C"; /*Unicode for Left Double Quote*/
    font-family: Georgia, serif;
    font-size: 70px;
    position: absolute;
    left: 10px;
    top:-5px;
    color: #e6e6e6;
}

blockquote::after{
  /*Reset to make sure*/
  content: "";
}


/* Forms */

form label{
    font-weight: normal;
}

.btn, 
.button,
.woocommerce .button,
.woocommerce .button:hover,
.woocommerce button.button.alt,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt,
.woocommerce-page input.button.alt:hover,
.woocommerce-page a.button.alt,
.woocommerce-page a.button.alt:hover,
.woocommerce input.button,
.woocommerce input.button:hover,
.woocommerce-page input.button,
.woocommerce-page input.button:hover,
.woocommerce-page a.button,
.woocommerce-page a.button:hover,
.fl-post-content .button,
.fl-post-content .button:hover,
input[type="submit"],
button:hover,  
input[type="submit"]:hover, 
a.fl-button, 
a.fl-button:visited,
a.fl-button:hover,
.fl-builder-content a.fl-button,
.fl-builder-content a.fl-button:visited,
.fl-builder-content a.fl-button:hover,
#hfwp-button,
#hfwp-button:visited,
#hfwp-button:hover {
    border: none;
    border-radius: 30px;
    text-transform: uppercase;
    color: white;
}

body .woocommerce .button,
#hfwp-button{
  background-color: #61b7bf;
}
body .woocommerce .button:hover,
#hfwp-button:hover{
  background-color: #a7dbdc;
}

body .woocommerce .button,
body .woocommerce .button:hover,
.woocommerce button.button.alt,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt,
.woocommerce-page input.button.alt:hover,
.woocommerce-page a.button.alt,
.woocommerce-page a.button.alt:hover,
.woocommerce input.button,
.woocommerce input.button:hover,
.woocommerce-page input.button,
.woocommerce-page input.button:hover,
.woocommerce-page a.button,
.woocommerce-page a.button:hover,
.gform_button.button,
.gform_button.button:hover,
#hfwp-button,
#hfwp-button:hover{
  padding: 9px 18px 7px;
}

body .woocommerce .checkout-button.button,
body .woocommerce .checkout-button.button:hover{
  padding: 20px 20px 17px;
}

input[type="text"], 
input[type="password"], 
input[type="email"], 
input[type="tel"], 
input[type="date"], 
input[type="month"], 
input[type="week"], 
input[type="time"], 
input[type="number"], 
input[type="search"], 
textarea{
  background-color: white;
  box-shadow: none;
  border: 1px solid #d3d3d3;
}


/* Hide Hushmail Secure Form phone label and field */
.hfwp-phone{
  display: none;
}


/* Expand the containers ---------------------- */

.fl-full-width .fl-page-header-container.container,
.fl-full-width .fl-page-bar-container.container{
  width:94%;
}

.container{
  max-width: 95%;
}

/* Header stuff -------------------------------*/


/*Transparent header*/

/* Make the header transparent */
body .fl-page-bar,
body .fl-page-header-primary{
    background:none;
    position:relative;
    z-index: 10;
}

/* FOR GREATER THAN THE MEDIUM DEVICE BREAKPOINT */
@media screen and (min-width: 993px) {
  /* ROW STYLING */
  #top-banner .fl-row-content-wrap,
  .es-top-post-header{
      margin-top: -102px; 
  }
}

/* Top Bar Style */

.fl-page-bar{
  font-size: 15px;
  font-weight: 300;
  line-height: 1.1;
}

/* Drop down sub item indicator */

.nav li > a:after {
    color: inherit;
    content: ' ▾';
}

.nav li > a:only-child:after {
    content: '';
}

/* Drop down menu style */

.fl-page-nav ul.sub-menu {
    border-top: none;
    box-shadow: none;
}

/* Make links in header light on active */
.fl-page-nav-right .fl-page-nav-wrap .navbar-nav li > a:hover{
  color:#bababa;
} 
body .fl-page-nav-right .fl-page-nav-wrap .navbar-nav li > a:active,
body .fl-page-nav-right .fl-page-nav-wrap .navbar-nav > li > a:focus {
    color: #bababa;
}

/* Menu highlight */
/* FOR GREATER THAN THE MEDIUM DEVICE BREAKPOINT */
@media screen and (min-width: 992px) {
  #menu-primary-menu .es-highlight,
  #menu-primary .es-highlight{
    background-color:#61b7bf;
    border-radius: 20px;
  }
  #menu-primary-menu .es-highlight:hover,
  #menu-primary .es-highlight:hover{
    background-color: #a7dbdc;
  }
  .fl-page-nav-right .fl-page-header-row .navbar-right > li:last-child.es-highlight > a {
      padding-right: 19px;
  }
  #menu-primary-menu .es-highlight a,
  #menu-primary .es-highlight a,
  #menu-primary-menu .es-highlight a:active,
  #menu-primary .es-highlight a:active,
  #menu-primary-menu .es-highlight a:focus,
  #menu-primary .es-highlight a:focus{
      font-weight: 400;
      color: white;
  }
}

/*Nav items*/

.fl-page-nav .navbar-nav > li > a {
    padding-bottom: 10px;
    padding-top: 10px;
}

.fl-page-header-row .nav{
  letter-spacing:1px;
}


/* Portfolio and Template (site) Screenshot Styles ------------------*/

.es-site-screenshot{
    border-radius: 5px;
    border: 1px solid #e2e2e2;
}

.es-site-screenshot img{
    border: 1px solid #e2e2e2;
}

.es-portfolio-item-description{
  margin-top:10px;
  font-size: 16px; 
  color: #767676; 
  font-weight:300;
}

/* Blog Archive Page and Feeds -------------------------------*/

.fl-archive.container{
  padding-top:30px;
}

.fl-archive .fl-post {
    border-bottom: 1px solid #ededed;
    padding-bottom: 50px;
    padding-top: 30px;
}

.fl-archive .fl-post-thumb img{
  margin: 0 auto;
  display: block;
}

.es-beside-content{
  padding-left: 40px;
}
.fl-post-header{
  margin-bottom: 35px;
}

.fl-post-grid-post{
  -webkit-box-shadow: 0px 7px 50px 0px rgba(38, 50, 56, 0.15);
  -moz-box-shadow:   0px 7px 50px 0px rgba(38, 50, 56, 0.15);
  box-shadow:    0px 7px 50px 0px rgba(38, 50, 56, 0.15);
  border: none;
}

/* Blog Widgets */

.fl-widget .widget_categories ul li{
    display: inline;
    padding-right:10px;
}
.widget_categories h2{
    font-size:20px;
}
.widget_search h2{
  font-size: 20px;
}

/* Pagination */

.fl-builder-pagination li a.page-numbers:hover, .fl-builder-pagination li span.current {
    background: none;
  }

.fl-builder-pagination,
.page-numbers,
a.page-numbers{
  font-size: 28px;
  font-weight: 300;
}

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

.es-pagination .page-numbers{
  padding:20px;
}

/* Archive and Search Stuff */

.fl-archive .fl-archive-title {
  font-size: 30px;
}

.fl-post-title-liststyle{
  font-size: 21px;
  margin-top: 10px;
  margin-bottom: 20px;
}
.fl-post-title-liststyle a{
  color: #61b7bf;
}
.fl-post-title-liststyle a:hover{
  color: #a7dbdc;
}

/* Single Page -------------------------------*/

/* Layout Overall */

.single .fl-content{
  margin-top: 0;
}
.es-single-header-container .es-post-header,
.single .es-single-thumb img{
  max-width: 900px;
  margin: 0 auto;
  display: block;
}

.single .es-post-content,
.single .fl-post-meta-bottom,
.single .es-author-box-container,
.single .fl-comments{
  max-width: 800px;
  margin: 0 auto;
  display: block;

}

.es-single-header-container .es-post-header,
.single .es-single-thumb img,
.single .es-post-content,
.single .fl-post-meta-bottom,
.single .es-author-box-container,
.single .fl-comments{
  padding-left: 20px;
  padding-right: 20px;
}

@media only screen and (min-width: 992px) {
  .es-single-header-container .es-post-header,
  .single .es-single-thumb img,
  .single .es-post-content,
  .single .fl-post-meta-bottom,
  .single .es-author-box-container,
  .single .fl-comments{
    padding-left: 0;
    padding-right: 0;
  }
}

/* Header Container */

.es-single-header-container{
    padding-top: 60px; 
    padding-bottom:60px;
    background-color: #f7f7f7;
    width: 100%;
}
@media only screen and (min-width: 992px) {
  .es-single-header-container{
      padding-top: 200px; 
      margin-top: -100px;
      padding-bottom: 300px; 
      margin-bottom:25px;  
  }
}

/* Title */

.single .fl-post-title{
  max-width: 80%;
  margin-bottom: 30px;
  font-size:35px;
}
@media only screen and (min-width: 992px) {
  .single .fl-post-title{
    max-width: 70%;
  }
}
/* Top Meta */

.single .fl-post-author{
  display:block;
  font-size: 14px;
  padding-top: 4px;
}
.single .fl-post-date{
  display:block;
  margin-top: -3px;
}

.es-post-header img.avatar{
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
   border-radius: 50%;
   float:left;
   width: 50px;
   margin-right: 10px;
 }

/* Featured Image */

.single .es-single-thumb{
  clear: both;
  padding-top: 20px;
}

@media only screen and (min-width: 992px) {
  .single .es-single-thumb{
    margin-top: -300px;
  }
}
.single .es-single-thumb img{
  width:100%;
}

/* Main written content area under image */

.single .fl-post-content{
  padding-top: 60px;
}

.single .fl-post-content h1,
.single .fl-post-content h2,
.single .fl-post-content h3,
.single .fl-post-content h4,
.single .fl-post-content h5,
.single .fl-post-content h6{
  margin-bottom:;
}


/* End Of Post Author Box */

.es-author-heading{
  font-size:22px;
}

.fl-author-description p{
  margin-bottom:0;
  font-size: 15px;
}

.fl-post .fl-author-box {
    background: #f7f7f7;
    border: none;
    margin-top: 20px;
    margin-bottom: 40px;
}
.fl-author-avatar img{
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
   border-radius: 50%;
   margin-bottom: 5px;
}

/* Comments */

.fl-comments .form-control{
  box-shadow: none;
  border-radius: 0;
  background-color: white;
}

.fl-comments-list .comment-content {
    border: none;
    padding: 0;
}

/* Naked Social Share ------------------------------------ */

.naked-social-share{
  margin: 20px 0 10px;
}

.entry-meta .naked-social-share ul {
    margin: 0;
}
.naked-social-share ul {
    list-style: outside none none;
    padding: 0;
    margin-bottom:0;
    color:  #bbbbbb;
    text-align: center;
}

.naked-social-share ul:before{
  content:"SHARE THIS ";
  letter-spacing: 2px;
  font-family:"Montserrat";
  padding-right:10px;
  font-size:110%;
}

.entry-meta .naked-social-share li {
    margin: 0 2px 0 0;
    width: 21%;
}
.naked-social-share li {
    display: inline-block;    
}
.naked-social-share a {
    border: medium none;
    display: block;
    padding: 0px 10px;
    text-decoration: none;
    color: #d1d3d4;
    font-size:110%;
}
.naked-social-share a:hover {
   color: #61b7bf;
}
.nss-site-name {
    display: none;
}


/* Woocommerce ------------------------------------ */


#customer_details .col-1{
  width:100%;
}

/* Fixing stripe field input text size*/
#add_payment_method #payment div.payment_box .wc-credit-card-form-card-number,
#add_payment_method #payment div.payment_box .wc-credit-card-form-card-expiry,
#add_payment_method #payment div.payment_box .wc-credit-card-form-card-cvc{
  font-size: 1em;
}

/* Footer ------------------------------------ */

/* Widget */

.fl-page-footer-widgets{
  padding:30px 0;
}
.fl-page-footer-widgets-row .fl-widget-title{
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 0.7px;
}
.fl-page-footer-widgets .widget_nav_menu a{
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 300;
  letter-spacing: 0.7px;
}

@media screen and (min-width: 993px) {
  .fl-page-footer-widgets{
    padding:50px 0 60px;
  }
}

.fl-page-footer-widgets a{
  display:inline-block;
  font-size: 14px;
}

@media screen and (min-width: 500px) {
  .fl-page-footer-widgets-row > div:nth-of-type(1) {
    width: 100%;
  }
  .fl-page-footer-widgets-row > div:nth-of-type(2),
  .fl-page-footer-widgets-row > div:nth-of-type(3),
  .fl-page-footer-widgets-row > div:nth-of-type(4){
    width: 30%;
    float: left;
  }

}

@media screen and (min-width: 793px) {
  .fl-page-footer-widgets-row > div:nth-of-type(1) {
    width: 40%;
    text-align: left;
  }

  .fl-page-footer-widgets-row > div:nth-of-type(2),
  .fl-page-footer-widgets-row > div:nth-of-type(3),
  .fl-page-footer-widgets-row > div:nth-of-type(4){
    width: 13%;
    float:right;
    text-align: left;
  }
}

/* Menu */
#menu-footer-menu{
  font-size:95%;
}

/* Copyright Alignment */

.es-footer-creds{
    text-align: center;
    text-transform: uppercase;
    color: #666669;
    font-size:10px;
}

.es-footer-creds a{
    color: #666669;
}

/* FOR GREATER THAN THE MEDIUM DEVICE BREAKPOINT */
@media screen and (min-width: 993px) {
.es-footer-creds{
    text-align: left;
    }
}

/* Consult stuff footer 
--------------------------------------------- */
.consult-heading{
  margin-top:10px;
  font-size:26px;
}

.consult-text-footer{
  color: #666669;
  font-weight: 300;
}

a.consult-button-footer {
  clear: both;
  max-width: 300px;
  border-radius: 25px;
  display: block;
  color: #fff;
  background-color: #61b7bf;
  text-align: center;
  font-size: 18px;
  font-weight: 200;
  padding: 14px 0 11px;
  text-transform: uppercase;
  margin-top:15px;
}
a.consult-button-footer:hover {
  background-color: #a7dbdc;
  color: #fff;
  text-decoration: none;
}
@media screen and (min-width: 793px) {
  a.consult-button-footer {
    margin: 20px 0;
  }
}

