body {
  font-size: 15px;
}

/* TYPOGRAPHY */
p, ul, ol {
  margin: 0 0 15px 0;
}

ul ol, ul ul, ol ol, ol ul {
  margin: 0;
}

/* HEADER */
header {
  /*border-bottom: 1px solid #cccccc;*/
  /*background-color: #cccccc;*/
  padding-bottom: 20px;
  background: url(../images/header_back.png) repeat-x top;
}

.cabecera {
	height: 100px;
}

header nav ul li {
  padding: 15px 20px 15px 0;
}

header nav ul {
	text-align: right;
}

img.logotipo {
	margin-top: 8px;
	margin-bottom: 7px;
}

#main ul li a {
	font-size: 16px;
	/*color: #b0bbf4;*/
	color: #adadad;
	font-weight: bold;
}

#main ul li a.on {
	color: white;
	font-weight: bold;
}

#main ul li a:hover {
	text-decoration: none;
	color: white;
}


/* CONTENT */
section {
  margin: 15px 0;
}

/* GRID */
.calculate [class*="grid-"] p {
  background: #ededed;
  border: 1px solid #888888;
  color: #333333;
  font-size: 0.8em;
  padding: 5px;
  margin-bottom: 1em;
  text-align: center;
}
.calculate [class*="grid-"] [class*="grid-"] p {
  background: #ffe5a3;
}
.calculate [class*="grid-"] [class*="pull-"] p {
  background: #eac199;
}
.calculate [class*="grid-"] [class*="push-"] p {
  background: #adc2ff;
}
.calculate p.noStyle {
  border: none;
  background: none;
  color: #333333;
  font-size: 1em;
  padding: 0;
  text-align: left;
}
.calculate article {
  margin: 0;
}
.calculate [class*="pull-"] p {
  background: #eac199;
}
.calculate [class*="push-"] p {
  background: #adc2ff;
}


div.menusuperior {
  margin-top: 15px;
}
  
div.socialmedia {
  margin-top: 15px;
  text-align: right;
}
  

span.strong {
	font-weight: bold;
}


span.italic {
	font-variant: small-caps;
}
  
div.parrafo {
	text-align: justify;
	word-wrap: break-word;
}

p.cita {
	font-style: italic;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	text-align: left;
}


input.form {
	color: #999999;
	padding: 5px;
	border: 1px solid #999999;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
   -webkit-appearance: none;
}


textarea.form {
	color: #999999;
	padding: 5px;
	border: 1px solid #999999;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
   -webkit-appearance: none;
}



select.form {
	color: #999999;
	padding: 5px 10px 5px 5px;
	border: 1px solid #999999;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
   -webkit-appearance: none;
}



h3.hachetresdown {
	color: #adadad;
	margin: 15px 0;
}

h3.hachetresverde {
	color: #b7cd27;
}

h3.hachetresnaranja {
	color: #ee6023;
}

h3.hachetresamarillo {
	color: #eea418;
}

h3.hachetresazul {
	color: #3bc6e0;
}  

h1.secprincipal {
	color: #034471;
}


a.linkrojo {
	color: #db0505;
	font-size: 1em;
	font-weight: bold;
}



/* FOOTER */
footer {
  border-top: 1px solid #cccccc;
  background-color: #ededed;
  min-height: 120px;
  margin-top: 35px;
  padding: 20px 0;
}
footer h2 {
  font-size: 1em;
}
footer p,
footer blockquote,
footer article,
footer section {
  font-size: 0.8em;
}
footer a {
  color: #999999;
  white-space: pre;
  white-space: pre-wrap;
  white-space: pre-line;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -hp-pre-wrap;
  word-wrap: break-word;
}
footer a:hover {
  color: white;
}
footer a:visited {
  color: #999999;
}

/*  Custom Media Queries  */
.mobile span {
  display: none;
}

/*04PROJECT*/

img.logo-large {
    display: inline;
  }

img.logo-small {
    display: none;
  }

img.scr_rrhh-large {
    display: inline;
  }

img.scr_rrhh-small {
    display: none;
  }

p.letramediana {
	font-size: 10px;
}  
  
p.letrapequenya {
	font-size: 9px;
	text-align: justify;
}

  
footer div.mobile-100.alpha {
		text-align: left;
	}

footer div.mobile-100.middle {
		text-align: center;
	}	
	
footer div.mobile-100.omega {
		text-align: right;
	}
	
	
iframe.videoframe {
	width: 540px;
	height: 304px;
}



@media screen and (min-width: 781px) and (max-width: 920px) {

	iframe.videoframe {
	width: 430px;
	height: 242px;
	}


}

@media screen and (min-width: 601px) and (max-width: 780px) {

  iframe.videoframe {
	width: 320px;
	height: 180px;
	}


}

	

@media screen and (min-width: 521px) and (max-width: 600px) {
	footer div.mobile-100.alpha, footer div.mobile-100.omega {
		text-align: center;
	}

	footer div.mobile-100.alpha {
	padding-left: 20px;
	}
	
	iframe.videoframe {
	width: 480px;
	height: 270px;
	}
		
}

@media screen and (min-width: 320px) and (max-width: 520px) {
	img.logo-large {
    display: none;
  }

	img.logo-small {
    display: inline;
  }

	img.scr_rrhh-large {
    display: none;
  }

	img.scr_rrhh-small {
    display: inline;
  }
  
  iframe.videoframe {
	width: 300px;
	height: 169px;
	}

	footer div.mobile-100.alpha, footer div.mobile-100.omega {
		text-align: center;
	}

	footer div.mobile-100.alpha {
	padding-left: 20px;
	}

  .mobile {
    position: relative;
  }
  .mobile span {
    background: black;
    color: white;
    cursor: pointer;
    display: block;
    font-family: "Open Sans", sans-serif;
    font-size: 1em;
    padding: 15px 0;
    text-indent: 10px;
  }
  .mobile .menuIcon {
    background: transparent url(../images/down.png) no-repeat center;
    display: block;
    font-size: 1.8em;
    height: 35px;
    padding: 0;
    position: absolute;
    text-indent: 3px;
    top: 5px;
    right: 5px;
    width: 35px;
    border: thin solid #cccccc;    
  }

 
  .mobile ul {
  	background-color: white;
  	border: thin solid black;
   display: none;
   width: 100%;
   text-align: left;
  }
  .mobile ul li {
    display: block;
    padding: 0;
    width: 100%;
    margin-right: 10px;
  }
  .mobile ul li a {
    padding: 10px 0;
    text-indent: 10px;
    width: 100%;
  }
  .mobile ul li a.on, .mobile ul li a:hover {
    background: #999999;
    color: white;
  }
  .mobile.down span.menuIcon {
    background: #cccccc;
    box-shadow: inset 0 0 10px #555555;
  }
}
