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

#top {
    height:60px;
    background: #fff;
}

#right {
    background: #5288f7;
    z-index: 1;
}

#left {
    background: #fb5737;
    z-index: 1;
}

#logo {
    width:120px;
}

#worklink, #aboutlink {
    opacity:1;
}

#project_bar {
	width:100vw;
	height:60px;
	position: fixed;
	background: #f8edd9;
	border-bottom:1px solid #000;
	display: flex;
	align-items: center;
	justify-content: center;
	top:60px;
	z-index: 2;
}

#project_bar h1 {
	color: #000;
	margin: 0;
	padding: 0px;
}

.main_content {
    top:120px;
    border-top:0;
}

.about_holder {
	position: relative;
	top:120px;
	margin:0 auto;
	width:calc(100% - 120px);
	border-top:0;
	border-bottom: 1px solid #000;
}

.colorsticker {
	fill:#f4d227;
}

.about_left {
	position: fixed;
	top: 120px;
	left: 60px;
	width: calc(50% - 61px);
	height: 50vh;
	border-right: 1px solid #000;
	background-image: url("https://okaynice.work/assets/images/gallery/okay_about.jpg");
	background-size: cover;
	background-repeat: no-repeat;
}

.about_left2 {
	position: fixed;
	top: calc(50vh + 120px);
	left: 60px;
	width: calc(50% - 61px);
	height: calc(50vh - 120px);
	border-right: 1px solid #000;
	border-top: 1px solid #000;
}

.about_left2 svg {
width: 100%;
height: calc(50vh - 120px);
}

.about_right {
	position:relative;
	width:calc(50% - 1px);
	left:50%;
	min-height: 100vh;
	padding-top:4%;
}

.about_right p {
	width:80%;
	padding:2% 10%;
	margin:0;
}

.about_full {
	width: calc(100vw - 120px);
	margin: 0 auto;
	position: relative;
	height: 100vh;
	background-image: url("../img/about2.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;

}

.footer {
	position:relative;
}