@charset "utf-8";

/* RESETTING DEFAULTS
------------------------------------------------------------------------*/
* {
margin:0;
padding:0;
}

p, blockquote, form, label, ul, ol, dl, fieldset, address {margin-bottom:20px;}


/* ELEMENTS COMUNS
------------------------------------------------------------------------*/
body {
margin:25px 0;
background:url(../logos/bg_body.png) repeat-x #dae4e6 fixed;
font:normal 12px Arial, Helvetica, sans-serif;
color:#000;
text-align:center; /*centro wrapper per a IE 5.5*/
}

a:link {
text-decoration:none;
color:#4fa0b7;
}

a:visited {
text-decoration:none;
color:#4fa0b7;
}

a:hover {
text-decoration:underline;
color:#95c6d4;
}

a:active {
text-decoration:none;
color:#999;
}


/* HEADINGS
------------------------------------------------------------------------*/
h1, h2, h3, h4 {
font-family:Verdana, Geneva, sans-serif;
font-weight:normal;
color:#006887;
}

h2 {
font-size:18px;
margin-bottom:11px; /*15(desitjat)-4(padding-bottom)=11*/
padding-bottom:4px;
background:url(../logos/bg_titols.gif) repeat-x bottom left #fff;
}

h3 {
font:bold 12px Arial, Helvetica, sans-serif;
margin-bottom:12px; /*15(desitjat)-2(padding-bottom)-1(border-bottom)=12*/
padding-bottom:2px;
border-bottom:1px dotted #4fa0b7;
}


/* ESTRUCTURA
------------------------------------------------------------------------*/
#wrapper {
position:relative;
width:938px;
margin:0 auto;
text-align:left; /*anulem text centrat body*/
}

/*** Header ***/
#wrapperHeader {
position:absolute;
width:938px;
height:142px;
top:0;
left:0;
background:url(../logos/bg_header.png) no-repeat bottom right;
}

#header {
position:relative;
width:938px;
height:142px;
}

#header h1 {
position:absolute;
width:540px;
height:35px;
top:82px;
left:356px;
font-size:26px;
margin-bottom:0;
/*overflow:hidden;*/
}

#logo {
position:absolute;
width:184px;
height:127px;
top:0;
left:0;
}

#logo img {
border:0;
}

#campus {
position:absolute;
width:116px;
height:16px;
top:17px;
left:822px;
font:normal 10px Verdana, Geneva, sans-serif;
}

#campus a {
display:block;
float:left;
height:16px; /*acomodo icona*/
padding-left:21px;
background:url(../logos/ico_campus.gif) left top no-repeat;
padding-top:1px; /*centro text verticalment*/
color:#fff;
}

/*** Content ***/
#wrapperContentNavigationFooter {
position:absolute;
width:938px;
top:142px;
left:0;
}

#wrapperContentNavigation {
position:relative;
width:938px;
background:url(../logos/bg_content.png) repeat-y;
overflow:hidden; /*Simple Clearing of Floats*/
}

#navigation {
float:left;
width:263px;
margin-left:62px;
display:inline; /*fixes IE5/6 Doubled Float-Margin Bug*/
}

#content {
float:right;
width:540px;
margin-right:42px;
display:inline; /*fixes IE5/6 Doubled Float-Margin Bug*/
}

/*** Footer ***/
#footer {
position:relative;
width:938px;
height:43px; /*80(desitjat)-37(padding-top)=43*/
font:normal 9px Verdana, Geneva, sans-serif;
line-height:14px;
/*line-height:94px; centro text verticalment*/
padding-top:37px; /*centro text verticalment*/
color:#006887;
text-align:center;
background:url(../logos/bg_footer.png) no-repeat left top;
overflow:hidden;
}

#footer a {color:#4fa0b7;}
#footer a:hover {text-decoration:underline;}


/* MENU PRINCIPAL
------------------------------------------------------------------------*/
#navcontainer {
position:absolute;
width:500px;
top:18px;
left:208px;
}

#navlist {
position:relative;
white-space:nowrap;
font:normal 10px Verdana, Geneva, sans-serif;
text-transform:uppercase;
}

