﻿body {
	margin:0; padding:0;
	background-image: url(../imagens/bg.jpg);
	background-position: top left;
  	background-repeat: no-repeat;
  	background-attachment: fixed;
  	background-color:#464646;
	background-size: cover; /*CSS padrão*/
	-webkit-background-size: cover; /*CSS safari e chrome*/
	-moz-background-size: cover; /*CSS firefox*/
	-ms-background-size: cover; /*CSS IE*/
	-o-background-size: cover; /*CSS Opera*/
  /* 
   * background: url(images/bg.jpg) top left cover no-repeat fixed;
   */
}

#topo {
	width:cover/ 10px;
	height:130px;
	float:right;
	margin: 100px 50px 0 0;
	-webkit-border-bottom-right-radius: 12px;
	-webkit-border-bottom-left-radius: 12px;
	-moz-border-radius-bottomright: 12px;
	-moz-border-radius-bottomleft: 12px;
	border-bottom-right-radius: 12px;
	border-bottom-left-radius: 12px;
	filter: alpha(opacity = 90); /* esta linha para o IE */
 	opacity: 0.9; /*esta para os demais browsers*/
}

#vestibular {
	background: url(../imagens/vestibular.png) no-repeat;
	width:240px;
	height:150px;
}

#menu { 
	margin: 0 50px 50px 0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:22px;
	font-weight:bold;
	float:right;
	clear:right;
	height: 400px;
}

div#menu ul {list-style:none; margin:0; padding:0; }

div#menu ul li {
	width:240px; 
	background:#FFFFFF; 
	margin: 8px 0 0 0;  
	text-align:center; 
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	filter: alpha(opacity = 90); /* esta linha para o IE */
 	opacity: 0.9; /*esta para os demais browsers*/ 
	}
div#menu ul li:hover {background:#e4e4e4;}

div#menu ul li a { 
	text-decoration:none; 
	color:#000000; margin:0; 
	display:block; 
	padding: 10px 0 10px 0;
	}
li.ifmg {
	background:#b25211 !important; border:#FFF 1px solid;
}

li.ifmg a {
	color:#fff !important;  padding: 20px 0 20px 0 !important; font-size:28px;
}

li.ifmg a:hover {
	background:#000000; -webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}
	
@media only screen and (min-width: 851px) {
	#rodape {
		width:100%; 
		background:#FFF; 
		position: absolute; 
		bottom: 0; 
		float:left; 
		clear:left;
		background-size: cover; /*CSS padrão*/
		-webkit-background-size: cover; /*CSS safari e chrome*/
		-moz-background-size: cover; /*CSS firefox*/
		-ms-background-size: cover; /*CSS IE*/
		-o-background-size: cover; /*CSS Opera*/
		filter: alpha(opacity = 80); /* esta linha para o IE */
		opacity: 0.8; /*esta para os demais browsers*/ 
	}

	#logo {
		max-width:90%;  
		max-height:12%;
		display:block;
		margin:0 60px 0 0; 
		float:right;
	}

	#logo img {
		max-width: 80%;
		height: auto !important;
	}

	.fb-share-button {
		float:right; margin: 50px 10px auto 0;
	}

	#portal { 
		font-size: 30px;
		font-family:Verdana, Geneva, sans-serif;
		font-weight:bold; float:right; margin: 25px 50px auto 0;
	}

	#portal a {
		text-decoration:none; 
		color:#999999;
	}

	#portal a:hover {
		color:#666;
	}
}

/* For mobile devices */
@media only screen and (max-width: 850px) {

	body {   
		background-image: url(../imagens/bg-mobile.jpg);
		background-size: cover;
	}
	
	#topo {margin: 30px 40px 0 0;
		align-self: center;
	}

	#menu {
		margin: 0 40px 50px 20px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:22px;
		font-weight:bold;	
		align-self: center;
	}

	#rodape {
		width:100%; 
		max-height:60px; 
		background:#FFF; 
		position:fixed;
		bottom:0px;            
		filter: alpha(opacity = 80); /* esta linha para o IE */
		opacity: 0.8; /*esta para os demais browsers*/ 
	}

	#logo {
		height:auto;
		display:block;
		margin:0 20px 0 0; float:right;
	}

	#logo img {  
		height:50px !important;
		display:block; margin: 0 auto 0 auto;
	}

	.fb-share-button {
		float:right; margin: 15px 25px auto 0;
	}

	#portal {
		font-size: 20px;
		font-family:Verdana, Geneva, sans-serif;
		font-weight:bold; 
		float:right; 
		margin: 15px 20px auto 0;
	}
}
