/* #Site Styles
================================================== */


html {
  overflow-y: scroll;
}

body{
	background-color: #fff;
	margin:0px;
	animation: fadein 1s;
	-moz-animation: fadein 1s; /* Firefox */
	-webkit-animation: fadein 1s; /* Safari and Chrome */
	-o-animation: fadein 1s; /* Opera */
	overflow: hidden;
}

/* ----- Page fade : Start ----- */
@keyframes fadein {
  from {opacity:0;}
  to {opacity:1;}
}

@-moz-keyframes fadein { /* Firefox */
  from {opacity:0;}
  to {opacity:1;}
}

@-webkit-keyframes fadein { /* Safari and Chrome */
  from {opacity:0;}
  to {opacity:1;}
}

@-o-keyframes fadein { /* Opera */
  from {opacity:0;}
  to {opacity: 1;}
}
/* ----- Page fade : End ----- */


::selection {background: #ec008c;color: #fff;}
::-moz-selection {background: #ec008c;color: #fff;}

.frame-top {
	width: 100%;
	height: 15px;
	background: #fff;
	position: fixed;
	z-index: 100000;
}
.frame-bottom {
	width: 100%;
	height: 15px;
	background: #fff;
	position: fixed;
	bottom: 0px;
	z-index: 100000;
}
.frame-left-bottom {
	width: 15px;
	height: 100vh;
	background: #fff;
	position: fixed;
	left: 0px;
	bottom: 0px;
	z-index: 100000;
}
.frame-right-bottom {
	width: 15px;
	height: 100vh;
	background: #fff;
	position: fixed;
	right: 0px;
	bottom: 0px;
	z-index: 100000;
}

img {display: block; max-width: 100%; height: auto;}


/* #Page Styles
================================================== */





.twentyyears {
    position: absolute;
    bottom: 20px;
    right: 20px;
    width: 200px;
	z-index: 100;
}


.liquid {
	overflow: hidden;
	padding: 30px 80px;
	width: 100%;
  height: 100vh;
  display: table;
}
.liquid-text {
	display: table-cell;
	vertical-align: middle;
}

.liquid.studiobg {
	background: url('../assets/About_3B.jpg') no-repeat center center #4a2e3e;
	background-size: cover;
  background-blend-mode:multiply;
}

.liquid-text img {
	margin: 0 auto;
	width: 300px;
}

.liquid p.intro {
	  font-family: 'Inter', sans-serif;
	  font-weight: 600;
    color: #fff;
    font-size: 36px;
    line-height: 42px;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
    padding: 0px 50px;
}
.liquid p.intro span {
	  font-family: 'Inter', sans-serif;
	  font-weight: 600;
    color: #d5328a;
    font-size: 36px;
    line-height: 42px;
    text-align: center;
}

.liquid p.intro img {
	width: 100px;
}

.liquid p.smallprint {
	  font-family: 'Inter', sans-serif;
	  font-weight: 600;
    color: #fff;
    font-size: 14px;
    line-height: 18px;
    z-index: 100;
    position: relative;
    text-align: center;
    padding: 0px 50px;
    max-width: 100%;
}

img.studio {
	opacity: 0;
	z-index: 0;
	position: absolute;
	min-width: 100%;
	-webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
a.studio:hover + img.studio {
	opacity: 1;
	-webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}














/* #Media Queries
================================================== */

	/* Over 1600 sizes (devices and browsers) */
	@media only screen and (min-width: 1700px) {}

	/* Desktop 960 to 1300 sizes (devices and browsers) */
	@media only screen and (max-width: 1300px) {


	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {


	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {


	}

	/* Retina Backgrounds */
	@media (-webkit-min-device-pixel-ratio: 1.5) {}
