/*
Theme Name: PivotalTheme5
Theme URI: 
Author: Pivotal Web
Author URI: https://www.pivotalmarketing.co.uk
Description: The 2021 Pivotal theme for WordPress built on Bootstrap.
Version: 21.0
License URI: https://www.pivotalmarketing.co.uk

CSS and actions to maintain
***************************
1*  Standard Styling
2*  Topbar, Header, Sticky
3*  Page Titles
4*  Parallax
5*  Soliloquy / Slider
6*  Menu
7*  Sidebar
8*  Blog / Case Studies
9*  Testimonials
10* Contact form
11* Woocommerce
12* Footer
13* Copyright
14* 404 / Search
15* Breakpoints

Colours:
Ultra Colours = Red: #a41a17 - Yellow: #f2c40e
Other colours: Beige BG: #f9e7ae  -  Teal: #01a1a4  -  Grey: #565656  -  Footer Lt Beige: #fdf9eb

font-family: 'Roboto', sans-serif; 

*/

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;700&display=swap');
/* font-family: 'Roboto', sans-serif; */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');
/* font-family: 'Open Sans', sans-serif; */


/* *1 */

html { 
    font-size: 16px;
}

body {
    font-size: 16px;
    color: #565656;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
}

h1 {
    font-size: 3rem;
    font-weight: 700;
    padding-bottom: 20px;
    color: #565656;
}

h2 {
    font-size: 2.25rem;
    font-weight: 700;
    margin: 0;
}

h3 {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    margin-bottom: 25px;
}

h4 {
    font-size: 1.25rem;
    font-weight: 700;
}

h5 {
    font-size: 1rem;
}

h6 {
    font-size: 0.875rem;
}

p {
    font-size: 1rem;
    line-height: 1.75rem;
    margin-bottom: 20px;
}


ul,
ol {
    font-size: 1rem;
    line-height: 1.75rem;
    margin:0 0 20px 0;
    padding: 0;
}

ul li {
    list-style:none;
    font-size: 1rem;
    line-height: 1.75rem;
    padding:0 0 10px 35px;
    margin: 0 0 0 10px;
    background: url("/wp-content/uploads/2021/02/hex-teal-14.png") no-repeat top 7px left;
}

ul li ul li {
    list-style:none;
    font-size: 1rem;
    line-height: 1.75rem;
    padding:0 0 10px 35px;
    margin: 0px;
    background: url("/wp-content/uploads/2021/02/hex-red-14.png") no-repeat top 7px left;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: #1e9dd8;
    text-decoration: none;
}

a:hover {
    color: #1e9dd8;
    text-decoration: underline;
}

.fl {
    float: left;
}

.fr {
    float: right;
}

.fn {
    float: none;
}

.clear {
    clear: both;
}

.pull-right {
    text-align: right;
}

hr {
    background: #fff;
    border-top: 5px dashed #50d4d2;
    margin: 40px 35% 45px;
    border-radius: 5px;
    opacity: 1;
	height:10px!important;
}

.wp-block-separator {
    border-top: none;
    border-bottom: none;
}

.nopadding {
    padding: 0;
}

.nomargin {
    margin: 0;
}

span {
    color: #2181cb;
}

center {
    text-align: center;
}

.center {
    text-align: center;
}


.centered {
    position: absolute;
    top: 50%;
    left: 10%;
    transform: translate(-5%, -50%);
}

.centred {
    display: block;
    margin: 0 auto;
}

.alignnone {
    margin: 5px auto 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}


.container-fluid {
    padding: 0;
}

.container {
    max-width: 100% !important;
    width: 1270px;
}

section {
    padding: 60px 0;
}


.spacer40 {
    height: 40px;
}

blockquote{
  font-size: 1rem;
  margin:5px 0 20px 0px;
  padding:1.2rem 30px 1.2rem 75px;
  border-left:8px solid #a41a17;
  line-height:1.6rem;
  position: relative;
  background:#EDEDED;
}

/***** Standard button *****/

