.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
		background: url(../images/obe-load.gif) center no-repeat #fffd09; background-size:80px;
}

@font-face {
font-family: 'IBM Ital';
font-style: normal;
font-weight: normal;
src: url('../fonts/IBMPlexMono-LightItalic.woff') format('woff');
}

@font-face {
font-family: 'IBM';
font-style: normal;
font-weight: normal;
src: url('../fonts/IBMPlexMono.woff') format('woff');
}

@font-face {
font-family: 'Mad';
font-style: normal;
font-weight: normal;
src: url('../fonts/MADSerif-Black.woff') format('woff');
}

@font-face {
font-family: 'Mezalia';
font-style: normal;
font-weight: normal;
src: url('../fonts/Mezalia-Thin.woff') format('woff');
}

@font-face {
font-family: 'Mezalia Ital';
font-style: normal;
font-weight: normal;
src: url('../fonts/Mezalia-ThinCursive.woff') format('woff');
}

@font-face {
font-family: 'Phrack';
font-style: normal;
font-weight: normal;
src: url('../fonts/PhrackSle.woff') format('woff');
}

@font-face {
font-family: 'Plantin Ital';
font-style: normal;
font-weight: normal;
src: url('../fonts/PlantinStd-Italic.woff') format('woff');
}

@font-face {
font-family: 'Plantin';
font-style: normal;
font-weight: normal;
src: url('../fonts/PlantinStd-Light.woff') format('woff');
}


::selection {
    background: #000;
    color: #fff;
}


html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, ol, ul, li, form, fieldset, legend, label, table, header, footer, nav, section, figure {
  margin: 0;
  padding: 0; 
}

html { 
	background-color: #ffff00;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
	font-family:'IBM';
	font-size:10px; letter-spacing:0.07em;
}

