@charset "UTF-8";
/*
Theme Name: Customfit Blocks
Text Domain: customfit-blocks
Version: 1.0.0
*/

/* localhost/blocktheme */
*,
*::before,
*::after {
    -webkit-box-sizing: border-box;
        box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent; /* Change the default tap highlight to be completely transparent in iOS */
  /*  or */
  /* -webkit-tap-highlight-color: rgba(0, 0, 0, 0); */
  -ms-overflow-style: scrollbar; /* Setting @viewport causes scrollbars to overlap content in IE11 and Edge, so we force a non-overlapping, non-auto-hiding scrollbar to counteract. */
}

html:focus-within {
  scroll-behavior: smooth;
}

html,body {
  text-size-adjust: none;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
  -moz-text-size-adjust: none;
}

@media screen and (prefers-reduced-motion: reduce) {
  scroll-behavior: auto;
}

/* max-width: 640px */ 
@media only screen and (max-width: 40em) {
	body {
          /*  font-size: var(--wp--preset--font-size--medium) !important; */
	}	
} /* end media query for max-width: 640px */

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
	display: block;
}

p, h1, h2, h3, h4, h5, h6 {
       /* overflow-wrap: break-word;*/
      /*  word-break: break-word;*/  
        white-space: pre-wrap;
        word-break: keep-all; /*this stops the word breaking*/
}

b,
strong {
	font-weight: var(--wp--custom--font-weight--semi-bold);
}

ol,
ul {
	padding: 0;
}

ol:where(:not([class*="wp-block"])),
ol:where(.wp-block-list),
ul:where(:not([class*="wp-block"])),
ul:where(.wp-block-list),
ul:where(.wp-block-categories-list) {
	padding-inline-start: var(--wp--preset--spacing--medium);
}

div[class*="wp-block-"] figcaption {
	color: var(--wp--preset--color--secondary);
	font-size: var(--wp--preset--font-size--x-small);
	margin-bottom: 0;
	margin-top: 20px;
	text-align: center;
}

/* Button */

.wp-block-button a.wp-block-button__link {
   -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s; 
}

/* Overriding global padding with class has-background */
:where(.wp-block-group.has-background) {
     padding: var(--wp--preset--spacing--medium) var(--wp--preset--spacing--medium);
}

.site-footer {
  /*  margin-top: -1px !important; /* if adding a svg above the footer */
}

/* Add negative margin to expand the SVG - get rid of little gap */
.expand {
    display: block !important;
    margin-left: -1px !important;
    margin-right: -1px !important;
    max-width: calc(100% + 2px) !important; 
}

/* Standardize form styling
--------------------------------------------- */

input,
button,
textarea,
select {
	font: inherit;
}

input[type="button"],
input[type="email"],
input[type="search"],
input[type="submit"],
input[type="text"],
textarea {
	-webkit-appearance: none;
}

input:not([type="submit"]),
select,
textarea,
.wp-block-post-comments-form input:not([type="submit"]):not([type="checkbox"]),
.wp-block-post-comments-form textarea {
	color: var(--wp--preset--color--main);
	border-radius: 5px;
	border: solid 1px var(--wp--preset--color--primary);
	padding: .5em 1em;
	font-size: var(--wp--preset--font-size--small);
	width: 100%;
}

input:focus, input:focus-visible, button:focus,  
textarea:focus, textarea:focus-visible,
select:focus, select:focus-visible {
	outline: none !important;
}

input[type="checkbox"],
input[type="image"],
input[type="radio"] {
	width: auto;
}

label {
	width: 100%;
	display: block;
}

::placeholder {
	color: var(--wp--preset--color--main);
	font-size: var(--wp--preset--font-size--small);
	opacity: 0.75;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
    max-width: 100%;
}

.iframe-container {
    position: relative;
    display: block;
    overflow: hidden;
    height: 0;
    padding-bottom: 105%; /* height of the video "527"" / width of the video "500" x 100 */
    max-width: 100% !important;	
}

.iframe-container iframe, 
.iframe-container object, 
.iframe-container embed {
    border: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; 
}

/* video portrait */
.iframe-container.iframe-container-long {
    position: relative;
    display: block;
    overflow: hidden;
    height: 0;
    padding-bottom: 183%; /* height of the video "1109" / width of the video "604" x 100 */
    max-width: 100% !important;	
}