.button {display: block; }
.btn-default {
    
    border-radius: 3px;
    transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    border: 0px;
    padding:2px  20px;
    background: #f2c40e;
    color: #fff;
    text-align: center;
    font-size: 1rem;
    display: block;
    margin: 0;
}

.btn-default:hover {
    background: #01a1a4;
    color: #fff;
}

/* Linkedin button */

.libuttonconnect {
  
  flex-direction: column;
  justify-content: center;
  padding: 7px;
  text-align: center;
  outline: none;
  text-decoration: none !important;
  color: #ffffff !important;
  width: 280px;
  height: 32px;
  border-radius: 16px;
  background-color: #f2c40e;
  font-family: "SF Pro Text", Helvetica, sans-serif;
}

.libutton {

  flex-direction: column;
  justify-content: center;
  padding: 7px;
  text-align: center;
  outline: none;
  text-decoration: none !important;
  color: #ffffff !important;
  width: 240px;
  height: 32px;
  border-radius: 16px;
  background-color: #0A66C2;
  font-family: "SF Pro Text", Helvetica, sans-serif;
}


/****** Standard post image *****/

.wp-post-image {
    max-height: 400px;
    object-fit: cover;
    float: left;
    margin: 0px 30px 50px 0;
}

/* *2 */

/***** Topbar *****/

.topbar {
    background: #a41a17;
    padding: 8px 0;
    margin: 0;
    color: #fff;
    font-size: 1rem;
}

.topbar a {
    color: #fff;
    text-decoration: none;
}
.topbar a:hover {

    text-decoration: none;
}
.topbar a .fas, .cta a .fas { 
    margin-right: 10px;
    margin-left: 20px; }

.topbar .btn-default { float: right; margin: 0 10px;}

.header h1 {
    text-align: center;
}


.custom-logo {
    display: block;
    margin: 10px 0;
    height: 90px;
    width: auto;
    padding: 0px;
    transition: all .5s cubic-bezier(0, 0.5, 0.2, 1);
}

/***** Header *****/

/* header with transparent background - To give header/menu/logo a background remove postition:absolute; */

.header {
    /* 
    position: absolute; - if you want the menu over the slider/top image
    */
    padding: 0;
    background: transparent;
    z-index: 999;
    width: 100%;
    transition: 1s ease;
    
}

/***** Sticky Header *****/

/* The sticky class is added to the header with JS when it reaches its scroll position */
.sticky {
    position: fixed !important;
    top: 0;
    width: 100%;
    height: 60px;
    background: rgba(255, 255, 255, .95 );
    border-bottom: 3px solid rgba(164, 26, 23, .9); 
}

/* Add some top padding to the page content to prevent sudden quick movement (as the header gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
    padding-top: 102px;
}

.sticky .custom-logo {
    height: 40px;
    width: auto;
}

.sticky .header-right {
    padding-top: 10px;
    width: auto;
}

/* Top menu color change on sticky header */

.sticky #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link {
    color: #fff;
}

/* Background block colour change on sticky header */

.sticky #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu {}

/* Background block colour change on sticky header */

.sticky #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link {}

.sticky #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item li.mega-menu-item > a.mega-menu-link {}

/* *3 */

/***** Page title area *****/

.header-wrap {
    text-align: center;
    padding: 50px 50px 20px 50px;
    object-fit: cover;
}

.header-wrap h1.entry-title {
    font-size: 3em;
    line-height: 1.2em;
    text-shadow: 2px 2px 8px #212121;
    color: #fff;
    font-weight: 700;
    text-align: left;
    margin-left: 100px;
}

.header-right {
    float: right;
    align-self: center;
}

.header-right p {
    color: #231f20;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 14px;
    font-weight: 600;
    padding: 0 20px;
    text-align: right;
    margin: 0;
}


#mega-menu-wrap-primary,
.navbar-default {
    margin: 7px 0;
    font-size: 14px;
}

.page-title {
    color: #222;
    letter-spacing: 1px;
    font: 700 40px/40px"Questrial", sans-serif;
    text-align: center;
    width: 100%;
    padding: 20px;
}


