/*
Theme Name:   Twenty Twenty One Child
Theme URI:    http://example.com/twenty-twenty-one-child/
Description:  Twenty Fifteen Child Theme
Author:       John Doe
Author URI:   https://webwerk.com
Template:     twentytwentyone
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain:  twentytwentyonechild
*/

/* Variables */
@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans.eot');
    src: url('fonts/OpenSans.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans.woff2') format('woff2'),
        url('fonts/OpenSans.woff') format('woff'),
        url('fonts/OpenSans.ttf') format('truetype'),
        url('fonts/OpenSans.svg#OpenSans') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
:root {

	/* Font Family */
	--font-family-primary: "Open Sans", Helvetica, Arial, Verdana, sans-serif;

	/* Font Size */
	--font-size-primary: 17px;
	--font-size-h1: 25px;

	/* Line Height */
	--line-height: 29px;
	--line-height-h1: 25px; 

	/* Color */
	--color-primary: #888888;
	--color-white: #ffffff;

	/* Background Color */
	--bg-primary: #97846a;
	--bg-secondary: #94c3ed;
}

/**
 * Relax the definition a bit, to allow components to override it manually.
 */

*{
	margin: 0;
	padding: 0;
}
*,
*::before,
*::after {
	box-sizing: border-box;
}
.screen-reader-text {
    border: 0;
    clip: rect(1px,1px,1px,1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal!important;
}
body {
	font-family: var(--font-family-primary);
	font-size: var(--font-size-primary);
    line-height: var(--line-height);
    font-style: normal;
    font-variant-caps: normal;
    font-variant-ligatures: normal;
    font-variant-numeric: normal;
    font-variant-east-asian: normal;
    font-weight: normal;
    font-stretch: normal;
    word-spacing: normal;
	color: var(--color-primary);
}
b, strong {
    font-weight: 700;
}
button {
	cursor: pointer;
}

button:hover, input[type="button"]:hover, 
input[type="reset"]:hover, 
input[type="submit"]:hover, 
input[type="submit"]{
    text-decoration: none;
}

button, 
input[type="button"], 
input[type="reset"], 
input[type="submit"]{
	padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 12px;
    padding-right: 12px;
    color: var(--color-white);
    background-color: #3b8ced;
    font: normal normal normal 14px / 36px var(--font-family-primary);
    text-transform: none;
    border: none;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    -ms-border-radius: 7px;
    -o-border-radius: 7px;
    border-radius: 7px;
	-webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    -ms-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
}
a, a:hover {
    color: #3b8ced;
}
a {
    text-decoration: underline;
}
.text-center{
	text-align: center;
}
.text-right{
	text-align: right;
}
.site{
	background-color: var(--bg-secondary);
}
.site-wrapper{
	padding-right: 0!important;
    padding-left: 0!important;
	background-color: var(--color-white);
}
.text-near-logo .safe-during-covid{
	border:2px dotted blue;
	padding: 5px;
	margin-top: 10px;
	line-height: 25px;
}
.text-near-logo .safe-during-covid a{
	color: #3a3a3a
}
#header .main-nav{
	background-color: var(--bg-primary);
}
#header .main-nav .sf-menu{
    padding: 0 40px;    
}
#header .main-nav .sf-menu > li {
	margin: 0 15px;
    line-height: 48px;
    display: inline-block;
    position: relative;
    z-index: auto;
    vertical-align: middle;
}
#header .main-nav .sf-menu >li:first-child>a {
    padding-left: 0;
}
#header .main-nav .sf-menu > li > a{
    position: relative;
    font-size: 14px;
    line-height: 18px;
    vertical-align: middle;
	color: var(--color-white);
}
#header .main-nav .sf-menu li a:hover,
#header .main-nav .sf-menu li.current-menu-item a{
    color: #c9c9c9;
}
.sub-menu-toggle{
	display: none;
}
#header .main-nav .sf-menu .sub-menu {
	padding: 10px 0;
    background-color: #ffffff;
    -webkit-box-shadow: 0px 0px 4px rgb(0 0 0 / 20%);
    -moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 4px rgb(0 0 0 / 20%);
}
#header .main-nav .sf-menu .sub-menu li a {
    padding-top: 6px;
    padding-bottom: 6px;
}
#header .main-nav .sf-menu .sub-menu > li > a {
    font: normal normal 12px / 16px "Open Sans", Helvetica, Arial, Verdana, sans-serif;
    text-transform: none;
    color: #000000;
    display: block;
    border-right: solid 1px transparent;
    border-left: solid 1px transparent;
    margin: 0 0 2px -1px;
    padding: 7px 30px 7px 10px;
    font-weight: normal;
    text-align: left;
    text-decoration: none;
    line-height: 20px;
}
.entry-header{
    padding: 10px 15px;
    background-color: rgba(136,136,136,0.08);
}
.entry-header.featured{
    padding: 0;
    background-color: transparent;
}
.page-title{
    font-size: 25px;
	line-height: 31px;
    font-weight: normal;
    color: #3a3a3a;
}
.breadcrumbs ol{
    display: flex;
}
.breadcrumbs ol li{
    position: relative;
    display: inline-block;
    padding-left: 12px;
    margin-left: 8px;
}
.breadcrumbs li:first-child:before {
    content: "";
}
.breadcrumbs li:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 15px;
    height: 13px;
    content: "/";
    opacity: .5;
    text-align: left;
    z-index: 3;
    color: rgba(188,188,188,0.5);
}
.breadcrumbs,
.breadcrumbs a {
    color: #bcbcbc;
    text-decoration: none;
}
.breadcrumbs a:hover{
    text-decoration: underline;
}
.entry-content{
    padding: 15px
}
.entry-content p {
    margin-bottom: 10px;
}

