
/* reusable */



.vl-top-nav {
	color:#FFF;
	font-size: 1.3em;	
}

.vl-top-nav a{
	text-decoration: none;
	font-weight:bolder;
}


.toc_active .toc-container a {
	color:#0FF;
}

.nav-active{
	text-decoration: underline;
	color:#D0F;
	text-shadow: 4px 0px #00F;
}

@font-face {
    font-family: 'Fantasque';
    src: url('../media/FantasqueSansMono-Regular.ttf');
}
.pixel-image {
    image-rendering:pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
    vertical-align:middle;
}

body {
    background-color:#000;
    margin:0px;
    padding:0px;
    font-family: 'Fantasque';
}


.header {
    background-color:#000;
    margin:0px;
    padding:0px;
    padding-top:8px;
    color:#333;
    border-bottom:32px solid #050505;
/*
    border-bottom-left-radius:60px;
    border-bottom-right-radius:60px;*/
}

.slide_1_blog {
    background-image: url("../media/mid.jpeg");
    background-size:cover;
    background-attachment:fixed;

    padding-top:0px;
    padding-bottom:0px;
    margin:0px;
}

.slide_1 {
    background-image: url("../media/vl_bg_images/00.jpeg");
    background-size:cover;
    background-attachment:fixed;

    padding-top:0px;
    padding-bottom:0px;
    margin:0px;
}
.slide_1_grad {
    background-image: linear-gradient(to top, rgba(0,0,0,1), rgba(0,0,0,0) );
    background-size:cover;
    background-attachment:local;
}

.vl-title-block {
    background-color:rgba(0,0,0,0);
    min-height: 600px;
    margin-left:0px;
    margin-right:0px;
    padding:0px;
}

.vl-banner {
    width: 905px;
    height: 457px;
}
@media only screen and (max-width: 1000px) {

    .vl-banner {
        width: 452px;
        height: 228px;
    }
}
@media only screen and (max-width: 1000px) {

    .vl-title-block {
        min-height: 200px;
    }
}
.footer {
    min-height: 220px;
    background-color:#222;
}


.logo-image {
    width: 420px;
    height: 420px;
}

.logo-image-small {
    width: 300px;
    height: 300px;
}

.logo-container {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top:0px;
    padding-top:15px;
    width:512px;
}


.vl-logo-container {
    padding-top:200px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width:1024px;
}

@media only screen and (max-width: 1000px) {
    .vl-logo-container {
        padding-top:32px;
        width: 900px;
    }
}

.copy_gradient {
 background-image: linear-gradient(

rgba(0,0,0,1), 
rgba(0,0,0,1),
rgba(0,0,0,0.5),
rgba(0,0,0,1)

/*
    rgba(255,255,0,1.0),
    rgba(255,255,0,1.0),
    rgba(0,0,0,1.0)*/


);
 background-attachment:scroll;

}

.vl-logo {
    width: 1024px;
    height: 288px;
}


@media only screen and (max-width: 1000px) {
    .vl-logo {
        width:512px;
        height:144px;
    }
}



.corpse {
    width:64px;
    height:64px;
}
.vlsprite {
    width:96px;
    height:96px;
}
.copy_base {


    width:80%;
    margin-left:auto;
    margin-right:auto;

/*
    border-top-left-radius:60px;
    border-top-right-radius:60px;*/

    hyphens: none;
    -webkit-hyphens:none;
    -ms-hyphens:none;

    background-size:cover;

    font-weight:50;

    letter-spacing:0.1em;
    word-spacing:0.3em;
    /*font-family: 'Arbutus Slab', serif;*/
    font-family: 'Fantasque';
    background-color:#000;
    color:#EEE;
    font-size: 1.3em;
    background-image: url("../media/vl_bg_images/arty.jpeg");
    background-size:cover;
    background-attachment:fixed;

    text-shadow: 0px 2px #333;


    margin-bottom:0px;
    padding-bottom:0px;
/*
    padding-top:32px;*/
}
@media only screen and (max-width: 1000px) {
    .copy_base {
        width: 100%;
    }
}

.copy_container {


    width:90%;
/*
    border-top-left-radius:60px;
    border-top-right-radius:60px;*/

    border-bottom-left-radius:0px;
    border-bottom-right-radius:0px;

    background-color:rgba(0,0,0,0.5);
    min-width:900px;
    margin-left: auto;
    margin-right: auto;


    /*padding-bottom:128px;*/
    margin-bottom:96px;
}
@media only screen and (max-width: 1000px) {

    .copy_container {
        min-width:inherit;
    }
}

