@charset "UTF-8";
/* text formatting */

body {font-family: Verdana; 
font-size: 12px; 
margin: 0px; 
padding: 20px; 
color: #444; 
background: #252525;
}

.page {font-size: 1em; }
h1 { font-size: 1.3em; color: #1f1f1f; margin: 0px 0px .5em 0px;}
h2 { font-size: 1.1em; color: #00cc33; margin: 0px 0px .5em 0px; }
h3 { font-size: 1em; color: #00cc33; margin: 0px 0px .25em 0px; }
p{ margin: 0px 0px 1em 0px; font-size: 1em; }
li { margin: 0px 0px 1em 0px;}
a img { border: none;}
a { color: #12F519;}
a:hover { color: #a5319d;}

.content_sidebar h3 { color: #00cc33; margin-bottom: 10px; }
.content_sidebar p, .content_sidebar li { color: #625f5f;}
.content_sidebar a { color: #cc14a1; }
.content_sidebar a: hover { color: #000; }
.content_sidebar figure { display: block; margin: 0px; padding: 0px; }
.content_sidebar figure .figure_photo {
    background: url(../images/sidebar_photo_large.jpg) 50% 0px;
    margin: 0px 0px 10px 0px;
    height: 175px;
    border: 1px solid #414141;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -moz-box-shadow: 0px 4px 4px 4px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0px 4px 4px 4px rgba(0,0,0,0.2);
    box-shadow: 0px 4px 4px 4px rgba(0,0,0,0.2);
    }
    
.content_sidebar figure figcaption {
    font-size: .9em;
    display: block;
    color: #777;
    margin: 3px 0px 15px 0px;
    padding: 0px 10px 0px 10px;    
    }
    
/* ******************************* LAYUOUT ************************** */
/* anything inside with abs. pos. will position itself 
   relative to the outer most .page contatiner */  
.page { position: relative; margin: 0px auto 0px auto; max-width: 850px;
    
     border-top-left-radius: 10px;
     -moz-border-radius-topright: 10px;   
     -webkit-border-top-right-radius: 10px; 

}

.page header { 

    display: block;
    position: relative;
    height: 125px;  /* matches background graphic */
    -moz-border-radius-topright: 10px; 
    -moz-border-radius-bottomleft: 10px; 
    -webkit-border-top-right-radius: 10px; 
    -webkit-border-top-left-radius: 10px;
     border-top-right-radius: 10px; 
     border-top-left-radius: 10px; 
     background-color: black;
  background: url(images/vt2000.png) no-repeat 0px 0px;  
    }
    
.page header a.logo { 
    position: absolute;
    top: 45px;
    left: 45px;
    display: block; 
    width: 360px;
    height: 105px;
 /*   background: url(images/vt2000.png) no-repeat 0px 0px;  */
    }

.page .page_content { 
    background-color: #fff; 
    padding: 1px 0px 1px 0px;

}

.page_content a { color: #075E19;}
.page .page_content .page_content_container_left { width: 70%; float: left; margin: 0px; padding: 0px;
     border-top-left-radius: 10px;
     -moz-border-radius-topleft: 10px;   
     -webkit-border-top-left-radius: 10px; 
}

/* .page .page_content .page_content_container_left p.wsites img.tmb {display: inline;}   */

.page .page_content .page_content_container_right { width: 30%; float: left; margin: 0px; padding: 0px;}

.page .page_content .content {margin: 15px 20px 20px 20px; padding: 0px;

}


.page .page_content .content_sidebar{
    margin: 15px 20px 20px 0px;
    padding: 10px;
    border:   1px solid #bdbdbd;
 /*   border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px; */
     border-top-left-radius: 10px;
     -moz-border-radius-topleft: 10px;   
     -webkit-border-top-left-radius: 10px; 
    background: #f1f1f1; 
    }
.page .page_content .page_content_container_right .content_sidebar p.heading1 {
background-color: #006633;
width: 92%;
padding: 3px 3px;
padding-left: 10px;
margin-left: 2px;
color: #fff;
border-bottom: 2px solid black;
}
.page nav { position: absolute; top: 75px; right: 20px; text-align: right; border: none;}
.page nav a {
    border: 1px solid #12F519;
 /*   border-radius: 16px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;#26EC09 */
     border-top-left-radius: 10px;
     -moz-border-radius-topleft: 10px;   
     -webkit-border-top-left-radius: 10px;   
    color: #fff; 
    padding: 7px 10px 7px 10px;
    text-decoration: none; 
    font-family: Verdana;
    font-weight: bold;
    display: inline-block;
    margin: 0px 2px 4px 2px;
    background-color: rgba(0,0,0,.6);
    font-size: 1.15em;  
    }
.page nav a:visited { background-color: #cecece; color: #00cc33;}
.page nav a:hover { background-color: rgba(255,255,36,1); color: #000;}

.page footer { 
    display: block;
    border-top: 1px solid #ddd;
    padding: 15px 10px 15px 20px;
    font-size: .9em;
    color: #757575;
    background-color: #fff;
    clear: both;
 -moz-border-radius-bottomleft: 10px;
    -webkit-border-bottom-left-radius: 10px;
    border-bottom-left-radius: 10px
    -moz-border-radius-bottomright: 10px;
    -webkit-border-bottom-right-radius: 10px;
    border-bottom-right-radius: 10px; 
    
 

    -moz-box-shadow: 0px 5px 3px rgba(0,0,0,.3);
    -webkit-box-shadow: 0px 5px 3px rgba(0,0,0,.3);
    box-shadow: 0px 5px 3px rgba(0,0,0,.3);
    background: -moz-linear-gradient(top, #ffffff 60%, #cccccc 90%);
    background: -webkit-gradient(linear left top, left bottom, color-stop(60%, #ffffff), color-stop(90%, #cccccc));
    }
 
/* any container that has items inside that float that container will
stretch to be the total height or width of all elements inside that
have float float properties assigned to them */   
.clear_both: { clear: both; line-height: 1px;}

/* Small Screen */

@media screen and (min-width: 150px) and (max-width: 500px) {	
	body { padding: 10px; }
	.page { margin: 0; padding: 0; font-size: 1.2em }
.page header { height: 70px; background-image: url(images/vt2000-m.png);}
	.page header a.logo {
		top: 3px;
		left: 10px;
		margin: 0 auto 0 auto;
        width: 360px;
        height: 109px;
/*		background: url(images/vt2000.png) no-repeat 0px 0px; */
	}
	.page .page_content .page_content_container_left { width: inherit; float: none; margin: 0; }
	.page .page_content .page_content_container_right { width: inherit; float: none; margin: 0px; }
	.page .page_content .content { margin: 10px 10px 20px 10px; }
	.page .page_content .content_sidebar { margin: 0 10px 15px 10px; }
	.page .page_content .content_sidebar figure { width: 30%; float: right; margin-left: 15px; }
	.page .page_content .content_sidebar figure .figure_photo { background-image: url(../images/sidebar_photo_small.jpg); height: 100px; }
	.page .page_content .content_sidebar figure figcaption { font-size: .8em; text-align: right; padding: 0px 10px 0px 10px; }
	.page nav {
		position: inherit;
		padding: 15px 0px 1px 0px;
		text-align: left;
		border-top: 1px solid #ddd;
	}
	.page nav a {
		color: #fff;
		border: none;
		padding: 7px 10px 7px 10px;
		font-weight: bold;
		font-size: 1em;
		display: block;
		margin: 0 10px 15px 10px;
		background: #00cc33 url(images/mobile_link_arrow.png) no-repeat right 50%;
		background-color: background-color: rgba(0,0,0,.6);
	}
	.page nav a:visited { background-color: silver; color: #000;}
	.page nav a:hover { color: #000; background-color: #fced04; }
	.page footer { font-size: .8em; }
}










/* Medium Screen - tablet*/
@media screen and (min-width: 501px) and (max-width: 800px){

    .page { margin: 0px; padding: 0px; font-size: 1.15em; height: 100%; }
    .page header { height: 90px; background-image: url(images/vt2000-m.png); 
            padding: 10px 50px 0 75px;
            }
    .page header a.logo {
        top: 20px;
        left: 25px;
        width: 90px;
		height: 55px;
   /*     background: url(images/vt2000-m.png) no-repeat 0 0;   */    
        }
        .clear_both: { clear: both; line-height: 1px;}
    .page nav {top: 34px; margin-left: 150px;}
    .page nav a {
        border-color: #fff; 
        margin-left: 10px; 
        padding: 5px 5px 5px 5px;
        font-size: .9em;
        }
 .page_content p {font-size: 1.3em;}     
/*   .page .content_sidebar figure .figure_photo {
           background-image: url(../images/sidebar_photo_medium.jpg); height: 150px;       
        } 
   .page .content_sidebar figure figcaption { font-size: .8em; } */

}