@charset "UTF-8";
/*
Theme Name: onlinebrandambassadors
Theme URI: https://www.onlinebrandambassadors.com
Author: onlinebrandambassadors
Author URI: http://onlinebrandambassadors.com
Version: 1.0
License: GNU General Public License
*/

/* FONT in header.php */


/* BOOTSTRAP */
html { scroll-behavior: smooth; overflow-y: scroll; box-sizing: border-box; }


/* A */
a, a:link, a:visited { text-decoration: none; transition: all 1s ease; color:rgba(0,0,0,1); }
a:hover, a:active { color: rgba(0,0,0,1); text-decoration: none;}
.accordion { cursor: pointer;width: 90%;min-width:90%;max-width:90%; padding:2.5% 5% 2.5% 5%;text-align: center;border: none;outline: none;transition: 0.4s;border-radius:11px;} .active, .accordion:hover { opacity:0.7; }
.panel { padding: 0 5% 0 5%;max-height: 0;overflow: hidden;transition: max-height 0.2s ease-out;} .accordion:after { content: '\02795';font-size: 13px;color: #777;float: right;margin-left: 5px;} .active:after { content: "\2796"; }

.alignleft { text-align:left;} .alignright {text-align:right;} .aligncenter {text-align:center;} .alignjustifyleft { text-align:justify; } .alignjustifyright { direction:rtl; text-align:justify; } .alignjustifycenter { text-align: justify; text-align-last: center; }

.aligntop {vertical-align:top;} .alignmiddle {vertical-align:middle; align-items: center;} .alignmiddleflex {vertical-align:middle;display: flex;justify-content: center;align-items: center;} .alignbottom {vertical-align:bottom;}

#alternate01 { display:block; width:100%; min-width:100%; max-width:100%; padding:25px 0 25px 0; margin:0 auto 0 auto; font-size: 0; vertical-align:middle; }
.alternate01row01 { display:flex; flex-direction: row; justify-content:center; flex-wrap: wrap; align-items: center; align-content: space-between; padding:0; margin:0 auto 0 auto; box-shadow: 0 0 2vw 2vw rgba(0,0,0,0.03); vertical-align:middle; align-self: center; }
.alternate01row01:nth-of-type(even) { flex-direction: row-reverse; }
.alternate01column01 { width:50%; height:auto; padding:0; margin:0 auto 0 auto; background-color:rgba(255,255,255,1); overflow:visible; vertical-align:middle; }
.alternate01column01:nth-of-type(even) { }

amp-iframe { display:block; }
.amp-iframe-trustindex { display:block; }

.animatebottom { position: relative; -webkit-animation-name: animatebottom; -webkit-animation-duration: 1s; animation-name: animatebottom; animation-duration: 1s }
@-webkit-keyframes animatebottom { from { bottom:-150px; opacity:0 } to { bottom:0px; opacity:1 } }
@keyframes animatebottom {  from{ bottom:-150px; opacity:0 } to { bottom:0; opacity:1 } }


/* B */
.background01 { background-image:url(/assets/background01.webp); background-repeat: repeat; background-position: center center; background-size:333px 333px; position:relative; }

#banner01 { display:block; position:relative; z-index:0; width:100%; min-width:100%; max-width:100%;height:auto;  background:#fff; padding:0; margin:0 auto 0 auto; background-repeat: no-repeat; background-position: center center; background-size:cover; position:relative; z-index:0; border:none; vertical-align:middle;text-align:center;display: flex;justify-content: center;align-items: center; white-space: nowrap; }
.banner01text { padding:20% 0 15% 0; color: rgba(255,255,255,1); vertical-align:middle; }

body { display:block; padding:0; margin:0 auto 0 auto; text-align:center; }

.borderlight01 { border:solid 1px rgba(255,255,255,1); }
.borderlightleft01 { border-left: solid 1px rgba(255,255,255,1); }
.borderlightright01 { border-right: solid 1px rgba(255,255,255,1); }
.borderlightbottom01 { border-left: solid 1px rgba(255,255,255,1); }
.borderlighttop01 { border-left: solid 1px rgba(255,255,255,1); }
.borderdark01 { border:solid 1px rgba(0,0,0,1); }
.borderdarkleft01 { border-left: solid 1px rgba(0,0,0,1); }
.borderdarkright01 { border-right: solid 1px rgba(0,0,0,1); }
.borderdarkbottom01 { border-left: solid 1px rgba(0,0,0,1); }
.borderdarktop01 { border-left: solid 1px rgba(0,0,0,1); }

#box01, .box01 { display:block; padding: clamp(25px, 5%, 25px); margin:5vh auto 5vh auto; background-color: rgba(0,0,0,0.1); border-radius:16px; } /* BG COLOR */
#box02, .box02 { display:block; padding: clamp(25px, 5%, 25px); margin:5vh auto 5vh auto; border:solid 2px rgba(0,0,0,1); border-radius:16px; } /* FRAME */
.box03wrap { display:block; width:100%; min-width:100%; max-width:100%; height:auto; padding:0; margin:0 auto 0 auto; border-radius:100%; z-index:1; }
.box03 { position: relative; width: 50%;margin:0 auto 0 auto;}
.box03:before { content: ""; display: block; padding-top: 100%;}
.box03content { position: absolute; z-index:2; top: 0; left: 0; right: 0; bottom: 0; background-repeat:no-repeat; background-size:80% auto; background-position: center center; border:none; border-radius:100%; }
.box04wrap { display:block; width:100%; min-width:100%; max-width:100%; height:auto; padding:0; margin:0 auto 0 auto; border-radius:0; z-index:1; }
.box04 { position: relative; width: 50%;margin:0 auto 0 auto;}
.box04:before { content: ""; display: block; padding-top: 100%;}
.box04content { position: absolute; z-index:2; top: 0; left: 0; right: 0; bottom: 0; background-repeat:no-repeat; background-size:80% auto; background-position: center center; border:none; border-radius:0; }

.boxShadow { box-shadow: 0 0 5px 5px rgba(135,136,138,0.5); } /* x,y,blur,spread */

#breadcrumbs01 ul, #breadcrumbs01 ol { display:block; width:100%; min-width:100%; max-width:100%; height:auto; list-style:none; padding:0; margin:0 auto 0 auto; text-align:right; }
#breadcrumbs01 { display:block; width:100%; min-width:100%; max-width:100%; height:auto; list-style:none; padding:0; margin:0 auto 9px auto; }
#breadcrumbs01 li { list-style:none; display:inline-block; width:auto; font-size:calc(10px + 0.1vw); line-height:80%; text-transform:uppercase; }
#breadcrumbs01 a, #breadcrumbs01 a:link, #breadcrumbs01 a:visited, #breadcrumbs01 a:hover, #breadcrumbs01 a:active { font-size:calc(10px + 0.1vw); line-height:80%; text-transform:uppercase; }

br { display:block; clear:all; padding:0; margin-bottom: 16px; }

button, .button, .button01, .woocommerce #content input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce-page #content input.button, .woocommerce-page #respond input#submit, .woocommerce-page a.button, .woocommerce-page button.button, .woocommerce-page input.button, .woocommerce #content input.button.alt, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt, .woocommerce-page #content input.button.alt, .woocommerce-page #respond input#submit.alt, .woocommerce-page a.button.alt, .woocommerce-page button.button.alt, .woocommerce-page input.button.alt, .woocommerce #content input.button.alt, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt, .woocommerce-page #content input.button.alt, .woocommerce-page #respond input#submit.alt, .woocommerce-page a.button.alt, .woocommerce-page button.button.alt, .woocommerce-page input.button.alt { display:inline-block; color: rgba(255,255,255,1); background: rgba(250,180,30,1); background-color: rgba(250,180,30,1); border:none; border-color: none; border-radius:0; padding:6px 5% 6px 5%; margin:8px auto 8px auto; text-align:center; transition: all .3s ease; cursor:pointer; box-shadow: none; text-shadow: transparent; white-space: nowrap; color: rgba(255,255,255,1); transition: all 2s ease; }
.button01 a, .button01 a:link, .button01 a:visited, .button01 a:hover, .button01 a:active { color: rgba(255,255,255,1); }

button:hover, .button:hover, .button01:hover, .woocommerce #content input.button:hover, .woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce-page #content input.button:hover, .woocommerce-page #respond input#submit:hover, .woocommerce-page a.button:hover, .woocommerce-page button.button:hover, .woocommerce-page input.button:hover, .woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover, .woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover { background: rgba(250,180,30,0.5); background-color: rgba(250,180,30,0.5); box-shadow: 0 0 9px 9px rgba(0,0,0,0.1); }

.button02 { display:inline-block; color: rgba(0,0,0,1); background: rgba(255,255,255,1); background-color: rgba(255,255,255,1); border:solid 2px rgba(0,0,0,1); border-color: rgba(0,0,0,1); border-radius:0; padding:6px 5% 6px 5%; margin:1vh auto 1vh auto; text-align:center; transition: all .3s ease; cursor:pointer; box-shadow: none; text-shadow: transparent; white-space: nowrap;}
.button02:hover { box-shadow: 0 0 9px 9px rgba(0,0,0,0.1); }


/* C */
.clearfix {}
.clearfix::after { content: ""; display: table; clear: both; }

.colorBlack { color: rgba(0,0,0,1); }
.colorBlackbg { background-color: rgba(0,0,0,1); }
.colorBlackbg10 { background-color: rgba(0,0,0,0.1); }
.colorWhite { color: rgba(255,255,255,1); }
.colorWhitebg { background-color: rgba(255,255,255,1); }
.color01 { color: rgba(250,180,30,1); }
.color01bg100 { background-color: rgba(250,180,30,1); }
.color01bg10 { background-color: rgba(250,180,30,0.1); }
.color01bg25 { background-color: rgba(250,180,30,0.25); }
.color01bg50 { background-color: rgba(250,180,30,0.5); }
.color01bg75 { background-color: rgba(250,180,30,0.75); }

#column01 ul { display:block;width:100%;min-width:100%;max-width:100%;height:auto;list-style:none;padding:0;margin:0; }
#column01 { display:block;width:100%;min-width:100%;max-width:100%;height:auto;list-style:none;padding:0;margin:0 auto 0 auto; }
#column01 li { list-style:none; display:inline-block; }
#column01 .one { width: 95%; height: auto; padding:1%; margin:0 1% 1% 1%;}
#column01 .two { width: 45%; height: auto; padding:1%; margin:0 1% 1% 1%;}
#column01 .three { width: 28%; height: auto; padding:1%; margin:0 1% 1% 1%;}
#column01 .onethird { width: 28%; height: auto;padding:1%;margin:1%;}
#column01 .twothirds { width: 56%; height: auto;padding:1%;margin:1%;}
#column01 .four { width: 19%; height: auto; padding:1%; margin:0 1% 1% 1%;}
#column01 .five { width: 15%; height: auto; padding:1%; margin:0 1% 1% 1%;}


/* D */
.displayblock { display:block; text-decoration:none; }
.displayinlineblock { display:inline-block; text-decoration:none;  }
.displayinline { display:inline; text-decoration:none;  }

.dropbtn { border: none; cursor: pointer;}
.dropdown { position: relative; display: inline-block; }
.dropdown-content { display: none; position: absolute; z-index: 5; min-width:40vw; max-width:40vw; box-shadow: 0 0 5px 5px rgba(0,0,0,0.1); padding:3vh 2vw 3vh 2vw; margin:-1% auto 0 auto; border-radius:8px; background-color:rgba(255,255,255,0.99); }
.dropdown-content a { text-decoration: none; display:inline-block; padding:1vh 1vw 1vh 1vw; margin:0 1vw 1.5vh auto; background-color: rgba(66,69,78,0.05); border-radius:8px; }
.dropdown-content a:hover { }
.dropdown:hover .dropdown-content { display: block; }
.dropdown:hover .dropbtn { }

/* E */
em { font-style:italic; }

/* F */
#flex01 { display:flex; background-color:rgba(0,0,0,0,1); margin:0 auto 0 auto;	
/* row width */ width:100%; 
/* column width */ height:100%; 
/* main axis */ flex-direction: row; /*row, row-reverse : main axis horizontal, cross axis vertical OR column, column-reverse: main axis vertical, cross axis horizontal*/ 
justify-content:center; /* flex-start, flex-end, center, space-between, space-around, space-evenly (depends on direction's main axis)*/
flex-wrap: wrap; /* wrap, no-wrap; wrap-reverse (wrap over to next row or column, depends on direction's main axis) */
/* cross axis	*/	align-items: flex-start; align-content: space-between; /* flex-wrap must be turned on */
}  
.flex01 { min-width:280px; max-width:20%; overflow:auto; background-color:rgba(0,0,0,0.05); padding:1vw; margin:0.5vw; border-radius:8px; }
.flex01-header01 { padding:5%; background-color:rgba(0,0,0,0.075); border-radius: 8px 8px 0 0 ;}
.flex01-content01 { padding:5%; height:7vw; min-height:70px; }
.flex01-footer01 { padding:5%; border-top: solid 1px rgba(68,120,45,1); }

