/*
Theme Name: Breast Pumps 123
Theme URI: https://www.valice.com/
Author: Valice
Author URI: https://www.valice.com/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Template: whitespace
Text Domain: breast-pumps-123
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Whitespace is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

@import url('https://fonts.googleapis.com/css2?family=Sacramento&family=Montserrat:wght@300&display=swap');

@font-face {
    font-family: "Stone Sans";
    src: url("fonts/Stone_Sans_Medium.otf") format("opentype"),
        url("fonts/Stone_Sans_Regular.ttf") format("truetype"),
         url("fonts/Stone_Sans_Medium_Italic.otf") format("opentype");
}
  

body {
    font-family: "Stone Sans", sans-serif;
}

a,
a:visited {
    color: #98cc33;
}

a:hover {
    color: #ffbc01;
}

a.button,
.button,
a.wp-block-button__link,
.woocommerce a.button {
    background: #fff;
    color: rgba(0,0,0,.64);
    border: 1px solid rgba(33,33,33,.64);
    text-align: center;
    padding: 5px 10px;
    text-decoration: none;
    text-transform: uppercase;
    display: inline-block;
    border-radius: 0;
}

a.button:hover,
.button:hover,
a.wp-block-button__link:hover,
.woocommerce a.button:hover {
    background: #ffbc01;
    color: #fff;
}

a.button.yellow {
    background: #ffbc01;
    color: #fff;
}

a.button.yellow:hover {
    background: #fff;
    color: rgba(33,33,33,.64)
}

.woocommerce li.product a.button {
    display: block;
}

ol, ul {
    margin-left: 8px;
}

.entry-content ol > li {
    margin-bottom: 10px;
}

figcaption {
    background: none;
    bottom: -40px;
    display: block;
    color: #ffbc01;
    text-align: center;
}

/* Site Header */

.site-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-size: cover;
    position: relative;
}

.site-header .header-image img,
.site-header .header-image {
    width: 100%;
    max-width: 1060px;
    background-color: #fff;
}

