/*
 Theme name: XX / Fluffytech WHITE LABEL
 Version: 1.0
 Description:  Because we don't know either...
 Author: Gordon Langley vs Sean Alexander
 Author URI: http://www.fluffytech.co.uk
 Template: twentytwelve
*/




/*///////////////Get the fonts - from Google///////////////*/

@import url('https://fonts.googleapis.com/css2?family=Overpass+Mono:wght@300;400;600&display=swap');

body.custom-font-enabled {font-family: 'Overpass Mono', monospace !important; font-weight: 400; word-spacing: -0.2em; letter-spacing: 0.02em; color: #333 !important}

/*///////////////Get the fonts - from Google - ENDS///////////////*/




/*///////////////Switch OFF///////////////*/


/*Don't show the WP Bakery Page Editor Link*/

a#vc_load-inline-editor {display:none;}

/*no rounded corners or box shadows on images*/

img {border-radius: 0 !important;}

.entry-content img, .comment-content img, .widget img, img.header-image, .author-avatar img, img.wp-post-image {
    border-radius: 0px;
    box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
}

/*Turn off Ipad font scaling*/

body, div, p, a, li, td { -webkit-text-size-adjust:100% !important;}

/*Color No opacity on Browser input text field placeholder color*/


::-webkit-input-placeholder {
    color: #333 !important;
    opacity: 1 !important; /* for chrome */
}

:-moz-placeholder { /* Firefox 18- */
    color: #333 !important;
    opacity: 1 !important;
}

::-moz-placeholder {  /* Firefox 19+ */
    color: #333 !important;
    opacity: 1 !important;
}

:-ms-input-placeholder {  
   color: #333 !important;
    opacity: 1 !important;
}

/*No outline on input*/

input { outline:none !important; }

/*Mobile Tap color*/

* {
    -webkit-tap-highlight-color: rgba(255,255,255,0.2) !important;
}

/*Border off and Kill all hyphens in articles*/

.site-content article {
    border-bottom: 0px double #ededed;
    word-wrap: break-word;
    -moz-hyphens: none;
    -webkit-hyphens: none;
    hyphens: none;
}

/*.site background color and box shadow OFF*/

.site {background: #fff; box-shadow: 0 0px 0px rgba(100, 100, 100, 0) !important;}


/*///////////////Switch OFF ENDS///////////////*/



/*//////////WIDTHS///////////*/

/*Full site content width, margin top & padding*/

.site {width:100%;max-width:100% !important; margin: 0 auto 0 auto !important;}

@media screen and (max-width: 736px) {
    .site {margin: 0 auto 0 auto !important;}
}

body .site {padding: 0 0; overflow-x:hidden !important;}

/*Full site content width, margin top & padding ENDS*/


/*site-content margin padding & width*/

.site-content {margin: 0 auto 0 auto !important; padding: 0 30px 0 30px !important; max-width: calc(100% - 0px); box-sizing:border-box; }

@media screen and (max-width: 810px) {
    .site-content {padding: 0 20px 0 20px !important;}
}

/*site-content ENDS*/

/*//////////WIDTHS///////////*/



/*//////////vc customisations///////////*/

.vc_row {/*! margin-left: 0 !important; */ /*! margin-right: 0 !important; */}

@media screen and (max-width:1280px) {
    .vc_row {padding-left: 20px; padding-right: 20px;}
    #hh-intro-row {padding-left: 0 !important; padding-right: 0 !important;}
    .vc_column_container > .vc_column-inner {padding-left: 0 !important}
}

@media screen and (max-width:1024px) {
    .vc_row {padding-left: 8%; padding-right: 8%;}
}

@media screen and (max-width:809px) {
    .vc_row {padding-left: 5%; padding-right: 5%;}
}

@media screen and (max-width:414px) {
    .vc_row {padding-left: 6.5%; padding-right: 6.5%;}
}

/*Don't show the WP Bakery Page Editor Link*/

a#vc_load-inline-editor {/*display:none*/;}

/*Don't show the WP Bakery Page Editor Link ENDS*/


/*page edit link*/

a.post-edit-link {}

/*page edit link ENDS*/


/*article margin and padding*/

.site-content article {margin-bottom: 0; padding-bottom: 0;}

/*article margin and padding*/


/*//////////vc customisations ENDS///////////*/





/*/////////////////Stop Safari changing the colour without disabling the call function/////////////////*/


a[href^=tel] {
   text-decoration:inherit;
   color: inherit;
}

/*/////////////////Stop Safari changing the colour without disabling the call function ENDS/////////////////*/


/*///////////////Switches ENDS ///////////////*/






/*///////////////html, body and Font Basics///////////////*/


/*html font scale*/

html {
	font-size: 100%; background:#fff;
}

html.vc_desktop {margin-top: 0 !important;}

/*html font scale ENDS*/




/*--body scrollbar & background--*/

body {background: #fff; color: #333 !important;}

/*--body scrollbar & background ENDS--*/


/*body font, base size and color*/

body {color: #fff; font-size: 13px !important;}

@media screen and (max-width: 1280px) {
    body {font-size: 14px !important}
}

@media screen and (max-width: 500px) {
    body {font-size: 15px !important}
}

/*body font, base size and color ENDS*/



/*h tags */

h1 {word-spacing: -0.25em; letter-spacing: -0.02em; margin-top: 0px !important; font-weight: 300 !important; font-size: 125% !important;  line-height: 1.2 !important;}
h2 {word-spacing: -0.25em; letter-spacing: -0.01em; margin-top: -5px !important; font-weight: 300 !important; line-height: 1.8 !important; font-size: 110% !important;}
h3 {word-spacing: -0.25em; letter-spacing: 0.025em; margin-top: 0px !important;  font-weight: 300 !important; font-size: 100% !important; line-height: 1.1 !important; margin-bottom: 20px !important;}

@media screen and (max-width: 500px) {
    h1 {font-size: 125% !important}
    h2 {font-size: 110% !important;}
}

/*h tags ENDS*/


/*///////////////html, body and Font Basics ENDS///////////////*/


/*//////////////links & buttons///////////////*/

a, a:visited, a:active {color: #333 !important; text-decoration:none; outline:0 !important;}
a:hover {color: #333 !improtant;}


/*//////////////links & buttons///////////////*/




/*///////////////hide wpadmin bar on homepage///////////////*/

body.home #wpadminbar {/*display:none*/}

/*///////////////hide wpadmin bar on homepage ENDS///////////////*/





/*///////////////Header & Site title///////////////*/



.site-header {padding: 30px 30px !important; background: none; /*! /*display:none*/; */}

@media screen and (max-width: 810px) {
    .site-header {padding: 20px 20px !important;}
}

.entry-header {/*display:none*/;}

.site-header img {/*display:none*/;}


/*don't show site title on Homepage*/

body.home .site-title {/*display:none*/;}


.site-title {/*display:none*/}

.site-description {/*display:none*/;}


/*don't show site title on Homepage ENDS*/



/*///////////////Header & Site title ENDS///////////////*/





/*///////////////Hide site nav for now///////////////*/

.main-navigation {/*display:none*/;}
/*///////////////Hide site nav for now ENDs///////////////*/




/*///////////////Hide entry meta/////////////////*/

footer.entry-meta {display:none;}

/*//////////////Hide entry meta ENDS//////////////*/





/*/////////////////Footer///////////////////*/

footer[role="contentinfo"] {margin-left: 0; margin-right: 0; min-width: 100%; max-width: 100%;border-top: 0;}

#colophon {background:#fff; color: #333; padding: 20px 30px 60px 30px !important; font-size: 80%}

@media screen and (max-width: 810px) {
    #colophon {padding: 20px 20px 60px 20px !important;}
}

.footer-left {float: left; word-spacing: 0;}
.footer-right {float:right; padding-right: 40px}

.al-credit a, .al-credit a:hover, .al-credit a:visited, .al-credit a:active {color: #333 !important;}
.al-credit a:after {content:"";display:inline-block; width: 9px; height: 9px; border: 3px solid;box-sizing: border-box; transform:rotate(45deg); margin-left: 6px;}

footer[role="contentinfo"] {margin-top: 0;}

/*/////////////////Footer ENDS///////////////////*/





/*/////////////////Mobile Menu///////////////////*/



/*mobile menu*/
#mobileMenu {
    position: fixed;
    left: 0;
    height: 100%;
    transform: translateY(-100%);
    width: 100%;
    transition: opacity 0.3s ease-in-out;
    background: #fff;
    z-index: 99;
    opacity: 0;
}



input[type="checkbox"]:checked ~ #mobileMenu {
    transform: translateY(0);
    opacity: 1;
}

input[type=checkbox].makeover {
    transition: all 0.2s;
    box-sizing: border-box;
    display: none;
}
.mobileIconToggle {
    transition: all 0.2s;
    box-sizing: border-box;
    cursor: pointer;
    position: absolute;
    z-index: 999;
    height: 100%;
    width: 100%;

    top: 32px;
    right: 15px;
    height: 32px;
    width: 24px;
}

.spinner {
    transition: all 0.2s;
    box-sizing: border-box;
    position: absolute;
    height: 2px;
    width: 100%;
    background-color: rgba(255,255,255,0);
}
/*homepage change background-color*/

body.homepage .spinner {background-color: #fff;}


.horizontal {
    transition: all 0.2s;
    box-sizing: border-box;
    position: relative;
    float: left;
    margin-top: 4px;
}
.diagonal.part-1 {
    position: relative;
    transition: all 0.2s;
    box-sizing: border-box;
    float: left;
}
.diagonal.part-2 {
    transition: all 0.2s;
    box-sizing: border-box;
    position: relative;
    float: left;
    margin-top: 4px;
}

input[type=checkbox]:checked ~ .mobileIconToggle > .horizontal {
    transition: all 0.5s;
    box-sizing: border-box;
    opacity: 0;
}
input[type=checkbox]:checked ~ .mobileIconToggle > .diagonal.part-1 {
    transition: all 0.5s;
    box-sizing: border-box;
    transform: rotate(135deg);
    margin-top: 6px;
    background-color: rgba(0,0,0,1);
}
input[type=checkbox]:checked ~ .mobileIconToggle > .diagonal.part-2 {
    transition: all 0.5s;
    box-sizing: border-box;
    transform: rotate(-135deg);
    margin-top: -8px;
    background-color: rgba(0,0,0,1);
}

.Mobile-Menu-Content {position:absolute; top: 50%; left: 50%; transform:translate(-50%,-20%); text-align:center; opacity: 0; transition: all 0.6s ease;}


/*extra label*/

.mobileIconToggle .label {color: #333; position:absolute; top: 0;  transition: all 0.5s;}

input[type=checkbox]:checked ~ .mobileIconToggle > .label {color: #fff;}

/*animating the content*/

input[type="checkbox"]:checked ~ #mobileMenu > .Mobile-Menu-Content {opacity: 1 !important; transform:translate(-50%,-50%); }


/*----------------Mobile menu content--------------*/

.Mobile-Menu-Content ul {list-style: outside none; font-size: 120%; padding: 0;}

.Mobile-Menu-Content li {margin-bottom: 4em;color: #333; line-height: .8}

.Mobile-Menu-Content a, .Mobile-Menu-Content a:visited {color: #333; text-decoration:none;}


/*---------------Switch menus on 736px--------------

@media screen and (min-width: 741px) {
    .mobileIconToggle, .Mobile-Menu-Content {display:none;}


}

@media screen and (max-width: 740px) {
    .makeover-nav {display:none;} 
}

*/


/*/////////////////Mobile Menu ENDS///////////////////*/



/*///////////////////////////////Woocommerce///////////////////////////////*/


/*-------single product-------*/

/*Width of right hand content*/
@media screen and (min-width: 769px) {
    .product .entry-summary h1, .product .entry-summary p {max-width: 580px;}
}
/*width of left hand content*/
@media screen and (min-width: 769px) {
    .woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images {
  float: left;
  width: 50%;}
}

/*tabs position*/

.woocommerce-tabs {float:left !important; clear:none !important; margin-left: 2%;}


/*tabs & tabs template h2 greyed out - not wanted*/

.woocommerce-tabs .description_tab, .woocommerce-tabs .additional_information_tab {opacity: .3;}
.wc-tab h2 {opacity: .3;}


/*product title*/
.product .entry-summary h1 {margin-bottom: 4em;}

/*price*/
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price {
  color: #333; font-weight: 300;
  font-size: 120% !important; margin-bottom: 4em;
}


/*copy*/
.product .entry-summary p {line-height: 1.5; margin-bottom: 1.5em}


/*short description*/
.woocommerce-product-details__short-description {margin-bottom: 4em;}

/*size label and options*/
.woocommerce .variations th {display:block; margin-bottom: 1em;}
.woocommerce div.product form.cart table td {float:left; clear:both !important;}

/*qty*/
.woocommerce div.product form.cart div.quantity { }





/*qty input*/
div.quantity input {border: 1px solid #999; border-radius: 0;}

/*options select*/
.variations select {border: 1px solid #999; border-radius: 0;}

/*.posted_in*/
.product_meta .posted_in {opacity: .3;}

/*add to basket button*/
.product form.cart .single_add_to_cart_button.button { background-color: #fff; color: #333; border: 1px solid #999; border-radius: 0; padding: .90em; line-height: 1; text-transform: uppercase; word-spacing: -.25em; letter-spacing: 0.06em; font-weight: 400; font-size: 84%; margin-left: .2em}
.product form.cart .single_add_to_cart_button.button:hover {background-color: #fff;color: #333; border: 1px solid #333; }

/*form*/
.woocommerce div.product form.cart {margin-bottom: 4em;}

/*tabs if we keep them*/
.entry-content table {color: inherit;}



/*-------Single product ENDS------*/

/*///////////////////////////////Woocommerce ENDS///////////////////////////////*/