@charset "UTF-8";
/* CSS Document */
html {
    font-family: "Helvetica", "Arial", "Verdana", sans-serif;
}
body{
    background: #FFF; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left top, #FFF, #CCC); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom right, #FFF, #CCC); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom right, #FFF, #CCC); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom right, #FFF, #CCC); /* Standard syntax */
    background-repeat: no-repeat;
    margin: auto;
    height: 100%;
	overflow-x: hidden;
}
#bod {
}
/* Responsive columns setting */
* {
    box-sizing: border-box;
}
.row::after {
    content: "";
    clear: both;
    display: table;
	overflow: hidden;
}
[class*="col-"] {
    float: left;
    padding: 1px;
}
@media only screen and (max-width: 400px) {
/* For mobile phones: */
    .col-s-1 {width: 8.33%;}
    .col-s-2 {width: 16.66%;}
    .col-s-3 {width: 25%;}
    .col-s-4 {width: 33.33%;}
    .col-s-5 {width: 41.66%;}
    .col-s-6 {width: 50%;}
    .col-s-7 {width: 58.33%;}
    .col-s-8 {width: 66.66%;}
    .col-s-9 {width: 75%;}
    .col-s-10 {width: 83.33%;}
    .col-s-11 {width: 91.66%;}
    .col-s-12 {width: 100%;}
}
@media only screen and (min-width: 401px) {
    /* For tablets: */
    .col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}
}
@media only screen and (min-width: 768px) {
    /* For desktop: */
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}
/* The header */
.header {
    overflow: hidden;
    width: 250px;
    height: 180px;
    background: no-repeat;
    background-image: url(../img/WC_logo.png);
    margin: auto;
	margin-top: 50px;
    padding: 10px 0 20px 0;
	z-index: 5;
}
/* The navbar container */
.menuBar {
	width: 100%;
	height: 46px;
	position: fixed;
    background-color: #000;
    top: 0;
    opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */
	z-index: 4;
}
.menu {
    margin: 0;
    opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */
    top: 0;
	right: 0;
    position: fixed;
	z-index: 5;
}
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
	cursor: pointer;
}
li {
    float: left;
	text-transform: uppercase;
	letter-spacing: 2px;
    margin: 0;
}
/* The dropdown menu */
li a, .dropbtn {
    display: inline-block;
    color: white;
    padding: 14px 16px;
}
li a:hover, .dropdown:hover .dropbtn {
    background-color: #8A7783;
	width: 100%;
}
li.dropdown {
    display: inline-block;
}
.dropdown-content {
    display: none;
	position: absolute;
	text-transform: none;
	letter-spacing: normal;
	right: 0;
    width: 100%;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	cursor: pointer;
    z-index: 4;
	background-color: #FFF;
}
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    display: block;
    text-align: left;
}
.dropdown-content a:hover {
    background-color: #8A7783;
}
.dropdown:hover .dropdown-content {
    display: block;
}
/* The headings */
h1, h2, h3, h4, h5, h6{
    font-family: "Helvetica", "Arial", "Verdana", sans-serif;
    margin: 0;
}
h1{
    font-size: 1.5em;    /* 24px/16=1.5em */
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;
	letter-spacing: 0.2em;    /* 3.2px/16=0.2em */
	color: #999;
	margin: 20px;
}
h2{
	font-size: 2.5em; /* 32px/16=2em */
	font-weight: lighter;    /* #EA4E33 */
	letter-spacing: -1px;
	line-height: 1.1;
	color: #FFF;
}
h3{
    font-size: 1.25em;    /* 20px/16=1.25em */
	font-weight: lighter;    /* #EA4E33 */
	letter-spacing: -0.5px;
	line-height: 1.4;
	color: #FFF;
}
h4{
    font-size: 20px;
}
h5{
    font-size: 16px;
}
h6{
    font-size: 14px;
}
#colorPurple {
    color: rgb(165, 147, 172);
}
a:link {
	text-decoration: none;
}
.links {
	font-size: 14px;
	color: #FFF;
	cursor: pointer;
	float: left;
}
.links:hover {
	text-decoration: underline;
}
p {
	font-size: 1em; /* 16px/16=1em */
	font-weight: normal;
	line-height: 1.5;
	color: #FFF;
}
p.intro-main {
	font-size: 1.75em; /* 28px/16=1.75em */
	font-weight: lighter;
	letter-spacing: -1px;
	line-height: 1.4;
	color: #444;
}
p.contact {
	font-size: 1.5em; /* 24px/16=1.5em */
	font-weight: lighter;
	line-height: 1.4;
	text-align: center;
	color: #888;
}
/* Intro */
.intro-container {
	text-align: left;
	display: block;
	margin: auto;
	max-width: 1200px;
	padding: 25px;
}
.intro-bluegrn {
    background-color: #80BCBC;
	transform: skewY(-5deg);
	opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */
	padding: 20px;
}
/* Section */
.section-container {
	position: relative;
	margin: auto;
	max-width: 1200px;
	height: auto;
	margin-top: 50px;
	margin-bottom: 50px;
}
#section-bg {
	pointer-events: none;
	position: fixed;
	margin: auto;
	max-width: 100%;
	height: auto;
	z-index: 0;
	-webkit-animation: floating 3s ease-in-out 1s infinite;    /* Safari 4.0 - 8.0 */
	animation: floating 3s ease-in-out 1s infinite;
}
#section-layer-mid {
	pointer-events: none;
	position: fixed;
	margin: auto;
	max-width: 100%;
	height: auto;
	z-index: 2;
	opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
    -webkit-animation: slowMoveUp 60s infinite;    /* Safari 4.0 - 8.0 */
	animation: slowMoveUp 60s infinite;
}
#section-layer-mid2 {
	pointer-events: none;
	position: fixed;
	margin: auto;
	max-width: 100%;
	height: auto;
	z-index: 2;
	opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
    -webkit-animation: slowMoveUp2 60s infinite;    /* Safari 4.0 - 8.0 */
	animation: slowMoveUp2 60s infinite;
	-webkit-animation-delay: 30s;    /* Safari 4.0 - 8.0 */
	animation-delay: 30s;
}
.section-purple {
	position: relative;
	margin-bottom: 100px;
	background-color: rgba(165, 147, 172, 0.7);    /* Purple with opacity */
	transform: skewY(10deg);
	z-index: 1;
}
/* IDs */
/* ID – Full Background */
#full-bg, #full-bg-M, #full-bg-S, #full-bg-G, #full-bg-NB, #full-bg-O {
	width: 100%;
	height: auto;
	position: relative;
	margin: auto;
}
#ex-test {
	width: 100%;
	height: auto;
	position: relative;
	margin: auto;
}
/* ID – Cubes Position */
#cubesPos {
}
/* Graphics */
/* Exclaimation */
.exclaimation {
	width: 200px;
	height: 300px;
	position: absolute;
	bottom: 0;
    right: 50px;
	background: url(../img/img_spr_exclaimation_7200px.svg) left center;
	background-repeat: no-repeat;
	opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */
	transform: skewY(5deg) scale(1.4,1.4);
	z-index: -1;
    -webkit-animation: play 4s steps(36) infinite;    /* Safari 4.0 - 8.0 */
	animation: play 4s steps(36) infinite;
}
@media only screen and (max-width: 767px) {
	.exclaimation {
		transform: skewY(5deg) scale(1,1);
		opacity: 0.8;
	    filter: alpha(opacity=80); /* For IE8 and earlier */
		right: 20px;
		bottom: -80px;
	}
}
@media only screen and (max-width: 400px) {
	.exclaimation {
		transform: skewY(5deg) scale(0.9,0.9);
		opacity: 0.7;
	    filter: alpha(opacity=70); /* For IE8 and earlier */
		right: 0px;
		bottom: -90px;
	}
}
/* QUESTION MARK */
.questionMark {
	pointer-events: none;
	display: flex;
    justify-content: center;
	width: 200px;
	height: 300px;
    margin: auto;
	background: url(../img/question_mark_03.svg) left center;
	background-repeat: no-repeat;
	float: left;
	opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
	transform: scale(1.3,1.3);
	z-index: -1;
    -webkit-animation: play 4s steps(36) infinite;    /* Safari 4.0 - 8.0 */
	animation: play 4s steps(36) infinite;
}
@media only screen and (max-width: 767px) {
	.questionMark {
		transform: scale(1.2,1.2);
	}
}
@media only screen and (max-width: 400px) {
	.questionMark {
		transform: scale(1.1,1.1);
	}
}
/* QUOTATION MARKS */
.open-quotation {
	width: 130px;
	height: 100px;
	position: absolute;
	top: -30px;
    left: 50px;
	background: url(../img/open_quotation.svg) left center;
	background-repeat: no-repeat;
	opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */
	transform: skewY(-10deg) scale(1.5,1.5);
	z-index: 3;
    -webkit-animation: playQuotation 4s steps(36) infinite;    /* Safari 4.0 - 8.0 */
	animation: playQuotation 4s steps(36) infinite;
}
.close-quotation {
	width: 130px;
	height: 100px;
	position: absolute;
	bottom: -30px;
    right: 50px;
	background: url(../img/open_quotation.svg) left center;
	background-repeat: no-repeat;
	opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */
	transform: skewY(-10deg) rotate(180deg) scale(1.5,1.5);
	z-index: 3;
    -webkit-animation: playQuotation 4s steps(36) infinite;    /* Safari 4.0 - 8.0 */
	animation: playQuotation 4s steps(36) infinite;
}
@media only screen and (max-width: 767px) {
	.open-quotation {
		transform: skewY(-10deg) scale(1.3,1.3);
	    left: 30px;
	}
	.close-quotation {
		transform: skewY(-10deg) scale(1.3,1.3);
	    right: 30px;
	}
}
@media only screen and (max-width: 400px) {
	.open-quotation {
		transform: skewY(-10deg) scale(1,1);
	    left: 0;
	}
	.close-quotation {
		transform: skewY(-10deg) scale(1,1);
	    right: 0;
	}
}
/* CUBES */
.cubes {
	width: 100px;
	height: 100px;
	position: absolute;
	overflow: hidden;
	opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */
}
.cubesSpecial {
	width: 100px;
	height: 100px;
	position: absolute;
	overflow: hidden;
	float: right;
	opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */
}
.cubesOnMenu1 {
	width: 17px;
	height: 14px;
	overflow: hidden;
	opacity: 0.9;
}
.cubes1 {
	background: url(../img/CUBES1.svg) left center;
	transform: scale(0.6,0.6);
	z-index: -2;
	opacity: 0.5;
    filter: alpha(opacity=50); /* For IE8 and earlier */
}
.cubes2 {
    background: url(../img/CUBES2.svg) left center;
	transform: scale(0.3,0.3);
	z-index: -5;
}
.cubes3 {
	background: url(../img/CUBES3.svg) left center;
	transform: scale(0.7,0.7);
	z-index: 0;
	opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
}
.cubes4 {
	background: url(../img/CUBES4.svg) left center;
	transform: scale(0.3,0.3);
	z-index: 1;
	opacity: 0.3;
    filter: alpha(opacity=30); /* For IE8 and earlier */
}
.cubes5 {
	background: url(../img/CUBES5.svg) left center;
	transform: scale(0.4,0.4);
	z-index: 0;
}
.cubes6 {
	background: url(../img/CUBES6.svg) left center;
	transform: scale(0.2,0.2);
	opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
	z-index: -1;
}
.cubes7 {
	background: url(../img/CUBES7.svg) left center;
	transform: scale(0.5,0.5);
	opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
	z-index: 1;
}
.cubes8 {
	background: url(../img/CUBES8.svg) left center;
	transform: scale(0.3,0.3);
	opacity: 0.6;
    filter: alpha(opacity=60); /* For IE8 and earlier */
	z-index: 0;
}
.arrow-purple-l {
	pointer-events: none;
	width: 150px;
	height: 150px;
	position: absolute;
	margin: -50px 0 0 -50px;
	background: url(../img/arrow_purple_L.svg) left center;
	background-repeat: no-repeat;
	transform: scale(0.9,0.9);
	opacity: 0.6;
    filter: alpha(opacity=60); /* For IE8 and earlier */
	z-index: 3;
    -webkit-animation: arrowMove 1s steps(8) infinite;    /* Safari 4.0 - 8.0 */
	animation: arrowMove 1s steps(8) infinite;
}
.arrow-purple-r {
	pointer-events: none;
	width: 150px;
	height: 150px;
	resize: both;
	position: absolute;
	right: -20px;
	bottom: -20px;
	background: url(../img/arrow_purple_L.svg) left center;
	background-repeat: no-repeat;
	transform: rotate(180deg) scale(0.5,0.5);
	opacity: 0.6;
    filter: alpha(opacity=60); /* For IE8 and earlier */
	z-index: 3;
    -webkit-animation: arrowMove 1s steps(8) infinite;    /* Safari 4.0 - 8.0 */
	animation: arrowMove 1s steps(8) infinite;
}
@media only screen and (max-width: 767px) {
	.arrow-purple-l {
		margin: -75px 0 0 -75px;
		transform: scale(0.7,0.7);
	}
}
@media only screen and (max-width: 400px) {
	.arrow-purple-l {
		margin: -80px 0 0 -80px;
		transform: scale(0.5,0.5);
	}
}
.button-arrow {
	position: absolute;
	bottom: -25px;
	right: 10px;
	width: 45px;
	height: 45px;
	cursor: pointer;
	background: url(../img/arrow_purple_onMenu.svg) left center;
	background-repeat: no-repeat;
	transform: rotate(-45deg);
    -webkit-animation: arrowBtnMove 1s steps(8) infinite;    /* Safari 4.0 - 8.0 */
	animation: arrowBtnMove 1s steps(8) infinite;
}
/* End of Graphics */
/* Logos */
.logos-center {
	position: relative;
	overflow: hidden;
    display: -webkit-flex; /* Safari */
	-webkit-justify-content: center; /* Safari 6.1+ */
	display: flex;
    justify-content: center;
	z-index: 3;
}
.logo-container {
	position: relative;
	overflow: hidden;
	float: left;
	border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.9);    /* White with opacity */
    object-fit: scale-down;
	margin: 10px;
    cursor: pointer;
    z-index: 3;
}
.logo-container:hover, .logo-container:active {
    background-color: rgba(255, 255, 255, 0.6);    /* White with opacity */
}
#others {
    background-color: rgba(146, 125, 136, 0.6);    /* White with opacity */
}
#others:hover {
    background-color: rgba(146, 125, 136, 0.5);    /* White with opacity */
}
#icon-contact {
    background-color: rgba(128, 188, 188, 0.6);    /* White with opacity */
}
#icon-contact:hover {
    background-color: rgba(128, 188, 188, 0.5);    /* White with opacity */
}
.logo img {
	overflow: hidden;
    width: 100%;
    height: auto;
	cursor: pointer;
}
/* The gallery */
.gallery-container {
    padding: 0 0 0 20px;
	border-right: 30px solid #CCC;
	border-top: 30px solid transparent;
	transform: skewY(-10deg);
	position: relative;
    box-sizing: border-box;
	opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
    margin: 0;
}
.gallery-topbar {
	display: table;
	margin-top: -30px;
	margin-left: 15px;
	height: 30px;
	width: 100%;
	float: none;
	opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */
	transform: skewX(-45deg);
	background-color: #FFF;
}
.gallery-corner {
	width: 0;
	height: 0;
	position: absolute;
	margin-right: -30px;
	margin-bottom: -30px;
	right: 0;
	bottom: 0;
	float: right;
	border-left: 30px solid #CCC;
	border-bottom: 30px solid transparent;
}
.off-top {
	margin-top: 50px;
}
.gallery {
    margin: 0;
	padding: 0;
	margin-bottom: -33px;
}
.gallery img {
    width: 100%;
    height: auto;
}
.gallery-description {
	position: relative;
    background-color: #879DA7;
    color: #FFF;
    font-size: 18px;
    padding: 15px;
}
/* Rollovers */
#modal-Kmouseover, #modal-Shmouseover, #modal-Gmouseover, #modal-NBmouseover {
    display: none;    /* Hidden by default */
	position: fixed;    /* Stay in place */
	top: 0;
    width: 100%;    /* Full width */
    height: 100%;    /* Full height */
	z-index: 2;    /* Sit behind icons only */
	overflow-x: auto;
}
#modal-Mmouseover {
    display: none;    /* Hidden by default */
	position: fixed;    /* Stay in place */
	top: 0;
	opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
    width: 100%;    /* Full width */
    height: 100%;    /* Full height */
	z-index: 2;    /* Sit behind icons only */
	overflow-x: auto;
}
.kinderino {
	position: absolute;
	width: 200px;
	height: 200px;
	left: 10%;
    top: 20%;
	background: url(../img/rollover/kinderino_turn_sprites.png) left center;
    background-repeat: no-repeat;
	transform: scale(1.5,1.5);
    -webkit-animation: kinderinoMove 0.8s steps(4) infinite;    /* Safari 4.0 - 8.0 */
	animation: kinderinoMove 0.8s steps(4) infinite;
}
.propertySheraton {
	position: absolute;
	width: 370px;
	height: 348px;
	transform: rotate(-10deg);
	background-image: url(../img/rollover/sheraton_property_photo.jpg);
	background-repeat: no-repeat;
	box-shadow: 5px 5px 10px #666;
	opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
    -webkit-animation: moveIn 4s ease-in-out 0.1s infinite;    /* Safari 4.0 - 8.0 */
	animation: moveIn 4s ease-in-out 0.1s infinite;
	z-index: -3;
}
.chipMemoriki {
	position: absolute;
	width: 200px;
	height: 200px;
	left: 10%;
	top: 50%;
	background:url(../img/Memoriki_chip_05.svg) left center;
	background-repeat: no-repeat;
    -webkit-animation: play 2s steps(36) infinite;    /* Safari 4.0 - 8.0 */
	animation: play 2s steps(36) infinite;
}
.bubbles1 {
	position: absolute;
	width: 200px;
	height: 200px;
	opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
	background-image: url(../img/rollover/bubble.png);
}
.bubbles2 {
	position: absolute;
	width: 200px;
	height: 200px;
	opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
	transform: scale(1.5,1.5);
	background-image: url(../img/rollover/bubble.png);
}
.bubbles3 {
	position: absolute;
	width: 200px;
	height: 200px;
	opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
	transform: scale(0.6,0.6);
	background-image: url(../img/rollover/bubble.png);
}
.nb-minimus {
	position: absolute;
	width: 400px;
	height: 419px;
	left: 70%;
	opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */
	background-image: url(../img/rollover/NB_minimus_KV.png);
    -webkit-animation: nBMoveUp 0.3s ease-in-out 0.1s forwards;    /* Safari 4.0 - 8.0 */
	animation: nBMoveUp 0.3s ease-in-out 0.1s forwards;
}
@media only screen and (max-width: 400px) {
	.kinderino {
		transform: scale(1.2,1.2);
	}
	.propertySheraton {
		transform: rotate(-10deg) scale(0.7,0.7);
	}
	.chipMemoriki {
		transform: scale(0.8,0.8);
	}
	.bubbles2 {
		transform: scale(0.3,0.3);
	}
    .nb-minimus {
	    left: 10%;
		transform: scale(0.7,0.7);
	}
}
/* The Modals */
.modal {
    display: none;    /* Hidden by default */
	position: fixed;    /* Stay in place */
	top: 0;
    width: 100%;    /* Full width */
    height: 100%;    /* Full height */
    background-color: rgb(0, 0, 0);    /* Fallback color */
    background-color: rgba(0, 0, 0, 0.8);    /* Black with opacity */
	z-index: 4;    /* Sit on top */
	overflow-x: hidden;
}
/* The modal box */
.clone-container {
	position: initial;
	width: 100%;
	height: auto;
}
.full-box, .full-box-M, .full-box-S, .full-box-G, .full-box-NB, .full-box-O {
	margin-top: 50px;
}
.modal-container {
	margin-top: 30px;
	padding: 0;
	height: auto;
	width: 100%;
	float: left;
}
.modal-pic-frame {
	position: relative;
	transform: skewY(10deg);
	width: 100%;
	height: auto;
	padding: 0;
	background-color: #FFF;
    background-color: rgba(255, 255, 255, 0.6);    /* White with opacity */
}
.modal-inside-pic-frame {
	margin: 0;
	padding: 0;
	transform: skewY(-10deg);
}
.modal-pic img {
	margin: 0;
    width: 100%;
    height: auto;
    object-fit: contain;
	float: left;
	padding: 0;
	overflow: hidden;
    -webkit-animation: moveDown 1s ease-in 0.5s forwards;    /* Safari 4.0 - 8.0 */
	animation: moveDown 1s ease-in 0.5s forwards;
}
.pic-adjustment {
	transform: skewY(-10deg);
}
#videoK, #videoNB {
	position: relative;
	z-index: 2;
}
.intro-modal {
	text-align: left;
	height: 100%;
	padding: 20px;
    background-color: rgba(112, 163, 190, 0.7);    /* Blue with opacity */
	z-index: 3;
}
.purple {
    background-color: rgba(165, 147, 172, 0.7);    /* Purple with opacity */
}
.modal-text {
	position: relative;
	margin-bottom: 30px;
    background-color: rgba(112, 163, 190, 0.7);    /* Blue with opacity */
	height: auto;
	padding: 20px;
	overflow: hidden;
}
/* The Close Button */
.close {
    color: #FFF;
	position: fixed;
    right: 0;
	margin: 50px 20px 0 0;
    font-size: 28px;
    font-weight: bold;
	z-index: 5;    /* Sit on top */
}
.close:hover,
.close:focus {
    color: #AAA;
    text-decoration: none;
    cursor: pointer;
	z-index: 5;    /* Sit on top */
}
.active {
  background-color: #717171;
}
/* Footer */
#sitemap {
	padding: 10px;
	margin-top: 10px;
	margin-bottom: 10px;
}
.footer {
    background-color: #000;
    color: #ffffff;
    text-align: center;
    font-size: 10px;
    padding: 10px;
	z-index: 5;
}
/* The animation code starts */
@-webkit-keyframes productFadeIn {
	0% {opacity:0;}
	100% {opacity:1}
}
@keyframes productFadeIn {
	0% {opacity:0;}
	100% {opacity:1}
}
@-webkit-keyframes floating {
	0% {margin-top: 0%;}
	50% {margin-top: 1%;}
	100% {margin-top: 0%;}
}
@keyframes floating {
	0% {margin-top: 0%;}
	50% {margin-top: 1%;}
	100% {margin-top: 0%;}
}
@-webkit-keyframes floatingIcon {
	0% {margin-top: 0%;}
	50% {margin-top: 5%;}
	100% {margin-top: 0%;}
}
@keyframes floatingIcon {
	0% {margin-top: 0%;}
	50% {margin-top: 5%;}
	100% {margin-top: 0%;}
}
@-webkit-keyframes slowMoveUp {
	0% {opacity:0; margin-top: 50vh;}
	1% {opacity:0.8;}
	100% {opacity:1; margin-top: -120vh;}
}
@keyframes slowMoveUp {
	0% {opacity:0; margin-top: 50vh;}
	1% {opacity:0.8;}
	100% {opacity:1; margin-top: -120vh;}
}
@-webkit-keyframes slowMoveUp2 {
	0% {opacity:0; margin-top: 50vh;}
	1% {opacity:0.8;}
	100% {opacity:1; margin-top: -120vh;}
}
@keyframes slowMoveUp2 {
	0% {opacity:0; margin-top: 50vh;}
	1% {opacity:0.8;}
	100% {opacity:1; margin-top: -120vh;}
}
@-webkit-keyframes play {
	100% {background-position: -7200px;}
}
@keyframes play {
	100% {background-position: -7200px;}
}
@-webkit-keyframes playQuotation {
	100% {background-position: -4680px;}
}
@keyframes playQuotation {
	100% {background-position: -4680px;}
}
@-webkit-keyframes cubeRoll {
    100% {background-position: -3600px;}
}
@keyframes cubeRoll {
    100% {background-position: -3600px;}
}
@-webkit-keyframes arrowMove {
    100% {background-position: -1200px;}
}
@keyframes arrowBtnMove {
    100% {background-position: -360px;}
}
@-webkit-keyframes arrowBtnMove {
    100% {background-position: -360px;}
}
@keyframes arrowMove {
    100% {background-position: -1200px;}
}
@-webkit-keyframes kinderinoMove {
	100% {background-position: -800px;}
}
@keyframes kinderinoMove {
	100% {background-position: -800px;}
}
@-webkit-keyframes moveIn {
    0% {opacity: 0.8; margin-left: -30%; margin-top: 25%;}
	100% {opacity: 1; margin-left: 110%; margin-top: 10%;}
}
@keyframes moveIn {
    0% {opacity: 0.8; margin-left: -30%; margin-top: 25%;}
	100% {opacity: 1; margin-left: 110%; margin-top: 10%;}
}
@-webkit-keyframes moveDown {
    0% {opacity: 0; margin-top: -100%;}
	100% {opacity: 1; margin-top: 0%;}
}
@keyframes moveDown {
    0% {opacity: 0; margin-top: -100%;}
	100% {opacity: 1; margin-top: 0%;}
}
@-webkit-keyframes chipMoveDown {
    0% {opacity: 0; margin-top: -40%;}
	100% {opacity: 1; margin-top: 0%;}
}
@keyframes chipMoveDown {
    0% {opacity: 0; margin-top: -40%;}
	100% {opacity: 1; margin-top: 0%;}
}
@-webkit-keyframes moveUp {
    0% {opacity: 0.5; margin-top: 50%;}
	100% {opacity: 1; margin-top: -80%;}
}
@keyframes moveUp {
    0% {opacity: 0.5; margin-top: 50%;}
	100% {opacity: 1; margin-top: -80%;}
}
@-webkit-keyframes nBMoveUp {
    0% {opacity: 0; margin-top: 100%;}
	100% {opacity: 1; margin-top: 10%;}
}
@keyframes nBMoveUp {
    0% {opacity: 0; margin-top: 100%;}
	100% {opacity: 1; margin-top: 10%;}
}
@-webkit-keyframes moveRight {
    0% {opacity: 0; margin-left: -100%;}
	100% {opacity: 1; margin-left: 0%;}
}
@keyframes moveRight {
    0% {opacity: 0; margin-left: -100%;}
	100% {opacity: 1; margin-left: 0%;}
}
@-webkit-keyframes moveBackFmRight {
    0% {opacity: 1; margin-left: 0%;}
	100% {opacity: 0; margin-left: -100%;}
}
@keyframes moveBackFmRight {
    0% {opacity: 1; margin-left: 0%;}
	100% {opacity: 0; margin-left: -100%;}
}
@-webkit-keyframes moveLeft {
    0% {opacity: 0; margin-left: 100%;}
	100% {opacity: 1; margin-left: 0%;}
}
@keyframes moveLeft {
    0% {opacity: 0; margin-left: 100%;}
	100% {opacity: 1; margin-left: 0%;}
}
@-webkit-keyframes moveBackFmLeft {
    0% {opacity: 1; margin-left: 0%;}
	100% {opacity: 0; margin-left: 100%;}
}
@keyframes moveBackFmLeft {
    0% {opacity: 1; margin-left: 0%;}
	100% {opacity: 0; margin-left: 100%;}
}