.floatRight { float:right; margin:0 auto 16px 50px; }
.floatLeft { float:left; margin:0 50px 16px auto; }

.font01 { font-family: 'Roboto', sans-serif; }
.font02 {  font-family: "Playfair Display", sans-serif; }

.fontSize01 { font-size: clamp(6px, 0.6vw, 0.6vw); letter-spacing:0.1vw; line-height:150%; font-weight:400; }
.fontSize05 { font-size: clamp(10px, 1vw, 1vw); line-height:150%; font-weight:400; }
.fontSize1 { font-size: clamp(13px, 1.3vw, 1.3vw); line-height:165%; font-weight:400; }
.fontSize2 { font-size: clamp(25px, 1.5vw, 1.5vw); line-height:165%; font-weight:400; }

#footer01 { display:block; width:90%; min-width:90%; max-width:90%; height:auto; padding:0 5% 0 5%; margin:0 auto 0 auto; }
#footer01 a, #footer01 a:link, #footer01 a:visited, #footer01 a:hover, #footer01 a:active { color: rgba(0,0,0,1); }

.frame01 { border: solid 1px rgba(0,0,0,1); }

/* G */
.gradientX { background-image: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,1));}
.gradientY { background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,1));}

.grayscale01 { filter: grayscale(100%); }

