@font-face{
    font-family: 'Fira Sans Light';
    src: url('../fuentes/FiraSans-Light.eot');
    src: url('../fuentes/FiraSans-Light.eot') format('embedded-opentype'),
         url('../fuentes/FiraSans-Light.woff2') format('woff2'),
         url('../fuentes/FiraSans-Light.woff') format('woff'),
         url('../fuentes/FiraSans-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

h2{
	font-family: 'Fira Sans Light', sans-serif;
   text-align: center;
}

body, html {
	height: 100%;
	width: 100%;
	margin: 0px;
	padding: 0px;
}
#main {
   height: 80%;
   display: -webkit-flex;
   display: flex;
   flex-flow: row;
}
#main article {
	background: #CFC;
	flex: 3 1 60%;
	order: 2;
}

#header_principal {
	text-align: center;
	display: block;
	min-height: 10%;
	background-color: #FFFFFF;
   background: -moz-linear-gradient(left, tomato, cyan, lightgreen);/* F 3.6+ */
   background: -ms-linear-gradient(left, tomato, cyan, lightgreen);/* IE 10+ */
   background: -webkit-linear-gradient(left, tomato, cyan, lightgreen);/* FF 3.6+ */
   background: -o-linear-gradient(left, tomato, cyan, lightgreen);/* Safari 5.1+, Chrome 10+ */ 
   background: linear-gradient(left, tomato, cyan, lightgreen);/* ESTILO ESTANDAR */ 
   font-family: 'Roboto', serif;
   font-size: 24px;
}

footer{
    width: 100%;
    border: 1px solid #004f71;
    font-family: courier, sans-serif;
    color: #004f71;
    margin:0 auto;
    padding: 20px;
    -webkit-border-radius: 15px 15px 15px 15px;
}

article > section video {
    width: 480px; 
    height: 200px;
}
article > section div.no-html5-video,
article > section div#no-canvas {
    width: 480px; 
    height: 40px; 
    border: 1px solid #993333;
    text-align: center; 
    color: #993333; 
    font-size: 13px;
    font-style: italic; 
    background-color: #F7E9E9;
}