.header-container {margin:0 30px 30px 30px; padding:30px 30px 100px 30px; border-right:1px solid #000; border-left:1px solid #000; }
.obe-icon {width:80px; transition:all 400ms;}
.obe-icon img {width:80px;  transition:all 400ms;}
.column1, .column2, .col1, .col2, .col3 {float:left;}
.column1, .col1 {width:15.8%;}
.column2 {width:47%; max-width:445px;}
.column3 {float:right; padding:30px 30px 0 0; position:absolute; top:30px; right:60px;}
.col2 {width:35%; }
.col3 {padding-left:18px;}
.IBM-ital {font-family:'IBM Ital';}
.IBM {font-family:'IBM';}
.nav-container ul li {list-style-type: none; text-transform:uppercase; display:inline-block; margin-right:20px; }
.nav-container {letter-spacing:0.07em; }
.nav {line-height:19px; margin-top:11px; }
.nav a {text-decoration:none; color:#000; transition:all 400ms;}
.nav a:hover {background: #000; color:#fff; transition:all 400ms;}
.contact {float:left; margin-top:95px; position:absolute;}
.obe-title {font-family:'Mad'; font-size:74px; transform: scale(1.2, 1); letter-spacing:-6px; line-height:63px; display:inline-block; margin-top:-28px; text-align:right; float:right; position:relative; top:0; transition:all 400ms;}
.phrack {font-family:'Phrack';}
.mad {font-family: 'Mad';}
.plantin {font-family:'Plantin';}
.plantin-ital {font-family:'Plantin Ital';}
.mez {font-family:'Mezalia';}
.mez-ital {font-family:'Mezalia Ital';}
.subhead {font-family:'Phrack';font-size:17px; margin-top:35px; clear:left; position:relative; z-index:99;} 
.subhead a {border-bottom:none; color:#000;  text-decoration:none; transition:all 400ms;}
.subhead a:hover {border-bottom:1px solid #000;  transition:all 400ms;}
.subhead .col3 {font-size:10px; text-transform:uppercase; letter-spacing:0.05em; margin-top:4px;}
.subhead .col2 {margin-top:5px; }
.subhead .col3 {margin-top:10px; letter-spacing:0.05em; }
.subhead .col1 {}
.pretitle {font-family:'Phrack';font-size:17px; }
.artist {font-family:'Mezalia'; font-size:18px; letter-spacing:0; margin-top:-11px; padding-right:15px; line-height:20px; margin-left:20px;}
.proj, .label {text-transform:uppercase; line-height:18px; margin-top:-8px;}
.entry {padding-top:10px; float:left; border-bottom:1px solid #000;  width:50%; border-right:1px solid #000; position:relative; transition:all 400ms;}
.entry a {color:#000 !important; text-decoration:none;}
.entry a:hover {}
.entryright {line-height:18px; margin-top:2px;}
.viewmore {font-family:'Phrack'; text-decoration:none; font-size:15px; letter-spacing:0; margin-top:1px; display:inline-block;}
.rule {border-bottom:1px solid #000; margin:0 -30px;}
.artist {display:inline; top:0;  display: -webkit-box; 
            -webkit-box-orient: vertical; 
            -webkit-line-clamp: 2; 
            overflow: hidden; 
            text-overflow: ellipsis; }
.proj, .label {display:inline; top:0;  display: -webkit-box; 
            -webkit-box-orient: vertical; 
            -webkit-line-clamp: 1; 
            overflow: hidden; 
            text-overflow: ellipsis; }
.label {margin-top:-10px;}
.entry .col1, .entry .col2 {padding-bottom:13px; padding-top:20px;}
.entry .col1 {width:34.1%;}
.entry .col2 {width:40%; border-right:none;}
.entry .col3 {display:inline-block; position:absolute; top:20px; right:20px;  text-align:right; padding-left:none; border-left:none;}
.workbody {padding:0 30px 0 0; margin-left:30px; display:inline-block; border-left:1px solid #000; margin-top:-130px;}
.workbody a {color:#000 !important;}
.workbody col2 {line-height:10px;}
.workintro {margin-top:-100px;  height:120px;  border-bottom:none; display:block;}
.subcontainer .col3 { height:60px;}
.subcontainer .col2 {}
.subcontainer { margin-bottom:20px;}
.footer {text-align:center; margin:18px 30px 30px 30px; }
.turn {display:inline-block; transform: rotate(0.1turn);}
.turn2 {display:inline-block; transform: rotate(0.4turn);}

.external a {cursor:ne-resize;}
.internal a {cursor:se-resize;}
.inactive a { color:#858500; pointer-events: none;}
.inactive { color:#858500; }

/*.feat-title {display:inline-block; margin-top:60px; float:left; font-family:'Phrack'; text-transform:none; letter-spacing:0; font-size:17px;}
.work-title {display:inline-block; float:left; text-transform:uppercase; top:90px; left:-36px; position:absolute;}*/
.feat-title, .work-title, .filter-title, .about-title, .subtitle {font-family:'IBM'; font-size:10px; text-transform:uppercase; position:absolute; top:100px; left:0;}
.workintro .col2 {width:50%;}
#work {border-top:1px solid #000;}

.entrybody {background:#ffff00; margin:-110px 30px 0 30px; padding:20px 30px 0 30px; border:1px solid #000;z-index:999;}
.projentry {float:left;  width:50%; border-right:1px solid #000; position:relative; margin-left:1px;}
.projintro {margin-top:-230px; position:absolute;  height:120px;  border-bottom:none; display:block;}
.hidden {display:none !important; position:relative !important; top:0; 
visibility: hidden !important;}
.external-link {color:#000 !important; text-decoration:none; /*cursor:ne-resize;*/}
.external-link:hover {border-bottom:1px solid #000; }
.proj-artist {font-family:'Mezalia';}
.proj-proj {font-family:'Mezalia Ital'; }
.proj-proj, .proj-artist {font-size:30px; letter-spacing:-0.02em; line-height:38px;
}
.proj-fine {text-transform:uppercase;}
.proj-col1, .proj-col2 {float:left; width:50%;}
.proj-col1 {padding-right:30px;}
.proj-container {width:100%;}
.proj-datelabel {margin-top:10px; text-transform:uppercase; display:inline-block;}
.proj-credit {white-space:pre-wrap; text-transform:uppercase; line-height:15px;}
.proj-link a {display:block; text-transform:uppercase; text-decoration:none; color:#000; padding:6px 0; border:1px solid #000; text-align:center; margin-top:10px; cursor:ne-resize; transition:all 400ms; }
.proj-link a:hover {background:#000; transition:all 400ms; color:#fff;}
.proj-images img {width:100%; margin-bottom:-3px;}
.proj-images {margin:20px -30px 0 -30px;}
.proj-descr {padding:40px 0 20px 0; white-space:pre-wrap; font-family:'IBM'; font-size:11px; column-count:2; letter-spacing:-0.01em; line-height:18px; display:block; top:20px;}
.proj-footer {text-align:right;}
.obe-icon-footer {width:45px; position:relative; margin-bottom:-42px;}
.proj-tags {display:block; text-transform:uppercase; margin-top:10px;}
.mobile-thumb {display:none;}

.about-big {font-size:22px; letter-spacing:-0.1em; line-height:38px; }
.about-intro {text-transform:uppercase; font-size:20px; ;  line-height:28px; font-family:'IBM'; display:inline-block; hyphens:manual;}
.about-copy {text-transform:none; font-family:'IBM Ital'; font-size:12px; letter-spacing:0; line-height:18px; display:block;  }
.about-copy a {text-decoration:none; color:#000; border-bottom:1px solid #000; transition:all 400ms;}
.about-copy a:hover {border-bottom:none; transition:all 400ms;}
.lilcity {font-family:'IBM'; font-size:12px; text-transform:uppercase; position:relative; top:-3px; margin-left:5px; letter-spacing:2px; display:inline-block; line-height:30px;}
.about-container {margin:0 15.5%}

.peeps {display:inline-block; width:50%; float:left; text-transform:uppercase; line-height:16px; margin-bottom:20px;}
.peeps img {width:100%; }
.peeps-divide {height:12px; display:block; clear:both;}
.peeps-in-r, .peeps-in-l { width:100%; float:left; margin-bottom:10px;}
.bio {margin-top:15px; display:block;}
.peeps .title a {margin-right:6px;}
.peeps .about-copy {text-transform:uppercase; margin-bottom:-8px;}

.core a {color:#000; text-decoration:none; border-bottom:1px solid #fff;  transition:all 400ms; display:inline-block;}
.core a:hover {text-decoration:none; transition:all 400ms; }
.core {line-height:16px;}
.peeps .title a {margin-top:4px; display:inline-block; color:#000; text-decoration:none; border-bottom:1px solid #fff;  transition:all 400ms;}
.peeps .title a:hover {}
.obe-icon-mobile {display:none;}
.contact-reword:after {
  content: 'HELLO@OBELUSERA.COM';}
.obe-title a {text-decoration:none; color:#000; transition:all 400ms;}
.obe-title a:hover { color:#575613; transition:all 400ms;}
.about-links a {display:block; text-transform:uppercase; text-decoration:none; color:#000; padding:6px 0; border:1px solid #000; text-align:center; margin-top:10px; cursor:ne-resize; transition:all 400ms; width:33%; float:left; padding:8px; margin:0;}
.about-links a:hover {background:#000; transition:all 400ms; color:#fff;}
.about-links {margin:20px 0; padding:0 ; width:100%;}
.burgerfi {border-top:1px solid #000; border-bottom:1px solid #000; width:35px; height:20px; position:absolute; top:30px; left:60px;  display:none;}
.burgermid {border-bottom:1px solid #000; width:100%; display:block; height:10px;}

.img1-desk {display:inline-block;}
.img1-mobile {display:none;}

.mobile-nav ul li, .empty-nav ul li {list-style-type: none; display:block;}

.mobile-nav, .empty-nav {
padding:0;
background: #ffff00;
color:#000;
position:fixed;
border-right:1px solid #000;
border-left:1px solid #000;
margin:0;
top:0;
left:30px;
right:30px;
width:;
height:100%;
z-index:9999;
line-height:18px;
text-align:center;

}

.mobile-nav {opacity:0;
visibility: hidden; }

.hide-arrow {display:none;}
.empty-nav .hide-arrow {display:inline-block !important; margin-right:12px;}

.mobile-close a {border-bottom:none !important;}
.mobile-close a:hover {}

/*.mobile-close {
margin-top:30px;
 display:block;

  width:40px;
  height:40px;
  background: -webkit-linear-gradient(-45deg, transparent 0%, transparent 46%, #000 46%,  transparent 56%,transparent 56%, transparent 100%), -webkit-linear-gradient(45deg, transparent 0%, transparent 46%, #000 46%,  transparent 56%,transparent 56%, transparent 100%);

  transition: all 0.3s ease;
}*/

.mobile-close-container a {border-bottom:none !important;}

.mobile-close {
  position: relative;
  width: 40px;
  height: 40px;
  margin:30px -9px 30px 0;
}

.mobile-close:before, .mobile-close:after {
  position: absolute;
  left: 15px;
  content: ' ';
  height: 40px;
  width: 1px;
  background-color: #000;
}
.mobile-close:before {
  transform: rotate(45deg);
}
.mobile-close:after {
  transform: rotate(-45deg);
}

.mobile-nav a, .empty-nav a {font-family: 'IBM'; font-size:20px; line-height:22px; text-decoration:none; color:#000 !important;  text-transform:uppercase; border-bottom:1px solid #000; padding:10px;   display:block; letter-spacing:0.03em;}

.mobile-aobe a { text-transform:none; display:inline-block;  font-size:20px; margin-top:15px; border-bottom:none; padding:0; letter-spacing:0.04em; font-family:'Phrack';}
.mobile-nav a:hover, .empty-nav a:hover {color:#fff !important;}
.mobile-aobe a:hover {border-bottom:1px solid #000; color:#000 !important; display:inline-block; padding:0;}
.obe-icon-nav2 {width:42px; bottom:35px; position:absolute; margin-left:-25px;}
.mobile-about {}
.mobile-contact {float:right; margin-right:20px;}

#togclose {cursor:pointer}
#tog {cursor:pointer}
.nav {margin-top:16px;}
.pre-mobile-nav {font-size:11px; letter-spacing:2px; bottom:-10px; position:relative;}

.fourohfour-container {background:#fffd09; width:100%; display:block; position:relative; text-align:center; opacity:0.9;}

.distract {opacity:0; position:absolute;}

.m-fadeOut {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s linear 0s, opacity 300ms;
}
.m-fadeIn {
  visibility: visible;
  opacity: 1;
  transition: visibility 0s linear 0s, opacity 300ms;
}

.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
	margin: 0 -30px -3px -30px;
}
.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

@media (max-width:1600px) {
.entry .col1 {width:34.3%;}
}

@media (max-width:1480px) {
.entry .col1 {width:34.5%;}
}

@media (max-width:1400px) {
.entry .col1 {width:34.8%;}
}

@media (max-width:1200px) {
.entry .col1 {width:35.3%;}
}

@media (max-width:1000px) {
.entry .col1 {width:35.8%;}
}

@media (max-width:1065px) {
.column2 {width:44%; max-width:380px;}
}

@media (max-width:925px) {
.obe-icon img {width:55px; transition:all 400ms;}
.obe-icon {width:55px; }
.obe-title {font-size:53px; margin-top:-30px; line-height:46px; transition:all 400ms; letter-spacing:-5px; margin-right:-10px;}
.entry .col1 {width:36.3%;}

}

@media (max-width:850px) {
.entry .col1 {width:36.9%;}

}

@media (max-width:780px) {
.entry .col2 {width:35%; }
}

@media (max-width:750px) {
.column1 {width:100%;}
.column2 {margin-top:20px; width:100%; margin-left:15.5%;}
.hide-mobile {display:none;}
.peeps-divide {display:none;}
.col1 {width:15.2%;}
.col3 {padding-left:24px;}
.obe-icon img {transition:all 400ms; width:48px;}
/*.obe-title {font-size:46px; letter-spacing:-3px; margin-top:-32px; margin-right:0;}*/
.obe-title {font-size:46px; letter-spacing:-3px; margin-top:-32px; margin-right:0;}

.subhead .col1 {display:none;}
.subhead .col3 {padding:none; position:absolute; right:121px;}

.about-container {margin:0;}
.column2 {margin-left:0; max-width:none;}
.obe-icon {margin-left:0; width:48px; z-index:9999;}

.nav-container {width:66%;}
.contact {}

.entry .col1, .entry .col2 {display:block;  z-index:1; position:relative;}
.entry .col3 {margin-right:6px; line-height:1px; margin-top:22px;}
.viewmore {position:relative; top:-6px;}
.entry .col1 {margin-left:9px; margin-bottom:-20px; width:90%;}
.entry .col2 {margin-left:30px; line-height:7px; width:51%;}
.nav-container {z-index:999; position:relative;}

.proj-col1, .proj-col2 {float:none; width:100%;}
.proj-descr{column-count: 1;}
.proj-col1 {margin-bottom:15px;}
.proj-proj, .proj-artist {line-height:31px;}
.proj-artist {margin-bottom:10px; display:inline-block;}
.artist {-webkit-line-clamp: 1;}
}

@media (max-width:580px) {
.img1-mobile {display:inline-block;}
.img1-desk {display:none;}
.hide-mobile {display:inline-block;}
}

@media (max-width:550px) {
.inactive, .internal, .external {width:100% !important; transition:all 400ms;}
.obe-title {width:100%; position:relative; text-align:center; font-size:95px; margin-top:18px; line-height:0.43em; font-size:16vw; letter-spacing:-4px;}
.column3 { padding:0; top:30px; right:0; width:100%; position:relative;}
.hide-mobile {display:block;}
.obe-icon {display:none;}
.obe-icon-mobile {display:inline-block; width:30px;}
.nav-container {display:none;}
.aobe {display: none;}
.header-container {padding:30px 30px 124px 30px; }
.projentry  {border-right:none !important;}
.entry {border-right:1px solid #000;}
.tag4lineremove {border-right:none !important;}
.subhead .col2 {width:70%;}
.contact-reword:after {
  content: 'CONTACT OBELUS';}
.contact {right:-4px;}
.subhead .col3 {position:initial;}
.subhead {margin-top:20px;}
.column1 {text-align:center; width:100%;}
.entry .col2 {width:56%;}
.entry .col3 {margin-top:133px;}
.subhead a {border-bottom:1px solid #000;}
.burgerfi {display:inline-block;}
.mobile-thumb {display:block; width:100%; height:110px; margin-bottom:10px; margin-top:-10px; clear:both; background-size:cover; position:relative; z-index:88 !important;}
.fix {margin-top:22px !important;}

}

@media (max-width:480px) {
.peeps {width:100%; padding-right:0 !important; padding-left:0 !important; margin-bottom:20px;}

}