#grid01 { display:block; width:100%; min-width:100%; max-width:100%; padding:0; margin:0 auto 0 auto; font-size: 0; } /* font-size:0 remove space between inline-block https://css-tricks.com/fighting-the-space-between-inline-block-elements/ */
#grid01 .one { display:block; width:100%; min-width:100%; max-width:100%; }
#grid01 .two { display:inline-block; width:50%; margin:0; padding:0; }
#grid01 .three { display:inline-block; width:33.3%; margin:0; padding:0;  }
#grid01 .four { display:inline-block; width:25%; margin:0; padding:0; }
#grid01 .four-two { display:inline-block; width:50%; margin:0; padding:0;  }
#grid01 .four-three { display:inline-block; width:75%; margin:0; padding:0;  }
#grid01 .five { display:inline-block; width:20%; margin:0; padding:0;  }
#grid01 .five-two { display:inline-block; width:40%; margin:0; padding:0;  }
#grid01 .five-three { display:inline-block; width:60%; margin:0; padding:0;  }
#grid01 .five-four { display:inline-block; width:80%; margin:0; padding:0;  }
#grid01 .six { display:inline-block; width:16.6%; margin:0; padding:0; }
#grid01 .seven { display:inline-block; width:14.2%; margin:0; padding:0; }
#grid01 .eight { display:inline-block; width:12.2%; margin:0; padding:0; }
#grid01 .nine { display:inline-block; width:10.2%; margin:0; padding:0; }

