/* -------------------------------------------------------------- 
   
   Vargas Websites
   Copyright (c) 2010 Vargas Websites
   By Jimbo Quijano
   style.css
   Sets the main style.
   
-------------------------------------------------------------- */

html, #wrapper {
height: 100%;
}

body > #wrapper{
height: auto;
min-height: 100%;
}

body{
background:url(images/body-bg.png) repeat-x scroll 0 156px;
margin:0;
}

/* Body */
#wrapper{
width:975px;
margin:0 auto;
}

#top{
display:block;
margin:0;
padding:30px 0;
height:96px;
overflow:hidden;
position:relative;
z-index:99;
}

.logo{
background:url(images/logo.png) no-repeat;
width:90px;
height:59px;
margin:0 auto;
}

h2.top-heading{
color:#7188A4;
font-size:22px;
letter-spacing:15px;
text-align:center;
text-transform:uppercase;
margin:15px 0 0 0;
}

#banner{
display:block;
height:327px;
position:relative;
overflow:hidden;
}

.items-gallery, .items-single, .items-videos{
position:absolute;
width:20000em;
}

/* Single View */
#single{
width:975px;
height:285px;
float:left;
position:relative;
}

#single .scrollable{
width:975px;
height:285px;
float:left;
overflow:hidden;
position:relative;
}

#single .web{
width:975px;
height:245px;
float:left;
padding:20px 0;
}

#single .web-thumb{
width:475px;
height:245px;
float:left;
text-align:right;
margin:0 25px 0 0;
}

#single .web-info{
width:475px;
height:245px;
float:right;
text-align:left;
}

#single .web-info .title{
color:#FFFFFF;
font-size:28px;
margin:25px 0 0;
}

#single .web-info .url{
color:#8b99b6;
font-size:16px;
}

#single .web-info .web-audio{
float:left;
width:380px;
margin:10px 0 20px 0;
}

#single .web-info img.profile-thumb{
border:2px solid #8a95b0;
-moz-border-radius:3px;
width:52px;
height:58px;
float:left;
margin:0 10px 5px 0;
}

#single .web-info .audio{
float:left;
margin:16px 0 0;
}

#single .web-info .desc{
float:left;
color:#abc1db;
font-style:italic;
width:380px;
line-height:16px;
}

#single .web-info .goto-video{
color:#abc1db;
cursor:pointer;
font-style:normal;
}

#single .web-info .goto-video span{
text-decoration:underline;
font-weight:bold;
}

#single .web-info .web-audio p{
color:#ACC2DC;
font-style:italic;
margin:0;
line-height:15px;
}

#single .web-info .buttons{
float:left;
}

a.nextSingle, a.prevSingle, a.galleryView{
background:#8a95b0;
color:#dbe5ff;
-moz-border-radius:5px;
padding:2px 20px 5px;
float:left;
margin:0 10px 0 0;
cursor:pointer;
}

a.nextSingle:hover, a.prevSingle:hover, a.galleryView:hover{
text-decoration:none;
background:#97a0b6;
}

#single .disabled{
background:#8a95b0 !important;
cursor:default !important;
opacity:0.5;
}

#single  a.galleryNext, #single  a.galleryPrev{
display:none;
}

/* Gallery View */
#gallery{
width:955px;
height:285px;
float:left;
position:relative;
}

#gallery .scrollable{
width:955px;
height:285px;
float:left;
overflow:hidden;
position:relative;
margin:0 10px;
}

#gallery .gallery-web{
width:183px;
height:263px;
float:left;
margin:0 10px 0 0;
padding:10px 0;
cursor:pointer;
position:relative;
}

#gallery  a.nextGallery, #gallery  a.prevGallery{
background:#8a95b0;
color:#dbe5ff;
-moz-border-radius:5px;
padding:2px 20px 5px;
float:left;
margin:0 10px 0 0;
cursor:pointer;
z-index:99;
position:absolute;
-moz-box-shadow:2px 2px 7px #000000;
}

#gallery  a.nextGallery{
bottom:20px;
right:10px;
}

#gallery a.prevGallery{
bottom:20px;
left:10px;
}

#gallery  a.nextGallery:hover, #gallery  a.prevGallery:hover{
text-decoration:none;
background:#97a0b6;
}

#gallery .disabled{
background:#8a95b0 !important;
cursor:default !important;
opacity:0.5;
}

.clickhere{
color:#FFFFFF;
font-weight:bold;
left:50px;
position:absolute;
text-shadow:1px 1px 1px #000000;
top:130px;
}

/* Video View */
#videos{
width:975px;
height:285px;
float:left;
position:relative;
}

#videos .scrollable{
width:975px;
height:285px;
float:left;
overflow:hidden;
position:relative;
}

#videos .video{
width:975px;
height:245px;
float:left;
padding:20px 0;
}

