/* allgemeine formatierung */

body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, blockquote {
	margin: 0; padding: 0; border: 0;
}


	html,body {

		 /*man konnte auch die gesamte schrift hier festlegen

			font-family: "georgia"; wenn sie die gleiche ist für die gesamte seite

		 */
	   		background-color: #fff;
	    	height: 100%;
			width: 100%;
	 }


/*

Margin: Außenabstand
werte reihenfolge: Oben Rechts unten Links

Padding: Innenabstand;


*/
/*
ELEMENT PSEUDOKLASSE: die namen sind festgelegt!;
Element.google.hover

*/
/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> typo  <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/



h1{

font-family: arial, sans-serif;
color: #5e0202;
font-size: 30px;
font-weight: bold;

}

h1:before{
 content: "\8226";
}


h4{    /*titulos prinipales de Página*/

font-family:'BasicCommercialW01-Roma';
color: #BC9768;
font-size:3em;


font-style: normal;
font-weight: 400;

}

h3{    /* subtitulos*/

font-family:'BasicCommercialW01-Roma';
color: #7391BF;
font-weight: 400;
font-size:1.125em;


}





.textContentLeft {
font-family: 'Source Sans Pro', sans-serif;
font-size: 16px;
color: #999999;
font-weight: 400;
line-height: 23px;



}

.textContentRight {
font-family:'BasicCommercialW01-Roma';
font-size: 16px;
color: #fff;
font-weight: 400;
line-height: 23px;



}




.red{

	color: #ff0000;
}

.yellow{

	color: #FFCC33;

}


a:hover{

	color:66f5f5;
}

a.google{

		color: #FFCC33;
}

a.google:hover{

	color:#ccffcc;

}
a.google:active{
	color: #000;
}

a.yahoo{

	color: #FF33CC;
}
a.yahoo:hover{

	color:#ddffdd;
}















#wrapper {

width:960px;
margin: 0px auto;
/*border: 1px solid #000;*/

}

#line {
	height:10px;
	width: 960px;
	/*border: 1px solid #000;*/
	background: #92B8F2;
	color: #BF9445; /*>>>>>>>>>>>aqui se define el color del texto*/
	float: left;
}


#main-header {
	height:188px;
	width: 960px;
	/*border: 1px solid #000;*/
	background: #FFF;
	color: #3366FF; /*>>>>>>>>>>>aqui se define el color del texto*/
	float: left;
	border-bottom: 1px dotted #c2c2c2;
}


#logo{
	height: 150px;
	width: 960px;
	background: #fff;
/*	float: left;*/
/*	margin-top: 5px;*/
/*	position: fixed;*/
/*	margin-left: 310px;*/
/*	 z-index:1;*/
}



#menuOben{
	height: 100px;
	width: 960px;
	/*background: #11aaaa;*/
	float: left;
/*	margin-top: 5px;*/
/*	position: fixed;*/
/*
	 z-index:1;*/
}


#menuPrincipal{

	width: 960;
	background: #ccc;

}

#menuPrincipal .menu{

list-style-type: none;


}




#menuPrincipal .menu li a{


width: 120px;
height: 38px;
display: block;
float: left;



font-family:'BasicCommercialW01-Roma', Arial;
color: #333;
font-size: 1em;



text-align: center;
text-decoration: none;
line-height: 36px;
/*text-indent: 25px;*/

padding-right: 4px;
background-color: #fff;




}


#menuPrincipal .menu li a:hover{
font-family:'BasicCommercialW01-Roma';
color: #ccc;
/*letter-spacing:-0.105em;*/
/*text-shadow: 0px 1px 0px #b3c0ac;
background:#004D99;*/

}


#sectionwrapper{ /*>>>>>>>>>>>todo, Menu y Content*/

width: 960px;
height: 1300px;

/*background: #334455;*/

}


#articleHeader{  /* -----------< Letra de Titulos >------------*/

text-indent: 40px;

}

#subtitulos{  /* -----------< Letra (formatierung) de subtitulos Left >------------*/

text-indent: 40px;
line-height: 50px;

}



#sidebar{

	height: 200px;
	width: 200px;
/*	background: #551133;*/
	float: left; 
	position: fixed;
	margin-top: 300px;

}

#sidebar .menu{

margin-top: 5px;
list-style-type: none;
width: 200px;

}


#sidebar .menu li a{


width: 200px;
height: 38px;
display: block;
float: left;



font-family:'BasicCommercialW01-Roma';
color: #333;
font-size: 1em;



text-align: right;
text-decoration: none;
line-height: 36px;
text-indent: 25px;

padding-right: 4px;
background-color: #FF4433;




}


#sidebar .menu li a:hover{
font-family:'BasicCommercialW01-Roma';
color: #fff;
/*letter-spacing:-0.105em;*/
text-shadow: 0px 1px 0px #b3c0ac;
background:#004D99;

}

#articleHeader{  /* -----------< hintergrund de Titulos >------------*/

/*padding-left: 50px;*/
/*padding-top: 10px;*/
float: left;
background: #fff;
display: block;
width: 960px;
height: 50px;

}

#subtitulos{  /* -----------< hintergrund de subtitulos Left >------------*/

/*padding-left: 50px;*/
/*padding-top: 10px;*/
float: left;
background: #fff;
display: block;
width: 640px;
height: 50px;

}


#subtitulosRightSpace{  /* -----------< hintergrund de subtitulos RightSpace>------------*/

/*padding-left: 50px;*/
/*padding-top: 10px;*/
float: left;
/*background: #ddff33;*/
display: block;
width: 340px;
height: 50px;


}

#content{   /* -----------< ID selektor >------------*/

	height: 800px;
	width: 960px;
	float: left;
/*	margin-left: 210px;*/
	margin-top: 5px;
/*	background: #CC33FF;*/
	display: block;
}


#contentLeftSpace{ /* -----------< toda la BoxLeft incluyendo la box de texto (textBoxleft)*/

height: 500px;
width: 620px;
/*background: #FF470A;*/
float: left;
/*border-right: 1px #ccc solid;*/
}

#textBoxLeft { /* -----------< la que contiene el texto >---------------*/
	width: 540px;
/*	background: #33ff55;*/
	margin-left: 40px;


}




#contentRightSpace{ /* -----------< toda la BoxRight incluyendo la box de texto (textBoxlRight)*/

height: 500px;
width: 340px;
/*background: #ddd;*/
float: left;
/*border-right: 1px #ccc solid;*/
}





#textBoxRight{ /* -----------< la que contiene el texto >---------------*/
	width: 294px;
	background: #33ff55;
	margin-left: 20px;


}

footer {   /*>>>>>>>>>> este es un typen selektor <<<<<<<<<<<<*/
	
	height: 480px;
	width: 960px;
/*	margin-left: 210px;*/
	clear: both;
	float: left;
	overflow: hidden;

	border-top: 10px solid #87AE99;

	background: #3666B2;;
	color: #fff; /*>>>>>>>>>>>aqui se define el color del texto*/

}