#grid01 .grid100 { display:block; width:100%; min-width:100%; max-width:100%; }
#grid01 .grid75 { display:inline-block; width:75%; margin:0; padding:0;  }
#grid01 .grid50 { display:inline-block; width:50%; margin:0; padding:0; }
#grid01 .grid33 { display:inline-block; width:33.3%; margin:0; padding:0;  }
#grid01 .grid25 { display:inline-block; width:25%; margin:0; padding:0; }
#grid01 .grid20 { display:inline-block; width:20%; margin:0; padding:0;  }
#grid01 .grid10 { display:inline-block; width:10%; margin:0; padding:0;  }

/* H */
#header01 { display:block; position:fixed; z-index:2; top:0; left:0; width:90%; min-width:90%; max-width:90%; height:auto; transition: all 1s ease; padding: 10px 5% 10px 5%; margin:0 auto 0 auto; box-shadow: 0 0 9px 9px rgba(0,0,0,0.1); transition: all 1s ease;  background-color: rgba(250,180,30,0.5);}	

h1 { font-size:calc(12px + 3vw); line-height:100%; padding:0; margin:0 auto 2vw auto; }
h2 { font-size:calc(12px + 2vw); line-height:100%; padding:0; margin:0 auto 2vw auto; }
h3 { font-size:calc(12px + 1vw); line-height:100%; padding:0; margin:0 auto 2vw auto; }
h4 { font-size:calc(12px + 0.5vw); line-height:100%; padding:0; margin:0 auto 2vw auto; }
h5 { font-size:calc(12px + 0.1vw); line-height:100%; padding:0; margin:0 auto 2vw auto; }
h9 { display:block; width: 80%; font-style:italic; padding-left:5%; margin-left:5%; border-left: solid 3px rgba(0,0,0,0.5); } /* QUOTE */
h10 { display:block;width:auto; background-color:rgba(215,53,52,0,1); color: rgba(215,53,52,1); padding:1vh 1vw 1vh 1vw; margin:0 auto 16px auto; } /* BAD */
h11 { display:block;width:auto; background-color:rgba(9,161,92,0.1); color: rgba(9,161,92,1); padding:1vh 1vw 1vh 1vw; margin:0 auto 16px auto; } /* GOOD */
h15 { display:inline-block; width:auto; height:auto; font-weight:500; padding:1vh 1vw 1vh 1vw; margin:0 auto 0 auto; background-color: rgba(255,255,255,1); color:rgba(0,0,0,1); text-align:center; letter-spacing:2px; text-transform:uppercase; position:relative; z-index:1; box-shadow: 0 0 3px 3px rgba(0,0,0,0.05); }
h15:after { display: block; content: ""; border-color: rgba(255,255,255,1) transparent transparent transparent; border-style: solid; border-width: 16px; height:0; width:0; margin:1vh auto -5vh auto; position:relative; z-index:1; } /* FIELDSET ARROW */

.hover01:hover { transform: scale(1.1); z-index:999; box-shadow: 0 0 9px 9px rgba(0,0,0,0.1); transition: all 1s ease; }
hr { box-shadow:none; color: rgba(0,0,0,1); border:none; border-bottom: solid 1px rgba(0,0,0,1); }