#videos .video-thumb{
width:475px;
height:245px;
float:left;
text-align:right;
margin:0 25px 0 0;
}

#videos .video-info{
width:475px;
height:245px;
float:right;
text-align:left;
}

#videos .video-info .title{
color:#FFFFFF;
font-size:28px;
margin:25px 0 0;
}

#videos .video-info .url{
color:#8b99b6;
display:block;
font-size:16px;
}

#videos .video-info .video-message{
float:left;
width:370px;
margin:10px 0 20px;
}

#videos .video-info .video-message p{
color:#ACC2DC;
font-style:italic;
margin:0;
line-height:15px;
}

#videos .video-info .buttons{
float:left;
}

a.nextVideos, a.prevVideos{
background:#8a95b0;
color:#dbe5ff;
-moz-border-radius:5px;
padding:2px 20px 5px;
float:left;
margin:0 10px 0 0;
cursor:pointer;
}

a.nextVideos:hover, a.prevVideos:hover{
text-decoration:none;
background:#97a0b6;
}

#videos .disabled{
background:#8a95b0 !important;
cursor:default !important;
opacity:0.5;
}

#contact{
background:url(images/shadow.png) no-repeat scroll center bottom;
display:block;
padding:20px 0 73px;
margin:0;
}

#contact .callme{
background:url(images/button-callme.png) no-repeat;
width:95px;
height:28px;
float:left;
margin:0 20px 0 220px;
cursor:pointer;
}

#contact span{
float:left;
letter-spacing:5px;
padding:2px 0 0;
text-transform:uppercase;
}

/* Menus */
#video-links{
width:975px;
height:37px;
float:left;
bottom:5px;
position:absolute;
}

#video-links ul{
margin:6px 0 0 0;
padding:0;
list-style:none;
text-align:center;
}

#video-links li{
background:url(images/video-links-arrow.png) no-repeat scroll left 3px;
display:inline;
padding:0 0 0 25px;
margin:0 0 0 5px;
}

#video-links li:first-child{
background:none;
padding:0;
margin:0;
}

#video-links li a, #video-links li span{
color:#acc2dc;
text-transform:uppercase;
cursor:pointer;
}

#video-links li span{
cursor:default;
}

#video-links a.galleryView{
background:none;
float:none;
margin:0;
padding:0;
}

.video-thumb .vid{
width:287px;
height:245px;
float:right;
}

.video-thumb .vid1{
background:url(images/videobkgrnd-doug.jpg) no-repeat;
}

.video-thumb .vid2{
background:url(images/videobkgrnd-barney.jpg) no-repeat;
}

.video-thumb .vid3{
background:url(images/videobkgrnd-gary.jpg) no-repeat;
}

#preloader{
display:none;
}

#popup-overlay{
background:#666666 url(images/popup-overlay.png) repeat;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:999;
opacity:0.5;
}

#popup{
background:#fff;
position:fixed;
width:500px;
z-index:9999;
color:#000;
font-size:30px;
text-transform:uppercase;
padding:20px;
text-align:center;
-moz-border-radius:5px;
-moz-box-shadow:0 0 15px #000;
line-height:35px;
}

#popup span{
font-size:45px;
display:block;
margin:0 0 5px 0;
}

#popup .close-popup{
cursor:pointer;
font-size:11px;
line-height:11px;
position:absolute;
right:10px;
text-decoration:none;
top:10px;
}

#mural{
width:100%;
float:left;
font-family:ajensonpro-regular;
}

#mural h1{
background:url(images/vaac-logo.png) no-repeat;
height:73px;
overflow:hidden;
text-indent:3000px;
white-space:nowrap;
width:356px;
margin:0 auto;
}

#mural h1 span{
display:inline;
font-size:17px;
}

#mural h1 em{
font-style:normal;
font-size:42px;
font-weight:normal;
}

#mural h1 em.indent{
margin:0 -10px 0 0;
}

#mural h1 em:first-letter{
font-size:50px;
}

#mural p{
font-size:14px;
margin:10px 0 10px;
text-align:center;
text-transform:uppercase;
font-weight:bold;
}

#mural p a{
color:#778da7;
}

p#expandmural{
margin:25px 0 10px;
}

p#expandmural a{
color:#778da7;
}

#muralvideo{
width:100%;
float:left;
background:#778da7;
padding:20px 0;
margin:0;
}

#muralvideo-wrapper{
width:975px;
margin:0 auto;
}

#muralvideo .themuralvideo{
width:413px;
height:310px;
float:left;
margin:0 20px 0 0;
}

#muralvideo .muraldesc{
color:#fff;
float:left;
font-family:ajensonpro-regular;
font-size:26px;
width:542px;
line-height:30px;
}

#muralvideo .muraldesc em{
font-style:normal;
font-weight:bold;
}

/* Sidebar */


/* Footer */