/* Header */
/* hide site title - keep for SEO */
h1.wp-block-site-title  {
  /*  position:absolute;
    top:-9999px !important;
    left:-9999px !important;*/
    /* OR */
    color: transparent; 
    font: 0/0 a;
    margin: 0px !important; 
}

.header-outter {
    background-image: url('assets/images/Faint-Background-for-Top-Bar-2.jpg'); 
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    z-index: 9000;
}

.header-outter::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, .85);
}

.site-logo, .header-phone {
    position: relative;    
}

.logo-wrap {
    padding-top: var(--wp--preset--spacing--small) !important;
    padding-bottom: var(--wp--preset--spacing--small) !important;
}

@media screen and (max-width: 1059px) {
/* Fontawesome header phone icon */
.header-phone a {
    display: none;
}

.header-phone-wrap {
    display: none !important;
}
} /* end media query for max-width 1059px */

/* min-width: 1060px  */
@media only screen and (min-width: 1060px)  {
    .header-phone a {
        display: block;
    }
} /* end media query for min-width: 1060px */  

.header-phone a {
    text-decoration: none;
    font-size: var(--wp--preset--font-size--medium);
    line-height: var(--wp--custom--line-height--none);
}

.header-phone a[href*="tel:+"]::before {
    display: inline-block;
    vertical-align: top;
    font-size: var(--wp--preset--font-size--medium);
    line-height: var(--wp--custom--line-height--none);
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Brands","Font Awesome 5 Free";
    font-weight: 900;
    content: "\f095";
    margin-right: 10px;
}

/* footer */

/* max-width: 781px  */
@media only screen and (max-width: 781px )  {

    .footer-col-left, .footer-col-right, .footer-social {
        text-align: center;
        display: block !important;
    }
    
    .footer-social li {
        margin-right: var(--wp--preset--spacing--medium) !important; 
    }

} /* end media query max-width: 781px */

.site-content .wp-block-post-title  {
  /*  color: transparent; 
    font: 0/0 a;
    margin: 0px !important; */
}

/* Delete margin if no title */
.entry-content {
  /*  margin-top: 0; */
}

/* Make 4 columns into 2 - dividing gap between 2 columns */
/* Added class cfwd for the columns block */

/* min-width 782px and max-width 1000px */
@media only screen and (min-width: 782px) and (max-width: 1000px)  {
.wp-block-columns.cfwd-2-columns {
    -ms-flex-wrap: wrap !important;
        flex-wrap: wrap !important;
    gap: var(--wp--preset--spacing--medium);
}

.wp-block-columns.cfwd-2-columns .wp-block-column {
     -ms-flex: 0 0 calc(50% - var(--wp--preset--spacing--medium)/2) !important;
    flex: 0 0 calc(50% - var(--wp--preset--spacing--medium)/2) !important;
    max-width: 0 0 calc(50% - var(--wp--preset--spacing--medium)/2) !important;
}
    
} /* end media min-width 782px and max-width 1000px */



/* Make multiple columns into 3 columns - dividing gap between 3 columns */
/* We have 2 gaps divided between 3 columns

/* Add class .cfwd-3-columns for the main Columns block */

/* min-width 782px and max0width 1000px */
@media only screen and (min-width: 782px) and (max-width: 1000px)  {

.wp-block-columns.cfwd-3-columns {
    -ms-flex-wrap: wrap !important;
        flex-wrap: wrap !important;
    gap: var(--wp--preset--spacing--medium);
}

.wp-block-columns.cfwd-3-columns .wp-block-column {
     -ms-flex: 0 0 calc(33.33333% - var(--wp--preset--spacing--medium)*2 /3) !important;
    flex: 0 0 calc(33.33333% - var(--wp--preset--spacing--medium)*2 /3) !important;
    max-width: 0 0 calc(33.3333% - var(--wp--preset--spacing--medium)*2 /3) !important;
}

} /* end media min-width 782px and max0width 1000px */

/* Gallery - add .cfwd-2-columns class to the gallery */
@media only screen and (max-width: 599px){
  .wp-block-gallery.cfwd-2-columns .wp-block-image {
    width: 100% !important;
  }
} /* end media max-width 599px */

/* min-width 600px and max-width 1000px */

@media only screen and (min-width: 600px) and (max-width: 1000px)  {
    .wp-block-gallery.cfwd-2-columns  {
       gap: var(--wp--preset--spacing--small);
    } 
    
    .wp-block-gallery.cfwd-2-columns .wp-block-image {
     -ms-flex: 0 0 calc(50% - var(--wp--preset--spacing--small)/2) !important;
        flex: 0 0 calc(50% - var(--wp--preset--spacing--small)/2) !important;
        max-width: 0 0 calc(50% - var(--wp--preset--spacing--small)/2) !important;
}
} /* end media min-width 600px and max-width 1000px */


