@charset "utf-8";
@import url('pm-layout.css?v=19');
@import url('animations.css?v=2');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400;600;700;900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Poppins:300,600,800&display=swap');
@import url('https://fonts.googleapis.com/css?family=Exo+2:300,400,700&display=swap');/*300-light, 400-regular, 700-bold*/
@font-face{font-family:"grind";
    src:url("/resources/fonts/Grind_and_Death.ttf");
/*
    src:url('/resources/fonts/Grind_and_Death.woff') format('woff');
    src: url('/resources/fonts/Grind_and_Death.eot');
*/
}
/* ---------- standaard lettertype en kleur ---------- */

/*
=============
site colors
=============


*/
html {
  scroll-behavior: smooth;
  perspective: 150px;
}
.layout {
	color: 		 #1a171b;
	font-size: 	 18px;
	font-family: 'Montserrat';
	line-height: 1.9em;
}

.layout * {
	color: inherit;	
	font-family: 'Montserrat';
}

.layout td, .layout th, .layout a,
.layout h1,.layout h2,.layout h3,.layout h4,.layout h5,.layout h6 {

}

.layout h1,.layout h2,.layout h3,.layout h4,.layout h5,.layout h6 {	
	margin: 0.5em 0;
}

.layout h1 { line-height: 1.25em; color:#1a171b; font-size: 5.75em; font-weight: 900; }
.layout h2 { line-height: 1.25em; color:#1a171b; font-size: 3.5em; font-weight: 600; }
.layout h3 {line-height: 1.25em; color:#1a171b; font-size: 2.5em; font-weight: 900; }
.layout h4 {line-height: 1.25em; color:#1a171b; font-size: 1.75em; font-weight: 900; }
.layout h5 {}
.layout h6 {}
.layout p  {}

.layout a {text-decoration: none;}

/* headerbar twisted */


#layout{
    transform-origin: left top;
    overflow:hidden;
}
#layer1{
    overflow: hidden;
    overflow-y: scroll;
	top:106px;
	position:fixed;
	    bottom: 36px;
}

#layer2{
	
}
.hide-sidebar.pt-pagina #topbar, .hide-none.pt-pagina #topbar {
    display: block;
    position: fixed;
    z-index: 1;
}
#blockArea{
	-webkit-transition: filter 0.3s;
	transition: filter 0.3s;
}
.layout #layer1::-webkit-scrollbar-thumb, .layout #blockArea::-webkit-scrollbar-thumb {
    background-color: #1a171b;
    border-radius: 0;
}
.layout #layer1::-webkit-scrollbar-track, .layout #blockArea::-webkit-scrollbar-track {
    background-color: rgb(10, 10, 10);
    width: 15px;
}
#blockArea.__blurry{
	display:none;
}

.pm-overlay:after{
	content: '';
	display: block;
	position: absolute;
	left:0;right:0;top:0;bottom:0;
	z-index:1;
}

#layout #layer1:before{
	content : '';
	opacity: 0;
	transition: opacity 0.5s;
	display:block;position: absolute;
	top: 0;right:0;left:0;
}
#layout #layer1:after{
	content : '';
	display:block;position: absolute;
	top: 0;right:0;left:0;
}

.video-container {
   position: absolute;
    /* padding-bottom: 56.25%; */
    padding-bottom: 57.5%;
    /* padding-top: 30px; */
    /* height: 0; */
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    overflow: hidden;
    pointer-events: none;
}
.video-container._teaser {
    padding-bottom: 56.25%;
}
.video-text {
	position: absolute;
    left: 225px;
    top: 50px;
    max-width: 50%;
    z-index: 10;
}
/*
==========
Header
==========
 */
 


.hero-image {
	position: absolute;
	top: 0;
	left: 0;
	background-color: #5b3a0e;
}
.heroText{
	max-width:840px;
	z-index:5;
	position: absolute;
}
.heroImage{
	background-position: center;
}



/*
==========
Topbar
==========
 */
#topbar{
	min-height:105px;
	transition: filter 0.5s;
}
nav#headerbar{
	height:105px;	
	left:0;right:0;top:0;overflow:hidden;
	background-color:#FFF;

}
#layout nav#headerbar{
	position:fixed;
}
nav#headerbar:after{
	content: '';
	display: block;
	height:105px;	
	position: absolute;
	right:0;top:0;overflow:hidden;
	width:0.7em;
}

nav#headerbar #monstersLogo,
nav#headerbar #monstersLogoBG,
nav#headerbar #monstersLogoBG:after,
nav#headerbar #monstersLogo:after,
nav#headerbar #bttn-menu,
nav#headerbar #bttn-contact{
	display:block;
	background-repeat:no-repeat;
	background-position: center;
	background-size:  auto 100%;
	position: absolute;
	box-sizing: border-box;
	font-weight:900;
	z-index:1;
	cursor: pointer;
}

nav#headerbar #bttn-menu
{
	width: 52px;
    height: 45px;
    background-image: url(/svg/13monsters/f40f82/menu.svg);
    top: 30px;
    left: 30px;
    padding-left: 60px;
    background-position: left top;
    text-transform: uppercase;
    padding-left: 76px;
    padding-top: 13px;
    color:#000;
transition: all 0.5s;
}



nav#headerbar #bttn-menu:after{
	content: 'MENU';
}


nav#headerbar.__active #bttn-menu:after{
	content: 'CLOSE';
}


nav#headerbar ._bttn{
        height: 55px;
    float: right;
    padding-top: 13px;
    color: #000;
    margin: 15px 35px 15px 0;
    font-weight: 900;
    position:relative;
    display: block;top:15px;
}

nav#headerbar ._bttn.text-magenta	{ color:#f40f82; }

