@import url('https://fonts.googleapis.com/css?family=Oxygen');
html
{
	background:#1d1d1d;
}
p
{
clear:both;
margin:auto;
text-align:center;
font-family: 'Oxygen', sans-serif;
}
#wrapper
{
margin:auto;
min-width:320px;
max-width:95%;
height:900px;
max-height:1000px;
padding-top:30px;
}
#reddot {
	background: #f00;
	width: 15px;
	height: 15px;
	border-radius: 50%;
}
#header-container{
height: 135px;
}
#logotop{
height:100%
}
#logotop img{
min-height:70%;
max-height:70%;
margin: 10px auto 0 auto;
display:block;
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
}
#svg_preloader
{
display:none;	
}
#fineartlink{
	background-image:url(/img/fineart.svg);
	min-height: 42px;
    max-height: 40%;
    margin: 0 auto 30px auto;
    display: block;
    position: absolute;
    top: 120px;
    bottom: 0;
    left: -233px;
    right: 0;
	width:128px;

}
#fineartlink:before{
left:0;
background-image: url(/img/fineart_over.svg);
content: "";
padding:0;
width:0;
height:42px;
position:absolute;
background-size: 128px 42px;
    transition: width 0.2s ease-out;
}
#fineartlink:hover:before{
width: 128px;
    transition: width 0.2s ease-in;
}
#fineartlink_onpage{
	background-image:url(/img/fineart_active.svg);
	min-height: 42px;
    max-height: 40%;
    margin: 0 auto 30px auto;
    display: block;
    position: absolute;
    top: 120px;
    bottom: 0;
    left: -233px;
    right: 0;
	width:128px;

}

#designlink{
	background-image:url(/img/Design.svg);
	min-height: 42px;
    max-height: 40%;
    margin: 0 auto 30px auto;
    display: block;
    position: absolute;
    top: 120px;
    bottom: 0;
    left: 38px;
    right: 0;
	width:128px;

}
#designlink:before{
left:0;
background-image: url(/img/Design_over.svg);
content: "";
padding:0;
width:0;
height:42px;
position:absolute;
background-size: 128px 42px;
    transition: width 0.2s ease-out;
}
#designlink:hover:before{
width: 128px;
    transition: width 0.2s ease-in;
}
#designlink_onpage{
	background-image:url(/img/Design_active.svg);
	min-height: 42px;
    max-height: 40%;
    margin: 0 auto 30px auto;
    display: block;
    position: absolute;
    top: 120px;
    bottom: 0;
    left: 38px;
    right: 0;
	width:128px;

}

#videolink{
	background-image:url(/img/video.svg);
	min-height: 42px;
    max-height: 40%;
    margin: 0 auto 30px auto;
    display: block;
    position: absolute;
    top: 120px;
    bottom: 0;
    left: 268px;
    right: 0;
	width:128px;

}
#videolink:before{
left:0;
background-image: url(/img/video_over.svg);
content: "";
padding:0;
width:0;
height:42px;
position:absolute;
background-size: 128px 42px;
    transition: width 0.2s ease-out;
}
#videolink:hover:before{
width: 128px;
    transition: width 0.2s ease-in;
}
#videolink_onpage{
	background-image:url(/img/video_active.svg);
	min-height: 42px;
    max-height: 40%;
    margin: 0 auto 30px auto;
    display: block;
    position: absolute;
    top: 120px;
    bottom: 0;
    left: 268px;
    right: 0;
	width:128px;

}

#mainarea{
min-width:480px;

}
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
#nav{
height:100px;

/*snippet from Devin Vinson @DevinVinson*/
  opacity:0;
  opacity: 1 \9; /*just in case ie*/
  -webkit-animation:fadeIn ease-in 1;
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:0.5s;
  -moz-animation-duration:0.5s;
  animation-duration:0.5s;
    -webkit-animation-delay: 0;
  -moz-animation-delay: 0;
  animation-delay: 0;
}

/* Misc. TOS modifications */

.tos-desktop, .tos-touch{
background-color:#1d1d1d;
}

.tos-wrapper:hover{
opacity:1;
}

/* Slide selectors */

.tos-slide a img{
max-height:700px;
box-shadow: 5px 10px 30px #000;
}

.tos-slide a {
margin-bottom:128px;
}

/* Embedded videos */

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