@charset "utf-8";

/* CSS Document */

body {

	margin: 0;
	padding: 0;
	background: #000;
	font-size:16px;	
	-moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
}

* {margin:0; padding:0;}

section {
	width:100%;
}

.active_dot {
	width:.8vw;
	height:.8vw; 
	display:inline-block; 
	vertical-align: middle; 
	border-radius: 50%; 
	background:#69da91;
}

.home {
	background: #f9f9f9;
	width:100%;
    min-height: 78vh;
	position: relative;
}

.contact {
	background: #f9f9f9;
	padding-bottom:2%;
}

.contact_intro {
	position:relative;
	display: flex;
	align-items: center;
	justify-content:center;
}

h2.contactText {
	font-family:"Austin", 'Lucida Console', Monaco, monospace; font-size-adjust:0.5; font-weight:500; font-style:normal;
	font-size: 4.4vw;
	line-height: 4.68vw;
	letter-spacing: .5px;
	padding:2% .5% 2% 0%;
	width:60%;
}

h3.emailText {
	font-family:"GT-Cinetype", 'Lucida Console', Monaco, monospace; font-size-adjust:0.5; font-weight:100; font-style:normal;
	font-size: 1.4vw;
	letter-spacing: .5px;
	color:#000;
	margin:0;
	padding:10px 18px 10px 18px;
	border:1px solid #000;
	border-radius:30px;
	background: #f9f9f9;
	position: absolute;
	right:2%;
	bottom:2%;
}

h4.disclaimer {
	font-family:"Austin", 'Lucida Console', Monaco, monospace; font-size-adjust:0.5; font-weight:100; font-style:normal;
	font-size: 1.2vw;
	line-height: 2vw;
	letter-spacing: .5px;
	color:#000;
	position: absolute;
	bottom: 2%;
}

.black_text {
	color:#f9f9f9 !important;
}

.bar {
	width:100%;
	position: absolute;
	bottom:0px;
	overflow: hidden;
}

.bar_split {
	position: relative;
	float:left;
	overflow: hidden;
	width:50%;
	padding:0% 0% 0% 2%;
	display: flex;
	align-content: center;
}

h4.bar_text {
	font-family:"Austin", 'Lucida Console', Monaco, monospace; font-size-adjust:0.5; font-weight:500; font-style:normal;
	font-size: 1.2vw;
	line-height: 1.4vw;
	letter-spacing: .5px;
	color:#000;
	padding:1% 2% 4% 0%;
}

.intro {
	width:100%;
	padding:2% 20% 8% 2%;
    position: relative;
}

.homeText {
	display: inline;
	font-family:"Austin", 'Lucida Console', Monaco, monospace; font-size-adjust:0.5; font-weight:500; font-style:normal;
	font-size: 4vw;
	line-height: 4.48vw;
	letter-spacing: .5px;
	color:#000;
}

ul#exp {
	list-style: none;
	padding: 4% 10% 4% 0%;
}

ul#exp li {
	display: flex;
	font-size: .8vw;
	line-height: 1vw;
	letter-spacing: 1px;
	border-bottom: 1px solid #000;
	padding:2% 0%;
}

p.org {
	width:50%;
	margin-right:5%;
}

p.role {
	width:30%;
	margin-right:5%;
}

.year {
	width:10%;
	text-align: right;
}

#readmore {
	font-size: 4vw;
	line-height: 4.48vw;
	color:#000;
	cursor: pointer;
}
.cinetype {
	font-family:"GT-Cinetype", 'Lucida Console', Monaco, monospace; font-size-adjust:0.5; font-weight:100; font-style:normal;
}

.austin {
	font-family:"Austin", 'Lucida Console', Monaco, monospace; font-size-adjust:0.5; font-weight:500; font-style:normal;
}

.morecontent {
	display: none;
	width: 100%;
	overflow: hidden;
	padding:2% 0;
}

.morecontent_left {
	width:50%;
	float:left;
}

.morecontent_right {
	width:50%;
	float:left;
}

.moretxt {
	font-size: 1.2vw;
	line-height: 1.4vw;
	padding:4% 10% 4% 0%;
	letter-spacing: 1px;
}

.content {
	width:100%;
}

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

.one {
	width:100%;
	background: #222; 
}

.two {
	overflow: hidden;
	display: flex;
	align-items: flex-start;
}

.two img {
	width:50%;
	float:left;
}

.video_holder {
	width:50%;
	float:left;
	display: flex;
	align-content: center;
	justify-content: center;
}

.video_holder video {
	width:80% !important;
	display: block;
}


.andjuliet_holder {
	background:#000; 
	overflow:hidden; 
	align-items: center;
}

.andjuliet_video_holder {
	width:50%; 
	float:left; 
	position: relative; 
	display: flex; 
	align-items: center; 
	justify-content: center;
}

.andjuliet_video {
	width:100%; 
	display:flex; 
	align-content:center; 
	justify-content:center; 
	position:absolute; 
	z-index:1;
}

.aj_video {
	width:35%; 
	border-radius:2vw; 
	border:2px solid #ecece4;
}

#okn {
	width:100%;
	height:100vh;
	position: relative;
	background: #f8edd9;
	border-top:1px solid #000;
	border-bottom:1px solid #000;
}

.okn_half {
	width:50%;
	display:flex; 
	align-content: center; 
	justify-content: center;
    background: linear-gradient(0deg, rgba(255,222,59,1) 0%, rgba(0,167,93,1) 35%, rgba(82,136,247,1) 100%);
}