nav#headerbar ._bttn.__active{
color:#F40F82;	
}
nav#headerbar ._bttn .cart-nr-target{
background-color: #F40F82;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 100%;
    margin: 0px -25px 0 0;
    display: block;
    box-sizing: border-box;
    padding: 3px;
    line-height: 26px;
    text-align: center;
    color: #FFF;
    font-size: 0.8em;
    height: 30px;
    width: 30px;
}

nav#headerbar #monstersLogo{
	width: 457px;
	height: 106px;
	left:50%;
	margin-left: -228px;
	z-index:0;
	background-position:center;
}

nav#headerbar #monstersLogoBG{
	display: block;
    width: 100px;
    height: 106px;
    z-index: 1;
    background-repeat: no-repeat;
    overflow: hidden;
    outline: 2px solid #FFF;
    box-sizing: border-box;
    background-color: #f40f82;
    left: 85px;
    top: 0px;
    animation: bg-monsters 8s 1 0s forwards;
}


nav#headerbar #monstersLogoBG.__1{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-01-large.png')	
}
nav#headerbar #monstersLogoBG.__2{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-02-large.png')	
}
nav#headerbar #monstersLogoBG.__3{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-03-large.png')	
}
nav#headerbar #monstersLogoBG.__4{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-04-large.png')	
}
nav#headerbar #monstersLogoBG.__5{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-05-large.png')	
}
nav#headerbar #monstersLogoBG.__6{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-06-large.png')	
}
nav#headerbar #monstersLogoBG.__7{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-07-large.png')	
}
nav#headerbar #monstersLogoBG.__8{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-08-large.png')	
}
nav#headerbar #monstersLogoBG.__9{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-09-large.png')	
}
nav#headerbar #monstersLogoBG.__10{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-10-large.png')	
}
nav#headerbar #monstersLogoBG.__11{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-11-large.png')	
}
nav#headerbar #monstersLogoBG.__12{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-12-large.png')	
}
nav#headerbar #monstersLogoBG.__13{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-13-large.png')	
}

@keyframes bg-monsters{
	
	0%{
		background-size:auto 400%;
		background-position: center bottom;
	}
	40%{
		background-size:auto 200%;
		background-position: center top;
	}
	90%{
		background-size:auto 100%;		
		background-position: center;
	}
	100%{
		
	background-position:center center;
		background-size:auto 0%;		
	}
	
}

nav#headerbar #monstersLogoBG:after{
	content: ''; 
	display:block;
	left:-2px;right:-2px;
	height: 106px;
	background-image: url('/svg/13monsters/FFFFFF/logo13-cover.svg');
	background-size:  auto 140%;
	background-position: left center;
	z-index:1;
	background-repeat: no-repeat;
}




nav#headerbar #monstersLogo:after{
	content: '';
    display: block;
    width: 205px;
    height: 106px;
    left: 150px;
    /* margin-left: -228px; */
    /* background-image: url(../../images/13monsters/logos/logo-bg.png); */
    background-image: url(../../images/13monsters/logos/logo_thirteen-monsters.svg);
    background-size: 100% auto;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 2;
}
	.glitch nav#headerbar #monstersLogo{

	}


#submenu-cnt{
	background-color: #f40f82;
    box-sizing: border-box;
    position: absolute;
    top: 0;left:0;right:0;
    z-index: 3; height:0; overflow: hidden;
    transition: all 1s;
}
#submenu-cnt.__open{

	height:auto;
	
}

#submenu-cnt:before{
    content: '';
    width: 50px;
    height: 670px;
    position: absolute;
    top: 41px;
    left: 0;
    margin-left: -25px;
    background-color: #000;
    display: block;
	
}

#submenu-cnt > ._inner{
	padding: 40px;
	width: 1680px;
}

#submenu-cnt > ._inner{
	    box-sizing: border-box;
    margin: 0 auto;
    max-width: 1680px;
   
    padding-bottom: 50px;
    margin-left: 25px;
    background-image: url(../../images/13monsters/logos/logo_13.svg);
    background-size: 360px auto;
    background-position: right -65px bottom -190px;
    background-repeat: no-repeat;
    
}


#submenu-cnt > ._inner >  a._item{	
	position: relative;
    display: block;
    padding: 50px;
    padding-bottom: 12px;
    box-sizing: border-box;
    height: 10em;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    color: #FFF;
    /* background-size: 50% auto; */
    background-position: -51px -30px;
    background-repeat: no-repeat;
    background-image: url(../../images/13monsters/svg/graphic-danger.svg);
    padding-left: 75px;
    padding: 50px;
    width: 48%;
    float: left;
    margin: 1% 1%;
}



#submenu-cnt  > ._inner > a._item > ._title{
	display:block;
	font-weight: 900;
	font-size: 2em;color:#fff;
	
}
#submenu-cnt > ._inner  > a._item > ._description{
display: block;
    font-weight: 400;
    line-height: 1.35em;
    margin: 10px 0;
    padding-bottom: 10px;
    overflow: hidden;
    color: #fff;
    background-size: 100% auto;
    background-position: right bottom;
    background-repeat: no-repeat;
    background-image: url(/svg/13monsters/s_ffffff/arrow-button.svg);
}



/* footer */
.footer_content{
	    background-color: #F2F1F0;
    color: #000;
    box-sizing: border-box;
    padding: 50px;
	font-size:0.8em;
	line-height:normal;
}

.footer_content > ._inner{
	max-width: 1680px;
	margin: 0 auto;
	padding-top:10px;
	
	}

.footer_content a{
	color: #000;
}

