/*
    CSS Style for:  hydrosfera.it
    Author: D'Amico Simone - www.simonedamico.it
*/


/* CSS reset */
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:400}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-weight:inherit;font-size:100%}legend{color:#000}
.clear{clear:both}.float-left{float:left}.float-right{float:right}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.bold{font-weight:700}.italic{font-style:italic}.underline{border-bottom:1px solid}.highlight{background:#ffc}.wrap{width:960px;margin:0 auto}.img-left{float:left;margin:4px 10px 4px 0}.img-right{float:right;margin:4px 0 4px 10px}.nopadding{padding:0}.noindent{margin-left:0;padding-left:0}.nobullet{list-style:none;list-style-image:none}.width100{width:100%}.width75{width:75%}.width50{width:50%}


/* basic elements */
html, body {
    background-color:#041A65;
    height:100%; 
    margin:0; 
    padding:0;
    font-family: Verdana,"Trebuchet MS","Lucida Sans Unicode","Helvetica","Arial",sans-serif;
    font-size: 12px;    
}


/* layout della pagina */
#container {
    min-width:740px;
    text-align: center;
    position:relative; /* needed for footer positioning*/
    min-height:100%; /* real browsers */
    height:auto !important; /* real browsers */
    height:100%; /* IE6:treaded as min-height*/
    background:url(../images/background.jpg) no-repeat center top;   
}
    
    #container #wrapper {
        width: 740px;
        text-align:left;
        margin: 0 auto;   
    }
    
        #wrapper #header {
            background: url(../images/logo.png) no-repeat;
            height: 200px;   
        }
        
        #wrapper #nav {
        	width: 490px;
        	height: 48px;
        	float: right;
        	margin: -55px 5px 0 0;
        	z-index: 1;        
        }   
        
        #wrapper #content { 
            min-height: 350px;  
            height: auto !important;  
            height: 350px; 
            background: #73C1E7;
            margin: 20px 0px;    
            border: 5px solid #fff;
            padding: 5px;
        }  
        
        #wrapper #subcontent { 
            margin: 0;
            margin-top: -20px; 
            background: url(../images/subcontent.png) no-repeat;
            width: 740px;
            height: 30px;
        }
        
        #wrapper .box {
            float: left;
        }
   
    #container #footer {    
        clear:both; 
        bottom:0; 
        width:100%;   
        height:150px; 
        z-index:1;
    }   
/*--layout della pagina--*/



/* elementi grafici accessori */

/*--elementi grafici accessori--*/



/* #header */
/*--#header--*/



/* #nav */
#nav { }
    #nav .menu {
    	font-family: "Trebuchet MS", Arial, san-serif;
    	width:492px;
    	height:42px;
    	position:relative;
    	font-size:11px;
    	margin: 0;
    	padding-left: 85px;
    	z-index: 10;
    }
    #nav .menu ul li a {
    	display:block;
    	text-decoration:none;
    	color:#fff;
    	font-weight:bold;
    	width:81px; 
    	height:42px; 
    	text-align:center;
    	border-bottom: 0;
    	background-image:url(../images/nav/2a.png);
    	line-height:48px; 
    	font-size:11px; 
    	overflow:hidden;
    	padding-left: 1px;
    }
    /* first and last tabs */     
    #nav .menu .one {
    	background-image:url(../images/nav/1a.png);
    	padding-left: 1px;
    	margin-right: -1px;
    }
    #nav .menu .three {
    	background-image:url(../images/nav/3a.png);
    }
    
    #nav .menu ul {padding:0; margin:0; list-style: none;}
    #nav .menu ul li {float:left; position:relative;}
    #nav .menu ul li ul {display: none;}
    
    /* button hover properties */
    #nav .menu ul li:hover a {color:#043454; background: url(../images/nav/2b.png);}
    #nav .menu ul li:hover ul {display:block; position:absolute; top:42px; left:0; width:152px; margin: 0; padding: 0;}
    #nav .menu ul li:hover ul li a.two {background:#6a3; color:#fff;}
    #nav .menu ul li:hover ul li:hover a.two {background:#6fc; color:#544a3a;}
    #nav .menu ul li:hover ul li ul {display: none;}
    
    #nav .menu ul li:hover .one {color:#043454; background: url(../images/nav/1b.png);}
    #nav .menu ul li:hover .twoc {color:#043454; background: url(../images/nav/2c.png);}    
    #nav .menu ul li:hover .three {color:#043454; background: url(../images/nav/3b.png);}
    
    /* dropdown properties */
    #nav .menu ul li:hover ul li a {background-image: none; display:block;height: 28px; line-height: 26px; color:#043454; width:142px; text-align:left; margin: 0; padding:0 0 0 11px;font-weight:normal;}
    #nav .menu ul li:hover ul {
    	margin: 0 0 0 3px;
    	padding: 0;
    	background-image: url(../images/nav/ddbg.png);
    	background-repeat:no-repeat;
    	background-position:bottom left; 
    }
    #nav .menu ul li:hover ul .hlight {
    	background-image: url(../images/nav/hlight2.png);
    	margin-right: 1px;
    }
    
    /* dropdown selected properties */
    #nav .menu ul li:hover ul li a:hover {color:#fff; background-image: url(../images/nav/hlight.png);}
    
    #nav .menu ul li:hover ul li:hover ul {display:block; position:absolute; left:105px; top:0;}
    #nav .menu ul li:hover ul li:hover ul.left {left:-105px;}    