#navlist li {
display:inline;
list-style-type:none;
border-right:1px solid #ffdf44;
}

#navlist a {padding:1px 9px 1px 5px;}

#navlist a:link, #navlist a:visited {
color:#fff;
text-decoration:none;
}

#navlist a:hover {
color:#006887;
background-color:#ffdf44;
text-decoration:none;
}

#navlist #active {
padding:1px 9px 1px 5px;
color:#ffdf44;
text-decoration:overline;
}


/* MENU CURSOS
------------------------------------------------------------------------*/
/*** 1er nivell ***/
#navigation ul {
margin-bottom:0;
list-style-type:none;
}

#navigation li {margin-top:5px;}

#navigation li a {
display:block;
width:233px; /*263-28(paddings)-2(borders)=233*/
padding:1px 5px 1px 23px;
color:#fff;
text-decoration:none;
border:1px solid #006887;
background:url(../logos/sprite_masmenos.gif) no-repeat #006887;
background-position:0px 0px; /* [] 0px 0px / [+] 0px -51px / [-] 0px -102px */
}

#navigation li a:hover {
color:#ffdf44;
background-color:#33869f;
}

/*** 2on nivell ***/
#navigation ul ul {
margin-left:18px;
list-style-type:none;
background-color:#4fa0b7;
}

#navigation li li {margin-top:0;}

#navigation li li a {
display:block;
width:225px; /*263-20(paddings)-18(margin-left)=225*/
padding:1px 5px 1px 15px;
color:#fff;
text-decoration:none;
border:none;
border-bottom:1px dotted #fff;
background:url(../logos/sprite_fletxetes.gif) no-repeat 0px -51px #4fa0b7;
}

#navigation li li a:hover {
color:#ffdf44;
background:url(../logos/sprite_fletxetes.gif) no-repeat 0px -102px #72b3c5;
}

/*
#navlistCursos #activeCursos #currentCursos {font-weight:bold;}
*/
#navlistCursos #activeCursos .currentCursos {font-weight:bold;}
#navlistCursos #subactiveCursos {font-weight:bold;}


/* CURSOS DESTACATS
------------------------------------------------------------------------*/
.cursDestacat {
float:left;
width:263px;
height:192px; /*102(img)+90(div)=192*/
margin-right:14px;
margin-bottom:14px;
border-top:5px solid #006887;
overflow:hidden;
}

.no_margin {margin-right:0;}

.cursDestacat img {
display:block;
width:263px;
height:100px; /*102 amb borders*/
border:none;
border-top:1px solid #fff;
border-bottom:1px solid #fff;
}

.cursDestacat div {
width:261px; /*263 amb borders*/
height:88px; /*90 amb borders*/
border:1px solid #4fa0b7;
background:url(../logos/bg_destacados.png) repeat-x left bottom #f9fafb;
overflow:hidden;
}

.cursDestacat h3 {
font:normal 12px Verdana, Geneva, sans-serif;
color:#fff;
margin:0;
padding:4px 5px 6px 5px;
border:none;
background-color:#4fa0b7;
}

#content .cursDestacat h3 a {
display:block;
padding-right:15px; /*evito que text solapi fletxes*/
color:#fff;
background:url(../logos/ico_fletxes.gif) no-repeat right 2px;
}

#content .cursDestacat h3 a:hover {
color:#ffdf44;
text-decoration:none;
}

#content .cursDestacat p {
margin:5px;
font-size:11px;
line-height:normal;
text-align:left;
}

#content .cursDestacat p a {color:#000;}
#content .cursDestacat p a:hover {text-decoration:underline;}

.mes_info {color:#006887;}


/* BOTONS
------------------------------------------------------------------------*/
#wrapperBotons {
position:relative;
width:540px;
height:38px;
font-size:11px;
overflow:hidden;
}

#b_back {
position:absolute;
width:280px;
height:30px;
top:2px;
left:0;
padding-left:15px;
background:url(../logos/ico_fletxa_back.gif) no-repeat 0px 2px;
overflow:hidden;
}