.footer_content ._logo{
	width:253px;
	height:94px;
	float:left;
	margin:20px;
	margin-top:-35px;
	margin-right:50px;

	background-repeat:no-repeat;
	background-size: 100% auto;
	
}
.footer_content ._text{
	float:left;
	max-width: 890px;
}
.footer_content ._statement{
	float:right;
	margin-top: 4em;
}

	

/*
=========================
section background-color
=========================
 */
#page-section-black {
	background-color: #000000;
}
#page-section-white {
	background-color: #ffffff;
}
#page-section-grey {
	background-color: #ececec;
}
#page-section-magenta {
	background-color: #f40f82;
}
#page-section-green {
	background-color: #67e59a;
}

.table-form-reseller td {
	padding: 0 0 10px 0;
}
.table-form-reseller table label {
	display: block;
	margin: 0 0 10px 0;
}
.table-form-reseller .tbl_1, .table-form-reseller .tbl_2 {
	width: 50%;
	float: left;
}

.flag-select:hover {
	border-radius: 50%;
	box-shadow: 3px 3px 8px rgba(0,0,0,0.5);
	cursor: pointer;
}

.product-details {
	display: none;
}

/*
=========================
show / hide details
=========================
 */
.helpItem .details,
.show,
.hide:target {
  display: none !important;
}

.hide:target + .show,
.hide:target ~ .details {
  display: block;
}

.helpItem {
	background-color: #ffffff;
	position: relative;
	padding: 5px;
	margin: 0 0 15px 0;
}

.helpItem .title {
	font-size: 18px;
	text-transform: uppercase;
	font-weight: 700;
	color: #1A171B;
	margin: 10px 0 0 10px;
}
.helpItem .subTitle {
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	color: deeppink;
	margin: 5px 0 0 10px;
}

a.show:after {
	content: '-';
	display: block;
	position: absolute;
	font-weight: 700;
	font-size: 18px;
	color: #1A171B;
	top: 5px;
	right: 10px;
}
a.hide:after {
	content: '+';
	display: block;
	position: absolute;
	font-weight: 700;
	font-size: 18px;
	color: #1A171B;
	top: 5px;
	right: 10px;
}
.hide {
	
}
.details {
	background-color: #ffffff;
}
/* show / hide details */


/*
==========
Formulier
==========
 */
 /*
.default_table input[type="submit"] {
	display: inline-block;
	padding: 15px 50px 15px 50px;
	box-sizing: border-box;
	font-size: 1.0em;
	margin: 20px 0 0 0;
	background-color: #000000;
	color: #ffffff;
	font-weight: 700;
}

.layout .default_table input[type="text"],
.layout .default_table input[type="email"],
.layout .default_table input[type="tel"],
.layout .default_table textarea{
	padding: 10px 10px 10px 10px;
	background-color: #ffffff;
	color: grey;
		margin-bottom: 5px;
	width: 100%;	
	box-sizing: border-box;
	font-family: 'Poppins', sans-serif;
}
.layout .default_table img {
	width: 24px;
	height: 24px;
}
*/

/* blockstyle */
.blockCoverWidth,
.blockCoverWidth > .fs{
	position: absolute;
    left: 0;
    right: 0;
    width: 100%!important;
    max-width: none;
}



body .pblock.reveal-img {
	overflow: hidden;
}
body .pblock.reveal-img.__rechts{
	
}

body .pblock.reveal-img img{width: 1024px!important; height: auto!important;}
body .pblock.reveal-img img{float:right;}
body .pblock.reveal-img.__rechts img{float:left;margin-left:-135px;}




/* formulier velden */
label.__labelTitel {
    display: block;
    position: relative;
    top: 60px;
    left: 17px;
    font-size: 20px;
    font-weight: 700;
/*    color: #445593; */
}
.pblock input[type="text"], .pblock input[type="email"] {
    padding: 10px 10px 10px 10px;
    background-color: #ffffff;
    box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
/*    border-top:        solid 70px #ECEDED;
    border-right:      solid 15px #ECEDED;
    border-bottom:     solid 10px #ECEDED;
    border-left:       solid 20px #ECEDED; */
}
.pblock .__form-message {
    padding: 10px 10px 10px 10px;
    background-color:     #ffffff;
    box-sizing:           border-box;
    font-family:          'Montserrat', sans-serif;
    border-top:           solid 70px #000000;
    border-right:         solid 20px #000000;
    border-bottom:        solid 20px #000000;
    border-left:          solid 20px #000000;
}
/* formulier velden */



/* THEME COLORS */

.theme-green		{}
.theme-lime			{}
.theme-red			{}

