@charset "utf-8";
/* CSS Document */

/*
Website Name: Super Mega Attack
Author: Jason Banks
Description: Workshop of the Wicked
Version: 1.0
*/

/*----------------------------------------------------------------------------------------------------
>>> TABLE OF CONTENTS: BASURA STUDIO
------------------------------------------------------------------------------------------------------
1.0 CSS RESET
2.0 BASIC STYLES
3.0 HEADER
4.0 LEFT COLUMN
   4.1 
   4.2 
---------------------------
JASON BANKS
---------------------------
*/

/*----------------------------------------------------------------------------------------------------
1.0 CSS RESET
----------------------------------------------------------------------------------------------------*/
/*
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,  figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline;}

/* HTML5 display-role reset for older browsers */
/*
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display:block;
}
body {
	line-height:1;
}
ol, ul {
	/* list-style:none; */
	/*
}
blockquote, q {
	quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content:'';
	content:none;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}

/*----------------------------------------------------------------------------------------------------
3.0 BODY & MAIN WRAPPER SETTINGS
----------------------------------------------------------------------------------------------------*/
/*
html {font-size: 75%; // 12px}
body {font-size: 1em; // 12px}
h1 {font-size: 2em; // 24px}
*/

/*
html {font-size:100%; // 12px }

body {font-family:sans-serif; font-size:1em; // 12px}

#primary-container {margin:;}

* {box-sizing:border-box;}

h1, h2, h3, h4, h5, h6, p {line-height:1.25em;}

h1 {font-weight:bold;  font-size:6em; // 72px}
h2 {font-weight:bold;  line-height:1.25em; font-size:5em; // 60px}
h3 {font-weight:bold;  font-size:4em; // 48px}
h4 {font-weight:bold;  font-size:3em; // 36px}
h5 {font-weight:bold;  line-height:1.25em; font-size:2em; // 24px}
h6 {font-weight:bold;  font-size:1em; // 12px}
p {line-height:1.25em;}

b {font-weight:bold;}
i {font-style:italic;}
*/

@media only screen and (max-width:1200px)
{
  /* #primary-container {margin:20px 5%;} */
}

@media only screen and (max-width:800px)
{
  /* #primary-container {margin:20px 2%;} */
}

/*----------------------------------------------------------------------------------------------------
.0 HEADER SETTINGS
----------------------------------------------------------------------------------------------------*/
/******************** Styles for Burger Menu ********************/
/*
0.0 Top Container
--------------------------------------------------*/
#top-container {position:fixed; /* right:40px; */ z-index:50; width:100%; height:80px; padding:20px 40px 0 40px; background:; /*background:white;*/ /* background:rgba(250,250,250,0.8); */ transition:0.4s; /* pointer-events:none; */}

#top-container article {display:flex; flex-direction:row; flex-wrap:wrap;}

#top-container article aside {width:33%;}

#top-container article aside:nth-of-type(1) {width:50%;}
#top-container article aside:nth-of-type(2) {width:40%; padding-left:5%;}
#top-container article aside:nth-of-type(3) {width:10%;}

#top-container-left {float:; display:; background:;}
#top-container-left img {max-width:250px;}

#top-container-middle {margin:8px 0 0 0; background:;}
#top-container-middle ul {display:inline-block; float:;}
#top-container-middle ul li {display:inline-block;}
#top-container-middle ul li a {text-decoration:none; color:black; font-weight:bold; font-style:18px; transition:0.4s; padding:0 60px 10px 0; margin-right:20px; border-bottom:2px solid black;}
#top-container-middle ul li a:hover {/* color:#4FAC52; */ text-decoration:line-through;}
/*
#top-container-middle li a.current {color:#4FAC52; text-decoration:line-through;}
*/

/* Highlight using list element */
li.current_page_item{
    background:#999;
    color:#fff;
}
 
/* Highlight using link element */
li.current_page_item a{
    text-decoration:underline;
    background:#666;
}

#top-container-right {margin-top:7px; background:;}

/*
.icon-svg {width:36px; background:#ccc; cursor:pointer;}

.icon-svg:hover {background:#1C75BC; transition:0.4s;}
*/

@media only screen and (max-width:1500px)
{
	#top-container-middle {margin:13px 0 0 0; background:;}
	#top-container-middle ul li a {padding:0 0 10px 0; margin-right:25px; border-bottom:none; background:;}
	#top-container article aside:nth-of-type(2) {width:45%; padding-left:0;}
	#top-container article aside:nth-of-type(3) {width:5%;}
}

@media only screen and (max-width:800px)
{
  #top-container {/* right:10px; */ height:50px; padding:10px 20px; /* background:rgba(0,0,0,0.6); */ background:;}
  #top-container-left img {max-width:200px;}
  #top-container article aside:nth-of-type(1) {width:50%;}
  #top-container article aside:nth-of-type(2) {width:0;}
  #top-container article aside:nth-of-type(3) {width:50%;}
  #top-container-middle {display:none;}
  	#top-container-right {margin-top:0; background:;}
}

/*
0.0 Function - Sidenav Overlay
--------------------------------------------------*/
.sidenav {height:100%; width:0; position:fixed; z-index:100; top:0; left:0; background-color:rgba(0,0,0,0.9); overflow-x:hidden; transition:0.4s; padding:0;}

.sidenav a {color:#CCC; text-decoration:none; display:block; padding:20px 20px; transition:0.4s; /* font-weight:bold; */}

.sidenav a:hover, .offcanvas a:focus {/* background:rgba(28,117,188, 1); */ /* background:rgba(79, 172, 82, 1); */ color:white; padding-left:30px;}

.closebtn {position:absolute; z-index:10; top:0; right:0; width:; padding:; font-size:36px;}

/*
0.0 Function - Transformative Burger Menu Button
--------------------------------------------------*/
/*
.container {float:right; cursor:pointer; /* margin-left:4px; */}
/*
.container .bar1, .container .bar2, .container .bar3 {/* background:#1C75BC; */ background:black;}

/* .container:hover .bar1, .container:hover .bar2, .container:hover .bar3 {background:#1C75BC; background:red;} */

/* .bar1, .bar2, .bar3 {width:35px; height:5px; background:#ccc; margin:6px 0; transition:0.4s;} */

/*
.bar1, .bar3 {width:35px; height:5px; background:#ccc; margin:6px 0; transition:0.4s;}
.bar2 {width:25px; height:5px; background:#ccc; margin:6px 0 6px 10px; transition:0.4s;}
.change .bar1 {-webkit-transform:rotate(-45deg) translate(-9px, 6px); transform:rotate(-45deg) translate(-9px, 6px);}
.change .bar2 {opacity:0;}
.change .bar3 {-webkit-transform:rotate(45deg) translate(-8px, -8px); transform:rotate(45deg) translate(-8px, -8px);}
*/
/*
.bar1, .bar2, .bar3 {transition:0.4s;}
.bar1, .bar3 {width:25px; height:4px; margin:4px 0;}
.bar2 {width:25px; height:4px; margin:0 0 0 0;}
.change .bar1 {-webkit-transform:rotate(-45deg) translate(-6px, 3px); transform:rotate(-45deg) translate(-6px, 3px);}
.change .bar2 {opacity:0;}
.change .bar3 {-webkit-transform:rotate(45deg) translate(-7px, -7px); transform:rotate(45deg) translate(-7px, -7px);}

@media only screen and (max-width:800px)
{
  /*
 .bar1, .bar3 {width:25px; height:2px;  margin:6px 0;}
 .bar2 {width:20px; height:2px; margin:0 0 0 5px;}
 .change .bar1 {-webkit-transform:rotate(-45deg) translate(-6px, 3px); transform:rotate(-45deg) translate(-6px, 3px);}
 .change .bar3 {-webkit-transform:rotate(45deg) translate(-7px, -7px); transform:rotate(45deg) translate(-7px, -7px);}
 */
 /*
}
/******************** END - Styles for Burger Menu ********************/

/*----------------------------------------------------------------------------------------------------
.0 ADD ONS
----------------------------------------------------------------------------------------------------*/
#freeVisitCounter {/*display:none;*/ text-align:center; position:relative; left:50%;}
#freeVisitCounter a {color:black;}

/*----------------------------------------------------------------------------------------------------
2.0 ABOUT PAGE
----------------------------------------------------------------------------------------------------*/
#about {width:100%; padding:300px 20%; text-align:center; color:#333;}

#about p {font-size:1.5em;}

@media only screen and (max-width:800px)
{
  #about {width:100%; padding:80px 10%;}
}

/*----------------------------------------------------------------------------------------------------
BANNER SETTINGS
----------------------------------------------------------------------------------------------------*/
/* Banner Solo
--------------------------------------------------*/
#bannerSolo {width:100%; margin-bottom:4px;}
#bannerSolo article {display:flex; flex-direction:row; flex-wrap:wrap;}
#bannerSolo article aside {width:100%; height:800px; background-position:center; background-repeat:no-repeat; background-size:cover; color:white;}

