/* *********************** Styles for all media *************** */

/* ----------- Miscellaneous --------- */

* 
{
	padding:0;
	margin:0;
}

.anodecor
{
	text-decoration:none;
	color:#ffddcc;
	opacity:1;
}

img.langicon
{
	width:14px;
	vertical-align:middle;
}
			
body 
{
	/* Color chosen as a tetrad with base color the one of the 
		header, in http://www.paletton.com */
	background-color:#fff6e5;
	min-width:175px;
}

/* ----------- Waiting clock --------- */

div#clockdiv
{
	position:absolute; 
	z-index:10000;
	width:64px;
	height:64px;
	left:50%;
	top:50%;
	margin:-32px 0 0 -32px;
}

div#clockdiv img
{
	height:64px;
	width:64px;
}

/* ----------- Header --------- */

header
{
	width:100%;
	background:url('papel1.png');
	background-repeat:no-repeat;
	/* center bottom to anchor the x-middle and y-bottom point of 
		the background in the middle of the header */
	background-position:center bottom; 
	position:absolute;
	left:0px;
	top:0px;
	z-index:1000;
	text-align:center;
	color:black;
	margin-top:-200px; /* Initially hidden */
}
h1
{
	padding-top:10px;
	font-family:'co2';

	/* Support for non-media-query-enabled browsers (desktop media): */
	font-size:36px;
	opacity:0.3;
}
h2
{
	padding-bottom:56px;
	font-family:'co2';

	/* Support for non-media-query-enabled browsers: */
	font-size:18px;
	opacity:0.2;
}

/* ----------- Nav --------- */

nav
{
	width:100%;
	background:url('papel2.png');
	background-repeat:no-repeat;
	background-position:center bottom; 
	z-index:500;
	position:relative;
	left:0px;
	top:0px;
	text-align:center;
	margin-top:-200px; /* Initially hidden */

	/* Support for non-media-query-enabled browsers: */
	text-align:center;
}
nav ul
{
	padding-bottom:20px;
	list-style:none;

	/* Support for non-media-query-enabled browsers: */
	padding-top:120px;
}
nav ul li 
{ 
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border-width:0px; /* Initially invisible */
	border-style:solid;
	border-color:white;

	font-family:'jumps';
	font-variant:small-caps;
	color:white;

	cursor:pointer;

	/* Support for non-media-query-enabled browsers: */
	display:inline-block;
	font-size:18px;
}
.iconnav
{
	vertical-align: middle;

	/* Support for non-media-query-enabled browsers: */
	height:48px;
}
				
table.stackedletters
{
	display:inline-block; 
	vertical-align:middle; 
	border-width:0px;
	border-spacing:0px;
}
table.stackedletters td.bottomletter
{
	border-top-style:solid; 
	border-top-color:white;
	border-top-width:1px;
}

/* ----------- Red menus --------- */

div.redmenucontainer /* For its elements to have a positioned reference */
{
	position:relative; /* Must be relative to be after the previous nav */ 
	top:-52px;
}
section#SecAcademia.redmenuentry
{
	background:url('papel3r.png');
	background-repeat:no-repeat;
	background-position:center bottom; 
}
section#SecArtistica.redmenuentry
{
	background:url('papel3g.png');
	background-repeat:no-repeat;
	background-position:center bottom; 
}
section#SecSoftware.redmenuentry
{
	background:url('papel3b.png');
	background-repeat:no-repeat;
	background-position:center bottom; 
}
section#SecProyectos.redmenuentry
{
	background:url('papel3o.png');
	background-repeat:no-repeat;
	background-position:center bottom; 
}
section#SecContacto.redmenuentry
{
	background:url('papel3y.png');
	background-repeat:no-repeat;
	background-position:center bottom; 
}
section.redmenuentry
{
	position:absolute;
	z-index:250;
	width:100%;
	margin-top:-1000px; /* Initially hidden beyond top of screen */
	text-align:center;
}
section.redmenuentry ul
{
	padding-top:32px;
	padding-bottom:36px;
	list-style:none;
	text-align:center;

	/* Support for non-media-query-enabled browsers: */
	padding-left:40px;
}
section.redmenuentry ul li
{		
	color:#ffddcc;
	opacity:1;

	/* Support for non-media-query-enabled browsers: */
	font-size:20px;
}
section.redmenuentry ul li:first-child 
{
	font-family:'kaushan';
	font-style:italic;
	padding-bottom:12px;
}
section.redmenuentry ul li:not(:first-child) 
{
	font-family:'cabinsketch';
	cursor:pointer;
}

/* ----------- Fade div --------- */

div#fadediv
{
	visibility:hidden; /* initially hidden */
}

/* ----------- Highlights --------- */

div.highlightcontainer
{
	text-align:center;
}

div.highlightcontainer ul
{
	width:60%;
	margin-left:auto;
	margin-right:auto;
	list-style:none;
}

div.highlightcontainer ul li
{
	margin:8px;
	padding:32px 8px 8px 8px;
	display:inline-block;
	background-image:url('hoja.png');
	background-repeat:no-repeat;
	background-size:100% auto;
	vertical-align:text-top;
	font-family:'kaushan';
	opacity:0.7;
	-webkit-backface-visibility: hidden; /* Smooth background rotated img */
	cursor:pointer;

	-webkit-box-shadow: 0px 6px 2px -4px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 6px 2px -4px rgba(0,0,0,0.5);
	box-shadow: 0px 6px 2px -4px rgba(0,0,0,0.5);

	transform:rotate(-2deg);
	-ms-transform:rotate(-2deg); /* IE 9 */
	-webkit-transform:rotate(-2deg); /* Opera, Chrome, and Safari */

	/* Support for non-media-query-enabled browsers: */
	width:150px;
	font-size:18px;
}

img.highlightdrawing
{	
	display: block;
    margin-left: auto;
    margin-right: auto;
	width:auto;
	height:auto;

	/* Support for non-media-query-enabled browsers: */
	max-width:100%;
	max-height:100%;
}

div.newcontent
{
	position:absolute;
	top:70px;
	left:100px;
	background:url('nuevo.png');
	background-repeat:no-repeat;
	background-size:100% auto;
	width:100px;
	height:100px;
	z-index:1000;
}

/* ----------- Footer --------- */
footer
{
	position:static;
	margin-top:48px;
	margin-left:auto;
	margin-right:auto;
	width:40%;

	border-width:1px 0px 0px 0px;
	border-style:solid;
	border-color:black;

	text-align:center;

	font-family:serif;
	font-size:10px;
	color:black;
	opacity:0.4;
}

footer p
{
	padding-top:2px;
	padding-bottom:2px;
}