@font-face {
    font-family: 'railwayregular';
    src: url('tipografias/railway/railway-webfont.eot');
    src: url('tipografias/railway/railway-webfont.eot?#iefix') format('embedded-opentype'),
         url('tipografias/railway/railway-webfont.woff2') format('woff2'),
         url('tipografias/railway/railway-webfont.woff') format('woff'),
         url('tipografias/railway/railway-webfont.ttf') format('truetype'),
         url('tipografias/railway/railway-webfont.svg#railwayregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'troikaregular';
    src: url('tipografias/troika/troika-webfont.eot');
    src: url('tipografias/troika/troika-webfont.eot?#iefix') format('embedded-opentype'),
         url('tipografias/troika/troika-webfont.woff2') format('woff2'),
         url('tipografias/troika/troika-webfont.woff') format('woff'),
         url('tipografias/troika/troika-webfont.ttf') format('truetype'),
         url('tipografias/troika/troika-webfont.svg#troikaregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

html, body{
			font-family: railwayregular;
			margin: 0 auto;
			text-align: center;
			height: 100%;
            background-color: #2a2a2a;
            background: url(pattern/stardust/stardust.png);
			}


header{
	position: fixed;
	background: #2a2a2a;
	width: 100%;
	height: 80px;
	box-shadow: 2px 0.5px 1px black;
	font-size: 12px;
}

header img{
		margin-top: 10px;
		float: left;
		margin-left: 20px;
}

header nav{
		float: right;
		margin: 0px 43px;
		text-shadow: 2px 2px 1px black;	
		}
		
header ul{
		display: inline-block;
		margin: 15px;
		}

header li{
		list-style-type: none; 
		display: inline-block;
		padding: 0px 10px;
		margin: 0;
		height: 100%;
		padding: 20px;
		}
		

header li a{
		text-decoration: none;
		height: 100%;
		border-left: 2px solid #FFFFFF;
		padding-left: 5px;
		}

header li a:visited{ color: #FFFFFF;}
header li a:hover{ color: red;}

main{ text-align: center;}


#principal, #modulos{
			width: 70%;
			margin: 0 auto;
			padding: 0px;
			text-align: center;
			background: #ead16e;
			}

#principal p{
		padding: 20px 200px;
		margin: 0px  ;
        color:#e56a6a;
        font-style: italic;
}
			
h2{ margin: 80px 0px 0px 0px; display: inline-block; padding: 30px;color:#F7F7F7; }
h3{ margin: 0 auto; padding: 30px;color:#ead16e;}


#home_il{
	width: 70%;
	margin: 0 auto;
	background-color: rgba(42, 42, 42, 0.33)
}

#home_il p{
		padding: 0px 190px 40px 190px;
		margin-top: 40px;
        color: #F7F7F7;
}

#niveles{
		padding: 20px;
		background-color: #e56a6a;
		width: 70%;
		margin: 15px auto;
		padding: 15px 0px;
		}

#niveles h2{
			display: block;
			margin: 0;
			color: #ead16e;
			text-shadow: 2px 2px 1px black;
}

#niveles a h2{
		display: block;
		margin: 0;
		font-size: 50px;
		position: absolute;
		color: #ead16e;
		text-shadow: 2px 2px 1px black;
}

#niveles a{
		margin: 10px;
		text-decoration: none;
		display: inline-block;
}
			
#modulos h2{	margin: 0;}
#modulos ul{	list-style-type: none; margin: 0; text-align: center; padding: 0;}
#modulos ul li{
			width: 30%;
			display: inline-block;
			margin: 15px;
			background: #e56a6a;
			}
#modulos ul li p{
			width: 63%;
			display: inline-block;
			margin: 5px;
            color: #e9eced;
            text-align: center;
            font-size: 0.9rem;
			}
#modulos ul li a{
			text-decoration: none;
			margin: 5px;
			display: block;
			color: black;
           
			}

#modulos ul li a:hover{	color: #ead16e;}
			
footer{
		margin: 0 auto; 
		padding: 20px;
		text-align: center;
		color: #F7F7F7;
		background: #2B2B2B;
		font-size: 12px;
		}