﻿/**
 * project:      azzurro-reisen
 * main-url:     http://www.azzurro-reisen.de
 * file:		 screen.css     
 * description:  Main project style definitions for screen representation
 * auther:       markus bertelsmeier
 **/



/* HTML elements */

body {
	font-family: 'Trebuchet MS'; 
	font-size: 0.9em; 
	color: white;
	background-color: #823025;
	background-repeat:repeat-y;
	background-image: url('../../../images/bg.jpg');
	background-attachment: fixed;
}

h1 {
	
	text-align:center;
}

/* classes and IDs for main Layout/design*/

#left { width: 20%; 
        float: left; 
        border1: 1px solid white; 
}

#center { width: 60%; 
          float: left; 
          border1: 1px solid white; 
}

#right { width: 20%; 
         float: left; 
         border1: 1px solid white; 
}

#main { width: 100%; 
        float: left; 
}

#left ul, #center ul { text-align: center; 
                       margin: 0 0 0 0; 
                       padding: 0; 
                       list-style-type: none; 
}

#right ul { text-align: center; 
            margin: 0; padding: 0; 
            list-style-type: none; 
}

#left li { float: left; 
           margin: 0 0 3em 3em; 
           padding: 0; 
}

#center li { float: left; 
             margin-left: 2em; 
             padding: 0 1em 1em; 
}

#right li { float: left; 
            margin: 0 0 3em; 
            padding: 0 0 0 0; 
}

.decoImg {  border: 3px solid rgb(230, 205, 121);
}

#left a { color: white; 
          font-weight: bolder; 
          text-decoration: none; 
          text-align: center; 
          width: 200px; 
          float: left; 
          margin: 0 0 0 0; 
          padding: 137px 0 0; 
          display: block; 
          border1: 1px solid blue; 
}

#right a { color: white; 
           font-weight: bolder; 
           text-decoration: none; 
           text-align: center; 
           width: 200px; 
           margin: 0; 
           padding: 137px 0 0; 
           display: block; 
}

#center a { color: white; 
            font-weight: bolder; 
            text-decoration: none; 
            text-align: center; 
            width: 200px; 
            margin: 0; 
            padding: 137px 0 0; 
            display: block; 
}

#logo { background-image: url(../../../images/logohome.gif); 
        background-repeat: no-repeat; 
        background-position: center top; 
        color:white; 
        margin: 0; 
        padding: 0; 
}


#ferienwohnungen { background-image: url(../../../images/ferienwohnung_sw.jpg); 
                   background-repeat: no-repeat; 
                   background-position: center top; 
                   color:white; 
                   width: 200px; 
                   height: 135px; }

#ferienwohnungen:hover { background-image: url(../../../images/ferienwohnung_a.jpg);
}

#haus { background-image: url(../../../images/haus_sw.jpg); 
        background-repeat: no-repeat; 
        background-position: center top; 
        color: white; 
        width: 200px; 
        height: 135px; 
        padding-top: 107px; 
        padding-bottom: 200px; 
}

#haus:hover { background-image: url(../../../images/haus_a.jpg);
}

#hotels { background-image: url(../../../images/hotels_sw.jpg); 
          background-repeat: no-repeat; 
          background-position: center top; 
          color: white; 
          width: 200px; 
          height: 135px; 
          padding-top: 107px; 
          padding-bottom: 200px; 
}

#hotels:hover { background-image: url(../../../images/hotels_a.jpg);
}

#programm { background-image: url(../../../images/programm_sw_gr.jpg); 
            background-repeat: no-repeat; 
            background-position: center top; 
            color:white; 
            width: 200px; 
            height: 135px; 
            padding-top: 107px; 
            padding-bottom: 200px; 
}

#programm:hover { background-image: url(../../../images/programm_a_gr.jpg);
}

#cilento { background-image: url(../../../images/cilento_sw_gr.jpg); 
           background-repeat: no-repeat; 
           background-position: center top; 
           color:white; 
           width: 200px; 
           height: 135px; 
}

#cilento:hover { background-image: url(../../../images/cilento_a_gr.jpg);
}

#anreise { background-image: url(../../../images/anreise_sw_gr.jpg); 
           background-repeat: no-repeat; 
           background-position: center top; 
           color:white; 
           width: 200px; 
           height: 135px; 
           padding-top:107px; 
           padding-bottom: 200px; 
}

#anreise:hover { background-image: url(../../../images/anreise_a_gr.jpg);
}

#wetter { background-image: url('../../weather.php5');
          background-repeat: no-repeat;
	      background-position: top center;
	      color:white;
	      padding-top:108px;
}

#homepic { background-image: none; 
           margin-top: 2em; 
           margin-left: 1em; 
           padding: 2em; 
           display: inline; 
}

#mainCont a, #footer a, #extLinks a, a  { color:#ff9; display: inline; }

#mainCont {  }

#mainCont em, #mainCont strong { font-weight:normal;
	                             font-style:normal;
}

#footer { text-align: center; 
          width: 40%; 
          height:1.3em; 
          clear: both; 
          margin-right: auto; 
          margin-left: auto; 
          list-style-type:none; 
}

#footer li { text-align: center; float: left; }


#footer li:before, #extLinks li:before { text-align: center; margin-left: 0.3em; content:"  |  "; }

li.last:after { content:" | ";}

#footer a { font-weight:normal; 
            text-align: center; 
}

#extLinks { clear: both;
            list-style-type:none;   
 	        list-style-position:inside;
 	        width:35%;
 	        margin-left:auto;
 	        margin-right:auto;
 	        padding-left:auto;
 	        padding-right:auto;
 	        height:1.3em;
}

#copyright { float: right;}

#copyAll { background-color:transparent;
 	       background-image: url('../../../images/logohome.gif');
	       background-repeat: no-repeat;
	       background-position: bottom right;
	       height:92px;

}