/* Home Page */

/* make the cover block clickable to a page */

.container-with-link {
    position: relative;
    height: 2px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

/* hover cover - opacity 0 */
.container-with-link:hover .wp-block-cover__background.has-background-dim  {
   opacity: 0;
   -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.container-with-link:hover a {
    background: rgba(39,61,23,0.3); /* green - */
    padding: var(--wp--preset--spacing--x-small);
}

.container-with-link a {
  /*  color: transparent;
    font-size: 0;
    line-height: 1;*/
}

.container-with-link a:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0;
}

/* Ken Burns effect on Hover - images are scaled to be bigger */
.ken-burns  {
     -webkit-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
}

.ken-burns  {
-webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
   cursor: pointer!important;
}
.ken-burns:hover  {
-webkit-transform: scale(1.08);
        -ms-transform: scale(1.08);
            transform: scale(1.08);
        -webkit-transition: -webkit-transform 0.4s linear 0s;
        transition: -webkit-transform 0.4s linear 0s;
        -o-transition: transform 0.4s linear 0s;
        transition: transform 0.4s linear 0s;
        transition: transform 0.4s linear 0s, -webkit-transform 0.4s linear 0s;
        cursor: pointer!important;
}

/* Ken Burns effect image Zoom out animation when th browser reaches this div 
  Additional js - assets/js/animate-scroll.js
*/

.ken-burns-out-wrapper {
    overflow: hidden;
}
.ken-burns-out.zoomed img {
    -webkit-animation: CustomZoomOut 4s ease-in-out;
        animation: CustomZoomOut 4s ease-in-out;
  /*  -webkit-animation-delay: 5s;
        animation-delay: 5s;*/
}

@-webkit-keyframes CustomZoomOut {
    0% {
        -webkit-transform: scale(1.5);
            transform: scale(1.5);
    }
    100% {
        -webkit-transform: scale(1);
            transform: scale(1);
    }   
}

@keyframes CustomZoomOut {

    0% {
        -webkit-transform: scale(1.5);
            transform: scale(1.5);
    }
    100% {
        -webkit-transform: scale(1);
            transform: scale(1);
    }
}

/*  MEDIA QUERIES */

/* max-width: 599px */ 
@media only screen and (max-width: 37.4375em) {
} /* end media query for max-width: 599px */

 /* min-width: 600px  */
@media only screen and (min-width: 37.5em)  {
} /* end media query for min-width: 600px */

/* max-width: 640px */ 
@media only screen and (max-width: 40em) {
} /* end media query for max-width: 640px */

 /* min-width: 641px  */
@media only screen and (min-width: 40.0625em)  {
} /* end media query for min-width: 641px */

/* min-width: 600px and max-width 781px   */
@media only screen and (min-width: 37.5em) and (max-width: 48.8125em)  {
} /* end media query for min-width: 600x and max-width 781px */

/* max-width: 781px  */
@media only screen and (max-width: 48.8125em )  {
} /* end media query for max-width: 781px */  

/* min-width: 782px  */
@media only screen and (min-width: 48.875em)  {
} /* end media query for min-width: 782px */ 

/* min-width: 782px and max-width 991px  */
@media only screen and (min-width: 48.875em) and (max-width: 61.9375em)  {
} /* end media query for min-width: 782px and max-width 991px */

/* max-width: 991px  */
@media only screen and (max-width: 61.9375em )  {
} /* end media query for max-width: 991px */  

/* min-width: 992px  */
@media only screen and (min-width: 62em)  {
} /* end media query for min-width: 992px */  
 
/* max-width: 1199px */
@media only screen and (max-width: 74.9375em) {
} /* end media query for max-width: 1199px */

 /* min-width: 1200px  */
@media only screen and (min-width: 75em)  {
} /* end media query for min-width: 1200px */

/* min-width: 1200px and max-width 1399px   */
@media only screen and (min-width: 75em) and (max-width: 87.4375em)  {
} /* end media query for min-width: 1201px and max-width 1399px */

 /* min-width: 1400px  */
@media only screen and (min-width: 87.5em)  {
} /* end media query for min-width: 1400px */

/*  min-width: 1920px  */
@media only screen and (min-width: 120em)  {
} /* end media query for min 1920px */

/* min-width: 2560px  */
@media only screen and (min-width: 160em)  {
} /* end media query for min 2560px */

/* retina display  */
@media only screen and (-webkit-min-device-pixel-ratio: 2), 
       only screen and (min-device-pixel-ratio: 2), 
       only screen and (min-resolution: 192dpi) {
  /* Style Rules */
} /* end media query for retina */


/* Popup Maker */
.popmake-content img {
    margin-left: auto;
    margin-right: auto;
}

/* Masonry layout */

.is-style-masonry.columns-default {
   -webkit-columns: 3; /* Chrome, Safari, Opera */
   -moz-columns: 3; /* Firefox */
   columns: 3; /* Standard syntax */
}

.is-style-masonry{
   display: block !important;
}

.is-style-masonry .wp-block-image{
   width: 100% !important;
   margin-bottom: var(--wp--style--unstable-gallery-gap) !important;
}

.is-style-masonry.columns-1 {
   -webkit-columns: 1; /* Chrome, Safari, Opera */
   -moz-columns: 1; /* Firefox */
   columns: 1; /* Standard syntax */
}

.is-style-masonry.columns-2 {
   -webkit-columns: 2; /* Chrome, Safari, Opera */
   -moz-columns: 2; /* Firefox */
   columns: 2; /* Standard syntax */
}

.is-style-masonry.columns-3 {
   -webkit-columns: 3; /* Chrome, Safari, Opera */
   -moz-columns: 3; /* Firefox */
    columns: 3; /* Standard syntax */
}

.is-style-masonry.columns-4 {
   -webkit-columns: 4; /* Chrome, Safari, Opera */
   -moz-columns: 4; /* Firefox */
   columns: 4; /* Standard syntax */
}

.is-style-masonry.columns-5 {
   -webkit-columns: 5; /* Chrome, Safari, Opera */
   -moz-columns: 5; /* Firefox */
   columns: 5; /* Standard syntax */
}

.is-style-masonry.columns-6 {
   -webkit-columns: 6; /* Chrome, Safari, Opera */
   -moz-columns: 6; /* Firefox */
   columns: 6; /* Standard syntax */
}

.is-style-masonry.columns-7 {
   -webkit-columns: 7; /* Chrome, Safari, Opera */
   -moz-columns: 7; /* Firefox */
   columns: 7; /* Standard syntax */
}

.is-style-masonry.columns-8 {
   -webkit-columns: 8; /* Chrome, Safari, Opera */
   -moz-columns: 8; /* Firefox */
   columns: 8; /* Standard syntax */
}


/* max-width: 600px  */
@media only screen and (max-width: 600px )  {
    .is-style-masonry.columns-1,.is-style-masonry.columns-2,
    .is-style-masonry.columns-3,.is-style-masonry.columns-4,
    .is-style-masonry.columns-5,.is-style-masonry.columns-6,
    .is-style-masonry.columns-7,.is-style-masonry.columns-8 {
        -webkit-columns: 1; /* Chrome, Safari, Opera */
        -moz-columns: 1; /* Firefox */
        columns: 1; /* Standard syntax */
    }  
} /* end media query for max-width: 600px */ 

/* max-width: 920px  */
@media only screen and (max-width: 920px )  {
    .is-style-masonry.columns-1,.is-style-masonry.columns-2,
    .is-style-masonry.columns-3,.is-style-masonry.columns-4,
    .is-style-masonry.columns-5,.is-style-masonry.columns-6,
    .is-style-masonry.columns-7,.is-style-masonry.columns-8 {
        -webkit-columns: 2; /* Chrome, Safari, Opera */
        -moz-columns: 2; /* Firefox */
        columns: 2; /* Standard syntax */
    }  
} /* end media query for max-width: 920px */ 
  
.is-style-masonry figure.wp-block-image {
    margin-top: 0 !important;
} 

figure.wp-block-image {
    margin-top: 0 !important;
} 
    
main.site-content {
    background: url(assets/images/faded-bg-1500-2.png);
} 

.home-left, .home-right  {
   opacity: 0;
}

.home-left.animate__animated, .home-right.animate__animated  {
   opacity: 1;
}

/* ninja forms */

.nf-form-content {
    margin-top: 12px;
    padding: 0 !important;
}

.nf-form-content textarea.ninja-forms-field {
   /* height: 260px; */
}

.nf-form-content button, 
.nf-form-content input[type=button], 
.nf-form-content input[type=submit] {
    float: right;
}
 
    