.theme_prev.theme-magenta		{ background-color:#f40f82; }
.theme_prev.theme-green		{ background-color:#67e59a; }
.theme_prev.theme-aqua		{ background-color:#28ddd3; }
.theme_prev.theme-lime		{ background-color:#96ea13; }



/* magenta */
.theme-magenta .button.__active,
.bg-highlight,
#submenu-cnt,
#headerbar:after,
.text-deco-not-only-design:before,
.text-deco-not-only-design:after
{ 	background-color: #f40f82; }

.layout .text-highlight,
.layout.text-highlight
{ 	color: #f40f82; }

#layer1::-webkit-scrollbar-track,#blockArea::-webkit-scrollbar-track {background-color: #f40f82;width:15px;}
#layer1::-webkit-scrollbar-thumb, #blockArea::-webkit-scrollbar-thumb  { background-color: #000;border-radius: 0; border: 4px solid #f40f82;}


.arrow-button,
#submenu-cnt  > ._inner  a._item > ._button{
    background-image: url(/svg/13monsters/s_f40f82/arrow-button.svg);
}

nav#headerbar #bttn-menu{
    background-image: url(/svg/13monsters/f40f82/menu.svg);
}
.pm_flow #headerbar.__active  #bttn-menu{
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='43' height='45' viewBox='0 0 42.7 44.9'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23f40f82;%7D%0A%3C/style%3E%3Crect x='-5.5' y='18.5' transform='matrix(0.6881 -0.7256 0.7256 0.6881 -9.6286 22.487)' class='st0' width='53.7' height='7.9'/%3E%3Crect x='-5.5' y='18.5' transform='matrix(-0.6766 -0.7364 0.7364 -0.6766 19.2551 53.3429)' class='st0' width='53.7' height='7.9'/%3E%3C/svg%3E");
}


.text-deco{
	background-image: url('/svg/13monsters/f40f82/deco-bg.svg');	
}

.nav-block.__highlight{
		background-image: url(/svg/13monsters/f40f82/icon-arrow-right.svg);
	}
	.nav-block.__previous.__highlight{
		background-image: url(/svg/13monsters/f40f82/icon-arrow-left.svg);
	}
.theme-magenta.deco-bg-square,
.deco-bg-square{
	background-image: url(/svg/13monsters/f40f82/deco-ag-square.svg);
}
	
/* green */
.theme-green .button.__active,
.theme-green .bg-highlight,
.theme-green #submenu-cnt,
.theme-green #headerbar:after,
.theme-green .text-deco-not-only-design:before,
.theme-green .text-deco-not-only-design:after
{ 	background-color: #67e59a; }

.theme-green .text-highlight,
.theme-green .text-highlight
{ 	color: #67e59a; }

.theme-green #layer1::-webkit-scrollbar-track,.theme-green #blockArea::-webkit-scrollbar-track {background-color: #67e59a;width:15px;}
.theme-green #layer1::-webkit-scrollbar-thumb, .theme-green #blockArea::-webkit-scrollbar-thumb  { background-color: #000;border-radius: 0; border: 4px solid #67e59a;}

.theme-green .arrow-button,
.theme-green #submenu-cnt  > ._inner  a._item > ._button{
    background-image: url(/svg/13monsters/s_67e59a/arrow-button.svg);
}

.theme-green nav#headerbar #bttn-menu{
    background-image: url(/svg/13monsters/67e59a/menu.svg);
}
.theme-green #headerbar.__active  #bttn-menu{
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='43' height='45' viewBox='0 0 42.7 44.9'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%2367e59a;%7D%0A%3C/style%3E%3Crect x='-5.5' y='18.5' transform='matrix(0.6881 -0.7256 0.7256 0.6881 -9.6286 22.487)' class='st0' width='53.7' height='7.9'/%3E%3Crect x='-5.5' y='18.5' transform='matrix(-0.6766 -0.7364 0.7364 -0.6766 19.2551 53.3429)' class='st0' width='53.7' height='7.9'/%3E%3C/svg%3E");
}

.theme-green nav#headerbar #bttn-contact{
    background-image: url(/svg/13monsters/67e59a/contact.svg);
}

.theme-green .text-deco{
	background-image: url('/svg/13monsters/67e59a/deco-bg.svg');	
}

.theme-green .nav-block.__highlight{
		background-image: url(/svg/13monsters/67e59a/icon-arrow-right.svg);
	}
	.theme-green .nav-block.__previous.__highlight{
		background-image: url(/svg/13monsters/67e59a/icon-arrow-right.svg);
	}

.theme-green.deco-bg-square,
.theme-green .deco-bg-square{
	background-image: url(/svg/13monsters/67e59a/deco-ag-square.svg);
}
	.theme-green .text-deco{
	background-image: url('/svg/13monsters/67e59a/deco-bg.svg');	
}
/* aqua */
.theme-aqua .button.__active,
.theme-aqua .bg-highlight,
.theme-aqua #submenu-cnt,
.theme-aqua #headerbar:after,
.theme-aqua .text-deco-not-only-design:before,
.theme-aqua .text-deco-not-only-design:after
{ 	background-color: #28ddd3; }

.theme-aqua .text-highlight,
.theme-aqua .text-highlight
{ 	color: #28ddd3; }

.theme-aqua #layer1::-webkit-scrollbar-track,.theme-aqua #blockArea::-webkit-scrollbar-track {background-color: #28ddd3;width:15px;}
.theme-aqua #layer1::-webkit-scrollbar-thumb, .theme-aqua #blockArea::-webkit-scrollbar-thumb  { background-color: #000;border-radius: 0; border: 4px solid #28ddd3;}

.theme-aqua .arrow-button,
.theme-aqua #submenu-cnt  > ._inner  a._item > ._button{
    background-image: url(/svg/13monsters/s_28ddd3/arrow-button.svg);
}

.theme-aqua nav#headerbar #bttn-menu{
    background-image: url(/svg/13monsters/28ddd3/menu.svg);
}
.theme-aqua #headerbar.__active  #bttn-menu{
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='43' height='45' viewBox='0 0 42.7 44.9'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%2328ddd3;%7D%0A%3C/style%3E%3Crect x='-5.5' y='18.5' transform='matrix(0.6881 -0.7256 0.7256 0.6881 -9.6286 22.487)' class='st0' width='53.7' height='7.9'/%3E%3Crect x='-5.5' y='18.5' transform='matrix(-0.6766 -0.7364 0.7364 -0.6766 19.2551 53.3429)' class='st0' width='53.7' height='7.9'/%3E%3C/svg%3E");
}
.theme-aqua nav#headerbar #bttn-contact{
    background-image: url(/svg/13monsters/28ddd3/contact.svg);
}

.theme-aqua .text-deco{
	background-image: url('/svg/13monsters/28ddd3/deco-bg.svg');	
}