.site-title {
    font-family: 'Sacramento', cursive;
    font-weight: 100;
    font-size: 80px;
    margin: 0;
    padding: 0;
    line-height: 1;
    position: absolute;
    z-index: 9;
    left: 0;
    right: 0;
    top: 0;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.site-description {
    margin-top: -15px;
    color: #ffbc01;
}

.site-title {
    padding: 40px 10px;
}

.site-title a {
    text-decoration: none;
    color: #fff;
}
 

/* Navigation */

.site-header .main-navigation {
    text-align: center;
    text-transform: uppercase;
    position: relative;
    z-index: 999;
    background-color: #fff;
    padding: 0 0 20px 0;
    max-width: 1060px;
    margin: -50px auto 0 auto;
}

.site-header .main-navigation ul {
    justify-content: space-between;
    max-width: 1000px;
    margin: 0 auto;
    font-size: 15px;
}

.site-header .main-navigation ul li a {
    border-bottom: 1px solid transparent;
    color: #ffcc33;
    font-weight: bold;
    padding: 0 15px;
}

.site-header .main-navigation ul li a:hover {
    border-bottom: 1px solid #ffbc01;
}

.site-header .main-navigation ul.sub-menu {
    flex-direction: column;
    justify-content: flex-start;
    text-align: left;
    align-items: flex-start;
    background: #f5f6f6;
    text-transform: none;
}

.site-header .main-navigation ul.sub-menu li a {
    padding: 10px;
    line-height: 1;
    color: #98cc33;
}

@media screen and (max-width: 37.5em) {
    button.menu-toggle {
        color: transparent;
        margin: 0 auto;
        border: none;
        background-color: transparent;
    }

    button.menu-toggle:before {
        content: "\f349";
        font-family: 'dashicons';
        color: #ffbc01;
        display: block;
    }

    .site-header .main-navigation {
        text-align: left;
        padding: 0 20px;
    }
}

@media only screen and (max-width: 750px) {
    .site-title {
        font-size: 40px;
        align-items: flex-start;
        padding: 10px;
    }
}

/* Page Layout */

.wp-block-column.blue-heading {
    color: #98cc33;
    text-align: center;
}

.wp-block-column .black-heading {
    color: #000;
}

.wp-block-column.blue-heading h2 {
    margin: 0;
}

.page-header,
.single .entry-header {
    text-align: center;
    padding: 10px;
    margin-top: 0;
    color: #98cc33;
    background: #fff;
    max-width: 1060px;
    margin: 0 auto;
}

h1.page-title {
    padding: 0;
    margin: 0;
}

.blog .content-area {
    border-top: 5px solid #ffbc01;
    margin-top: 10px;
}

.site {
    background-color: #d6d6d6;
}

.page {
    margin-bottom: 0;
}

.page-content,
.single .entry-content,
.single-post .entry-footer {
    background: #fff;
    padding: 10px 40px 40px 40px;
    margin: 0 auto;
    max-width: 1060px;
}

.wp-block-columns.space-between > .wp-block-column {
    margin: 20px auto;
}

.wp-block-columns.pumps p {
    margin: 0;
    padding: 0;
}

.wp-block-column.blue-block {
    background-color: #67c4c5;
    color: #fff;
    padding: 20px;
}

.wp-block-column.green-block {
    background-color: #98cc33;
    color: #000;
    padding: 20px;
    max-width: 600px;
}

.wp-block-column.green-block h2 {
    margin-bottom: 0;
    padding-bottom: 0;
}

.wp-block-column.green-block p {
    margin-top: 0;
    padding-top: 0;
}

.wp-block-cover-image .wp-block-cover__inner-container,
.wp-block-cover .wp-block-cover__inner-container {
}

.wp-block-cover-image .wp-block-cover__inner-container a,
.wp-block-cover .wp-block-cover__inner-container a {
    text-decoration: none;
}

.page-content .wp-block-cover, .wp-block-cover-image {
    margin: -40px -40px 40px -40px;
    width: auto;
}

.page-content .wp-block-column .wp-block-cover, .wp-block-cover-image {
    margin: 0;
}

.green-text {
    color: #98cc33;
}

.grey-text {
    color: #d6d6d6;
}

/* Toggle */

.toggleable {
    margin-bottom: 30px;
}

.toggleable .toggle-body {
    display: none;
    background: #f5f6f6;
    padding: 0 20px 20px 20px;
    font-size: 18px;
}

.toggleable.open .toggle-body {
    display: block;
}

.toggleable .toggle-handle {
    border-bottom: 1px solid #67c4c5;
    font-size:  20px;
}
    
/* Blog */

.blog .site-main,
.archive .archive-content {
    max-width: 1060px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    background: #fff;
}

.blog .site-main article,
.archive .site-main article {
    max-width: 300px;
    margin: 20px;
}

.blog .site-main article .entry-header,
.archive .site-main article .entry-header,
.entry-footer {
    padding: 20px;
} 

.image-header {
    width: 100%;
    height: 300px;
    background-size: cover;
    background-position: center;
}

.blog .site-main article .entry-header,
.archive .site-main article .entry-header {
    line-height: 1;
}

article .entry-header a {
    text-decoration: none;
}

.blog .site-main article .entry-content,
.archive .site-main article .entry-content {
    text-align: center;
    padding: 0 20px;
}

.posts-navigation {
    clear: both;
    width: 100%;
}

.posts-navigation .nav-links {
    max-width: 1050px;
    margin: 20px auto;
    display: flex;
    justify-content: space-between;
    padding: 5px;
}

/* Forms */

.gform_wrapper table {
	border: 1px solid;
	margin: 20px auto;
}

.gform_wrapper table th {
	background:#f5f5f5;
	padding: 10px
}

.gform_wrapper table td {
	line-height:1;
	padding: 5px;
}

.gform_wrapper.abn_wrapper .gf_left_ten {
    width: 5% !important;
    display: inline-block;
    vertical-align: top;
    float: none;
}

.gform_wrapper.abn_wrapper .gf_right_ninety {
    width: 95%;
    display: inline-block;
    vertical-align: top;
    float: none;
}

body .gform_wrapper.abn_wrapper ul li.gfield.gf_left_ten  {
	margin-top:0 !important;
}

/* Home Page */

.home .page-content {
    background: #fff;
}

.image-header-content {
    max-width: 600px;
    line-height: 1;
    margin: 0 20px 0 20%;
}

.image-header-content h1 {
    color: #67c4c5;
    font-family: 'Sacramento', cursive;
    font-size: 60px;
    margin-bottom: 0;
    padding-bottom: 0;
}

.image-header-content h2 {
    margin-top: 0;
    padding-top: 0;
}

.image-header-content a.button {
    background: #ffbc01;
    color: #fff;
    padding: 10px 20px;
    font-size: 20px;
    border: none;
}

.image-header-content a.button:hover {
    border: none;
    background-color: #67c4c5;
}

.overview-section,
.services-section,
.about-section {
    max-width: 1060px;
    margin: 40px auto;
    padding: 40px 20px;
}

.image-separator {
    background-attachment: fixed;
    height: 500px;
    background-size: cover;
}

.services-section {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.services-section .service-block {
    width: 300px;
    margin: 20px;
    background: #c1bdbf;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.services-section .service-block .service-image {
    height: 300px;
    background-size: cover;
}

.services-section .service-block .service-content {
    padding: 10px;
    color: #fff;
    text-align: center;
}

.services-section .service-block .service-content a.button {
    margin-top: 20px;
    display: block;
}

.testimonial-items {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.testimonial-items .testimonial-item {
    width: 300px;
    height: 300px;
    margin: 20px;
    background: #f5f6f6;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

.testimonial-items .testimonial-item h2 {
    line-height: 1;
}

.about-section {
    display: flex;
    height: 500px;
    justify-content: center;
}

.about-section .about-content {
    background: #ffbc01;
    width: 50%;
    margin: 20px;
    display: flex;
    justify-content: center;
    color: #fff;
    flex-direction: column;
    padding: 20px;
}

.about-section .about-content a.button {
    margin-top: 40px;
}

.about-section .about-content a.button:hover {
    background: #67c4c5;
}

.about-section .about-image {
    width: 50%;
    background-size: contain;
    margin: 20px;
}

.articles-section .random-posts {
    display: flex;
    justify-content: center;
    background: #c1bdbf;
    padding: 60px 20px;
    flex-wrap: wrap;
}

.articles-section article {
    background: #fff;
    width: 400px;
    margin: 20px;
}

.articles-section article .image-header {
    height: 300px;
}

.articles-section article .entry-content,
.articles-section article .entry-header {
    padding: 0 20px;
    text-align: center;
}

.blocks-gallery-grid.aligncenter .blocks-gallery-item figure, .wp-block-gallery.aligncenter .blocks-gallery-item figure {
    width: 150px;
}

.blocks-gallery-grid .blocks-gallery-image figcaption, .blocks-gallery-grid .blocks-gallery-item figcaption, .wp-block-gallery .blocks-gallery-image figcaption, .wp-block-gallery .blocks-gallery-item figcaption {
    padding: 0;
    margin-bottom: 30px;
}

.wp-block-gallery.columns-4 .blocks-gallery-item {
    height: 230px;
    margin: 0;
}

.small-title {
    font-family: 'Sacramento', cursive;
    margin-bottom: -20px;
}

/* Breast Pumps */

.post-type-archive-breast_pump article {
    text-align: center;
    background: #f5f5f5;
    box-shadow: 3px 3px 3px #ccc;
}

.post-type-archive-breast_pump article img {
    padding: 10px;
    background-color: #fff;
}

.pump-gallery {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.pump-gallery .pump-gallery-item {
    background-size: cover;
    width: 240px;
    height: 240px;
}

.price {
    color: #77a464;
}

.breast-pump-content {
    display: flex;
}

.breast-pump-content > div {
    width: 50%;
}

.woocommerce div.product p.price {
	margin-bottom: 5px;
	color: #98cc33;
}

a.purple-button {
	background: #a46497;
	color: #fff;
	text-decoration: none;
overflow: visible;
padding: .618em 1em;
font-weight: 700;
border-radius: 3px;
}

.insurance-ordering {
	margin-bottom: 40px;
}

@media only screen and (max-width: 750px) {
    .breast-pump-content {
        flex-direction: column;
    }
    
    .breast-pump-content > div {
        width: 100%;
    }
}

/* Slider */

.image-slider {
  max-height: 200px;
  overflow: hidden;
}

.image-slider img.slick-slide {
    height: 200px;
    width: auto;
    max-width: none;
}

ul.slick-dots {
	position: absolute;
	text-align: center;
	bottom: 0;
	margin: 0;
	right: 0;
	left: 0;
}

ul.slick-dots li {
	list-style-type: none;
	display: inline-block;
}

ul.slick-dots button {
	text-indent: -9999px;
	background: transparent;
	border: 2px solid #3f4156;
	border-radius: 100%;
	padding: 0;
	height: 15px;
	width: 15px;
	margin: 0 3px;

}

ul.slick-dots button:hover {
	background: #fff;
}

ul.slick-dots li.slick-active button {
	background: #fff;
}


/* Footer */

.site-footer {
    padding: 0;
}

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

.footer-widgets p {
    padding: 0 10px;
    margin: 0;
}

.footer-widgets .widget {
    margin: 0;
}