.site-footer {
    padding: 0 15px 15px;
    background-color: var(--bg-primary);
}
.site-footer .widget-area {
    padding-top: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(255,255,255,0.15);
}
.sidebar .widget-area{
    padding: 15px;
    color: #000000;
    background-color: #fafafa;
}
.widget_block{
    padding: 5px 0;
    line-height: 27px;
}
.widget_block div,
.widget_block h4,
.widget_block p,
.widget_block a{
    color: var(--color-white);
}
.sidebar .widget_block h4{
    color: #3a3a3a;
}
.sidebar .widget_block div,
.sidebar .widget_block p,
.sidebar .widget_block a{
    color: #888888;
}
.sidebar .widget_block h4{
    padding-bottom: 10px;
}
 

.widget_block h4{
    margin: 0;
    padding: 0 0 35px 0;
    font-weight: normal;
    border-bottom: 1px solid #979797;
}
.widget_block .footadd{
    padding: 5px 0 35px;
    border-bottom: 1px solid #979797;
}
.widget_block .footlinks {
    border-bottom: 1px solid #979797;
    padding: 10px 0;
}
.widget_block .footlinks a {
    font-size: 0.76em;
    text-decoration: none;
    text-transform: uppercase;
}
.site-footer .widget_block .footcopy {
    padding: 10px 0 0 0;
    font-size: 12px;
}
.form-header{
    font-size:.8em
}
.wpcf7 input[type='text'], 
.wpcf7 [type='birthday'], 
.wpcf7 textarea,
.wpcf7 input[type="url"], 
.wpcf7 input[type="email"], 
.wpcf7 input[type="tel"] {
    margin: 0 0 0.875em 0;
    padding: 0 15px;
    background: #fff;
    border: none;
    border-bottom: solid 1px #ccc;
    color: #474544;
    font: normal normal normal 14px / 36px var(--font-family-primary);
    text-transform: none;
    font-size: 1.000em;
    font-weight: 400;
    letter-spacing: 1px;
    width: 100%;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    -ms-border-radius: 7px;
    -o-border-radius: 7px;
    border-radius: 7px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
@media screen and (min-width:768px){
	.site-branding{
		padding: 15px 44px 6px;
	}
    #header .main-nav .sf-menu{
        padding: 0 48px;    
    }
    .entry-header{
        padding: 10px 62px;
    }
    .entry-content{
        padding: 34px 64px
    }
    .alignleft {
        float: left;
        margin: 0 30px 10px 0;
    }
    .sidebar .widget-area{
        padding: 30px 25px;
    }
    .site-footer {
        padding: 0 15px 50px;
    }
    .site-footer .widget-area {
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .site-footer .widget_block{
        padding: 0 54px; 
    }
} 
@media screen and (max-width:767px){
    html :where(img[class*=wp-image-]) {
        padding-right: 0!important;
        display: block;
    }
    html :where(.entry-content :not(.row) [class*=col-]) {
        padding: 0!important;
    }
    .site-logo{
        padding: 0 15px;
    }
    img,
    img.custom-logo{
        width: 100%;
        height: auto;
    }
    .text-near-logo.text-right{
        text-align: center;
    }
    .site-footer .widget-area{
        padding: 15px;
    }
    .site-footer .widget_block:last-child{
        margin-bottom: 35px;
        -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
        order: -1;
    }
    .main-nav{
        position: relative;
    }
    .menu-button-container{
        padding: 5px 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .menu-button-container #primary-mobile-menu .dropdown-icon{
        display: flex;
        align-items: center;
    }
    .menu-button-container #primary-mobile-menu {
        background-color: transparent;
        outline: none;
    }
    .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.close {
        display: flex;
    }
    .menu-button-container #primary-mobile-menu .dropdown-icon.close,
    .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.open {
        display: none;
    }
    .primary-menu-container {
        top: 52px;
        position: absolute;
        z-index: 9;
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
    }
    .admin-bar .primary-navigation > .primary-menu-container {
        height: calc(100vh - 32);
    }
    .primary-navigation-open .main-nav > .primary-menu-container {
        background-color: #fff;
        width: 100%;
        display: block!important;
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
    }
    #header .main-nav .sf-menu {
        padding: 0;
    }
    #header .main-nav .sf-menu li {
        margin: 0;
        display: block;
        border-bottom: solid 1px rgba(0,0,0,0.1);
    }
    #header .main-nav .sf-menu >li:first-child>a {
        padding-left: 15px;
    }
    #header .main-nav .sf-menu .sub-menu {
        padding: 0;
    }
    #header .main-nav .sf-menu li a,
    #header .main-nav .sf-menu .sub-menu > li > a{
        font: normal normal 14px / 18px "Open Sans", Helvetica, Arial, Verdana, sans-serif;
        padding-left: 15px;
        padding-right: 15px;
        color: #000000;
    }
    .pum-container.pum-responsive{
        max-width: 100%!important;
        min-width: 100%!important;
        width: 100%!important;
        left: 0!important;
    } 
}