.theme-aqua .nav-block.__highlight{
		background-image: url(/svg/13monsters/28ddd3/icon-arrow-right.svg);
	}
	.theme-aqua .nav-block.__previous.__highlight{
		background-image: url(/svg/13monsters/28ddd3/icon-arrow-right.svg);
	}

.theme-aqua.deco-bg-square,
.theme-aqua .deco-bg-square{
	background-image: url(/svg/13monsters/28ddd3/deco-ag-square.svg);
}
	.theme-aqua .text-deco{
	background-image: url('/svg/13monsters/28ddd3/deco-bg.svg');	
}
/* lime */
.theme-lime .button.__active,
.theme-lime .bg-highlight,
.theme-lime #submenu-cnt,
.theme-lime #headerbar:after,
.theme-lime .text-deco-not-only-design:before,
.theme-lime .text-deco-not-only-design:after
{ 	background-color: #96ea13; }

.theme-lime .text-highlight,
.theme-lime .text-highlight
{ 	color: #96ea13; }

.theme-lime #layer1::-webkit-scrollbar-track,.theme-lime #blockArea::-webkit-scrollbar-track {background-color: #96ea13;width:15px;}
.theme-lime #layer1::-webkit-scrollbar-thumb, .theme-lime #blockArea::-webkit-scrollbar-thumb  { background-color: #000;border-radius: 0; border: 4px solid #96ea13;}

.theme-lime .arrow-button,
.theme-lime #submenu-cnt  > ._inner  a._item > ._button{
    background-image: url(/svg/13monsters/s_96ea13/arrow-button.svg);
}

.theme-lime nav#headerbar #bttn-menu{
    background-image: url(/svg/13monsters/96ea13/menu.svg);
}
.theme-lime #headerbar.__active  #bttn-menu{
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='43' height='45' viewBox='0 0 42.7 44.9'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%2396ea13;%7D%0A%3C/style%3E%3Crect x='-5.5' y='18.5' transform='matrix(0.6881 -0.7256 0.7256 0.6881 -9.6286 22.487)' class='st0' width='53.7' height='7.9'/%3E%3Crect x='-5.5' y='18.5' transform='matrix(-0.6766 -0.7364 0.7364 -0.6766 19.2551 53.3429)' class='st0' width='53.7' height='7.9'/%3E%3C/svg%3E");
}
.theme-lime nav#headerbar #bttn-contact{
    background-image: url(/svg/13monsters/96ea13/contact.svg);
}

.theme-lime .text-deco{
	background-image: url('/svg/13monsters/96ea13/deco-bg.svg');	
}

.theme-lime .nav-block.__highlight{
		background-image: url(/svg/13monsters/96ea13/icon-arrow-right.svg);
	}
	.theme-lime .nav-block.__previous.__highlight{
		background-image: url(/svg/13monsters/96ea13/icon-arrow-right.svg);
	}

.theme-lime.deco-bg-square,
.theme-lime .deco-bg-square{
	background-image: url(/svg/13monsters/96ea13/deco-ag-square.svg);
}
	.theme-lime .text-deco{
	background-image: url('/svg/13monsters/96ea13/deco-bg.svg');	
}
/**
Stipsets
**/

._pagDots{
	display:block;	
	height:20px;
}	
._pagDots ._dot{
	display:block;
	float:left;
	width: 20px;
	height: 20px;
	margin: 5px;
	background-color: #0a0a0a;
	border-radius: 100%;
}	

._pagDots ._dot.__active{
	background-color:red;	
}

#statsCnt ._pagDots{
	position: absolute;
	right: 75px;
	top: 0;
	margin: 15px;
}
#statsCnt .nav-block{
	position: absolute;
	right: 75px;
	bottom: 50px;
	margin: 15px;
}
	
	
/**
 * pie chart
 */


#berichtCnt
{
	margin:50px;
	position: absolute;
	width:400px;height:400px;
	margin-top:100px;
	left:100px;
}


#berichtGraph{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3E%3Ccircle cx='200' cy='200' r='200'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size:70%;
	background-position:center;	
	animation: float-graph 3s infinite ease-in-out alternate-reverse;
	transform-origin: left top;
}

#berichtCnt:after{
	content: '';
	display:block;
	position: absolute;
	bottom:0;
	margin-bottom: -60px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 382 27.3'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23D9D9DA;%7D%0A%3C/style%3E%3Cellipse class='st0' cx='191' cy='13.6' rx='191' ry='13.6'/%3E%3C/svg%3E");
	background-position:center;background-repeat: no-repeat;
	width:100%;height:40px;
	background-size: 80% auto;
	animation: graph-shadow 3s infinite ease-in-out alternate-reverse;
	transform-origin: left top;
}

#statsCnt .st-percentage:after{
	content: '%';
}

#statsCnt{
	width: 750px;
	margin:50px;
	float:right;
	margin-top:120px;
	min-height:100px;
	margin-right:150px;
	animation: float-stats 3.25s infinite 1s ease-in-out alternate-reverse;
	transform-origin: left top;
}

#statsCnt .st-text{
	    margin-top: -30px;
}


@keyframes float-graph{
	from {
		transform: translateY(0);
	}
	to {
		transform: translateY(-15%);
	}
}
@keyframes float-stats{
	from {
		filter: blur(5%);
	}
	to {
		filter: blur(5%);
	}
}
@keyframes graph-shadow{
	from {
		background-size: 80% auto;
	}
	to {
		background-size: 65% auto;
	}
}


/* game */
#monsterApp{
    width:1680px;
    height:780px;
    position:relative;
}
#characterSelect{
        width: 580px;
    height: 100%;
    left: 30px;
    position: relative;
    box-sizing: border-box;
    padding: 10px;
}