.feat_container {
    width:60%;
    margin-left: auto;
    margin-right: auto;
    padding: 32px;
}

.video-container {
    width:800px;
    height:450px;
    border-radius:24px;
    margin-left:auto;
    margin-right:auto;

}

.steam-container {
    width:800px;
    height:250px;
    border-radius:24px;
    margin-left:auto;
    margin-right:auto;

}

.video {
    width: 800px;
    height: 450px;
    margin-right:0 auto;
    border-radius:48px;
    display:block;
    text-align:center;

}

@media only screen and (max-width: 1000px) {
    .video {
        width: 400px;
        height: 225px;
    }
    .video-container {
        width:400px;
        height:225px;
    }
    .steam-container {
        width:400px;
        height:225px;
    }
}

p {

    margin-top:16px;
}

.footer-spacer {
    height:128px;
}

.title-alt {
    font-family: 'Freckle Face';

}

strong {
    letter-spacing:0.08em;
    color:#F0F;
    text-shadow: 3px 3px 5px #00F;

}

.blurb strong {
    color:#0FF;
}

.just-cent {
    text-align:center;
    vertical-align:bottom;
}

.vl-header-center {
    text-align:center;
}


/*
.smooth-bottom {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}

.smooth-top {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}*/


.screenshots {

    width:90%;
    margin-left:auto;
    margin-right:auto;
}

.shot {
    width: 480;
    height: 270;
    background-size:cover;

    margin-top:12px;

    display:inline-block;
    text-align:center;

}

.s1 {
    background-image: url("../media/vl_bg_images/01.jpeg");
}
.s2 {
    background-image: url("../media/vl_bg_images/02.jpeg");
}
.s3 {
    background-image: url("../media/vl_bg_images/02.jpeg");
}
.s4 {
    background-image: url("../media/vl_bg_images/02.jpeg");
}

.doom {
    font-family: 'Freckle Face';
    color:#F00;
}

.asterisk {
    font-family: 'Freckle Face';
    color:#F00;
}


a { color: inherit; }


.centergrad {
    background-image: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,1),rgba(0,0,0,0) );
    background-size:cover;
    background-attachment:fixed;
}

.centergrad_low {
    background-image: linear-gradient(to top, rgba(0,0,0,1), rgba(0,0,0,0) );
    background-size:cover;
    background-attachment:fixed;
}

.centerfold {

    background-position: 0px -400px;
    background-image: url("../media/vl_bg_images/02.jpeg");
    background-size:cover;
    background-attachment:local;
    border-top:32px solid #050505;
   /* border-bottom:32px solid #111;*/
    background-color:#000;
}

.centerfold-blog {
    background-position: 0px -400px;
    background-image: url("../media/mid.jpeg");
    background-size:cover;
    background-attachment:local;
    border-top:32px solid #050505;
   /* border-bottom:32px solid #111;*/
    background-color:#000;
}


.centerfold-low {
    background-position: 0px -400px;
    background-size:cover;
    background-attachment:local;
    border-top:32px solid #050505;
   /* border-bottom:32px solid #111;*/
    background-color:#000;
}

.footer-copy {

    font-size: 1.0em;
    color:#aaa;
    text-shadow: 0px 2px #333;
}

.footer-copy strong {
    color:#fff;
    text-shadow: 0px 2px #333;
}

input[type=button], input[type=submit], input[type=reset] {
    font-family: "Freckle Face";
    border-radius:30px;
    background-color: #FFF;
    border: none;
    color: 000;
    padding: 8px 16px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}

/*
.centerfold {

    padding-top:0px;
    margin-top:0px;
    width:100%;
    min-height:1080px;
    max-height:1080px;
    background-image: url("../media/vl_bg_images/cinema.jpeg");
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-attachment:fixed;
}
*/

.social-icons img {
    width:48px;
    height:48px;
}

.social-icons a {
    text-decoration: none;
}


.blog-container {

		min-width:50%;
		max-width:80%;
		margin-left:10em;
		margin-right:10em;
                padding:75px;
		color:#FFF;
                background-color:#111;
                border-radius:10px;
                font-family:Arvo;
}

.blog-container a {
		color:#F0F;
}
.blog-container p {
                font-size: 1.2em;
                letter-spacing: -0.05em;
		color:#999;
}
.blog-container h2 {
	text-decoration:underline;
	color:#0FF;
}

.blog-container h3 {
    color:#aaa;	
}

.blog-container h1 {
    font-size: 2em;
    color:#CCC;
}

.blog-container code {
    margin:25px;
    color:#0F0;
    white-space:pre;
}