/*** Boto solicitar info ***/
#b_mes_info {
position:absolute;
width:230px;
top:0;
right:0;
}

#b_mes_info a {
position:absolute;
padding:2px 10px 2px 25px;
color:#fff;
text-decoration:none;
border:1px solid #006887;
background:url(../logos/ico_fletxes_info.gif) no-repeat #006887;
}

#b_mes_info a:hover {
color:#ffdf44;
background-color:#33869f;
}


/* LLISTES
------------------------------------------------------------------------*/
/*** Llistes ***/
#content p, #content ul {
line-height:16px;
text-align:justify;
}

#content ul {
margin-left:0;
padding-left:0;
list-style:none;
}

#content ul li {
padding-left:30px;
background:url(../logos/ico_fletxa.gif) no-repeat 12px 3px;
}

#content ul li ul li {
background:url(../logos/ico_fletxa2.gif) no-repeat 12px 3px;
border-bottom:none;
}

#content ul li ul li ul li {
background:url(../logos/ico_fletxa3.gif) no-repeat 12px 3px;
border-bottom:none;
}

#content ol {
margin-left:30px;
padding-left:0;
}

/*** Llistes cursos ***/
#content .llista_cursos ul {
margin-bottom:0;
padding:4px 0;
}

#content .llista_cursos li {
margin-bottom:4px;
font-size:16px;
background:url(../logos/ico_fletxa.gif) no-repeat 12px 2px;
border-bottom:1px dotted #4fa0b7;
}

#content .llista_cursos li ul li {
margin-bottom:0;
font-size:14px;
background:url(../logos/ico_fletxa2.gif) no-repeat 12px 2px;
border-bottom:none;
}

#content .llista_cursos li ul li ul li {
margin-bottom:0;
font-size:12px;
background:url(../logos/ico_fletxa3.gif) no-repeat 12px 5px;
border-bottom:none;
padding-left:20px;
}


/* ALTRES
------------------------------------------------------------------------*/
.separa {
background:url(../logos/ico_separa.gif) 5px 2px no-repeat;
padding-left:14px;
}

/*** Banner Home ***/
#banner {
width:540px;
height:181px; /*175(height img)+6(margin-top img)=181*/
margin-bottom:15px;
background:url(../logos/border_blau.gif) repeat-x #fff;
overflow:hidden;
}

#banner img {
width:540px;
height:175px;
margin-top:6px;
border:0;
}

/*** Foto detall curs ***/
#foto_curs {
float:right;
width:263px;
/*margin-left:14px;*/
border-left:14px solid #fff; /*solvento problema amb <H3>*/
margin-bottom:14px;
background:url(../logos/border_blau.gif) repeat-x #fff;
}

#foto_curs img {
width:263px;
margin-top:6px;
border:0;
}


/* LOGIN CAMPUS
------------------------------------------------------------------------*/
#campusvirtual p {margin:0;}

#campusvirtual fieldset {
margin:0;
padding:0;
border:none;
}

#campusvirtual label {
clear:left;
display:block;
float:left;
width:66px;
margin-bottom:10px;
padding:2px;
font-weight:bold;
}

.input_camp_campus {
display:block;
float:left;
width:145px;
padding:0;
border:1px solid #ccc;
}

/*** Botons tipus Submit ***/
input.button {
float:left;
width:80px;
margin-top:10px;
text-align:center;
color:#fff;
font-size:11px;
background-color:#336699;
border:1px solid #006887;
}

input.button:hover {
cursor:pointer;
color:#ffdf44;
background-color:#33869f;
border:1px solid #006887;
}
		
/*** the overlayed element ***/
div.overlay {
background-image:url("/logos/white.png"); /* growing background image */
/* dimensions after the growing animation finishes  */
width:222px;
height:230px;
display:none; /* initially overlay is hidden */
padding:55px; /* some padding to layout nested elements nicely */
}
		
/* default close button positioned on upper right corner */
div.overlay div.close {
background-image:url("/logos/close.png");
position:absolute;
right:5px;
top:5px;
cursor:pointer;
height:35px;
width:35px;
}

:focus {-moz-outline-style:none;}