#characterBio{
position: absolute;
    width: 980px;
    top: 11px;
    /* border-radius: 25px; */
    /* bottom: 25px; */
    right: 45px;
    overflow: visible;

}

#characterSelect ._choose{

}
#characterSelect ._monsterText{
    width: 387px;
    height: 108px;
    overflow: hidden;
    margin: 15px;
}
#characterSelect ._monster{
    display:block;
    background-repeat: no-repeat;
    background-size:100% auto;
    background-position:center;
    width: 108px;
    height:108px;
    float:left;
    margin:15px;
    position:relative;
    cursor: pointer;
}
#characterSelect ._monster:before{
	content: '';
	display:block;
	width:0;
	position: absolute;
	bottom:0;
	margin-bottom: -12px;
	height:6px;
	background-color: #F40F82;
    
    cursor: pointer;
}
#characterSelect ._monster.__active:before{
    animation: character-select 1s 1 forwards running;
}
#characterSelect ._monster ._title{
    display:none;
}
/*
#characterSelect ._monster ._title{
    display:block;
    background-color:#00000080;
    box-sizing: border-box;
    padding:0px;
    color:#FFF;
    font-size:16px;
    position:absolute;
    width:100%;
    bottom:0;
    text-align:center;
    transition:margin 0.5s;
    margin-bottom:-140px;   
}
#characterSelect ._monster:hover ._title{
 margin-bottom:0;   
}
*/




@keyframes character-select{

    0%{}
    100%{
        width:100%
    }
}

#characterSelect ._monster.__1{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-01-thumb.png')	
}
#characterSelect ._monster.__2{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-02-thumb.png')	
}
#characterSelect ._monster.__3{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-03-thumb.png')	
}
#characterSelect ._monster.__4{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-04-thumb.png')	
}
#characterSelect ._monster.__5{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-05-thumb.png')	
}
#characterSelect ._monster.__6{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-06-thumb.png')	
}
#characterSelect ._monster.__7{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-07-thumb.png')	
}
#characterSelect ._monster.__8{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-08-thumb.png')	
}
#characterSelect ._monster.__9{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-09-thumb.png')	
}
#characterSelect ._monster.__10{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-10-thumb.png')	
}
#characterSelect ._monster.__11{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-11-thumb.png')	
}
#characterSelect ._monster.__12{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-12-thumb.png')	
}
#characterSelect ._monster.__13{
	background-image:url('../../cimages/13monsters/meet-our-monsters/monster-13-thumb.png')	
}

#characterSelect ._monster.__14{
	background-color:#f40f82;
}

#characterSelect ._monster.__15{
	background-color:#f40f82;
}

#characterSelect ._monster.__16{
	background-color:#f40f82;
}




#characterBio .monsterInfoWrapper:before{

    animation: monster-in 1s 1 forwards running;transform-origin: left center;
}


#characterBio.__out .monsterInfoWrapper:before{
	animation: monster-out 0.4s 1 0.5s forwards running;
}


@keyframes monster-out{

    100%{        
        transform: rotate(0) scale(1, 1) translate(0,200%);
    }
}



@keyframes monster-in{
    0%{
        transform: rotate(15deg) scale(0, 0) translate(0,90%);
    }
    50%{
        
    }
    90%{        
        transform: rotate(0) scale(1, 1) translate(0,0%);
    }
    100%{        
        transform: rotate(0) scale(1, 1) translate(0,0%);
    }
}

#characterBio .monsterName h3 {
    text-transform: uppercase;
    font-size: 3.25em;
    line-height: normal;
    margin: 0 15px 0 15px;
}
#characterBio .monsterName .icon-element {
	width: 178px;
	height: auto;
}

#characterBio ._monster ._title{
        position: absolute;
    top: 40px;
    left: 40px;
    font-weight: bold;
    display: block;
    font-size: 80px;
    z-index: 2;
    color: #f40f82;
    font-family:"grind";
    animation: title-out 0.5s 1 2.5s forwards;
}

#characterBio ._monster ._stats{
    right: 0;
    z-index: 2;
    box-sizing: border-box;
    padding: 10px;
    color: #FFF;
    border-left: 10px solid #FFFFFF40;
    top: 0;
    height: 800px;
    position:absolute;
    width: 544px;
    background-color: #00000080;
    animation: bio-in 0.5s 1 2.5s forwards;
    transform: translateX(100%);
}
#characterBio ._monster ._stats ._elemental{
        right: 0;
    z-index: 2;
    box-sizing: border-box;
    padding: 10px;
    margin-left: -120px;
    color: #FFF;
    border-left: 10px solid #FFFFFF40;
    bottom: 0;
    height: 200px;
    position: absolute;
    width: 800px;
    background-color: red;
    animation: bio-in 0.5s 1 3.5s forwards;
    transform: translateY(100%);
    
    border-radius: 20px;
}

#characterBio ._monster ._stats ._elemental:before{
        content: '';
    position: absolute;
    top: 0;
    background-repeat: no-repeat;
    background-position: center;
    width: 300px;
    height: 300px;
    background-size: 100% auto;
    z-index: 3;
    margin-top: -141px;
    left: 278px;
transform: translateY(100%);
    animation: bio-in 0.5s 1 3.5s forwards;
}