.okn_half img {
	width:10vw;
}

.okn_half:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.formaika_bg {
	display:flex; 
	align-content: center; 
	justify-content: center;
	background-image: url("../img/formaika/bg.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 100vh;
}

.formaika_bg img {
	width:12vw;
}

.formaika_split {
	width:50%;
	display:flex; 
	align-content: center; 
	justify-content: center;
}

.formaika_split:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

#formaika_split_1 {
	background: #000;
}

#formaika_split_1 img {
	width:20vw;
}

#formaika_split_2 {
	background: #fff;
}

#formaika_split_2 img {
	width:30vw;
}

#top {
	width:100%;
	height:80px;
	background: #fff;
	position: absolute;
	top:0px;
	left:0px;
	border-bottom: 1px solid #000;
	z-index: 4;
	display: flex;
	align-items: center;
	justify-content: center;
}

#top img {
	width: 120px;
}

#right {
	display: block;
	width:80px;
	height:100vh;
	background: #fb5737;
	position: absolute;
	top:0px;
	right:0px;
	border-left: 1px solid #000;
	z-index: 3;
}

#bottom {
	width:100%;
	height:80px;
	position: absolute;
	bottom:0px;
	left:60px;
	border-top: 1px solid #000;
	z-index: 1;
	background: #f8edd9;
	display: flex;
	justify-content: center;
}

#left {
	display: block;
	width:80px;
	height:100vh;
	background: #5288f7;
	position: absolute;
	top:0px;
	left:0px;
	z-index: 3;
	border-right: 1px solid #000;
}

#sign {
	position: absolute;
	bottom:0px;
	right:50%;
	left:50%;
	margin-left:-16vw;
	width: 32vw;
	z-index: 5;
}

#sticker_holder {
	width:calc(100vw - 160px);
	height:calc(100vh - 160px);
	position: relative;
	top:80px;
	left:80px;
	display: flex;
	align-items: center;
	justify-content: center;
}

#sticker_holder img{
	width: 50vw; 
	margin-bottom:8vw;
}

.colorsticker {
fill: #000;
}

#sticker {
	width:6vw;
	height:6vw;
	z-index: 1;
	position: absolute;
    animation: moveX 2s linear 0s infinite alternate, moveY 3.4s linear 0s infinite alternate;
}

	@keyframes moveX {
	  from { left: 0;  } to { left: calc(100% - 6vw); }
	}

	@keyframes moveY {
	  from { top: 0; } to { top: calc(100% - 6vw); }
	}

.link {
	position:fixed; 
	bottom:20px;
	right:20px;
	background:#000;
	border-radius:10px;
	opacity:0;
	transition: all .48s ease-in;
	visibility: hidden;
	overflow: hidden;
	width:42vw;
	border:1px solid #000;
	box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.06);
	z-index: 9;
}

.link_holder {
	position: relative;
	overflow: hidden;
}

.link_desc {
	background: rgba(0, 0, 0, 0) radial-gradient(ellipse at center center , #e9e9e9 40%, #e9e9e9 40%, #ffffff 100%) repeat scroll 0 0;
	width:100%;
}

.marq {
	font-family:"Austin", 'Lucida Console', Monaco, monospace; font-size-adjust:0.5; font-weight:500; font-style:normal;
	animation: marquee 5s linear infinite;
	font-size: 1.2vw;
	letter-spacing: 0px;
	color:#000;
	padding:20px;
	white-space: nowrap;
	
}

@keyframes marquee {
  0% { transform: translateX(80%); }
  100% { transform: translatex(-80%); }
}

.link_name {
	position:absolute;
	white-space: nowrap;
	left:0;
	top:0;
	z-index: 2;
}

.link_visit {
	position:absolute;
	white-space: nowrap;
	right:0;
	top:0;
	min-height: 100%;
	background: #000;
	transition: all .18s ease-in;
}

.link_visit:hover{
	/*padding-left:4%;*/
}

p.link_name_txt {
	font-family:"Austin", 'Lucida Console', Monaco, monospace; font-size-adjust:0.5; font-weight:500; font-style:normal;
	font-size: 1.2vw;
	letter-spacing: 0px;
	color:#000;
	padding:20px;
	white-space: nowrap;
}

p.link_txt {
	font-family:"GT-Cinetype", 'Lucida Console', Monaco, monospace; font-size-adjust:0.5; font-weight:500; font-style:normal;
	font-size: 1vw;
	letter-spacing: 1px;
	color:#fff;
	padding:22px;
	white-space: nowrap;
}

p.link_txt a {
	color:#fff;
	text-decoration: none;
}

.hover {
	opacity: 1;
	visibility: visible;
}

.link:hover {
	opacity: 1;
	visibility: visible;
}

.flexed {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
	background: rgb(34,0,85);
background: radial-gradient(circle, rgba(0,0,0,.9) 0%, rgba(0,0,0,1) 80%,  rgba(0,0,0,1) 100%);
}

.centered_overlappings {
	width:48%;
	position: fixed;
	z-index: 1;
	box-shadow: 0px 10px 30px rgba(0,0,0, .2);
}

.centered_overlappings:hover {
	z-index: 2;
	cursor: pointer;
}

.co_1 {
	transform: rotate(-3deg); 
	width:60%
}

.co_2 {
	transform: rotate(11deg); 
	width:55%;
}

.co_3 {
	transform: rotate(-4deg); 
	width:52%;
}

.co_4 {
	transform: rotate(4deg); 
	width:42%;
}

.co_5 {
	transform: rotate(30deg); 
	width:58%;
}