@media only screen and (max-width:800px){#bannerSolo article aside {height:400px;}}

/* Banner Dual
--------------------------------------------------*/
#bannerDual {width:100%; margin-bottom:40px;}

#bannerDual article {display:flex; flex-direction:row; flex-wrap:wrap;}

#bannerDual article aside {width:50%; height:800px;}

#bannerDual article aside:nth-of-type(1) {/* box-shadow:inset 0 0 0 100vmax rgba(0, 0, 0, .5); */ background-position:center; background-repeat:no-repeat; background-size:cover; /* position:relative; */ color:white;}

#bannerDual article aside:nth-of-type(2) {/* box-shadow:inset 0 0 0 100vmax rgba(0, 0, 0, .5); */ background-position:center; background-repeat:no-repeat; background-size:cover; /* position:relative; */ color:white;}

@media only screen and (max-width:800px)
{
	#bannerDual {margin-top:10px;}
	#bannerDual article aside {width:100%; height:400px;}
	#bannerDual article aside:nth-of-type(1) {margin-bottom:4px;}
}

/* Banner Tri
--------------------------------------------------*/
#bannerTri {width:100%; margin-bottom:4px;}

#bannerTri article {display:flex; flex-direction:row; flex-wrap:wrap;}

#bannerTri article aside {width:33.33%; height:800px; background-position:center; background-repeat:no-repeat; background-size:cover; color:white;}

@media only screen and (max-width:1200px)
{
  #bannerTri article aside {width:100%; height:400px;}
  #bannerTri article aside:nth-of-type(1), #bannerTri article aside:nth-of-type(2) {margin-bottom:4px;}
}

/* 
#bannerDual {width:100%;}

#bannerDual article {display:flex; flex-direction:row; flex-wrap:wrap;}

#bannerDual article a {width:50%; height:800px;}

#bannerDual article a:nth-of-type(1) {/* box-shadow:inset 0 0 0 100vmax rgba(0, 0, 0, .5); */ /*background-position:center; background-repeat:no-repeat; background-size:cover; /* position:relative; */ /* color:white;}

#bannerDual article a:nth-of-type(2) {/* box-shadow:inset 0 0 0 100vmax rgba(0, 0, 0, .5); */ /* background-position:center; background-repeat:no-repeat; background-size:cover; /* position:relative; */ /* color:white;}

@media only screen and (max-width:800px)
{
  #bannerDual article a {width:100%; height:400px;}
}
*/

/* brandBanner - 2020
--------------------------------------------------*/
.brandBanner {background:red;}
.brandBanner article {display:flex; flex-direction:row; flex-wrap:wrap;}
.brandBanner article aside {position:;}
.brandBanner article aside:nth-of-type(1) {width:40%; height:; background:;}
.brandBanner article aside:nth-of-type(1) div {position:;}
.brandBanner article aside:nth-of-type(1) div h1 {transform: rotate(-90deg); background:grey;}
.brandBanner article aside:nth-of-type(2) {width:40%; height:600px; background:;}
.brandBanner article aside:nth-of-type(3) {width:20%; height:600px; background:green;}

/* Notification Banner
--------------------------------------------------*/
.notificationBanner {/*height:40px;*/ margin:0 0 -18px 0; padding:0 20%; text-align:center; background:black; color:white;}
.notificationBanner p {padding:10px 0;}

@media only screen and (max-width:800px)
{
	.notificationBanner {margin:10px 0 -18px 0; padding:0 0;}
	.notificationBanner p {font-size:12px;}
}

/* Hero Container Settings
--------------------------------------------------*/
.heroContainer {border-bottom:1px solid #E2E2E2; padding:40px 0 4px 0; margin:0 0 4px 0;}
.heroContainer img {max-width:100%;}

/* Hero Container Settings - V02 */
.heroContainerV02 {display:flex; flex-direction:row; flex-wrap:wrap; height:600px; padding-top:; background:; background-image:linear-gradient(to bottom right, #efefef, #ddd);}
.heroContainerV02 article aside {padding-top:100px;}
.heroContainerV02 article:nth-of-type(1) {width:35%;}
.heroContainerV02 article:nth-of-type(1) aside {margin:10% 0 0 30%;}
.heroContainerV02 article:nth-of-type(2) {width:55%; margin-top:100px; background-image:url("/wp-content/uploads/2020/02/pm_poketrap-house_black.png"); background-repeat:no-repeat; background-position:; background-size:cover;}

.verticalLogoTextDivHeroV02 {z-index:20; position:absolute; /*top:100px;*/ top:0; right:0; padding:60px 28px 0 28px; height:600px; background-image:linear-gradient(#ddd, #efefef);}
.verticalLogoTextDivHeroV02 img {width:50px;}
.verticalLogoTextDivHeroV02 h5 {writing-mode:vertical-rl; text-orientation:mixed; display:flex; margin:10px 0 0 4px;}

@media screen and (max-width:1200px)
{
  .heroContainerV02 article:nth-of-type(1) aside {margin:0 0 0 20%;}
  .heroContainerV02 article:nth-of-type(2) {width:55%; background-position:; background-size:cover;}
  .verticalLogoTextDivHeroV02 {top:0; right:0; padding:60px 28px 0 28px; height:600px; background:none;}
}

@media screen and (max-width:800px)
{
  .heroContainerV02 {height:800px;}
  .heroContainerV02 article aside {padding-top:0;}
  .heroContainerV02 article:nth-of-type(1) {width:90%; height:400px; padding:60px 0 0 5%; background:;}
  .heroContainerV02 article:nth-of-type(1) aside {margin:0 0 0 0; background:;}
  .heroContainerV02 article:nth-of-type(2) {width:100%; height:400px; margin-top:0; background-position:center top; background-size:; background:;}
  .verticalLogoTextDivHeroV02 {top:0; right:0; padding:50px 14px 0 2px; height:auto; background:;}
  .verticalLogoTextDivHeroV02 img {width:40px; margin-left:12px;}
  .verticalLogoTextDivHeroV02 h5 {margin:10px 0 0 12px;}
}

@media screen and (max-width:400px)
{
  .heroContainerV02 {height:740px;}
  .heroContainerV02 article:nth-of-type(1) {width:85%; height:340px; padding:60px 10% 0 5%;}
  .heroContainerV02 article aside h3 {font-size:36px;}
  .heroContainerV02 article aside p {font-size:18px;}
}
/*--------------------------------------------------*/

/*----------------------------------------------------------------------------------------------------
BANNER SETTINGS
----------------------------------------------------------------------------------------------------*/
/*
.bannerFull {padding-top:80px;}
.bannerFull article {width:100%;}
.bannerFull article img {max-width:100%;}
*/

.bannerFull {position:relative;}
.bannerFull div:nth-of-type(1) {position:absolute; text-align:center; text-decoration:none; width:100%; height:; opacity: 0.7; transition:0.5s ease;}
.bannerFull div {}
.bannerFull img {max-width:100%;}
.bannerFull:hover .overlayDark {opacity:1; background:rgba(0,0,0,0.8);}

@media screen and (max-width:800px)
{
  /*
  #banner-two-up {width:90%; margin:60px 5% 0 5%;}
  #banner-two-up article {width:100%;}
  #banner-two-up article:nth-of-type(odd) {margin-right:0;}
  #banner-two-up article:nth-of-type(even) {margin-left:0;}
  */
}

/* Div Auto Slider Indicator - Gamma
*************************/
.mySlidesGamma {display:none}

.slideshow-containerGamma {position:relative; margin:auto; text-align:;}

.prevGamma, .nextGamma {cursor:pointer; position:absolute; top:50%; width:auto; margin-top:-22px; padding:16px; color:white; font-weight:bold; font-size:18px; transition:0.6s ease; border-radius:3px;}

.prevGamma {left:0;}

.nextGamma {right:0;}

.bannerFull:hover .prev, #bannerFull:hover .next {background:rgba(0,0,0,0.8); margin-right:10px; margin-left:10px;}

.dotIndicatorWrapperGamma {position:absolute; bottom:0; margin:0 0 10px 10%; display:inline-block;}

.dotGamma {cursor:pointer; height:8px; width:8px; margin:0 2px; background:#bbb; border-radius:50%; display:inline-block; transition:background-color 0.6s ease;}

.activeGamma, .dot:hover {background:#4FAC52;}

.fadeGamma {animation-name:fade; -webkit-animation-name:fade; animation-duration:1.5s; -webkit-animation-duration:1.5s;}

@keyframes fade
{
  from {opacity:.4}
  to {opacity:1}
}

@-webkit-keyframes fade
{
  from {opacity:.4} 
  to {opacity:1}
}

@media only screen and (max-width:300px) {
  .prevGamma, .nextGamma, .textGamma {font-size:11px}
}

/*----------------------------------------------------------------------------------------------------
.0 BLOG SETTINGS (MAIN TEMPLATE, SINGLE TEMPLATE & SIDEBAR)
----------------------------------------------------------------------------------------------------*/
/* Blog Pagination

#blog-pagination {margin:40px 16% 40px 16%; text-align:center;}
#blog-pagination div {display:inline-block; margin:0 20px 0 20px;}

.blog-pagination a {color:#007FB2; transition:0.5s ease;}
.blog-pagination a:hover {text-decoration:none;}

/* Blog Page

#blogPage {width:80%; padding:100px 0 0 10%; display:inline-block; background:;}
#blogPage a h5 {color:#333; text-decoration:none;}
#blogPage a:hover h5 {color:#007FB2; text-decoration:none !important;}
#blogPage a {color:#007FB2; text-decoration:none;}
#blogPage a:hover {text-decoration:underline;}
#blogPage h6 {color:#333;}
#blogPage article {display:flex; flex-direction:row; flex-wrap:wrap;}
#blogPage article aside {width:48%; margin-top:20px; border-bottom-width:; border-bottom-style:; border-bottom-color:; background:;}
#blogPage article aside div {display:inline-block; vertical-align:top;}
#blogPage article aside img {max-width:100%; height:auto;}
#blogPage article aside p {color:#999;}
#blogPage article aside h5 {margin-top:10px;}
#blogPage article aside:nth-of-type(even) {margin-left:2%;}

@media screen and (max-width:800px)
{
  #blogPage {width:100%; padding:60px 10% 0 10%; background:;}
  #blogPage article aside {width:48%;}
}

@media screen and (max-width:600px)
{
  #blogPage {width:100%; padding:60px 10% 0 10%;}
  #blogPage article aside {width:100%;}
  #blogPage article aside:nth-of-type(even) {margin-left:0;}
}

.textwidget {width: 110%; height: auto; font-size: 20px; font-family: "Graphie"; font-weight: bold; text-align: center; margin: 0px;}
.widgetitle h2 {margin: 0px;}

/* Single Post - 2020

#singlePost {width:40%; margin:100px 2% 40px 20%; display:inline-block; background:; line-height:24px;}
/*
#singlePost article {display:flex; flex-direction:row; flex-wrap:wrap;}
#singlePost article aside {width:50%;}
*/
/*
#singlePost a {text-decoration:none; color:#333; font-weight:bold;}
#singlePost a:hover {text-decoration:; color:red; transition:.2s ease;}

.faAuthor {text-decoration:none; color:#333; font-weight:bold;}
.faAuthor:before {content: "\f007"; font-family: "Font Awesome 6 Free"; font-weight:400; margin-right:5px;}
.faAuthor:hover {text-decoration:line-through; color:#4FAC52; transition:.25s ease;}
.faCategory {text-decoration:none; color:#333; font-weight:bold;}
.faCategory:before {content: "\f07b"; font-family: "Font Awesome 6 Free"; font-weight:400; margin-right:5px;}
.faCategory:hover {text-decoration:line-through; color:#4FAC52; transition:.25s ease;}
/*
.faTag:before {content: "\23"; font-family: "Font Awesome 6 Free"; font-weight: 400; margin-right:5px;}

.faTag {padding:8px; margin-right:5px; background:#CCC; color:#333; text-decoration:none; border-radius:5px; font-size:10pt;}
.faTag:hover {background:#EFEFEF; transition:.25s ease;}
#singlePost p {color:#999;}
#singlePost h5 {margin-top:10px;}
#singlePost img {width:100%; height:auto; margin-bottom:;}

.singlePostContent {line-height:21px; color:#333;}

.blog-figcaption {border-bottom:solid 2px #F1F2F2; /* border-bottom-width:2px; border-bottom-style:solid; border-bottom-color:#F1F2F2;  color:#999; font-size:12px; font-style:italic; text-align:right; text-transform:uppercase; padding-bottom:5px; margin-bottom:10px;}

@media screen and (max-width:800px)
{
  #singlePost {width:60%; margin:60px 20% 40px 20%;}
}

@media screen and (max-width:600px)
{
  #singlePost {width:80%; margin:60px 10% 40px 10%;}
}

/* SideBar - 2020

#sideBar {width:10%; margin:100px 0 60px 0; display:inline-block; vertical-align:top; background:;}
#sideBar ul {list-style-type:none;}
#sideBar li {font-size:16px; margin-bottom:10px;}
#sideBar li a {display:inline-block; /*text-decoration:underline; text-decoration:none; color:#333; transition:all 0.2s;}
#sideBar li a:hover {text-decoration:none; color:#007FB2; cursor:pointer;}
#sideBar li a:active {color:darkgrey; transition:0.0s;}
#sideBar li a:visited {color:#333;}
#sideBar aside h2 {margin:20px 0 6px 0; font-weight:; font-size:24px;}
#s {border:thin solid #007FB2;}

@media screen and (max-width:800px)
{
  #sideBar {width:100%; padding:20px 20%; margin-top:0; border-top-width:2px; border-top-style:solid; border-top-color:#F1F2F2; background:;}
}

@media screen and (max-width:600px)
{
  #sideBar {padding:20px 10%;}
}
*/

/* Blog Bin

#blogBin {width:100%; padding:0 10% 40px 10%; background:; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center;}

#blogBin a h5 {color:#333; text-decoration:none;}
#blogBin a:hover h5 {color:#007FB2; text-decoration:none;}
#blogBin a {color:#007FB2; text-decoration:none;}
#blogBin a:hover {text-decoration:underline;}

#blogBin h6 {color:#333;}

#blogBin section {background:; width:33%; padding:0 2% 0 2%;}

#blogBin section div {width:; background:;}
#blogBin section div img {width:100%; height:auto;}
#blogBin section div p {color:#999;}
#blogBin section div h5 {margin-top:10px;}
#blogBin section div:nth-of-type(even) {margin-left:;}

/*
@media screen and (max-width:1200px)
{
	#blogBin section {width:50%; padding:2%;}
}
*/

/*
@media screen and (max-width:1200px)
{
	#blogBin section {width:100%; padding:0 0 5% 0;}
}
*/

/*----------------------------------------------------------------------------------------------------
.0 WRAPPERS
----------------------------------------------------------------------------------------------------*/
/* Wrapper Eighty
--------------------------------------------------*/
.wrapperEighty {width:80%; margin:40px 10%;}

/* Wrapper Hundred
--------------------------------------------------*/
.wrapperHundred {}

/*----------------------------------------------------------------------------------------------------
.0 COLUMNS
----------------------------------------------------------------------------------------------------*/
/* Fade-In Overlay
--------------------------------------------------*/
.fade-overlay-container {position:relative; width:50%;}

.image {display:block; width:100%; height:auto;}

.overlay {position:absolute; top:0; bottom:0; left:0; right:0; height:100%; width:100%; opacity:0; transition:.5s ease; background:black;}

.fade-overlay-container:hover .overlay {opacity:0.6;}

.text {color:white; position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%); text-align:center;}

.text h1 {font-size:4em; font-weight:bold;}

.text h2 {font-size:3em; font-weight:bold;}

.text h5 {}

.text p {font-size:1.5em;}

@media only screen and (max-width:800px)
{
  .text h1 {font-size:2em;}
  .text h2 {font-size:2em;}
  .text p {display:;}
}

@media only screen and (max-width:400px)
{
  .text h1 {font-size:2em;}
  .text h2 {font-size:1em;}
}

/* Two Column
--------------------------------------------------*/
.two-columns {display:flex; flex-direction:row; flex-wrap:wrap; text-align:center;}
.two-columns aside {width:49%; margin-bottom:2%; /* box-shadow:1px 2px 2px rgba(0, 0, 0, .1); */}
.two-columns aside:nth-of-type(odd) {margin-right:1%;}
.two-columns aside:nth-of-type(even) {margin-left:1%;}
.two-columns img {max-width:100%;}

/* Three Column
--------------------------------------------------*/
.three-columns {display:flex; flex-direction:row; flex-wrap:wrap; text-align:; justify-content:center;}
.three-columns aside{width:32%; margin-bottom:2%; /* box-shadow:1px 2px 2px rgba(0, 0, 0, .1); */}
.three-columns aside:nth-of-type(2) {margin:0 2% 2% 2%;}
.three-columns img {max-width:100%;}

/* THREE COLUMN
--------------------------------------------------*/
.threeColumn {margin:40px 0 40px 0;}
.threeColumn article {display:flex; flex-direction:row; flex-wrap:wrap; text-align:; justify-content:center; }
.threeColumn article a {width:33%; /* padding:2%; */ background:;}
.threeColumn img {width:100%;}

@media screen and (max-width:800px)
{
	.threeColumn article a {width:50%;}
}

/* Four Column
--------------------------------------------------*/
.four-columns {display:flex; flex-direction:row; flex-wrap:wrap; text-align:center;}
.four-columns aside {width:23%; margin-bottom:5%; /* box-shadow:1px 2px 2px rgba(0, 0, 0, .1); */}
.four-columns aside:nth-of-type(2) {margin:0 2%;}
.four-columns aside:nth-of-type(4) {margin-left:2%;}
.four-columns img {max-width:100%;}

/* SIX COLUMN
--------------------------------------------------*/
.sixColumn {margin:40px 0 40px 0;}
.sixColumn article {display:flex; flex-direction:row; flex-wrap:wrap; text-align:; justify-content:center; }
.sixColumn article a {width:16.6%; /* padding:2%; */ background:;}
.sixColumn img {max-width:100%;}

@media screen and (max-width:1200px)
{
	.sixColumn article a {width:33.3%;}
}

@media screen and (max-width:600px)
{
	.sixColumn article a {width:50%;}
}

/* Filter Settings
--------------------------------------------------*/
#filter-container {overflow:hidden; width:100%; height:; padding:20px 0 20px 0; text-align:center; z-index:10!important; background:; }

/* #filter-container {overflow:hidden; width:100%; height:40px; padding:60px 0 0 0; border-top-width:1px; border-top-style:solid; border-top-color:#EBEBEC; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:#EBEBEC; text-align:center; z-index:10!important; background:red;} */

/* Used with JS */
.filterDiv {display:none;}

.show {display:block;}

.filter-container-product {overflow:hidden;}

/* Style the buttons */
.btn {border:none; outline:none; padding:13px 16px; background-color:#f1f1f1; cursor:pointer;}

.btn:hover {background:#ddd;}

.btn.active {background:#666 !important; color:white !important;}
/* End Style the buttons */

.change-view-display-container {display:block; vertical-align:; position:; left:;}

.change-view-display-container img {width:40px; cursor:pointer; margin:0 10px;}

.change-view-display-container img:nth-of-type(1) {display:;}

.filter-buttons {margin-top:20px; position:; right:;}

@media screen and (max-width:800px)
{
  .btn {padding:6px 8px; font-size:12px;}
  .change-view-display-container img {/* width:26px; */}
  .change-view-display-container img:nth-of-type(1) {display:inline-block;}
  .change-view-display-container img:nth-of-type(3) {display:;}
}

/*
FOUR COLUMN FULL
--------------------------------------------------*/
#four-column-full {width:100%; padding:0 0 40px 0; background:;}

#four-column-full a {color:#333; text-decoration:none; background:#EFEFEF; /* background:#F7F7F7; */}

#four-column-full article {display:flex; flex-direction:row; flex-wrap:wrap;}

#four-column-full article a {position:relative; /* display:inline-block; */ width:21%; margin:20px 2% 20px 2%; text-align:center; transition:all 0.2s ease; background:;}

/* 
#four-column-full article a:hover {box-shadow:0px 10px 50px 0px rgba(0,0,0,0.2); margin:-10px 1% 60px 1%;}
*/

#four-column-full img {max-width:100%; margin-bottom:4px;}

#four-column-full p:nth-of-type(1) {font-weight:bold; margin:0 0 4px 0;}

#four-column-full p:nth-of-type(2) {color:#666;}

@media screen and (max-width:1200px)
{
 /* #four-column-full article a {width:50%; padding:20px 2% 20px 2%; margin:0 0 0px 0;} */
 #four-column-full article a {width:46%; margin:20px 2% 20px 2%;}
}

/*--------------------------------------------------

--------------------------------------------------*/
/*
.four-column-full article {display:flex; flex-direction:row; flex-wrap:wrap;}

.four-column-full article aside {width:23%; margin:1%;}

.scale-bin-one {width:25%; background:red;}
*/

/*----------------------------------------------------------------------------------------------------
.0 PRIMARY COLLECTIONS
----------------------------------------------------------------------------------------------------*/
.headerPadding {/*padding-bottom:80px; background:;*/} /* Must exist due to scroll function on Single Product Pages */
.headerBoxSpacing {height:80px; background:;}

@media screen and (max-width:800px)
{
  .headerPadding {/*padding-bottom:50px; background:;*/}
  .headerBoxSpacing {height:40px; background:;}
}

/* Hero Image
--------------------------------------------------*/
.hero-image {/* box-shadow:inset 2000px 0 0 0 rgba(0, 0, 0, 0.7); */ /* box-shadow:inset 0 0 0 100vmax rgba(0, 0, 0, .5); */ height:900px; background-position:center; background-repeat:no-repeat; background-size:cover; position:relative; color:white;}

.hero-text-left {color:white; position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%); text-align:center; /* text-align:left; width:60%; */}

.hero-text-left h5 {text-align:left;}

/*
.hero-text-left {text-align:left; width:60%;}
*/

/*
.hero-text-left {text-align:left; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); color:white;}
*/

.hero-image article {padding:;}

/*
@media only screen and (max-width:1200px)
{
  .hero-text-left {width:80%;}
}

@media only screen and (max-width:800px)
{
  .hero-text-left {text-align:center; width:100%;}
}
*/

/*----------------------------------------------------------------------------------------------------
.0 BRAND PAGE TEMPLATE - VERSION 02
----------------------------------------------------------------------------------------------------*/
.brandPageTemplate-02 {/*background:#20232A;*/ background:#2B2F38;}
.dpBgLeft {background:#20232A !important; /* border-bottom:2px solid #2B2F38 !important; */}
.dpBgLeft p {color:#666;}
.dpBgRight {background:#2B2F38 !important; color:#999 !important; /* border-bottom:2px solid #20232A !important; */}
.dpBgRight p, .dpBgRight li {color:#666;}
.dpBgRightRight {background:#2B2F38 !important;}
.dpBgRightRight h5 {color:black !important;}

/* Brand Page Template - Header (first section)
--------------------------------------------------*/
.brandPageTemplate-02 header {width:100%; height:auto;}

/* Brand Page Template - Sections - (second section)
--------------------------------------------------*/
.brandPageTemplate-02 section {position:relative; margin-bottom:; height:800px; width:;}
.bpt-02-article-01 {position:absolute; width:100%; height:800px; display:flex; flex-direction:row; flex-wrap:wrap;}
.bpt-02-article-01 aside {width:50%;}

.bpt-02-article-01 aside:nth-of-type(1) {background:#20232A; border-bottom:2px solid #2B2F38;}
.bpt-02-article-01 aside:nth-of-type(1) h3 {margin:10% 5% 0 10%; color:#666; width:50%; background:;}
.brandDivLeft {position:absolute; right:; bottom:20%; left:5%; background:; width:25%; /*margin:20% 40% 0 10%;*/ color:#444; line-height:100px;}
.brandDivLeft p {line-height:24px;}
.bpt-02-article-01 aside:nth-of-type(1) a {position:absolute; left:5%; color:#666; bottom:60px; text-decoration:none;}
.brandBarLeft {position:absolute; bottom:40px; width:202px; height:10px; background:#4FAC52;}

.bpt-02-article-01 aside:nth-of-type(2) {background:#2B2F38; border-bottom:2px solid #20232A;}
.bpt-02-article-01 aside:nth-of-type(2) button {position:absolute; top:50%; right:10%;}

/* BPT 02 Aside Two - Div with Vertical logo/img and vertical text */
.verticalLogoTextDiv {z-index:20; position:sticky; /*top:100px;*/ top:60px; right:28px; float:right; /*text-align:right; padding:20px 20px 0 0;*/ color:; background:;}
/*.verticalLogoTextDiv {position:sticky; top:20px; right:20px; width:50px; height:; padding:; text-align:center; vertical-align:center; background:;}*/
.verticalLogoTextDiv img {width:50px; /*position:absolute; right:28px; background:;*/}
.verticalLogoTextDiv h5 {writing-mode:vertical-rl; text-orientation:mixed; display:flex; margin:10px 0 0 4px;}
.verticalLogoTextDiv p {writing-mode:vertical-rl; text-orientation:mixed; display:flex; margin:10px 0 0 4px;}
/*--------------------------------------------------*/

.bpt-02-article-02 {z-index:0; position:absolute; width:100%; height:800px; text-align:center; background:; pointer-events:none;}
.bpt-02-article-02 img {position:relative; max-width:100%; height:800px;}

.bpt-02-exception {height:80px !important;}
.bpt-02-exception aside {border:none !important;}

/* Brand Page Template - Product Gallery/Shirt Filter - (third section)
--------------------------------------------------*/
.brandProductGalleryWrapperDark {background:#20232A;}
.fourColumnFull-DeadPixels p {color:#ccc;}

@media screen and (max-width:1200px)
{
	/*
	.brandPageTemplate-02 section {position:static; margin-bottom:; height:400px; width:;}
	.bpt-02-article-01 {position:; width:100%; height:400px;}
	.bpt-02-article-01 aside {width:100%; height:400px;}
	.bpt-02-article-01 aside:nth-of-type(1) h3 {margin:10% 5% 0 10%;}
	.bpt-02-article-01 aside:nth-of-type(1) a {position:; left:5%; bottom:60px;}
	.bpt-02-article-01 aside:nth-of-type(1) div {position:; bottom:40px; width:202px;}
	.bpt-02-article-01 aside:nth-of-type(2) button {position:; top:0; right:0;}
	.bpt-02-article-02 {z-index:0; position:static; width:100%; height:400px; background:;}
	.bpt-02-article-02 img {position:absolute; max-width:100%; height:400px;}
	*/
}

@media screen and (max-width:900px)
{
	.brandPageTemplate-02 section {position:static; height:auto;}
	.bpt-02-article-01 {position:static; width:100%; height:auto;}
	.bpt-02-article-01 aside {width:;}
	.bpt-02-article-01 aside:nth-of-type(1) {padding:20px 0 20px 0; width:100%; height:auto; text-align:;  border-bottom:none; background:#2B2F38;}
	.bpt-02-article-01 aside:nth-of-type(1) h3 {width:90%; margin:0% 5% 20px 5%; font-size:36px; text-align:center;}
	.brandDivLeft {position:static; bottom:0; left:0; width:0; display:none;}
	.bpt-02-article-01 aside:nth-of-type(1) a {position:static; padding:; margin:0 0 0 94px;}
	.brandBarLeft {position:static; margin:10px 0 0 0;}
	.bpt-02-article-01 aside:nth-of-type(2) {width:100%; height:auto; text-align:center; border-bottom:none;}
	.bpt-02-article-01 aside:nth-of-type(2) button {position:static; margin:20px 0 0 0;}
	.bpt-02-article-02 {z-index:30; position:static; width:100%; height:auto; text-align:center; background:#2B2F38; border-bottom:2px solid #20232A;}
	.bpt-02-article-02 img {position:static; height:auto;}
	
	.verticalLogoTextDiv h5 {margin:10px 0 0 0; display:none;}
	.verticalLogoTextDiv p {margin:10px 0 0 0; display:none;}
	
	.bpt-02-exception {height:0 !important; background:red !important;}
}

@media screen and (max-width:800px)
{
	.verticalLogoTextDiv {position:sticky; top:50px; right:14px;}
	.verticalLogoTextDiv img {width:40px;}
}

@media screen and (max-width:600px)
{
	.bpt-02-article-01 aside:nth-of-type(1) {text-align:center;}
	.bpt-02-article-01 aside:nth-of-type(1) a {position:static; margin:0;}
	.brandBarLeft {position:static; bottom:0px; width:160px; height:5px; margin:10px auto 0 auto;}
}

/* Classes to change background colors of the Brand Page Template */
.bpt-02-Grey aside:nth-of-type(1) {background:#efefef !important; border-bottom:2px solid white !important;}
.bpt-02-White aside:nth-of-type(2) {background:white !important; border-bottom:2px solid #EFEFEF !important;}
.brandProductGalleryWrapperWhite {background:white;}

@media screen and (max-width:900px)
{
	.bpt-02-Grey aside:nth-of-type(1) {border-bottom:2px solid #EFEFEF !important;}
	.bpt-02-White aside:nth-of-type(2) {background:#EFEFEF !important;}
	.bpt-02-GreyTwo {background:#EFEFEF;}
	.bpt-02-WhiteBorder {border-bottom:2px solid white;}
}
/*--------------------------------------------------*/

/*----------------------------------------------------------------------------------------------------
SINGLE PRODUCT SETTINGS
----------------------------------------------------------------------------------------------------*/
/* Single Product Settings
--------------------------------------------------*/
.single-product {width:100%; padding:0 0 0 0;}

.single-product article {display:flex; flex-direction:row; flex-wrap:wrap;}

.single-product article aside {}

.single-product article aside:nth-of-type(1) {}

.single-product article aside:nth-of-type(2) {}

.single-product article aside:nth-of-type(3) {}

@media screen and (max-width:800px)
{
  .single-product {width:100%; padding:0 5% 0 5%;}
}

/* Related Product Settings
--------------------------------------------------*/
/*
.lobster {padding:10px 0 10px 0; border-top-width:1px; border-top-style:solid; border-top-color:#E2E2E2; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:#E2E2E2; margin-bottom:20px; color:#333; text-align:center; font-family:'Lobster', cursive; font-size:38px; font-weight:normal; line-height:48px;}
.lobsterDp {padding:10px 0 10px 0; border-top:1px solid #2B2F38; border-bottom:1px solid #2B2F38; margin-bottom:20px; color:#666; text-align:center; font-family:'Lobster', cursive; font-size:38px; font-weight:normal; line-height:48px;}
*/

.lobster {padding:20px 0 0 0; color:#333; text-align:center; font-size:38px; font-weight:normal; line-height:48px;}
.lobsterDp {padding:20px 0 0 0; color:#666; text-align:center; font-size:38px; font-weight:normal; line-height:48px;}

.related-products {margin:40px 0;}

.related-products img {width:100%;}

.related-products article {display:flex; flex-direction:row; flex-wrap:wrap;}

.related-products article a {width:25%; padding:20px 2%;}

@media screen and (max-width:800px)
{
  .related-products article a {width:46%; padding:20px 2%;}
}

/* SingleProduct / SingleProductWrapper
--------------------------------------------------*/
.singleProduct {}

.singleProductWrapper {width:100%; padding:;}

.singleProductWrapper article {display:flex; flex-direction:row; flex-wrap:wrap;}

.singleProductWrapper article aside {height:; background:; padding:;}

.singleProductWrapper article aside:nth-of-type(1) {width:50%; padding:80px 0 0 0; background:#efefef; position:relative;}

.singleProductWrapper article aside:nth-of-type(2) {width:45%; padding:80px 5% 40px 5%; /*padding:5% 5% 5% 5%;*/ background:;}

/* .singleProductWrapper article aside:nth-of-type(2) div {margin-top:40px;} */

.singleProductWrapper article aside:nth-of-type(2) div ul {list-style-position:inside; line-height:2em; padding:0 0 20px 0;}

.singleProductWrapperPrice {font-size:2em; color:#333;}

.sizeGuide {display:inline-block; text-decoration:underline; color:#333; cursor:pointer; background:;}
.shippingTerms {display:inline-block; text-decoration:underline; color:#333; cursor:pointer; background:;}

/*
.buyButtonWrapperSpp {display:flex; flex-direction:row; width:100%;}
.buyButtonWrapperSpp div {display:flex; flex-direction:row; max-width:400px !important; background:;}
.buyButtonWrapperSpp {display:flex; flex-direction:row; width:100%;}
.buyButtonWrapperSpp div iframe {width:100%; background:red;}
.shopify-buy__btn {float:right; background:black !important;}
.shopify-buy__layout-vertical .shopify-buy__btn:first-child, .shopify-buy__layout-horizontal .shopify-buy__btn:first-child {
    margin-top: 200px;
}
*/

.singleProductWrapper article aside:nth-of-type(3) {position:relative; width:5%; padding:60px 30px 40px 0; text-align:center; vertical-align:center; background:;}
.singleProductWrapper article aside:nth-of-type(3) a {background:;}
.singleProductWrapper article aside:nth-of-type(3) img {width:50px; position:absolute; right:28px; background:;}
.singleProductWrapper article aside:nth-of-type(3) h5 {writing-mode:vertical-rl; text-orientation:mixed; display:flex; margin:60px auto 0 auto; position:absolute; right:35px; color:#333; background:;}

#relatedProductsSpp {/* padding-top:80px; */}

/*
.singleProductWrapperFooter {width:100%; position:absolute; bottom:0; padding:2% 40px; background:;}
*/

/*
.thumbNavSpp {position:fixed; right:38px; bottom:60px; z-index:50; width:30px;}
.thumbNavSpp article {display:flex; flex-direction:column; flex-wrap:wrap;}
.thumbNavSpp article a {width:30px; height:30px; margin-bottom:20px; border-radius:30px; background:rgba(0,0,0, 0.2); transition:0.4s;}
.thumbNavSpp article a:hover {background:rgba(79,172,82,1);}
.thumbNavSpp article a:active, .thumbNavSpp article a:focus {background:rgba(79,172,82,1);}
.thumbNavSpp article a:nth-of-type(2) {display:none;}
*/

/* Vertical Slate Thumbnail */
.thumbNavSpp {position:fixed; right:48px; bottom:80px; z-index:50; width:10px;}
.thumbNavSpp article {display:flex; flex-direction:column; flex-wrap:wrap;}
.thumbNavSpp article a {width:10px; height:40px; margin-bottom:10px; background:rgba(0,0,0, 0.2); transition:0.4s;}
.thumbNavSpp article a:hover {background:rgba(79,172,82,1);}
.thumbNavSpp article a:active, .thumbNavSpp article a:focus {background:rgba(79,172,82,1);}
.thumbNavSpp article a:nth-of-type(2) {display:none;}

@media only screen and (max-width:1000px)
{
  .singleProductWrapper article aside {height:auto; text-align:center;}
  .singleProductWrapper article aside:nth-of-type(1) {width:100%; padding:80px 5% 20px 5%; order:2;}
  
  .singleProductWrapper article aside:nth-of-type(2) {width:100%; padding:40px 5% 40px 5%; order:3;}
  .buyButtonWrapperSpp {display:flex; justify-content:center;}
  
  .singleProductWrapper article aside:nth-of-type(3) {display:none;}
  .singleProductWrapper article aside:nth-of-type(3) {position:static; width:100%; padding:80px 5% 0 5%; order:1; background:#efefef;}
  .singleProductWrapper article aside:nth-of-type(3) img {position:static; display:block; text-align:center; margin:0 auto 0 auto; background:;}
  .singleProductWrapper article aside:nth-of-type(3) h5 {writing-mode:horizontal-tb; display:inline-block; padding:0; margin-top:10px; position:static; background:;}
  
  .thumbNavSpp {bottom:80px;}
  .thumbNavSpp article a:nth-of-type(2) {display:block;}

	.dpBgRightRight {background:#20232A !important;}
}

@media only screen and (max-width:800px)
{
   /*
  .thumbNavSpp {right:22px; bottom:; width:20px;}
  .thumbNavSpp article a {width:20px; height:20px; margin-bottom:20px; border-radius:20px;}
  */
  .thumbNavSpp article a {width:; height:; margin-bottom:;}
  
  .thumbNavSpp {right:20px; bottom:60px;}
}

@media only screen and (max-width:400px)
{
  .singleProductWrapper article aside:nth-of-type(1) {padding:50px 5% 20px 5%;}
  .singleProductWrapper article aside:nth-of-type(2) h3 {font-size:3em;}
  .singleProductWrapper article aside:nth-of-type(2) ul {text-align:left; padding:0 0 20px 10% !important; background:;}
}

/* productDetailsHome
--------------------------------------------------*/
.productDetailsHome {width:;}

.productDetailsHome ul {list-style-position:inside; line-height:2em; padding:0 0 20px 0; width:;}

@media only screen and (max-width:1200px)
{
  .productDetailsHome {display:none;}
}

/*----------------------------------------------------------------------------------------------------
SHIPPING TERMS SETTINGS
----------------------------------------------------------------------------------------------------*/
/*
#shipping-terms {width:100%; padding:40px 20%  80px 20%;}
#shipping-terms article {display:flex; flex-direction:row; flex-wrap:wrap;}
#shipping-terms article aside {/* margin-top:40px; */ /* }
#shipping-terms article aside p {/* margin-top:10px; */ /* line-height:24px;}

@media only screen and (max-width:800px)
{
  #shipping-terms {width:100%; padding:40px 10%  80px 10%;}
}
*/

/*----------------------------------------------------------------------------------------------------
.0 ACCORDION
----------------------------------------------------------------------------------------------------*/
/* Accordion Primary Collections
--------------------------------------------------*/
/*
.accordionPrimaryCollections {background:black; color:#ccc; cursor:pointer; width:100%; border:none; text-align:left; outline:none; font-size:; transition:0.4s; border-top-width:2px; border-top-style:solid; border-top-color:#333; position:relative; background-repeat:no-repeat;}

.accordionPrimaryCollections div {padding:2%; width:; background-position:right; background-repeat:no-repeat; background-size:50%;}

.accordionPrimaryCollections div {background:;}

.accordionPrimaryCollections p {font-size:21px;}

.activePrimaryCollections, .accordionPrimaryCollections:hover {background:#111;}

.accordionPrimaryCollections:after {content:'\002B'; color:#ccc; font-weight:bold; float:right; font-size:48px; background:; position:absolute; top:0; right:0; padding:2% 2%;}

.activePrimaryCollections:after {content:"\2212";}

.panelPrimaryCollections {padding:0 0; background:white; max-height:0; overflow:hidden; transition:max-height 0.4s ease-out;}

.panelPrimaryCollections img {max-width:100%;}

.panelPrimaryCollectionsGreen {background:#4FAC52; color:white;}
.panelPrimaryCollectionsBlack {background:black; color:;}
.panelPrimaryCollectionsWhite {background:white; color:;}

@media only screen and (max-width:800px)
{
  .accordionPrimaryCollections:after {font-size:32px; top:0; right:0;}
  .accordionPrimaryCollections div {padding:2% 5%; background-position:top; background-image:none;}
  .accordionPrimaryCollections p {display:none;}
}

@media only screen and (max-width:400px)
{
  .accordionPrimaryCollections:after {font-size:24px; top:10%; right:0;}
  .accordionPrimaryCollections div {padding:5%;}
  .accordionPrimaryCollections h5 {font-size:1.5em;}
}
*/

/* Primary Collections Panel Left
--------------------------------------------------*/
/*
.panelPrimaryCollectionsLeft article {display:flex; flex-direction:row; flex-wrap:wrap;}

.panelPrimaryCollectionsLeft aside {height:600px;}

.panelPrimaryCollectionsLeft aside:nth-of-type(1) {width:33.33%;}

.panelPrimaryCollectionsLeft aside:nth-of-type(2) {width:33.33%; background-position:center; background-repeat:no-repeat; background-size:contain; position:relative;}

.panelPrimaryCollectionsLeft aside:nth-of-type(3) {width:33.33%; background-position:center; background-repeat:no-repeat; background-size:contain; position:relative;}

.panelPrimaryCollectionsVerbiage {padding:10%;}
.panelPrimaryCollectionsVerbiage h5 {margin-bottom:20px;}
.panelPrimaryCollectionsVerbiage p {margin-bottom:20px;}

.panelPrimaryCollectionsVerbiageBlack {background:black; color:white; height:600px;}
.panelPrimaryCollectionsVerbiageWhite {background:white; color:black; height:600px;}

@media only screen and (max-width:1400px)
{
  .panelPrimaryCollectionsLeft aside:nth-of-type(1) {width:50%; order:1;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(2) {width:50%; order:2;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(3) {order:3;display:none;}
}

@media only screen and (max-width:800px)
{
  .panelPrimaryCollectionsLeft aside {}
  .panelPrimaryCollectionsLeft aside {height:500px; width:100%;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(1) {height:100px; width:100%; order:3;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(2) {background-position:top; background-size:cover; width:100%; order:1;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(3) {background-position:top; background-size:cover; width:100%; order:2; display:block;}
  .panelPrimaryCollectionsVerbiage {padding:5%;}
  .panelPrimaryCollectionsVerbiage h5, .panelPrimaryCollectionsVerbiage p {display:none;}
  .panelPrimaryCollectionsVerbiageBlack {height:500px;}
  .panelPrimaryCollectionsVerbiageWhite {height:500px;}
}

@media only screen and (max-width:400px)
{  
  .panelPrimaryCollectionsLeft aside:nth-of-type(3) {order:2; display:none;}
  .panelPrimaryCollectionsVerbiageBlack {height:200px;}
  .panelPrimaryCollectionsVerbiageWhite {height:200px;}
}
*/

/* Primary Collections Panel Right
--------------------------------------------------*/
/*
.panelPrimaryCollectionsRight article {display:flex; flex-direction:row; flex-wrap:wrap;}

.panelPrimaryCollectionsRight aside {height:600px;}

.panelPrimaryCollectionsRight aside:nth-of-type(1) {width:33.33%; background-position:center; background-repeat:no-repeat; background-size:contain; position:relative;}

.panelPrimaryCollectionsRight aside:nth-of-type(2) {width:33.33%; background-position:center; background-repeat:no-repeat; background-size:contain; position:relative;}

.panelPrimaryCollectionsRight aside:nth-of-type(3) {width:33.33%;}

@media only screen and (max-width:1400px)
{
  .panelPrimaryCollectionsRight aside:nth-of-type(1) {order:1; display:none;}
  .panelPrimaryCollectionsRight aside:nth-of-type(2) {width:50%; order:2;}
  .panelPrimaryCollectionsRight aside:nth-of-type(3) {width:50%; order:3;}
}

@media only screen and (max-width:800px)
{
  .panelPrimaryCollectionsRight aside {height:500px; width:100%;}
  .panelPrimaryCollectionsRight aside:nth-of-type(1) {background-position:top; background-size:cover; width:100%; order:2; display:block;}
  .panelPrimaryCollectionsRight aside:nth-of-type(2) {background-position:top; background-size:cover; width:100%; order:1;}
  .panelPrimaryCollectionsRight aside:nth-of-type(3) {height:100px; width:100%; order:3;}
}

@media only screen and (max-width:400px)
{
  .panelPrimaryCollectionsRight aside:nth-of-type(1) {order:2; display:none;}
}
*/

/*----------------------------------------------------------------------------------------------------
.2 ACCORDION
----------------------------------------------------------------------------------------------------*/
/* Accordion Primary Collections
--------------------------------------------------*/
.accordionPrimaryCollections {background:black; color:#ccc; cursor:pointer; width:100%; border:none; text-align:left; outline:none; font-size:; transition:0.4s; border-top-width:2px; border-top-style:solid; border-top-color:#333; position:relative; background-repeat:no-repeat;}

.accordionPrimaryCollections div {padding:2%; width:; background-position:right; background-repeat:no-repeat; background-size:50%;}

.accordionPrimaryCollections div {background:;}

.accordionPrimaryCollections p {font-size:21px;}

.activePrimaryCollections, .accordionPrimaryCollections:hover {background:#111;}

.accordionPrimaryCollections:after {content:'\002B'; color:#ccc; font-weight:bold; float:right; /* margin-left:5px; */ font-size:48px; background:; position:absolute; top:0; right:0; padding:2% 2%;}

.activePrimaryCollections:after {content:"\2212";}

.panelPrimaryCollections {padding:0 0; background:white; max-height:0; overflow:hidden; transition:max-height 0.4s ease-out;}

.panelPrimaryCollections img {max-width:100%;}

.panelPrimaryCollectionsGreen {background:#4FAC52; color:white;}
.panelPrimaryCollectionsBlack {background:black; color:;}
.panelPrimaryCollectionsWhite {background:white; color:;}

@media only screen and (max-width:800px)
{
  .accordionPrimaryCollections:after {font-size:32px; top:0; right:0;}
  .accordionPrimaryCollections p {display:none;}
}

@media only screen and (max-width:400px)
{
  .accordionPrimaryCollections:after {font-size:24px; top:10%; right:0;}
  .accordionPrimaryCollections div {padding:5%;}
  .accordionPrimaryCollections h5 {font-size:1.5em;}
}

/* Primary Collections Panel Left
--------------------------------------------------*/
.panelPrimaryCollectionsLeft article {display:flex; flex-direction:row; flex-wrap:wrap;}

.panelPrimaryCollectionsLeft aside {width:33.33%;}

.panelPrimaryCollectionsVerbiage {padding:10%; height:100%;}
.panelPrimaryCollectionsVerbiage h5, p {margin-bottom:20px;}

.panelPrimaryCollectionsVerbiageBlack {background:black; color:white;}
.panelPrimaryCollectionsVerbiageWhite {background:white; color:black;}

@media only screen and (max-width:1400px)
{
  .panelPrimaryCollectionsLeft aside {width:50%;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(1) {order:1;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(2) {order:2;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(3) {order:3;display:none;}
}

@media only screen and (max-width:800px)
{
  .panelPrimaryCollectionsLeft aside {width:100%;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(1) {order:3;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(2) {order:1;}
  .panelPrimaryCollectionsLeft aside:nth-of-type(3) {order:2; display:block;}
  .panelPrimaryCollectionsVerbiage {padding:5%;}
  .panelPrimaryCollectionsVerbiage h5, .panelPrimaryCollectionsVerbiage p {display:none;}
}

@media only screen and (max-width:400px)
{  
  .panelPrimaryCollectionsLeft aside:nth-of-type(3) {order:2; display:none;}
}

/* Primary Collections Panel Right
--------------------------------------------------*/
.panelPrimaryCollectionsRight article {display:flex; flex-direction:row; flex-wrap:wrap;}

.panelPrimaryCollectionsRight aside {width:33.33%;}

@media only screen and (max-width:1400px)
{
  .panelPrimaryCollectionsRight aside {width:50%;}
  .panelPrimaryCollectionsRight aside:nth-of-type(1) {order:1; display:none;}
  .panelPrimaryCollectionsRight aside:nth-of-type(2) {order:2;}
  .panelPrimaryCollectionsRight aside:nth-of-type(3) {order:3;}
}

@media only screen and (max-width:800px)
{
  .panelPrimaryCollectionsRight aside {width:100%;}
  .panelPrimaryCollectionsRight aside:nth-of-type(1) {order:2; display:block;}
  .panelPrimaryCollectionsRight aside:nth-of-type(2) {order:1;}
  .panelPrimaryCollectionsRight aside:nth-of-type(3) {order:3;}
}

@media only screen and (max-width:400px)
{
  .panelPrimaryCollectionsRight aside:nth-of-type(1) {order:2; display:none;}
}

/*----------------------------------------------------------------------------------------------------
VIDEO SETTINGS
----------------------------------------------------------------------------------------------------*/
/* Aspect Ration Video Wrapper */
.video-wrapper {position:relative; padding-bottom:56.25%; /* 16:9 */ padding-top:25px; height:0;}

.video-wrapper iframe {position:absolute; top:0; left:0; width:100%; height:100%;}

/* Standard Video Wrapper */
.video-wrapper-standard {width:100%; height:100%;}

/*----------------------------------------------------------------------------------------------------
.0 FONTS
----------------------------------------------------------------------------------------------------*/
/* Google Fonts
--------------------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Zhi+Mang+Xing&display=swap');
.font-zhiMang {font-family: 'Zhi Mang Xing', cursive;}

@import url('https://fonts.googleapis.com/css?family=Bebas+Neue&display=swap');
.font-bebasNeue {font-family: 'Bebas Neue', cursive; font-weight:normal; /* text-transform: uppercase; */}

/* Font Faces
--------------------------------------------------*/
@font-face {font-family:brushlie; src:url(/wp-content/themes/basurastudio/fonts/brushlie.otf); font-weight:bold;}
.font-brushlie {font-family:'brushlie';}

@font-face {font-family:Webrush; src:url(/wp-content/themes/basurastudio/fonts/Webrush.ttf); font-weight:bold;}
.font-webrush {font-family:'Webrush';}

@font-face {font-family:Brushield; src:url(/wp-content/themes/basurastudio/fonts/Brushield.ttf); font-weight:bold;}
.font-brushield {font-family:'Brushield';}

@font-face {font-family:GhostBrush; src:url(/wp-content/themes/basurastudio/fonts/GhostBrush.ttf); font-weight:bold;}
.font-ghostbrush {font-family:'GhostBrush';}

/*----------------------------------------------------------------------------------------------------
.0 BINS
----------------------------------------------------------------------------------------------------*/
/* Quote Bin
--------------------------------------------------*/
.quoteBin {width:100%; padding:80px 10%; background:#111; color:#ccc; text-align:center;}

@media only screen and (max-width:800px)
{
  .quoteBin h4 {font-size:36px;}
  .quoteBin h5 {font-size:24px;}
}

/* Elfsight Instagram Bin
--------------------------------------------------*/
.binElfsightInstagram {margin-bottom:4px;}

/*----------------------------------------------------------------------------------------------------
.0 BUTTONS
----------------------------------------------------------------------------------------------------*/
.bttn {width:200px; height:50px; border:none; font-size:1em; font-weight:bold; transition:0.4s;}
.bttn-right {float:right;}
.bttn-left {float:left;}
.bttn-wide-center {width:100%;}

.black-bttn {background:black; color:white; transition:0.4s; cursor:pointer;}
.black-bttn:hover {/*background:#222222;*/ background:#4FAC52;}
.black-bttn-plain {width:200px; height:50px; border:none; font-size:1em; font-weight:bold; transition:0.4s; background:red; color:black; transition:0.4s; cursor:pointer;}
.black-bttn-plain:hover {margin-right:5px;}

.green-bttn {background:#4FAC52; /* background:#DC5E69; */ color:white; cursor:pointer;}
.green-bttn:hover {background:#DC5E69;}
/*
.green-bttn:hover {background:rgba(0,0,0, 0.2);}
*/

.pink-bttn {background:#DC5E69; color:white; transition:0.4s; cursor:pointer;}
.pink-bttn:hover {background:;}

.white-bttn {background:white; color:black; cursor:pointer; margin-left:20px;}
.white-bttn:hover {background:#cccccc;}
.white-bttn-two {background:white; color:black; transition:0.4s; cursor:pointer;}
.white-bttn-two:hover {background:#cccccc;}

.white-bttn-three {background:white; color:black; transition:0.4s; cursor:pointer;}
.white-bttn-three:hover {background:#DC5E69; color:white;}

.bttnOutline {display:inline-block; padding:10px; border:medium solid black; margin-top:; color:black; font-size:14px; text-decoration:none; cursor:pointer; transition:all 0.2s ease;}

.bttnOutline:hover {border:medium solid #7AC143; background:#7AC143; color:white;}

@media only screen and (max-width:800px)
{
  .white-bttn {margin-left:0; margin-top:20px;}
  /*
  .bttn-right {float:none; margin:0 auto; display:block;}
  .bttn-left {float:none; margin:0 auto; display:block;}
  */
  /*
  .bttn-right {float:right; position:relative; left:-50%; /* or right 50% */ /* text-align:left;
  */
}

/*----------------------------------------------------------------------------------------------------
.0 MODALS
----------------------------------------------------------------------------------------------------*/
/* Modal - First
--------------------------------------------------*/
/*
.modal {display:none; position:fixed; z-index:100; padding-top:100px; left:0; top:0; width:100%; height:100%; overflow:auto; background:rgb(0,0,0); background:rgba(0,0,0,0.8);}

.modal-content {position:relative; background:#fefefe; margin:auto; padding:20px; border:1px solid #888; width:500px; box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); -webkit-animation-name:animatetop; -webkit-animation-duration:0.4s; animation-name:animatetop; animation-duration:0.4s; text-align:;}

.modal-content img {max-width:100%;}

@-webkit-keyframes animatetop 
{
  from {top:-300px; opacity:0;} 
  to {top:0; opacity:1;}
}

@keyframes animatetop
{
  from {top:-300px; opacity:0;}
  to {top:0; opacity:1;}
}

.close {color:#aaaaaa; float:right; font-size:28px; font-weight:bold;}

.close:hover, .close:focus {color:#000; text-decoration:none; cursor:pointer;}

@media only screen and (max-width:800px)
{
  .modal {padding-top:80px;}
  .modal-content {width:80%;}
}

/* Modal - Second
--------------------------------------------------*/
/*
.modalSecond {display:none; position:fixed; z-index:1; padding-top:100px; left:0; top:0; width:100%; height:100%; overflow:auto; background:rgb(0,0,0); background:rgba(0,0,0,0.8);}

.modal-contentSecond {position:relative; background:#fefefe; margin:auto; padding:20px; border:1px solid #888; width:500px; box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); -webkit-animation-name:animatetop; -webkit-animation-duration:0.4s; animation-name:animatetop; animation-duration:0.4s; text-align:center;}

.modal-contentSecond img {max-width:100%;}

@-webkit-keyframes animatetop 
{
  from {top:-300px; opacity:0;} 
  to {top:0; opacity:1;}
}

@keyframes animatetop
{
  from {top:-300px; opacity:0;}
  to {top:0; opacity:1;}
}

.closeSecond {color:#aaaaaa; float:right; font-size:28px; font-weight:bold;}

.closeSecond:hover, .closeSecond:focus {color:#000; text-decoration:none; cursor:pointer;}

@media only screen and (max-width:800px)
{
  .modalSecond {padding-top:80px;}
  .modal-contentSecond {width:80%;}
}
*/

/*----------------------------------------------------------------------------------------------------
.0 SLIDESHOWS
----------------------------------------------------------------------------------------------------*/
/* Slideshow Gallery - Alpha
--------------------------------------------------*/
#ssg-alpha-wrapper {margin:0 0 4px 0; padding-top:0; background:;}
#ssg-alpha-wrapper img {/* vertical-align:middle; */ max-width:100%; background:;}

.container-ssg-alpha {position:relative; display:flex; flex-direction:row; flex-wrap:wrap;} /* Position the image container (needed to position the left and right arrows) */

.container-ssg-alpha aside {vertical-align:top; background:;}

.container-ssg-alpha aside:nth-of-type(1) {width:100%; background:;}

.container-ssg-alpha aside:nth-of-type(2) {z-index:10; position:absolute; /* right:48px; */ right:48px; bottom:80px; background:;}
.container-ssg-alpha aside:nth-of-type(2) div div {width:10px; height:40px; margin-bottom:10px; background:rgba(0,0,0, 0.2); transition:0.4s;}
.container-ssg-alpha aside:nth-of-type(2) div div:hover {background:rgba(79,172,82,1);}
/*
.container-ssg-alpha aside:nth-of-type(2) div div:active, .container-ssg-alpha aside:nth-of-type(2) div div:focus {background:rgba(79,172,82,1);}
*/

.mySlidesAlpha {display:none;} /* Hide the images by default */

.mySlidesAlpha section {display:flex; flex-direction:row; flex-wrap:wrap;}

.mySlidesAlpha section div {/* width:50%; */}

.mySlidesAlpha section div:nth-of-type(1) {position:relative; width:50%; background:white;}
.mySlidesAlpha section div:nth-of-type(1) img {display:block; margin:0 auto 0 auto;}

.mySlidesAlpha section div:nth-of-type(2) {padding:10% 10% 0 5%; width:50%;}
.mySlidesAlpha section div:nth-of-type(2) img, p, h3 {margin-bottom:20px;}

.colorOverlayAlpha {width:50%; height:100%; background:rgba(79, 172, 82, 1); mix-blend-mode:multiply; z-index:10; display:; position:absolute; transition:0.4s;}

.mySlidesAlpha section div:nth-of-type(1):hover > .colorOverlayAlpha {width:20%; transition:0.4s;}

.mySlidesAlpha section div img {padding-top:;}

.hoverMe {/* text-align:center; */ margin-left:52%; font-style:italic; font-size:14px; margin-bottom:20px;}

.cursor {cursor:pointer;} /* Add a pointer when hovering over the thumbnail images */

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

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

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

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

.caption-container {text-align:center; background:#222; padding:2px 16px; color:white;} /* Container for image text */

/*
.rowAlpha {width:48px; padding:20px 0 20px 20x !important; background:white; opacity:;}

.columnAlpha {padding:20px 0 20px 20x !important; background:;}
*/

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

/* .column {float:left; width:16.666%;} Can use for mobile to place thumbnail aside underneath first aside */ /* Six columns side by side */

.demoAlpha {opacity:0.6; width:;} /* Add a transparency effect for thumnbail images */

.activeAlpha, .demoAlpha:hover {opacity:1;}

.activeAlpha {background:rgba(79,172,82,1) !important;}

@media only screen and (max-width:1400px)
{
  .container-ssg-alpha aside:nth-of-type(2) {padding-top:10%;}
  .mySlidesAlpha section div:nth-of-type(2) h3 {font-size:3em;}
  .mySlidesAlpha section div:nth-of-type(2) {padding:5% 10% 5% 5%;}
  .mySlidesAlpha section div:nth-of-type(2) img {width:50px;}
  .hoverMe {text-align:center; margin-left:0;}
  .demoAlpha {/* padding:10px; */}
}

@media only screen and (max-width:800px)
{
  .container-ssg-alpha aside:nth-of-type(1) {width:100%; text-align:;}
  .container-ssg-alpha aside:nth-of-type(2) {/* width:100%; padding-top:0; border-left-width:thin; border-left-style:solid; border-left-color:#ccc; position:relative; */  top:600px; right:20px; bottom:clear; background:;}
  .mySlidesAlpha section div {width:100%;}
  .mySlidesAlpha section div:nth-of-type(1) {width:100%;}
  .mySlidesAlpha section div:nth-of-type(2) {width:100%; padding:20px 5% 5% 5%; text-align:center; background:;}
  .mySlidesAlpha section div:nth-of-type(2) img {padding-top:0;}
  .mySlidesAlpha section div:nth-of-type(2) p {text-align:left;}
  
  .prevAlpha, .nextAlpha {top:20%; margin-top:-50px;}
  .nextAlpha {right:0;}

  .colorOverlayAlpha {display:none;}
  .rowAlpha {/* display:flex; flex-direction:row; flex-wrap:wrap; */}
  .columnAlpha {/* width:25%; */}
  .activeAlpha {/* border-left-width:thin; border-left-style:solid; border-left-color:#ccc; border-right-width:thin; border-right-style:solid; border-right-color:#ccc; */ 
  /* border-left:none; border-right:none; border-top-width:4px; border-top-style:solid; border-top-color:#4FAC52; border-bottom:none; */}
  .buyButtonWrapper {display:flex; justify-content:center;}
}

@media only screen and (max-width:600px)
{
  .container-ssg-alpha aside:nth-of-type(2) {top:400px;}
}

@media only screen and (max-width:400px)
{
  /*
  .mySlidesAlpha section div:nth-of-type(2) p {margin-left:10%;}
  */
  .mySlidesAlpha section div:nth-of-type(1) {margin-bottom:0; background:white;}
   /*
  .mySlidesAlpha section div:nth-of-type(2) a, .mySlidesAlpha section div:nth-of-type(2) h3, .mySlidesAlpha section div:nth-of-type(2) p {display:none;}
  */
  .mySlidesAlpha section div:nth-of-type(2) img, h3 {margin-bottom:10px;}
  .mySlidesAlpha section div:nth-of-type(2) img {padding-top:0;}
  .mySlidesAlpha section div:nth-of-type(2) h3 {font-size:2em;}
  .mySlidesAlpha section div:nth-of-type(2) p {display:none;}

  .container-ssg-alpha aside:nth-of-type(2) {top:300px;}
  /*
  .container-ssg-alpha aside:nth-of-type(2) {width:5%; height:200px; border-left:; z-index:100; position:absolute; right:40px; bottom:100px; padding:10px; background:red;}
  .container-ssg-alpha aside:nth-of-type(2) img {display:;}
  */
}

/* Slideshow Gallery - Beta
--------------------------------------------------*/
/* img {vertical-align: middle;} */

.containerBeta {position:relative; display:flex; flex-direction:row; flex-wrap:wrap;} /* Position the image container (needed to position the left and right arrows) */

.containerBeta section:nth-of-type(1) {/* width:15%; */ width:100%; padding:0 5% 0 5%; text-align:center; /* padding:100px 0 0 40px; */}

.containerBeta section:nth-of-type(2) {/* width:80%; */ width:100%; padding:0 5% 0 5%; /* margin-left:5%; */}

/* .containerBeta section:nth-of-type(3) {width:10%; background:;} */

.mySlidesBeta {display:none;} /* Hide the images by default */

.cursorBeta {cursor:pointer;} /* Add a pointer when hovering over the thumbnail images */

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

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

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

/* Number text (1/3 etc) */
.numbertextBeta {color:red; font-size:12px; padding:8px 12px; position:absolute; /* top:0; */ bottom:10px; background:black; width:40%;}

/* Container for image text */
.caption-containerBeta {text-align:; background:red; padding:2px 16px; color:white; width:100%; position:fixed; bottom:10%;}

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

.columnBeta {/* float:left; width:16.66%; */} /* Six columns side by side */
.columnBeta {display:inline; width:16.66%;}

.demoBeta {opacity:0.6;} /* Add a transparency effect for thumnbail images */

.activeBeta, .demoBeta:hover {opacity:1;}

.rowBeta {background:; float:right;}

.rowBeta img {max-width:100px;}

.mySlidesBeta img {max-width:100%;}
/*
.mySlidesBeta div {width:200px; background:red;}
*/

@media only screen and (max-width:1200px)
{
  .containerBeta section {text-align:center;}
  .containerBeta section:nth-of-type(1) {width:100%; padding:0 0 0 0; order:2; background:;}
  .containerBeta section:nth-of-type(2) {width:100%; padding-left:0; margin:0; order:1; background:;}
  .rowBeta {display:flex; justify-content:center;}
  #productDetailsSpp h3 {font-size:3em;}
}

@media only screen and (max-width:400px)
{
  #productDetailsSpp h3 {font-size:2em;}
}

/* Simple JQuery Slider - By Tristan White - Codepen - 2022
--------------------------------------------------*/
/*
#slider {position:relative; overflow:hidden;}
    
#slider ul {position:relative; margin:0; padding:0; height:auto; list-style:none;}
    
#slider li {position:relative; display:block; float:left; margin:0; padding:0; width:500px; text-align:center;}
  
a.control_prev, a.control_next {position:absolute; top:40%; z-index:100; display:block; padding:5%; text-decoration:none; font-size:48pt; opacity:1; cursor:pointer;}

a.control_prev, a.control_next:hover {opacity:1; transition:all 0.2s ease;}
  
a.control_prev {border-radius:0 5px 5px 0;}

a.control_next {right:0; border-radius:5px 0 0 5px;}

#slider ul li img {width:100%;}
*/

/* Slider Chevrons Slide Animation - 2023
--------------------------------------------------*/
#slider-container {position:relative;}
#slider {display:flex; /* display:flex; */ width:90%; margin:0 5%; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scroll-behavior:smooth;}
.img-slider {flex:none; scroll-snap-align:start; padding-bottom:5px; position:relative; width:100%;}
.img-slider img {/* display:block; */ width:100%; /* height:100%; */}
#slider-container button {position:absolute; top:50%; transform:translateY(-50%); border:none; background-color:rgba(0,0,0,0.0);}

#prev {left:20px; cursor:pointer;}
#prev:before {content:'\2039'; font-size:36pt;}
    
#next {right:20px; cursor:pointer;}
#next:before {content:'\203A'; font-size:36pt;}

/*custom scollbar */
#slider::-webkit-scrollbar {width:10px; height:10px;}
#slider::-webkit-scrollbar-thumb {background:#000; /* border-radius:10px; */ visibility:hidden;}
#slider::-webkit-scrollbar-track {background:transparent;}
#slider-container:hover #slider::-webkit-scrollbar-thumb {visibility:visible;}

/*----------------------------------------------------------------------------------------------------
FOOTER SETTINGS
----------------------------------------------------------------------------------------------------*/
/*
footer {width:100%; padding:100px 20%; background:#000;}

footer article {display:flex; flex-direction:row; flex-wrap:wrap; color:#666; font-size:14px; padding:0 0 20px 0;}

footer article aside {width:25%;}

footer article aside ul {list-style:none;}

footer article aside ul li {line-height:24px;}

footer article aside ul li:nth-child(1) {color:#ccc; font-size: 16px; margin: 0 0 10px 0;}

footer article aside ul a {text-decoration:none; color:#666; transition:0.4s ease;}

footer article aside ul a:hover {color:#4FAC52; text-decoration:line-through;}

footer div {text-align:center; font-size:14px; border-top-width:1px; border-top-style:solid; border-top-color:#E2E2E2;padding:20px 0 0 0;}

footer div p {color:#666;}

footer div a {text-decoration:none; color:#666; transition:all 0.4s ease;}

footer div a:hover {color:#7AC143; text-decoration:line-through;}

@media only screen and (max-width:800px)
{
  footer article aside {width:100%; border-top-width:1px; border-top-style:solid; border-top-color:#333; text-align:center; margin:20px 0 0 0; padding:4px 0 0 0;}	
  footer article div {width:100%;}
}
*/

/*----------------------------------------------------------------------------------------------------
0 BASIC STYLES / UNIVERSAL CLASSES ETC.
----------------------------------------------------------------------------------------------------*/
.base-overlay {position:absolute; top:0; bottom:0; left:0; right:0; height:100%; width:100%; background:rgba(0,0,0, 0.8); /* opacity:0.8; */ transition:.4s ease; /* background:black; */}

.base-overlay:hover {background:rgba(0,0,0, 0.6); /* opacity:0.6; */}

.dark-overlay-sixty {height:100%; width:100%; background:rgba(0,0,0, 0.6);}

.bg-white {background:white !important; color:black;}
.bg-pink {background:#DC5E69; color:white;}

.bgBlack {background:black;}

.headerParagraph {font-weight:bold;  line-height:1.25em; font-size:2em; // 24px} /* Used on Banners with text for Yoast SEO purposes - Keyphrase in Introduction */
.headerParagraphH3 {font-weight:bold;  font-size:4em; // 48px} /* Keyphrase in Introduction/first paragraph - for H3  */

.linkStyleBase {display:inline-block; text-decoration:underline; color:#333; transition:all 0.2s;}
.linkStyleBase:hover {text-decoration:none; color:#007FB2 !important; cursor:pointer;}
.linkStyleBase:active {color: dimgrey !important; transition: 0.0s;}
.linkStyleBase:visited {color:#333;}

/* Shopify - Shopping Cart
*************************/
#cart {display:none;}

/* Back to Top Settings
*************************/
/* .back-to-top {display:none; width:40px; height:40px; position:fixed; z-index:10; right:20px; bottom:20px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px; background:rgba(28,117,188, 0.8); background-image:url('/wp-content/themes/pixelmothapparel/resources/icon-back-to-top.svg'); background-repeat:no-repeat; background-position:center 50%;} */

/*
.back-to-top {display:none; position:fixed; z-index:100; right:20px; bottom:20px; width:0; height:0; border-left:30px solid transparent; border-right:30px solid transparent; border-bottom:30px solid #4FAC52; opacity:0.8;}
*/
/*
.arrowUp {display:none; position:fixed; z-index:10; right:20px; bottom:20px; width:0; height:0; border-left:25px solid transparent; border-right:25px solid transparent; border-bottom:25px solid #4FAC52; opacity:0.8;}
*/

/*
@media only screen and (max-width:800px)
{
  .back-to-top {border-left:20px solid transparent; border-right:20px solid transparent; border-bottom:20px solid #4FAC52;} /* #1C75BC; - Blue Color */
/*
}
*/

.centeredTopic {text-align:center; margin-bottom:20px;}
.centeredTopicTwo {text-align:center; margin:100px 0 20px 0;}

.eightyPercentWrap {width:80%; margin:0 10% 0 10%;}

@media only screen and (max-width:800px)
{
	.eightyPercentWrap {width:100%; margin:0;}
}