/************************** Image Overlay with tint colour ****************************/
.image-overlay {
    background: green;
    overflow: hidden;
    position: relative;
    text-align: center;
    color: white;
}
.image-overlay p {margin: 0;}

.image-overlay img {
   object-fit: cover;
   opacity: 0.6;
}

.image-overlay .centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}




/************************** Smooth scroll instructions ****************************/
/* https://github.com/cferdinandi/smooth-scroll */
/* Functions.php to enqueue :  wp_enqueue_script ("smooth-scroll", get_stylesheet_directory_uri()."/js/dist/js/smooth-scroll.js");    */
/* Footer script to include:  <script> 	var scroll = new SmoothScroll('a[href*="#"]');  </script>
   - See full script including speed of scroll in the footer.php of this theme  */

/* Then add links to page: e.g.  <a data-scroll href="#bazinga">Anchor Link</a>   &   <div id="bazinga">Scroll End</div>  */
/* Upload the JS  to /js/dist/js/smooth-scroll.js */

/* *4 */

/***** Parallax Images *****/

.parallax h1 {
    font-size: 3em;
    line-height: 1.2em;
    text-shadow: 2px 2px 8px #212121;
    color: #fff;
    text-align: center;
    font-weight: 700;
    margin-top: 20px;
    padding-top: 40px;

    display: flex;
    justify-content: center;

}

.parallax-200-1 {
    /* The image used */
    background-color: antiquewhite;
    background-image: url("/wp-content/uploads/2018/06/test-solilowuy.jpg");
    /* Set a specific height */
    height: auto;
    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    max-width: 1920px;
}

.parallax-200-2 {
    /* The image used */
    background-color: antiquewhite;
    background-image: url("/wp-content/uploads/2018/06/parallax.jpg");
    /* Set a specific height */
    height: 800px;
    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    max-width: 1920px;
    padding: 5% 0;
}

.parallax-200-3 {
    /* The image used */
    background-color: antiquewhite;
    background-image: url("/wp-content/uploads/2018/06/parallax.jpg");
    /* Set a specific height */
    height: auto;
    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    max-width: 1920px;
    padding: 5% 0;
}




/***** Mega Menu Styling Taylia ******/

#mega-menu-wrap-max_mega_menu_2 #mega-menu-max_mega_menu_2 > li.mega-menu-megamenu > ul.mega-sub-menu {
    margin-top: 25px;
    text-align: center;
    padding: 20px;
}

#mega-menu-wrap-max_mega_menu_2 #mega-menu-max_mega_menu_2 > li.mega-menu-megamenu > ul.mega-sub-menu p {
    text-align: center;
    text-transform: capitalize;
    color: #a41a17;
    font-weight: 400;
    font-size: 1rem;
    margin-top: 15px;
    line-height: 1.3rem;
}

/***** Mega Menu Styling ******/

#mega-menu-wrap-primary,
.navbar-default {
    background: transparent;
    border: 0px;
    float: right;
    padding: 0;
}


/* Top Bar Styling - Hover */

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-toggle-on > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:focus,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-menu-ancestor > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-page-ancestor > a.mega-menu-link {
    background: transparent;
    color: #565656;
}

/* Top Bar Styling - Active Page */

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link {
    color: #e22014;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-menu-ancestor > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-page-ancestor > a.mega-menu-link {
    color: #565656;
    padding: 0 0 0 25px;
    margin-bottom: 15px;
    line-height: 20px;
    height: auto;
    text-transform: uppercase;
    font-weight: 400;
}



/* Dropdown Menu - Active */
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item a.mega-menu-link {
    color: #565656;
    padding: 10px 20px;
    margin: 0px;
    background:#fcf3d7;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item > a.mega-menu-link:hover {
    color: #565656;
    background:#56dad8;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu {
    width: 250px;
    margin-left: 15px;
}


