/* BODY */
body {background:#221f1f}


/* HEADER */
#header {background:none; height:84px;}
#logo {position:absolute; margin-left:28px; width:224px; height:84px; background:url(../images/logo-vsc.png) no-repeat; _background-image:url(../images/logo-vsc-ie6.png)}

#english {width:55px; height:12px; background-image:url(../images/english-button.png)}
#english:hover {background-position: 0 -12px}

#login {width:43px; height:12px; background-image:url(../images/login-button.png)}
#login:hover {background-position: 0 -12px}

ul.idiomas {float:right; width:57px; margin:4px 0 0 0; height:12px}
.idiomas li { padding-left:5px; margin:0; float:right; list-style-type:none; background:none;} 
.idiomas li a { text-indent: -9999em; display: block; height:12px; padding: 0 0px; margin: 0; overflow: hidden; background: url(../images/nav_idiomas.png) 0 0 no-repeat}

.idiomas-español {width: 57px} 
ul.idiomas .idiomas-español a { background: url(../images/nav_idiomas.png) 0 0 no-repeat}
ul.idiomas .idiomas-español a:hover,
ul.idiomas .idiomas-español a.active { background: url(../images/nav_idiomas.png) 0 -12px no-repeat}

.idiomas-english { width: 55px} 
ul.idiomas .idiomas-english a { background: url(../images/nav_idiomas.png) -60px 0 no-repeat}
ul.idiomas .idiomas-english a:hover,
ul.idiomas .idiomas-english a.active { background: url(../images/nav_idiomas.png) -60px -12px no-repeat}


ul.nav {position:absolute; margin:36px 0 0 380px; width:400px; height:21px; background-colour:FFF}
.nav li { padding-left:20px;margin: 0; float:left; list-style-type:none; background:none;} 
.nav li a { text-indent:-9999em; display:block; height:21px; padding:0 11px; margin:0; overflow:hidden; background:url(../images/nav_sp.png) 0 0 no-repeat; background-colour:FFF}

.nav-inicio { width: 34px} 
ul.nav #nav-inicio a { background: url(../images/nav_sp.png) -8px 0 no-repeat}
ul.nav #nav-inicio a:hover,
ul.nav #nav-inicio a.active { background: url(../images/nav_sp.png) -8px -21px no-repeat}

.nav-acercademi { width: 81px} 
ul.nav .nav-acercademi a { background: url(../images/nav_sp.png) -62px 0 no-repeat}
ul.nav .nav-acercademi a:hover,
ul.nav .nav-acercademi a.active { background: url(../images/nav_sp.png) -62px -21px no-repeat}

.nav-trabajos { width: 57px}
ul.nav .nav-trabajos a { background: url(../images/nav_sp.png) -164px 0 no-repeat}
ul.nav .nav-trabajos a:hover,
ul.nav .nav-trabajos a.active { background: url(../images/nav_sp.png) -164px -21px no-repeat}

.nav-blog { width: 29px}
ul.nav .nav-blog a { background: url(../images/nav_sp.png) -242px 0 no-repeat}
ul.nav .nav-blog a:hover,
ul.nav .nav-blog a.active { background: url(../images/nav_sp.png) -242px -21px no-repeat}

.nav-contacto { width: 60px}
ul.nav .nav-contacto a { background: url(../images/nav_sp.png) -295px 0 no-repeat}
ul.nav .nav-contacto a:hover,
ul.nav .nav-contacto a.active { background: url(../images/nav_sp.png) -295px -21px no-repeat}


/* MAIN CONTENT AREA */
.maincontent-home {margin-top:-23px; height:550px; background:url(../images/mainimage-home.jpg) no-repeat top; border-top:1px solid #999;}
.maincontent-me {margin-top:-23px; height:550px; background:url(../images/mainimage-me.jpg) no-repeat top; border-top:1px solid #999;}
.maincontent-work {margin-top:-23px; border-top:1px solid #999;}
.maincontent-contact {margin-top:-23px; height:550px; background:url(../images/mainimage-contact.jpg) no-repeat top; border-top:1px solid #999;}
.content-block {background:#fff; filter:alpha(opacity=94); -moz-opacity:0.94; -khtml-opacity: 0.94; opacity: 0.94; }
.content-area {margin:20px}

img.work {border:1px solid #888; padding:3px; }
img.work-large {border:12px solid #444; margin-top:-10px;}
a:hover img.work {border: solid 1px #ddd;}

ul.work {margin:12px 0 0; border-bottom:1px solid #444;}
.work li{padding:4px 0 0; -padding:2px 0 0; *padding:2px 0 0;list-style-type:none; background:none; border-top:1px solid #444;}
.work li h3 {margin:6px 0 0; font-size:0.9em; -font-size:0.8em; *font-size:0.8em; color:#ccc;}
.work li h3 a {text-decoration:none; padding:0; color:#61b6f4;}
.work li h3 a:hover {text-decoration:underline;}
.work li h3 a.active {color:#fff;}
.work li p {font-family:georgia; font-style:italic; padding-top:1px; font-size:0.8em; -font-size:0.7em; *font-size:0.7em; color:#999; margin-bottom:6px;}

.sample {height:225px}

ul.trabajo {margin:20px 0 0; padding:20px 0 3px; font-size:0.8em; -font-size:0.7em; *font-size:0.7em; color:#999; border-top:1px solid #444;}
.trabajo li{padding:0; margin-top:2px; list-style-type:none; background:none;}
.trabajo li a{color:#61b6f4; text-decoration:none;}
.trabajo li a:hover{text-decoration:underline;}

#gallery {margin: 0 0 15px; border:12px solid #444;}
#gallery .thumb {display: block;}
#gallery_changer li {font-size:0.75em; display:inline; background:url(../images/bg_gallery_changer.png) no-repeat left; padding:0 0 0 8px; margin:0 0 0 7px;}
#gallery_changer .first {padding-left:0px; margin-left:-10px; background:none;}
#gallery_changer li a{text-decoration:none; color:#61b6f4;}
#gallery_changer li a:hover{text-decoration:underline;}
#gallery_changer .current a {color:#fff; font-weight:bold; text-decoration:none;}
#gallery_changer .current a:hover{text-decoration:none;}


/* FOOTER CONTENT AREA */
dl.blog *{font-weight:normal; color:#999; margin:0; padding: 3px 0; margin:0 0 3px 0;}
.blog dt{font-size:0.8em; -font-size:0.75em; *font-size:0.75em; width:34.9%; float:left; border-bottom:1px solid #333; margin:0 0 3px 0;}
.blog dd{font-size:0.8em; -font-size:0.75em; *font-size:0.75em; width:65%; float:right; border-bottom:1px solid #333;}
.blog dd a, #pe a{text-decoration:none; padding:0; color:#61b6f4;}

#blog {width:90px; height:12px; margin-top:8px; background-image:url(../images/blog-button.png)}
#blog:hover {background-position: 0 -12px}

ul.contact {margin-left:0px; padding: 3px 0; font-size:0.8em; -font-size:0.75em; *font-size:0.75em; color:#999;}
.contact li.skype {padding-left:16px; background:url(../images/skype-icon.png) no-repeat 0; margin-top:-2px;}
.contact li{padding-left:0px; margin:0 0 6px 0; list-style-type:none; background:none;}
.contact li a, #pe a{text-decoration:none; padding:0; color:#61b6f4;}
.contact img {margin-bottom:-3px}

ul.contact-main {margin:0 0 30px 20px; padding:0; font-size:1em; -font-size:0.9em; *font-size:0.9em; color:#333;}
.contact-main li.skype {padding-left:24px; background:url(../images/skype_icon.png) no-repeat 0; margin-top:-2px;}
.contact-main li{padding-left:0px; margin:0 0 10px 0; list-style-type:none; background:none;}
.contact-main li a, #pe a{text-decoration:none; padding:0; color:#2585dd;}
.contact-main img {margin-bottom:-5px}

ul.contact-inline {margin-left:0px; padding: 3px 0; font-size:0.8em; -font-size:0.75em; *font-size:0.75em; color:#999;}
.contact-inline li.skype {display: inline; padding-left:16px; background:url(../images/skype-icon.png) no-repeat 0; margin:-2px 0 0;}
.contact-inline li{display: inline; padding-left:0px; margin:0 20px 0 0; list-style-type:none; background:none;}
.contact-inline li a, #pe a{text-decoration:none; padding:0; color:#61b6f4;}
.contact-inline li a:hover{text-decoration:underline;}

/* CONTACT FORM */
ul.submit {margin:10px 0 5px 0; padding:0 20px 0 16px; list-style-type:none;}
.submit li{background:none; clear:both;}

ul.captcha {float:left; margin:5px 0 5px 20px; padding:10px 10px 0 10px; width:208px; font-size:0.8em; -font-size:0.75em; *font-size:0.75em; color:#999; border:1px solid #CCC;}
.captcha li{float:left; margin-right:10px; width:80px; padding-left:0px; margin:0 0 5px 0; list-style-type:none; background:none;}

#nombre, #telefono, #consulta,
#email {position:relative; float:left; margin:8px 0 0 20px; font-size:0.8em;}
input#name-field, input#telephone-field,
input#email-field {width:226px; padding:2px; border:1px solid #ccc; background:#eee;}
textarea#enquiry-field {width:226px; height:80px; padding:2px; border:1px solid #ccc; background:#eee;}
label.overlabel {color:#999;}
label.overlabel-apply {position:absolute; top:3px; left:5px; z-index:1; color:#999;}

#codigo {position:relative; float:left; width:230px; margin:8px 0 0 20px; border:1px solid #ccc;  font-size:0.8em;}
#captcha {position:relative; float:left; margin:13px 0 0 5px; }
#code-image {float:right; width:120px; margin:5px 5px 0 5px; }
input#captcha-field {width:80px; padding:2px; border:1px solid #ccc; background:#eee;}

#submit {position:relative; float:left; margin:10px 0 8px 20px; border:none;}

.compulsory {font-weight:bold;}

/* Hack to remove Safari's extra padding. Remove if you don't care about pixel-perfection. */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    input, textarea, select { padding: 4px; }
}




ul.wallpaper {float:left; margin:0 20px 0 0; padding: 3px 0; font-size:0.75em; -font-size:0.7em; *font-size:0.7em; color:#999; list-style: none;}
.wallpaper li{padding-left:12px; margin:0 0 1px; background: url(../images/bg_more.gif) no-repeat 0 5px;}
.wallpaper li a, #pe a{text-decoration:none; padding:0; color:#61b6f4;}

h2.large-neg {font: normal "Avenir LT Std", Avenir, Helvetica, Arial, sans-serif; letter-spacing: -1px; margin:0 0 6px 0; font-size:2em; -font-size:1.9em; *font-size:1.9em; color:#CCC; font-weight:normal; letter-spacing:0.05em;}
h2.main-negative {margin:20px 0 10px 0; font-size:1.2em; -font-size:1.1em; *font-size:1.1em; color:#CCC;}
h2.light-neg {margin:20px 0 10px 0; font-size:1.2em; -font-size:1.1em; *font-size:1.1em; color:#444;}
h2.main {margin:20px 0 0 20px; font-size:1.2em; -font-size:1.1em; *font-size:1.1em; color:#333;}
h2.normal {margin:4px 0 0; font-size:0.9em; -font-size:0.8em; *font-size:0.8em; line-height:120%; color:#ccc;}
h2.normal a {text-decoration:none; padding:0; color:#61b6f4;}
h2.space {margin-bottom:15px; font-size:1em; -font-size:0.9em; *font-size:0.9em; color:#ccc;}
h3.normal {margin:4px 0 0; font-size:1em; -font-size:0.9em; *font-size:0.9em; color:#ccc;}
h3.normal a {text-decoration:none; padding:0; color:#61b6f4;}


img.imac {float:left; margin-top:5px;}

#atom {width:25px; height:24px; background-image:url(../images/icon-atom.png);}
#cc {width:80px; height:15px; margin-bottom:10px; background-image:url(../images/logo-cc.png);}
#csans {width:50px; height:20px; margin: 0 10px 10px; background-image:url(../images/logo-csans.png);}
#W3C {width:230px; height:104px; margin:0; background-image:url(../images/w3c_approved.png);}

	
p.normal {font-size:1em; -font-size:0.9em; *font-size:0.9em; line-height:140%; color:#333;}
p.normal a{color:#2585dd; text-decoration:none;}
p.small {font-size:0.8em; -font-size:0.75em; *font-size:0.75em; line-height:140%; color:#333;}
p.negative {font-size:0.8em; -font-size:0.7em; *font-size:0.7em; color:#999; margin-top:8px;}
p.description {padding:3px 100px 0 0; line-height:170%; font-size:0.8em; -font-size:0.7em; *font-size:0.7em; color:#999; margin-top:10px;}
p.subtitle {font-family:georgia; font-style:italic; padding:3px 0; font-size:0.9em; -font-size:0.8em; *font-size:0.8em; color:#999; margin:2px 0 0;}
p.italic {font-family:georgia; font-style:italic; padding: 3px 0; font-size:0.8em; -font-size:0.7em; *font-size:0.7em; color:#999; margin-bottom:10px;}

p.web_link {margin-top:10px;}
p.web_link a{font-size:0.8em; -font-size:0.7em; *font-size:0.7em; color:#61b6f4; text-decoration:none;}
p.web_link a:hover{text-decoration:underline;}