#characterBio ._monster ._stats ._elemental.__earth:before{
    background-image:url('../../cimages/13monsters/meet-our-monsters/elementals/earth.svg?t=1')	;
}
#characterBio ._monster ._stats ._elemental.__fire:before{
    background-image:url('../../cimages/13monsters/meet-our-monsters/elementals/fire.svg?t=1')	;
}
#characterBio ._monster ._stats ._elemental.__air:before{
    background-image:url('../../cimages/13monsters/meet-our-monsters/elementals/air.svg?t=1')	;
}
#characterBio ._monster ._stats ._elemental.__water:before{
    background-image:url('../../cimages/13monsters/meet-our-monsters/elementals/water.svg?t=1')	;
}
#characterBio ._monster ._stats ._elemental.__ghost:before{
    background-image:url('../../cimages/13monsters/meet-our-monsters/elementals/ghost.svg?t=1')	;
}

#characterBio ._monster ._stats ._elemental.__earth{
   background-color:#7ab91b
}
#characterBio ._monster ._stats ._elemental.__fire{
    background-color:#ec6510
}
#characterBio ._monster ._stats ._elemental.__air{background-color:#28277a
}
#characterBio ._monster ._stats ._elemental.__water{background-color:#3eaad1
}
#characterBio ._monster ._stats ._elemental.__ghost{background-color:#545454
}









@keyframes title-out{
    0%{}
    100%{
        transform: translateX(-150%);
    }
}
@keyframes bio-in{
    0%{}
    100%{
        transform: translateX(0);
    }
}


/* twisted */

@keyframes stroke-anim{
    0%{
        width: 0%   
    }
    100%{
        width:100%;
    }
}



@keyframes glitch-spacing{
    0% {    
		word-spacing: 40px;
    }
    23%{
		word-spacing: 50px;
	}	
	66%{
		word-spacing: 2px;
	}	
	77%{
		word-spacing: -40px;
	}
	88%{		
		word-spacing: 0px;
	}
	100%{
		word-spacing: inherit;
	}
}

@keyframes glitch-text{
    0% {    
		word-spacing: 10px;
    }
    23%{
		word-spacing: 10px;line-height:0.75em;
	}
	
	66%{
		word-spacing: 2px;line-height:0.75em;
	}
	
	77%{
		word-spacing: -2px;line-height:normal;
	}
	88%{		
		word-spacing: 0px;
	}
	100%{
		word-spacing: inherit;
	}
}

@keyframes go-text{
    0% {    
		content: '[GO ] ';	
    }
    23%{
		content: '[GO > ] ';	
	}
	
	66%{
		content: '[GO > ] ';	
	}
	
	77%{
		content: '[GO >>> ] ';	
	}
	88%{
		content: '[GO NOW ] ';	
	}
	100%{
		content: '[NOW!!! ] ';	
	}
}



@keyframes hover-button-in {
    0% {    

    }
    
    10%{
		padding-left: 0px;
	}
    /* glitch */
    22%{
		padding-left: 250px;
	}
    25%{
		padding-left: 10px;
	}
	
    60%{
		padding-left: 0px;
	}
    /* glitch */
    72%{
		padding-left: 600px;
	}
    75%{
		padding-left: 100px;
	}
    90% {
    background-size: 0;
	background-position: center top;
    
    background-color: transparent; 
    }
    100% {
    background-color: #000;       
    background-size: 0;
    }
}
	
	
	
/* Cart */
.productComboBox{
	
}

.productComboBox .comboRow{
    position: relative;
    box-sizing: border-box;
    width: 18%;	
    float:left;
    margin:1%;
}
.productComboBox .comboRow .default_table td{
padding:5px;
}

/* Cart */
.cartTitle{
    padding-bottom: 100px;
    padding-left: 50px;
    padding-right: 30px;
    padding-top: 150px;
    width: 25%;
    float: left;
    height: 482px;
}
.cartRow{
    position: relative;
    box-sizing: border-box;
    width: 75%;
    float: right;
	
}
.cartRow ._image{
	padding-left: 20px;
    padding-top: 70px;
    width: 386px;
    height: 480px;
    float:left;
    box-sizing: border-box;
    position:relative;
}
.cartRow ._image img{
border:1px solid #ccc;
}
.cartRow ._name{
	padding-left: 20px;
    padding-right: 20px;
    padding-top: 115px;
    width: 376px;
    height: 480px;
    float: left;
    box-sizing: border-box;
}
.cartRow ._description{
	clear:both;
}
.cartRow ._quantity{
	    padding-left: 25px;
        padding-top: 109px;
    width: 190px;
    height: 478px;
    float: left;
    box-sizing: border-box;
}
.cartRow ._quantity ._input{
    width: 85px;
    margin: 4px 0;
    float: left;
    font-size: 2em;
    outline: 0;
    border: 1px solid #000;
    font-weight: 600;
    padding: 0 10px;
}
.cartRow ._price{
	padding-left: 30px;
    padding-right: 50px;
        padding-top: 76px;
    width: 290px;
    height: 476px;
    float: left;
    box-sizing: border-box;
    text-align:right;
}

.cartRow ._bttn-trash{
	background-image:url('/resources/cimages/13monsters/Shop/icon-trash.png');
	background-repeat:no-repeat;
	background-size: 100% auto;
	display:block;
	float:left;
	width:20px;height:30px;
	margin-left:5px;
	box-sizing: border-box;
	
}	