/* Dropdown Level 2 Menu - Active */
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item ul.mega-sub-menu {
    width: 200px;
    margin-left: 0px;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item ul.mega-sub-menu li.mega-menu-item a.mega-menu-link {
    color: #565656;
    padding: 10px 20px;
    margin: 0px;
    background: purple;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item ul.mega-sub-menu li.mega-menu-item a.mega-menu-link:hover {
    color: #565656;
    padding: 10px 20px;
    margin: 0px;
    background: red;
}

/* Sub menu full width design */

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu {
    padding: 50px;
    margin-top: 8px;
    background: #efefef;
    transition: 1s ease;

}

/* Hover over main menu  */

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:hover {
    color: #01a1a4;
}


/************ Home page *************/

.home h1 {
    text-align: center;
}
.home h2 {
    color:#a41a17;
    text-align: center;
    margin-bottom: 20px;
}

.home-acca { 
    height: 650px;
    background-image: url(/wp-content/uploads/2021/02/bg-acca.png); 
    background-color: white;
    background-position:bottom left;
    background-repeat: no-repeat;
    background-size:1585px 500px;
    margin-bottom: 40px;
}

.home-video { background: #202128; padding-bottom: 2px; }

.home-video p {    line-height:0;   margin-bottom: 0px;  }

.home-fresh { 
/*    height: 1100px;*/
    background-image: url(/wp-content/uploads/2021/02/bg-fresh.png); 
    background-color: #f9e7ae;
    background-position:bottom left;
    background-repeat: no-repeat;
    background-size:1920px 1247px;
}

.home-fresh p { text-align: center; }

.fresh { margin:15px; padding: 50px 20px 0 20px; background-color: #fff; border-radius: 2rem; box-shadow: 15px 15px rgba(0, 0, 0, 0.1); }

.freshbox { height:360px;}
.freshbox-ser { height:450px;}

.fresh-nojar {  }

.fresh-nonon { text-align: center; }

.fresh-nounex { text-align: center; }

.fresh-relaible { text-align: center; }

.fresh .btn-fresh { width: 87px; height: 44px; display: block; background-image: url(/wp-content/uploads/2021/02/bg-btn-fresh.png);
    position: relative; bottom: 0; margin: 0 auto;
}

/***** Service Page *****/

.service { border: 1px solid #eaeaea; box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1); text-align: center;  }

.service p {margin-bottom: 0; text-align: center;}

.arrow_box {
	position: relative;
	background: #fcf3d7;
	border-left: 3px solid #fcf3d7;
	border-bottom: 3px solid #fcf3d7;
	border-top: 3px solid #fcf3d7;
    padding:40px 20px;
    
    margin-top: 0px
}

.arrow_box h2 {
    margin:0;
    font-size:36px;
    line-height:48px;
    font-weight:400;
    text-transform: uppercase;
}

.arrow_box:after, .arrow_box:before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.arrow_box:after {
	border-color: rgba(255, 255, 255, 0);
	border-left-color: #fcf3d7;
	border-width: 68px;
	margin-top: -68px;
}
.arrow_box:before {
	border-color: rgba(194, 225, 245, 0);
	border-left-color: #fcf3d7;
	border-width: 92px;
	margin-top: -92px;
}

.intro p {margin: 0;}


.cloud { min-height: 280px;}

/***** Soliloquy / Slider *****/

.soliloquy-outer-container {
    margin-top: 0;
    background-image: url("/wp-content/uploads/2021/02/bg-slider.jpg");
    background-size: cover;
}

.soliloquy-outer-container h1, .soliloquy-outer-container h2 { text-align: left;}

.soliloquy-container .soliloquy-caption .soliloquy-caption-inside {
    background: rgba(0, 0, 0, 0);
    transition: 1s ease;
}

.soliloquy-container .soliloquy-caption.soliloquy-caption-left {
    width: 70%;
    top: 40%;
    left: 15%;
    height: auto!important;
}

.soliloquy-container .soliloquy-caption .soliloquy-caption-inside {
    text-align: left;
    height: auto!important;
    padding: 0;
}



/* New Animated Caption Formattting */

.soliloquy-caption-inside .captiontext {
    max-width: 80%;
    color: transparent;
    position: relative;
    -webkit-animation-name: example;
    /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 3s;
    /* Safari 4.0 - 8.0 */
    -webkit-animation-fill-mode: forwards;
    /* Safari 4.0 - 8.0 */
    animation-name: example;
    animation-duration: 3s;
    animation-fill-mode: forwards;
}

.soliloquy-caption-inside h1, .soliloquy-caption-inside h2 {
    font-size:4rem;
    line-height:4rem;
    text-align: left;
    color: transparent;
    animation-name: example;
    animation-duration: 3s;
    animation-fill-mode: forwards;
}


.soliloquy-caption-inside h3 {
    color: #444;
    font-size: 3.5rem;
    line-height: 1.2;
    text-align: left;
    font-style: normal;
    font-weight: 600;
    white-space: nowrap;
    letter-spacing: 2px;
    overflow: hidden;
    width: 100%;
    animation-name: type;
    animation: type 4s steps(60, end);
}


/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
    from {
        left: 50px;
        top: 0px;
    }

    to {
        left: 50px;
        top: 250px;
        color: #a41a17;
    }
}

@keyframes example {
    from {
        left: 50px;
        bottom: 0px;
    }

    to {
        left: 50px;
        bottom: 100px;
        color: #a41a17;
    }
}

@-webkit-keyframes exampleh3 {
    from {
        left: 50px;
        top: 0px;
    }

    to {
        left: 50px;
        top: 250px;
        color: #202222;
    }
}

@keyframes exampleh3 {
    from {
        left: 50px;
        bottom: 0px;
    }

    to {
        left: 50px;
        bottom: 100px;
        color: #202222;
    }
}

@keyframes type {
    0% {
        width: 0;
    }

    50% {
        width: 0;
    }

    100% {
        width: 100;
    }
}



.soliloquy-caption-inside .downarrow {
    color: black;
    font-size: 18px;
    text-align: center;
    color: transparent;
    position: relative;
    -webkit-animation-name: downarrow;
    /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 3s;
    /* Safari 4.0 - 8.0 */
    -webkit-animation-fill-mode: forwards;
    /* Safari 4.0 - 8.0 */
    animation-name: downarrow;
    animation-duration: 3s;
    animation-fill-mode: forwards;
}

.soliloquy-caption-inside .downarrow i {
    color: black;
    font-size: 48px;
}

@keyframes downarrow {
    from {
        bottom: 100px;
    }

    to {
        bottom: 0px;
        color: black;
    }
}


/* End New Animated Caption Formattting */


/* 7* */

/***** sidebar *****/

.blog-sidebar {
    text-align: right;
    background: #efefef;
    padding: 15px 10px;
    margin-bottom: 45px;
}

.blog-sidebar .textwidget {
    margin-bottom: 40px;
}

.blog-sidebar p {
    text-align: center;
}

.blog-sidebar h4 {
    text-align: center;
}


.widget_recent_entries {
    
    
}


/* 8* */

/***** Main Blog  *****/

.blog-info {
    position: absolute;
    left: 50%;
    bottom:0;
    transform: translate(-50%, -50%);
    width: 100%;
    min-height: 70px;
    padding: 10px 10px;
    text-align: center;
    background: #a41a17;
    color: #fff;
    transition: 1s ease;
}

.blog-info p.blog-post-meta {
    color: #efefef;
    margin: 0;
}

.blog-container {
    position: relative;
    border: 3px solid transparent;
    min-height: 380px;
    margin-bottom: 20px;
}

.blog-image {
    opacity: 1;
    display: block;
    width: 100%;
    height: auto;
    transition: 0.5s ease;
    backface-visibility: hidden;
}

.blog-image img {
    display: block;
    margin: 0 auto;
    max-height: 250px;
    height: 250px;
    width: auto;
}

.blog-middle {
    transition: .5s ease;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
}

.blog-container:hover .blog-image {
    filter: grayscale(1);
}

.blog-container:hover .blog-middle {
    opacity: 1;
}

.blog-container:hover .blog-info {
    opacity: 0;
}

.blog-text {
    background-color: #1e9dd8;
    color: #fff;
    font-size: 16px;
    padding: 10px 15px;
}

.blog-middle a,
.blog-middle a:hover {
    text-decoration: none;
}


/***** Single Blog *****/

.featured-image {
    width: 300px;
    float: left;
    margin: 5px 20px 0 0;
}

/***** Case studies *****/

.case-study-excerpt {}

/* 9* */

/***** Testimonials *****/

.testi-author {
    background: #ebebeb;
    padding: 20px;
    margin: 5px 0 10px 10px;
    text-align: center;
}

.testi-author img {
    width: 150px;
    border-radius: 50%;
}


/* 10* */
/***** Contact Form CF7 WPCF7  *****/

#wpcf7-f5-o1 {
    padding: 50px;
}

.form-control {
    background: rgba(255, 255, 255, 0.6);
}

textarea {
    height: 100px;
}

input.btn-default {
    max-width: 300px;
    padding: 15px;
    background: transparent;
    border: 2px solid white;
    border-radius: 5px;
}

input.btn-default:hover {
    background: #fff;
    border: 2px solid white;
    cursor: pointer;
}

/* 11* */
/***** woocommerce *****/

.woocommerce div.product .woocommerce-tabs .panel {
    border-left: 1px solid #d3ced2;
    border-right: 1px solid #d3ced2;
    border-bottom: 1px solid #d3ced2;
    padding: 20px;
    margin-top: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
    border-radius: 5px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
    margin: 0;
}

.woocommerce .header-wrap {
    text-align: left;
    padding: 10px 0px;
    object-fit: cover;
}

.woocommerce .header-wrap a {
    color: #fff;
}

.woocommerce ul.products li.product {
    padding: 10px;
    transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s;
}

li.product-category:hover {
    background: #efefef;
}


/* 12* */
    
/***** CTA Call to Action *****/

.cta {
    background-color:#565656;
    font-size: 1.25rem;
    color: #fff;
    padding: 30px 0;
}
.cta small { font-size: 0.75rem; font-weight: 100; color: #fff; }

.cta a {
    color: #fff;
    text-decoration: none;
}  
.cta .fas {color:#f2c40e;}
    
/***** Footer *****/

.footer-awards { margin: 40px 0;}

footer {
    background: #fdf9eb;
    padding: 25px 0;
    font-size: 0.75rem;
}

footer h4 {
    font-size: 1.25rem;
    padding-bottom: 20px;
    margin: 0;
    color: #a41a17;
    font-weight: 700;
    text-transform: uppercase;
}

footer p
    {
    font-size: 0.8rem;
    line-height: 1.25rem;
    text-decoration: none;
}

footer a {
    font-size: 0.8rem;
    line-height: 1.25rem;
    color: #565656;
    text-decoration: underline;
}
footer a:hover {
color:#a41a17;
}


footer ul {
    margin: 0 0 10px 0;
    padding: 0;
}

footer ul li {
    list-style: none;
    font-size: 1rem;
    line-height: 1.75rem;
    padding: 0 0 4px 25px;
    margin: 0px;
    background: url(/wp-content/uploads/2021/02/hex-red-12.png) no-repeat top 9px left;
}

/* 13* */
/***** Copyright *****/


.copyright {
    background-color:#a41a17;
    font-size: 0.75rem;
    color: #fff;
    padding: 15px 0;
}

.copyright a {
    color: #fff;
}

.copyright p {
    line-height: 15px;
    font-size: 11px;
    margin-bottom: 0;
    color: #fff;
}

.copyright a:hover {
    color: #4CB3EA;
}

.copyright p.copyright-right {
    text-align: right;
}

.copyright p.copyright-left {
    text-align: left;
}


/* 14* */
/***** 404 / Search *****/

.page404 { margin-top:50px; text-align: center; padding: 100px 30px; }

.page404 h2 {font-size: 3rem; color: #565656; }

.page404 p {font-size: 1.5rem; color: #565656; }

.page404 form#searchform.searchform {     max-width: 300px;     margin: 0 auto; }

.page404 input { margin-bottom: 20px;
    float:right;
    width: 300px;
}
.page404 [type=submit] {
    max-width: 120px;
    padding:3px 15px;
    background: #a41a17;
    color: #fff;
    border: none;
    border-radius: 0px;
}

/* 15* */
/***** Resolution Break Point / Media Screens *****/

/***** 
Bootstrap Grid 

Size              Extra Small    Small         Medium        Large       Extra Large
                  <576px         >=576PX       >=768px       >=992px     >=1200px
Class Prefix      .col-          .col-sm-      .col-md-      .col-lg-    .col-xl-

*****/

/***** Large devices (desktops, up to 1200px)   .col-lg-   *****/
@media (max-width:1199px)  {
    
    /*** header / menu ***/
    .logo {padding-left: 20px;}
    
  .soliloquy-container .soliloquy-caption.soliloquy-caption-left {
    width: 50%;
    top: 40%;
    left: 5%;
    height: auto!important;
}  
.soliloquy-caption-inside h1, .soliloquy-caption-inside h2 {
    font-size:3rem;
    line-height:1.2;
}

.soliloquy-caption-inside h3 {
    font-size: 2.5rem;
    line-height: 1.2;
}      
    /*** body ***/
            .home-acca {

    background-size: 100%;
    }
    .accatext { padding-left: 50px;}
    
    /*** footer ***/    
}

/***** Medium devices (tablets, up to 992px)   .col-md-   *****/
@media (max-width:991px)  {
    
    /*** header / menu ***/
    
    
.soliloquy-caption-inside h1, .soliloquy-caption-inside h2 {
    font-size:2.25rem;
    line-height:1.2;
}

.soliloquy-caption-inside h3 {
    font-size: 2rem;
    line-height: 1.2;
} 
    
  
    
    /*** body ***/
    
    /*** footer ***/    
}

/***** Small devices (landscape phone, up to 768px)   .col-sm-   *****/
@media (max-width: 767px) {

    /*** header / menu ***/

    /*** body ***/
        .home-acca {
    height: 710px;
    background-size: 100%;
    }
            
        .accatext { padding-left: 10px;}

    /*** footer ***/
    .copyright p { line-height: 20px; text-align: center;}
}


/***** Small devices (phones, up to 576px)   .col-   *****/
@media (max-width: 575px) { 

    .logo {padding: 0;}
    
    section {padding: 30px 0;}
    
    .home h2 {font-size: 1.75rem;}
    
.featured-image {
    width: 100%;
    float: none;
    margin:10px;
}    
    .topbar .container {padding:0;}
    .topbar a { font-size: .85rem;}
    /*** header / menu ***/
    

    
.soliloquy-caption-inside .captiontext {
    max-width: 100%;
    }

.soliloquy-container .soliloquy-caption.soliloquy-caption-left {
    width: 100%;
    top: 72%;
    left: -5%;
    height: auto!important;
}

.soliloquy-caption-inside h1, .soliloquy-caption-inside h2 {
    font-size:1.25rem;
    line-height:1.2;
    }
    
.soliloquy-caption-inside h3 {
    font-size: 1.25rem;
    line-height: 1.2;
    letter-spacing: 0px;
    text-shadow: 1px 1px #f9e7ae;
} 
    
    
    .header-wrap h1.entry-title {
    margin-left: 0px;
}
    
    .button {display: block; margin-top: 10px; }
    
    .topbar .btn-default { float: right; margin: 0 5px;}
    
.btn-default {
    padding:2px 5px;
    margin: 0;
    font-size: 1rem;
}
   
    .custom-logo {
    margin: 10px auto;
    }
    
    /*** body ***/
    
    .home-acca {
    height: 710px;
    background-size: 100%;
    margin-bottom: 20px;
}

.freshbox {
    height: 260px;
}
    
    .testi-author, blockquote { margin: 5px 0;}
    
    /*** footer ***/
    footer h4, footer p, .copyright p.copyright-left, .copyright p.copyright-right { text-align: center; }

    
    .cta span { display: block; text-align: center; float: none!important; margin: 5px 0;}
    
    .cta a {text-align: center;}
}
