@import url('https://fonts.googleapis.com/css?family=Open+Sans:400italic,400,600,700%7CRaleway:400,700');
body { 
	font-family: "Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; 
	-webkit-font-smoothing: antialiased; 
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
	background: url(./imagenes/fondo.jpg) #000 no-repeat center center fixed;
	background-size: cover; 
}
h1, h3, h4, h5, h6 {
	font-family: "Raleway","Open Sans", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; 
	color: #fff;
	text-transform: uppercase; 
	font-weight: bold; 
	padding-left: 1em;
}
h2{ letter-spacing: 0.2em; color: #5515D1; padding-left: 1em; }
h3{ letter-spacing: 0.2em; }
h6{ font-size: 0.9em; letter-spacing: 0.1em; }
h5{ font-size: 1.1em; letter-spacing: 0.2em; }

a {
	text-decoration: none;
}
a:link {
	color: #fff;
}
a:visited {
	color: #fff;
}
a:hover {
	color: #CFC;
}

b {font-size: 1.1em; color: #D11582;}

#main {
   height: 80%;
   display: -webkit-flex;
   display: flex;
   flex-flow: row;
}
#main article {
	background: #2793e6;
	background: radial-gradient(#167ac6,rgba(255,255,255,0.6));
	min-width: 18em;
	max-width: 36em;
	aling: center;
	margin: 6em;
	padding: 6em;
	border-radius: 30%;
	flex: 3 1 40%;
	order: 2;
}
section{
 background:#222222;
 border-radius:10px 10px;
 min-width: 16em;
		max-width: 20em;
		margin: 1em;
		
}
#parrafo{
   font-family:Roboto, sans-serif;
   margin: 20px auto;
    padding: 0px 60px; 
   color:#dddddd;
}
header, footer {
	display: block;
	min-height: 10%;
}
#main nav {
	background: url(./imagenes/curly_bracket_left.svg) no-repeat center center;
	padding: 2em;
	background-origin: content-box;
	flex: 1 6 30%;
	order: 1;
}
#main aside {
	background: url(./imagenes/curly_bracket_right.svg) no-repeat center center;
	padding: 2em;
	background-origin: content-box;
	flex: 1 6 30%;
	order: 3;
}
#icono {
	text-align: center;	
}
#icono img {
	float:left;
	display: inline-block;
	width: 30%;
}
#icono a:link img {
	opacity: 0.7;
}
#icono a:hover img {
	opacity: 1.0;
}
/*video#bgvideo { 
    /position: fixed;
   
    width: 50%;
    height: 50%;
    z-index: -100;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}*/
@media screen and (max-device-width: 800px) {
    #bgvideo {
		
        display: none;
    }
    #main {
   		height: 90%;
	}
	#main article {
		 background:#222222;
 border-radius:10px 10px;
 
	}
    #main nav,aside,footer {
		display: none;
	}
	footer {
		display: none;
	}
}