/*
 Theme Name:   White Space Brands Child
 Theme URI:    https://whitespacebrands.com/
 Description: We are a branding and packaging company. At every level, we use strategic design  to help our clients’ brands, products and services succeed. Our designers ideate  and create with purpose to generate winning ideas and bring them to life.
 Author:       White Elephant Agency
 Author URI:   http://www.whiteelephant.agency/
 Template:     whitespacebrands
 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:  whitespacebrands
*/



#wpcf7-f81-p14-o1 h3 {
    font-family: 'Lato';
    font-size: 23px;
}

#wpcf7-f81-p14-o1 label {
    display: block;
    color: #231f20;
    font-size: 17px;
    font-family: 'Lato';
    margin-bottom: 6px;
}


span.wpcf7-form-control.wpcf7-checkbox {
    display: flex;
    flex-wrap: wrap;
}


span.wpcf7-form-control-wrap.checkbox-693 .wpcf7-list-item {
    margin: 0 18px 0 0;
    font-weight: bold;
    line-height: 35px;
    flex-basis: 30%;
    white-space: nowrap;
}

.box_form {
    max-width: 380px;
    width: 100%;
}

#wpcf7-f81-p14-o1 .form_checkbox label {
    font-size: 18px;
    display: inline-block;
}

#wpcf7-f81-p14-o1 p {
    margin:0 0 15px;
}

.form_checkbox {
    margin-bottom: 25px;
}

.box_form input.wpcf7-form-control:not(input.wpcf7-form-control.wpcf7-submit){
    width: 100%;
    border: 2px solid;
}

input.wpcf7-form-control.wpcf7-submit {
    background: #221e1f;
    color: #fff;
    max-width: 170px;
    border-radius: 40px;
    padding: 12px;
    height: 45px;
    cursor: pointer;
    width: 100%;
}

textarea{
   	border: 2px solid;
     height: 90px;
     resize: vertical;
}


.post, .page {
    margin: 0;
}

.wpcf7-checkbox label input {
	position: absolute;
	margin-left: 0px !important;
	left: 0px;
	width: auto;
	opacity: 0;
}

.wpcf7-checkbox label span.wpcf7-list-item-label:before {
	content: "" !important;
	border: 1px solid #000 !important;
	background: #fff;
	border-radius: 0px !important;
	cursor: pointer !Important;
	display: inline-block !important;
	float: left !Important;
	height: 28px !important;
	position: relative !Important;
	top: 0 !important;
	margin-right: 10px !important;
	width: 30px !important;
}

.wpcf7-checkbox input:checked+span.wpcf7-list-item-label:before {
	background-color: #000 !important;
	background-image: url(/wp-content/uploads/2021/09/draw-check-mark.png) !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
	background-size: 80% !important;
}


 



.logo_sec .row {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
}

@media screen and (min-width: 768px){
.logo_sec .column {
    flex-basis: 32%;
    margin-bottom: 20px;
    background: #fff;
    padding: 25px;
}
}


/*=============== Modal Popup ========================================= */

.modal .column{
    float: left;
    width: 25%;
}



/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 100;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(255 255 255 / 70%);
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1200px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);

}

/* The Close Button */
.close {
    color: #000;
    position: absolute;
    top: 6px;
    right: 18px;
    font-size: 40px;
    font-weight: normal;
    z-index: 5;
}
.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.mySlides {
  display: none;
}

.cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}


/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}



.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;
}

.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/*.slider-nav .slick-current {
    border: 2px solid red;
}*/

.slick-dotted.slick-slider {
    margin-bottom: 0;
}

.slick-slide .lightbox_thumb_image {
    padding: 6px;
}

.slider-for .lightbox_main_image img {
    width: 86% !important;
    margin: auto;
    padding: 40px 0 5px;
}


.slick-next:before, .slick-prev:before {
    content: none;
}

.modal-content .slick-prev {
    left: 25px;
}
.modal-content .slick-next { right: 25px; }





/*================= Password Protected page ============================*/

.ppw-post-password-container {
     max-width: 654px;
    margin: 60px auto;
    font-size: 22px;
    text-align: center;
    font-family: 'Lato';
    height: 62vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    padding: 0 22px;
    border-radius: 8px;
     box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
    background-image: url(/wp-content/uploads/2021/09/Banner.png);
    background-position: 101% 122%;
    background-size: 427px;
    background-repeat: no-repeat;
    border: 10px solid #ddd;
}

.ppw-ppf-desc {
    font-size: 28px;
    font-style: italic;
    line-height: normal;
}
.ppw-post-password-container label.ppw-pwd-label input {
    /* background: #221e1f; */
    color: #000;
    /* max-width: 170px; */
    border-radius: 40px;
    padding: 12px;
    height: 45px;
    cursor: pointer;outline: 0px;
    margin-left: 16px;
}

.ppw-post-password-container input[type="submit"] {
    background: #221e1f;
    color: #fff;
    max-width: 100px;
    border-radius: 40px;
    padding: 12px;
    height: 45px;
    cursor: pointer;
    width: 100%;
}


.slick-next:before, .slick-prev:before{display: none;}


/*==================== Responsive media query ====================================*/


@media only screen and (max-width: 767px){

.elementor .footer_menu li a {
    display: block;
    text-align: center;
}

.logo_sec  .column {
       flex-basis: 48%;
    margin-bottom: 15px;
    }

footer .elementor-widget-image img {
    width: auto !important;
}

.close {
    right: 5px;
    top: 0;
    font-size: 28px;
}

.modal-content .slick-prev {
    left: 6px;
}

.modal-content .slick-next {
    right: 6px;
}

}

@media only screen and (max-width: 479px){

    .logo_sec  .column {
        flex-basis: 100%;
        margin-bottom: 10px;
    }

    footer .elementor-widget-image img {
    width: 92% !important;
}

span.wpcf7-form-control-wrap.checkbox-693 .wpcf7-list-item {
    margin: 0;
    flex-basis: 46%;
}

#wpcf7-f81-p14-o1 .form_checkbox label {
    font-size: 14px;
    }

    #wpcf7-f81-p14-o1 label {
        font-size: 15px;
    }

    .ppw-ppf-desc {
        font-size: 16px;
    }

    .ppw-post-password-container label.ppw-pwd-label input {
        width: 100%;
        margin: 8px 0;
    }

    .ppw-post-password-container {
        font-size: 16px;
    }

    .ppw-post-password-container input[type="submit"] {
        width: 100%;
        max-width: unset;
    }
    .ppw-ppf-desc {
        font-size: 24px;
    }

    .slick-next, .slick-prev{
        z-index: 55;
    }

    .close {
        font-size: 25px;
        top: 0;
        right: 5px;
    }
    .slick-next img, .slick-prev img {
        width: 12px !important;
    }

    .modal-content .slick-next{
        right: -3px;
    }
    .modal-content .slick-prev {
        left: 3px;
    }

}