.pm-cart-overview.__compact .cartRow{
    float:none;
    margin:0 auto;
	width: 100%;
	clear:both;
}
.pm-cart-overview.__compact .cartRow ._image{
    padding-top: 70px;
    width: 130px;
    height: 200px;
    padding-left: 0;
    float: left;
    box-sizing: border-box;
}
.pm-cart-overview.__compact .cartRow ._image img{
        width: 110px!important;    margin-top: -24px;
}
.pm-cart-overview.__compact .cartRow ._name{
padding-left: 20px;
    padding-right: 20px;
    padding-top: 67px;
    width: 190px;
    height: 200px;
    padding: 84px 20px;
    float: left;
    line-height: 2.5em;
    font-size: 0.6em;
    box-sizing: border-box;
}
.pm-cart-overview.__compact .cartRow ._description{
	clear:both;
	display:none;
}
.pm-cart-overview.__compact .cartRow ._quantity{
	    padding-left: 25px;
    padding-top: 76px;
    width: 170px;
    height: 200px;
    float: left;
    box-sizing: border-box;
}
.pm-cart-overview.__compact .cartRow ._quantity ._input{
	width: 85px;
    margin: 1%;
    float: left;
}
.pm-cart-overview.__compact .cartRow ._price{
    font-size: 0.5em;
    width: 100px;
    padding-left: 0;
    height: 200px;
    padding-right: 0;
}

.pm-cart-overview.__compact .cartRow ._bttn-trash{

	
}	
.pm-cart-overview .cartRow .price-sticker{
    display: block;
    font-size: 2em;
    color: #FFF;
    font-weight: 900;
    /* border-radius: 100%; */
    background-color: #000;
    /* width: 110px; */
    /* height: 110px; */
    box-sizing: border-box;
    position: absolute;
    line-height: 1em;
    right: 0;
    bottom: 0;
    padding: 10px 10px;
    text-align: center;
    overflow: hidden;
}	


/* TICKER */
#tickerbar{
    position: absolute;
    height: 38px;
    left: 0;
    right: 0;
    z-index: 1;
    box-sizing: border-box;
    padding-top: 3px;
    background-color: #000;
    color: #FFF;
    overflow: hidden;
    animation: tickerstart 4s 1 step-start ;
    bottom: 0;
}
#tickerbar h1{
	text-align:center;
	font-size: 25px;
}
#tickerbar .tickers{
    display: inline-block;
    white-space: nowrap;
    font-weight: 600;
}



@keyframes tickerstart{
    
    0% {
          background-color: #000;
          
      }
    3% {
          background-color: #efefef;
      }
    5% {
          background-color: #000;
          padding-top:0px;padding-right:50px
      }
    6% {
          background-color: #2A292C;
      }
    8% {
          background-color: #bbb;padding-top:7px;padding-left:50px
      }
    10% {
          background-color: #000;
      }

}

@keyframes ticktick{
    from {
          transform:translateX(0);
      }
      to {
          transform:translateX(-50%);
      }
}

@keyframes ticktick{
    from {
          transform:translateX(0);
      }
      to {
          transform:translateX(-50%);
      }
}

#tickerbar ul.tickerding,
#tickerbar ul.tickerding li{list-style-type: none;margin:0;padding:0;white-space: nowrap;display:inline-block}

#tickerbar ul.tickerding li{
	padding:2px 10px 2px 30px;
    font-size: 12px;
	/*background-image: url('/svg/13monsters/ffffff/ticker-dot.svg');	*/
	background-image:url(../../images/13monsters/monsters/elementals/air.svg);
background-repeat:no-repeat;background-position: left center; background-size: auto 20px;
animation: elementals 10s infinite;
}

@keyframes elementals{
	0%{
		background-image:url(../../images/13monsters/monsters/elementals/air.svg?t=1);
	}20%{
		background-image:url(../../images/13monsters/monsters/elementals/earth.svg?t=1);
	}40%{
		background-image:url(../../images/13monsters/monsters/elementals/water.svg?t=1);
	}60%{
		background-image:url(../../images/13monsters/monsters/elementals/fire.svg?t=1);
	}100%{
		background-image:url(../../images/13monsters/monsters/elementals/air.svg?t=1);
	}
}

#liveQuote{
	
}
#liveQuote ._author{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1448' height='46' viewBox='0 0 1447.5 45.5'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23E30F6F;stroke-width:2;stroke-miterlimit:10;%7D%0A%3C/style%3E%3Cpolyline class='st0' points='0 4 1317.2 4 1368.7 43.4 1368.7 1 1447.5 1 '/%3E%3C/svg%3E");
	    background-repeat: no-repeat;
    background-size: 100% auto;
    height: 35px;
    padding-top: 5px;

}
#liveQuote ._quote{
	
}




/* checkbox */
.inp-checkbox .input{
	    display: inline-block;
    height: 25px;
    margin: 5px 8px -5px 0px;
    width: 25px;
    background-image: url(/svg/13monsters/efefef-efefef/icon-check.svg);
    background-size: 100% auto;
    margin-left: -25px;
    transition: all 0.3s;
}

.inp-checkbox.__checked .input{
	background-image: url(/svg/13monsters/000000-ffffff/icon-check.svg);
}
.inp-checkbox:before{
display:none!important;	
}
.layout label.inp-radio, .layout label.inp-checkbox {
    padding-left: 20px;
    min-height: 20px;
}

/* swap images */
.pm-swap-target{
	transition: all 0.5s;
}
.pm-swap-trigger{
	cursor: pointer;
}


#coupon-teaser{

}
#coupon-reveal{
	display:none; 
}
#coupon-teaser,
#coupon-reveal
{
}

#coupon-video-1{
	position:absolute;
	z-index:2;
	 width: 100%;
}
#coupon-video-2{
	position:absolute;
	    width: 100%;

}
.button.half_off{
	opacity: 0.3;
}

#til-stats{
	display:none;
    position: absolute;display:block;
    right:0;top:0;background-color:#000;
    color:#FFF;z-index:11;padding:5px;
}

.til-percentage{
    position: absolute;display:none;
    right:0;top:0;background-color:#000;
    color:#FFF;z-index:11;padding:5px;
}
#layout.live_edit #til-stats,
#layout.live_edit .til-percentage{
/*display:block;	*/
}