/*--#nav--*/



/* #wrapper */
#wrapper { }
    #wrapper h1 {
        color: #FFFF00;
        font-size: 1.3em;
        font-weight: bold;
    }
    #wrapper h2 {
        color: #FFFF00;
        font-size: 1.2em;
        font-weight: bold;
    }    
    #wrapper p {
        text-align: justify;
        margin-top: 10px;
        margin-bottom: 30px;
    }
        #wrapper p.marchi {
            text-align: center;
        }
            #wrapper p.marchi img {
                padding: 10px;
                border: 1px solid #fff;
            }
    #wrapper a {
        color: #FFFF00;
        font-weight: bold;
        text-decoration: none;
    }
    #wrapper a:hover {text-decoration: underline;}
    #wrapper a.opacity img { border: 2px solid white; }
    #wrapper a.opacity:hover { opacity: 0.75; }

    /* .box */
    #wrapper .box { }
    #wrapper .box .content {
        background: #73C1E7;
        border: 5px solid #fff;
        width: 355px;
        height: 200px;   
        margin: 30px 0px; 
    }
        #wrapper .box .content h1 {
            color: #FFFF00;
            font-size: 1.3em;
            font-weight: bold;
            padding: 5px;
        }
        #wrapper .box .content h2 {
            color: #FFFFA5;
            font-size: 1.2em;
            font-weight: bold;
            text-decoration: underline;
            padding: 5px;
        }        
        #wrapper .box .content p {
            color: black;
            font-size: 1.2em;
            padding: 5px;
        }
        #wrapper .box a:hover { opacity: 0.75; }
    
    #wrapper .box .subcontent {
        margin: 0;
        margin-top: -30px; 
        background: url(../images/box_subcontent.png) no-repeat;
        width: 365px;
        height: 30px;
    }
    
    #wrapper .left { margin-left: 5px;}
    #wrapper .right { margin-right: 5px;}    
    /*------*/

/*--#wrapper--*/




/* #footer */
#footer { }
    #footer img { border: none; }
    #footer p { text-align: center; }
    
    #footer #left-coral {
        position:absolute; 
        z-index:3; 
        bottom:0px; 
        background:url(../images/left-corals.png) no-repeat; 
        height:150px; 
        width:108px; 
        left:0;
    }  
    
    #footer #right-coral {
        position:absolute; 
        z-index:4; 
        bottom:0px; 
        background:url(../images/right-corals.png) no-repeat; 
        height:150px; 
        width:108px; 
        right:0;
    }
    
    #footer #footer-info {
        position:absolute; 
        bottom:0;  

        text-align:center; 
        color:#B0B4B7; 
        z-index:5;
    }   
/*--#footer--*/























/* #slider */
#slider{}
    #slider ul, #slider li{
    	margin:0;
    	padding:0;
    	list-style:none;
    }
   	#slider li{ 
    	width:355px;
    	height:145px;
    	overflow:hidden; 
    }
    #slider li p {
        padding-right: 15px;
        text-align: justify;
    }
/*------*/    


/* #map1 */
#map1 {
    width: 700px; 
    height: 250px;
    margin: 10px auto;
}
.map1 { width: 500px; }
#map1 span { display:none; }
#map1 a { color: red; }
/*------*/ 


/* form */
form { font-size: 1.1em; margin-left: 20px; }
    label {
                display: block; 
                padding: 6px 0px;
            }
    input, textarea {
        display: block; 
        border: 1px solid #0E3C8A;
        width: 260px;
        padding: 6px 6px 6px 30px;
        background: #fff;
    }
        input.user { background: #fff url(../images/formuser.png) no-repeat left center; }
        input.email { background: #fff url(../images/formemail.png) no-repeat left center; }
        .border-active { border: 1px solid red; }
        textarea { 
            padding: 10px;
            width: 276px;
            margin-bottom: 10px;
        }
        
    input.submit { 
        padding: 2px; 
        margin: 2px; 
        background: url(../images/submit.png) no-repeat center center; 
        border: none;
        width: 49px;
        height: 23px;
        color: #fff;
        font-weight: bold;
    }        
/*--form--*/