/* I */
.image01img { width: 100%; min-width:100%; max-width: 100%; margin: 0 auto 16px auto;
padding:0; height:auto; min-height:auto; max-height: auto; }
.image01Square  { width: 100%; }
.image01Square:after { content: ""; display: block; padding-bottom: 100%; }
.image01div { width: 100%; min-width:100%; max-width: 100%; margin: 0 auto 0 auto; padding:0; height:50vw; min-height:50vw; max-height: 50vw; background-repeat: no-repeat; background-position: center center; background-size:cover; }
.image02div { width: 100%; min-width:100%; max-width: 100%; margin: 0 auto 0 auto; padding:0; height:30vh; max-height: 333px; background-repeat: no-repeat; background-position: center center; background-size:cover; }
.image03div { width: 100%; min-width:100%; max-width: 100%; margin: 0 auto 0 auto; padding:0; height:10vw; min-height:100px; max-height: 10vw; background-repeat: no-repeat; background-position: center center; background-size:cover; }
.imagecirclewrap01 { width:90%; min-width:90%; max-width:90%; height:auto; padding:5%; margin:0 auto 0 auto; border-radius:100%; background:#fff; z-index:11; box-shadow: 0.5vw 0.5vh 5vw 5vw rgba(57,67,97,0.05); }
.imagecirclebox01 { position: relative;width: 100%;margin:0 auto 0 auto;}
.imagecirclebox01:before { content: ""; display: block;padding-top: 100%;}
.imagecirclecontent01 { position: absolute; z-index:3; top: 0; left: 0; right: 0; bottom: 0; background: #fff; background-repeat:no-repeat; background-size:cover; background-position: center center; border:none; border-radius:100%; }
.imagesquarewrap01 { width:95%; height:auto; padding:2%; margin:0 auto 0 auto; border:solid 2px rgba(0,99,46,1); border-radius:0; background:#fff; z-index:1; }
.imagesquarebox01{ position: relative; width: 100%; }
.imagesquarebox01:before { content: ""; display: block; padding-top: 100%; }
.imagesquarecontent01 { position: absolute; z-index:1; top: 0; left: 0; right: 0; bottom: 0;}

/* J */

/* K */
.kenburns-wrap { width: 100%; height: auto; margin: 0 auto; overflow: hidden; position: relative; }
.kenburns-wrap img, .kenburns-bgimg { width: 100%; animation: move 40s ease; -ms-animation: move 40s ease; -webkit-animation: move 40s ease; -0-animation: move 40s ease; -moz-animation: move 40s ease; position: absolute; }
@-webkit-keyframes move { 
0% { -webkit-transform-origin: bottom left; -moz-transform-origin: bottom left; -ms-transform-origin: bottom left; -o-transform-origin: bottom left; transform-origin: bottom left; transform: scale(1.0); -ms-transform: scale(1.0); -webkit-transform: scale(1.0); -o-transform: scale(1.0); -moz-transform: scale(1.0); }
100% { transform: scale(1.3); -ms-transform: scale(1.3); -webkit-transform: scale(1.3); -o-transform: scale(1.3); -moz-transform: scale(1.3); }
}

/* L */
.link01 { border-bottom: solid 1px rgba(0,0,0,0.9); }
.link01:hover { opacity:0.6; }

#list01 ul, #list01 ol { display:block; width:100%; height:auto; list-style:none; }
#list01 { display:block; list-style:none; width:95%; min-width:95%; max-width:95%; height:auto; padding:0 0 0 5%; margin:0 auto 25px auto; border-left: solid 5px rgba(250,180,30,0.5); }
#list01 #list01 { border:none; padding:0 0 0 2%; margin:0 auto 0 auto; }
#list01 li { list-style:none; display:block; vertical-align:top; padding:2vh 0 2vh 0; margin:0 auto 0 auto; border-bottom:dotted 1px rgba(0,0,0,0.5); } 
#list01 li:last-of-type { border:none; border-bottom:none; }

#list02 ul, #list02 ol { display:block; width:100%; height:auto; list-style:none; }
#list02 { display:block; list-style:none; width:100%; min-width:100%; max-width:100%; height:auto; padding:0; margin:0 auto 0 auto; }
#list02 #list01 { border:none; padding:0 0 0 2%; margin:0 auto 0 auto; }
#list02 li { list-style:none; display:inline-block; vertical-align:top; padding:8px 0 8px 0; margin:0 8px 8px auto; border-bottom:dotted 1px rgba(0,0,0,0.5); } 

#logo01 { position:fixed; z-index:112; top:1vw; left:1vw; display:inline-block; width:3vw; height:3vw; padding:1.6vw; background-color:rgba(0,0,0,1); margin:0 auto 0 auto; box-shadow: 0.1vw 0.1vh 1vw 1vw rgba(0,0,0,0.1); border-radius:50%;  border:solid 1px rgba(255,255,255,1); transition: all 3s ease; }
#logo01 img { width:auto; height:3vw; position:relative; z-index:112; }
#logo02 { display:block; width:100%; margin:0 auto 15px auto; padding:0; }
#logo02 img { display:inline-block; width:33%; height:auto; margin:0 auto 0 auto; padding:0; }


/* M */
#media_screen { display:block; }
#media_tablet { display:none; }
#media_mobi { display:none; }

/* N */
#nav01 ul { display:block; list-style:none; width:100%; height:auto; padding:0; margin:0 auto 0 auto;}
#nav01 { display:block; position: relative; z-index:2; list-style:none; width:100%; height:auto; padding:0; margin:0 auto 0 auto; text-align:right; }
#nav01 li { display:inline-block; width:auto; padding:0 1% 0 1%; margin: 0 auto 0 auto; text-transform:uppercase; border: none; transition: all 2s ease; border-right: solid 1px rgba(255,255,255,0.5);}
#nav01 li:nth-of-type(4), #nav01 li:nth-of-type(5), #nav01 li:nth-of-type(6) {border: none;}
#nav01 li:nth-of-type(5) { padding:0 2% 0 0; }
#nav01 li:hover { background-color: rgba(250,180,30,0.5); color: rgba(255,255,255,1);  }

#nav01 a, #nav01 a:link, #nav01 a:visited, #nav01 a:active { display:block; color: rgba(0,0,0,1);  }
#nav01 a:hover { color: rgba(255,255,255,1); }

.nowrap { white-space: nowrap; }

/* O */
.opacity50 { opacity:0.5; }

/* P */
p { display:block; padding:0; margin:0 auto 16px auto; }
.padding1 { padding:1%; }
.padding1x { padding:0 1% 0 1%; }
.padding1y { padding:1% 0 1% 0; }
.padding2 { padding:2%; }
.padding5 { padding:5%; }
.padding5x { padding:0 5% 0 5%; }
.padding5y { padding:5% 0 5% 0; }
.padding10 { padding:0 10% 0 10%; }
#page01 { display:block; width:90%; min-width:90%; max-width:90%; height:auto; padding:0; margin:0 auto 0 auto; }
#page02 { display:block; width:90%; min-width:90%; max-width:90%; height:auto; padding:95px 0 0 0; margin:0 auto 0 auto; }


#popup01cover { position:fixed; top:0; left:0; background:rgba(0,0,0,0.6); z-index:3332; width:100%; height:100%; display:none; }
#popup01screen { width:60%; min-width:60%; max-width:60%; height:70%; min-height:50px; max-height:70%; overflow:auto; padding:5%; margin:0 auto 0 auto; position:fixed; top:20%; left:15%; z-index:3333; display:none; background: rgba(255,255,255,0.99); border:none; box-shadow: 15px 15px rgba(0,0,0,0.5); } #popup01screen:target, #popup01screen:target + #popup01cover { display:block; transition: all 3s ease-in-out; } .popup01cancel i, .popup01cancel a, .popup01cancel a:link, .popup01cancel a:visited, .popup01cancel a:active { display:inline-block; width:33px;height:33px; position:fixed; z-index:11; top:15%; left:40%; right:40%; font-size:33px; color:rgba(0,0,0,1); background-color:rgba(255,255,255,1); border-radius:100%; padding:0; margin:0 auto 0 auto; border:solid 10px rgba(255,255,255,1); } .popup01cancel:hover, .popup01cancel a:hover { color:rgba(0,99,46,1); }

/* S */
#search01 { display:block; width:100%; margin:0 auto 0 auto; padding:0; }
#search01 .search-form { display:block; width:100%; margin:0 auto 0 auto; padding:0;}
#search01 .search-field { display:inline-block; width:75%; border:none; text-align:center; margin:0 auto 0 auto; padding: 5px 0 5px 0; border-radius:0; }
#search01 .search-submit { display:inline-block; width:20%; border:none; text-align:center; margin:0 auto 0 auto; padding: 5px 0 5px 0; border-radius:0; }

#social01 ul, #social01 { display:inline-block; width:auto; height:auto; list-style:none; padding:0; margin:0 auto 0 auto; }
#social01 li { list-style:none; display:inline-block; width:2vw }

strong { font-weight:600;}

/* T */
.table01 {} 
.cell01 {}


.textShadow { text-shadow: 5px 5px 5px rgba(135,136,138,0.5); } /* x,y,blur */

/* U */
.underline a, .underline a:link, .underline a:visited { text-decoration: underline; text-decoration-color: rgba(0,0,0,0.5); }
.underline a:hover, .underline a:active { text-decoration: none; background-color: rgba(243,203,89,0.1); }



/* W */

/* WOOCOMMERCE override */

.woocommerce { display:block; width:100%; min-width:100%; max-width:100%; height:auto; padding: 0; margin: 0 auto 0 auto; border:none; }
.woocommerce form { display:block; width:100%; min-width:100%; max-width:100%; height:auto; padding: 0; margin: 0 auto 0 auto; border:none; }
.woocommerce table, .woocommerce .shop_table, .woocommerce thead { display:block; width:100%; min-width:100%; max-width:100%; height:auto; padding: 0; margin: 0 auto 0 auto; border:none; }


/* SINGLE PRODUCT */
.woocommerce-Price-amount { font-family: 'Antonio', sans-serif; font-size:25.88px; line-height:35.88px; font-weight:400; margin:5% 0 5% 0; padding:0; text-transform:uppercase; }

/* VARIATIONS */
.variations_form {  }
.variations_form table { width:auto; }
.variations { display: block; width:auto; text-align:left; margin:5% auto 5% auto; }
.variations_form td { width:auto; min-width:auto; max-width:auto; }
.variations input { }
.variations .label { }
.variations .value { padding:0 0 0 5%; }
.woocommerce-variation-price { display:inline-block; font-family: 'Antonio', sans-serif; font-size:16px; line-height:25.88px; font-weight:400; margin:0; padding:3% 0 3% 0; text-transform:uppercase; color: rgba(0,0,0,0.5); }

/* QUANTITY */
.quantity { }
.quantity input { }

/* SKU */
.sku_wrapper { display:none; }

/* CATEGORIES */
.posted_in { display:none; }

/* CART PAGE */
.cart-collaterals h2 { display:none; }

/* CHECKOUT */
.woocommerce-billing-fields { border:solid 1px #000; padding:5%; margin:1% auto 0 auto; box-shadow: 0 0 5px 5px rgba(0,0,0,0.2); border-radius:11px;  }
.woocommerce-billing-fields h3 { display:none; }
#ship-to-different-address { display:none; }
.shipping_address { display:none; }
.woocommerce-checkout-review-order { border:solid 1px #000; padding:5%; margin:1% auto 0 auto; box-shadow: 0 0 5px 5px rgba(0,0,0,0.2); border-radius:11px; } 
#order_review { background-color: rgba(255,255,255,1); background: rgba(255,255,255,1); }
#order_review table {}
.woocommerce-checkout-review-order {}
.shop_table {}
#payment { background-color: rgba(255,255,255,1); background: rgba(255,255,255,1); }
.woocommerce-checkout-payment { background-color: rgba(255,255,255,1); background: rgba(255,255,255,1); }
#payment label, #payment_method_payfast label, .wc_payment_methods, .payment_methods, .methods, .wc_payment_method, .payment_box, .payment_method_payfast { background-color: rgba(255,255,255,1); background: rgba(255,255,255,1); }

.form-row, .place-order, .woocommerce-terms-and-conditions-wrapper, .woocommerce-privacy-policy-text { background-color: rgba(255,255,255,1); background: rgba(255,255,255,1); }
.shop_table, .shop_table_responsive, .cart, .woocommerce-cart-form__contents, .checkout, .woocommerce-checkout { display:block; width:100%; min-width:100%; max-width:100%; height:auto; padding: 0; margin: 0 auto 0 auto; }
.product-thumbnail img { display:block; width:80%; height:auto; padding:10%; border-radius:8px;}
.checkout input { padding:16px 0 16px 0; text-align:center; }
.col2-set { display:block; width:100%; min-width:100%; max-width:100%; height:auto; padding: 0; margin: 0 auto 0 auto; }
.col-1 { display:block; width:100%; min-width:100%; max-width:100%; height:auto; padding: 0; margin: 0 auto 0 auto; }
.col-2 { display:block; width:90%; min-width:90%; max-width:90%; height:auto; padding: 5%; margin: 0 auto 0 auto; }
#order_review_heading { margin-top: 5%; }

/* CHECKOUT CONFIRM */
.order_details { display:block; text-align:center; background-color:rgba(0,0,0,0.1); padding:50px 5% 50px 5%; margin: 0 auto 0 auto; }
.order_details li { display:inline-block; width:19%; min-width:19%; max-width:19%; padding:10px 1% 10px 1%; margin:0 auto 0 auto; }

/* THANK YOU */
.woocommerce-order-overview { display:block; text-align:center; background-color: rgba(0,0,0,0.1); padding:50px 5% 50px 5%; margin:0 auto 0 auto; }



/* WOOCOMMERCE MESSAGES */
.woocommerce-notices-wrapper { display:block; width:100%; min-width:100%; max-width:100%; padding:0; margin:0 auto 0 auto; }
.woocommerce-notices-wrapper p { display:block; width:100%; min-width:100%; max-width:100%; padding:0; margin:0 auto 0 auto; } 
.woocommerce-info, .cart-empty .woocommerce-info { display:block; width:90%; min-width:90%; max-width:90%; padding:25px 5% 25px 5%; margin:0 auto 0 auto; border-top: solid 3px rgba(255,0,0,1); background-color:rgba(255,0,0,0.05); }
.woocommerce-info::before { content: "" !important; } /* remove image */

/* WP FORMS https://wpforms.com/docs/how-to-customize-the-style-of-individual-form-fields/ */
#wpforms-32 .wpforms-form { padding: 0 0 !important; border: none !important; border-radius: 0 !important; color: rgba(0,0,0,1); filter: grayscale(100%); }
.wpforms-form  .wpforms-field.wpforms-field-text,
.wpforms-form .wpforms-field.wpforms-field-email { padding: 10px 0; clear: both; color: rgba(0,0,0,1);}
.wpforms-form .wpforms-field.wpforms-field-text .wpforms-field-label,
.wpforms-form .wpforms-field.wpforms-field-email .wpforms-field-label { display: block; font-weight: 700; font-size: 16px; float: none; line-height: 1.3; margin: 0 0 4px 0; padding: 0; }
.wpforms-form .wpforms-field.wpforms-field-text input,
.wpforms-form .wpforms-field.wpforms-field-text input[type=email],
#wpforms-8888-field_5,
.wpforms-field-medium { background-color: rgba(217,214,208,0.5); box-sizing: border-box; border-radius: 10px; color: rgba(0,0,0,1); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; display: block; float: none; font-size: 16px; border: 1px solid rgba(217,214,208,0.5); padding: 6px 10px; height: 30px; width: 100%; line-height: 1.3; }
.wpforms-form .wpforms-field.wpforms-field-textarea { padding: 10px 0; clear: both; color: rgba(0,0,0,1); }
.wpforms-form .wpforms-field.wpforms-field-textarea .wpforms-field-label { display: block; font-weight: 700; font-size: 16px; float: none; line-height: 1.3; margin: 0 0 4px 0; padding: 0; }
.wpforms-form .wpforms-field.wpforms-field-textarea textarea { background-color: rgba(217,214,208,0.5); box-sizing: border-box; border-radius: 10px; color: #000; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; display: block; float: none; font-size: 16px; border: 1px solid rgba(217,214,208,0.5); padding: 6px 10px; height: 5vh; width: 100%; line-height: 1.3; }
.wpforms-32 input[type=submit],
.wpforms-32 button, .wpforms-32 button[type=submit] { background: rgba(250,180,30,1); background-color: rgba(250,180,30,1); border: 1px solid rgba(255,255,255,1); color: rgba(255,255,255,1); font-size: 1em; padding: 10px 15px; }
.wpforms-form .wpforms-required-label { color: rgba(0,0,0,1); font-weight: 400; }
.wpforms-container em.wpforms-error { display: block; color: rgba(0,0,0,1); font-size: 12px; float: none; }
.wpforms-container-full .wpforms-form em.wpforms-error:before {content: ''; position: relative; display: inline-block; right: 5px; top: 1.5px; width: 16px; height: 14px; background-color: rgba(150,100,50,0.1); }
.wpforms-confirmation-container-full { color: rgba(0,0,0,1); margin: 0 0 24px 0; background:rgba(150,100,50,0.5); ; border: 1px solid rgba(150,100,50,0.5); padding: 15px 15px; }


/* Media Queries: Smartphone -------------------------------------------------------------- */
@media (max-width: 800px) {
@-ms-viewport { width: device-width; }
@viewport { width: device-width; }

/* A */
a,a:link,a:visited { color: rgba(0,0,0,1); }
.alignleft { text-align:center;} .alignright {text-align:center;} .alignjustify {text-align:center;}
.alignleftFix { text-align:left;} .alignrightFix { text-align:right;}

#alternate01 { display:block; width:100%; min-width:100%; max-width:100%; padding:0; margin:0 auto 0 auto; font-size: 0; vertical-align:middle; }
.alternate01row01 { display:flex; flex-direction: row; justify-content:center; flex-wrap: wrap; align-items: center; align-content: space-between; padding:0; margin:0 auto 0 auto; box-shadow: 0 0 2vw 2vw rgba(0,0,0,0.03); vertical-align:middle; align-self: center; }
.alternate01row01:nth-of-type(even) { flex-direction: row-reverse; }
.alternate01column01 { width:100%; height:auto; padding:0; margin:0 auto 0 auto; background-color:rgba(255,255,255,1); overflow:visible; vertical-align:middle; }
.alternate01column01:nth-of-type(even) {}

/*B*/
body { }
button, .button01, .button02, .button03 { display:block; font-size:16px; line-height:155%; font-weight:600; }

/*C*/
#column01 .one, #column01 .two, #column01 .three, #column01 .twothirds, #column01 .onethird, #column01 .four, #column01 .five,#column01 .six,#column01 .seven,#column01 .eight, #column01 .nine, #column01 .ten { display:block; width:90%;min-width:90%;max-width:90%;height:auto;padding:5%;margin:0 auto 1% auto;}

/* F */
.fontSize1 { font-size: 22px; line-height:165%; font-weight:400; }
.fontSize05 { font-size: 14px; line-height:150%; font-weight:400; }

/* G */
#grid01 .one, #grid01 .two, #grid01 .three, #grid01 .four, #grid01 .four-two, #grid01 .four-three, #grid01 .five, #grid01 .five-two, #grid01 .five-three, #grid01 .five-four, #grid01 .six, #grid01 .seven, .eight { display:block; width:100%; min-width:100%; max-width:100%; height:auto; min-height:auto; max-height:auto; overflow:hidden; }


/* H */
#header01 { display:block; position: fixed; z-index:5; top:0; left:0; width:100%; height:auto; padding:2hv 0 2vh 0; margin:0 auto 0 auto; text-align:center; }
h1 { font-size: 52px; line-height:100%; letter-spacing:-0.5vw; padding:16px 0 16px 0; }
h2 { font-size: 42px; line-height:100%; letter-spacing:-0.5vw; padding:16px 0 16px 0;}
h3 { font-size: 32px; line-height:100%; letter-spacing:-0.5vw; padding:16px 0 16px 0; }	
h4 { font-size: 15px; line-height:100%;letter-spacing:-0.1vw; padding:16px 0 16px 0; }
	
/* I */
.image01img { padding:0; margin:16px auto 16px auto; }	
.image01div { height:33vh; min-height:333px; max-height: 33vh; padding:0; margin:16px auto 16px auto;}
.image02div { height:33vh; min-height:333px; max-height: 33vh; padding:0; margin:16px auto 16px auto;}
.image03div { height:33vh; min-height:333px; max-height: 33vh; padding:0; margin:16px auto 16px auto;}	

/* L */
#list01 li { }
#list02 li { display:block; }
	
#logo01 { display:none; }
#logo01 img {}
#logo02 img { display:inline-block; width:75%; height:auto; margin:0 auto 0 auto; padding:0; }	
.logoMobi { display:block; width:61.8%; min-width:61.8%; max-width:61.8%; height:auto; margin:0 auto 0 auto; padding:0; }	

/* M */
#media_screen { display:none; }
#media_tablet { display:none; }
#media_mobi { display:block; }

/* N */
#nav01 { display:none; }
#navMobi01 { display:block; margin: 0 auto 0 auto; padding: 10px 20px 10px 20px;}	
.navMobi { position: relative; border-radius:15px 15px 0 0;
padding:2vw;
font-size:25px;
text-align:center; }
.navMobi input[type='checkbox'] { position: absolute; opacity: 0; z-index: -1; }
.navMobi__content { max-height: 0; overflow: auto; transition: all 1s; }
.navMobi__content a, .navMobi__content a:link, .navMobi__content a:visited, .navMobi__content a:hover, .navMobi__content a:active {}	
.navMobi input:checked ~ .navMobi__content { max-height: 100vh; }


/* P */
#page01, #page02 { display:block; width:90%; min-width:90%; max-width:90%; padding:0 5% 0 5%; margin:0 auto 0 auto; background-color:rgba(255,255,255,1); box-shadow: 0 0 0 0 rgba(0,0,0,0.1); border-radius:11px; }
.popcontent01 { padding:10% 0 0 0; }



/* S */

/* T */
	
/* W */
/* Basic Styling for WPForms Submit Button */
.wpforms-32 .wpforms-submit {
	display:block;
	width:80%;
    background-color: rgba(250,180,30,1); /* Green background */
    color: #ffffff; /* White text */
    border: none; /* Remove border */
    padding: 10px 5% 10px 5%; /* Add padding */
    font-size: 16px; /* Increase font size */
    font-weight: bold; /* Make text bold */
    text-transform: uppercase; /* Make text uppercase */
    border-radius: 5px; /* Rounded corners */
    transition: background-color 0.3s ease; /* Smooth hover transition */
    cursor: pointer; /* Change cursor to pointer */
}

/* Hover State */
.wpforms-32 .wpforms-submit:hover {
    background-color: rgba(250,180,30,0.8); /* Darker green on hover */
    color: #ffffff; /* Ensure text stays visible */
}

/* Disabled State */
.wpforms-32 .wpforms-submit[disabled] {
    background-color: rgba(250,180,30,0.5); /* Grey background for disabled state */
    cursor: not-allowed; /* Show not-allowed cursor */
    opacity: 0.7; /* Reduce opacity */
}

}