/*
Theme Name: Cuppetelli and Mendoza Theme
Theme URI: 
Author:  Cristobal Mendoza
Author URI: http://cuppetellimendoza.com
Description: Theme for cuppetellimendoza.com
Version: 1
Text Domain: cuppetellimendoza


*/

/* =Notes
--------------------------------------------------------------
This stylesheet uses rem values with a pixel fallback. The rem
values (and line heights) are calculated using two variables:

$rembase:     14;
$line-height: 24;

---------- Examples

* Use a pixel value with a rem fallback for font-size, padding, margins, etc.
	padding: 5px 0;
	padding: 0.357142857rem 0; (5 / $rembase)

* Set a font-size and then set a line-height based on the font-size
	font-size: 16px
	font-size: 1.142857143rem; (16 / $rembase)
	line-height: 1.5; ($line-height / 16)

---------- Vertical spacing

Vertical spacing between most elements should use 24px or 48px
to maintain vertical rhythm:

.my-new-div {
	margin: 24px 0;
	margin: 1.714285714rem 0; ( 24 / $rembase )
}

---------- Further reading

http://snook.ca/archives/html_and_css/font-size-with-rem
http://blog.typekit.com/2011/11/09/type-study-sizing-the-legible-letter/


/* =Reset
-------------------------------------------------------------- */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video
	{
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	font-family: corbert_condensedregular, helvetica, arial, sans-serif;
}

body {
	line-height: 1;
}

ol,ul {
	list-style: none;
}

blockquote,q {
	quotes: none;
}

blockquote:before,blockquote:after,q:before,q:after {
	content: '';
	content: none;
}

a {
	text-decoration: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption,th,td {
	font-weight: normal;
	text-align: left;
}

h1,h2,h3,h4,h5,h6 {
	clear: both;
}

html {
	overflow-y: scroll;
	font-size: 100%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

a:focus {
	outline: thin dotted;
}

article,aside,details,figcaption,figure,footer,header,hgroup,nav,section
	{
	display: block;
}

audio,canvas,video {
	display: inline-block;
}

audio:not ([controls] ) {
	display: none;
}

del {
	color: #333;
}

ins {
	background: #fff9c0;
	text-decoration: none;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin: 24px;
	margin-bottom: 1.714285714rem;
}

sub,sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

small {
	font-size: smaller;
}

img {
	border: 0;
	-ms-interpolation-mode: bicubic;
}

/* Clearing floats */
.clear:after,.wrapper:after,.format-status .entry-header:after {
	clear: both;
}

.clear:before,.clear:after,.wrapper:before,.wrapper:after,.format-status .entry-header:before,.format-status .entry-header:after
	{
	display: table;
	content: "";
}

/* My stuff
-------------------------------------------------------------- */

/* Structure
-------------------------------------------------------------- */
body {
	background-color: white;
	margin: 0;
background: white url(images/1px-stripe-backy.png);
/* background-size: 1%; */
}

#pageWrapper {
	background-color: transparent;
/* 	background-image: url(images/background-2.png);
	background-size: 12%; */
	/* 	height: 100%; */
}

div#page {
	width: 1000px;
	margin: 0 auto;
	background-color: rgba(255, 255, 255, 0.9);
	/* padding: 24px;  */
/* 	border-left: 1px solid #5B5B5B;
	border-right: 1px solid #5B5B5B; */
/* 	height: 100%;*/
	-webkit-box-shadow: 0px 0px 48px 2px rgba(0, 0, 0, 0.42);
	-moz-box-shadow: 0px 0px 48px 2px rgba(0, 0, 0, 0.42);
	box-shadow: 0px 0px 48px 2px rgba(0, 0, 0, 0.42); */
}

#masthead {
	padding: 36px 0 0 0;
}

#content {
	/* padding: 0 12px; */
	margin-top: 24px;
}

footer {
	clear: both;
}

/* 
-----------------------------------------------
	Header
-----------------------------------------------
 */
 
 h2.site-description {
 	position:relative;
 	font-family: corbert_condensedregular;
 	margin-top: -48px;
 	font-weight: normal;
 	padding:16px;
	color: RGBA(220, 220, 200, 0.9);
 	background-color: rgba(100, 100, 100, 0.7);
 }
 
/* 
-----------------------------------------------
	Work - Front page
-----------------------------------------------
 */
#Work {
	margin-left: 32px;
	margin-right: 32px;
	overflow: auto;
	padding-bottom: 32px;
	padding-top: 8px; /*padding instead of margin so that the linked anchor position looks better */
	margin-top: 0; /*override .front-section to get proper positioning of the linked anchor */
}

#content .work-index-entry {
	position: relative;
	/* 	border: 1px solid black; */
	width: 312px;
	height: 240px;
	float: left;
	/* 	margin-bottom: 12px; */
}

.work-index-entry-image a, .work-index-entry-text a {
	border: none;
}

/* Second  */
/* #content .work-index-entry:nth-child(4n-2) {
	margin-right: 6px;
	margin-left: 12px;
	background-color:blue;
}

Third
#content .work-index-entry:nth-child(4n-1) {
	margin-right: 12px;
	margin-left: 6px;
	background-color:red;
} */
.work-index-entry-image img {
	width: 100%;
	height: 240px;
}

#content .work-index-entry-text {
	position: absolute;
	bottom: 0;
	width: 100%;
	margin: 0;
	background-color: RGBA(100, 100, 100, 0.7);
}

#content .work-index-entry-text p {
	padding: 5px;
}

#content .work-index-entry-text p,#content .work-index-entry-text a {
	font-family: quasiquicksandlight;
	color: RGBA(220, 220, 200, 0.9);
	font-size: 18px;
	padding: 6px;
	text-align: center;
}

#content .work-index-entry-text a {
	display: block;
	/* width: 218px; */
	/* height: 100%; */
}

#content .work-index-entry-text a:hover {
	border: none;
}

#content .work-index-entry-text a:visited {
	color: RGBA(220, 220, 200, 0.9);
}

#Latest {
	
}

footer {
	padding: 16px 48px;
}


/* 
-----------------------------------------------
	News List - Front page
-----------------------------------------------
 */
 
#Latest div.newsList {
	margin-left: 128px;
	margin-right: 128px;
/* 	margin-bottom: 24px; */
}

.newsList-item {
	margin-bottom: 26px;

}

.newsList-item-content {
	padding: 0 16px;
}

.newsList-item-content p {
	margin-bottom: 1em;
	line-height: 1.2em;
}

.newsList-item-content li {
	line-height: 1.2em;	
}

.newsList-item-header {
	margin-bottom: 16px;
}

.newsList-item-header h1, .newsList-item-header h2  {
	font-weight: 100;
	color: black;
	font-size: 18px;
	text-align: left;
}

.newsList-item-header h1 {
	margin-bottom: 0.25em;
	display:inline;
	border-bottom: 1px solid rgb(128, 128, 128);
}

.newsList-item-header h2  {
	font-size: 16px;
	font-weight: 100;
	margin-bottom: 0.5em;
	text-align: center;
}



/* #Latest h2 {
	width: 700px;	
	clear:none;
}

#Latest h3 {
	width: 200px;
	float: left;
} */

.front-section {
 	margin-top: 24px;
/* 	margin-bottom: 24px;  */
}

.front-section header {
	padding: 0;
	padding-bottom: 12px;
	margin: 0 256px;
	margin-bottom: 24px;
	border-bottom: 3px double black;
}

/* 
-----------------------------------------------
	Main Navigation
-----------------------------------------------
 */
nav#site-navigation {
	text-align: center;
	width: 1000px;
	padding: 1em 0;
}

nav#site-navigation ul {
	
}

nav#site-navigation li {
	display: inline;
	padding: 0.2em 3em;
	text-align: center;
}

.page-template-page-templatesno-header-image-php nav#site-navigation {
	border-bottom: 3px double black;
	width: 900px;
	margin: 0 auto;
}

/* 
-----------------------------------------------
	Footer Navigation
-----------------------------------------------
 */
nav#footer-site-navigation {
	text-align: center;
	width: 100%;
	padding: 1em 0;
}

nav#footer-site-navigation li {
	display: inline;
	padding: 0.2em 3em;
	text-align: center;
	font-size: 18px;
}

nav#footer-site-navigation a {
	color: white;
	border-bottom: none;
}

nav#footer-site-navigation a:hover {
	color: white;
	border-bottom: 1px solid white;
}


/* 
-----------------------------------------------
	Single Post Nav
-----------------------------------------------
 */

nav.nav-single {
	text-align: center;
	overflow: auto;
	padding-bottom: 16px;
/* 	margin-bottom: 16px;
 */}

 nav.nav-single .nav-previous {
	text-align: right;
	padding-right: 0;
}

nav.nav-single .nav-next {
	text-align: left;
	padding-right: 0;
} 

 nav.nav-single .nav-previous a {
	text-align: right;
	margin-right: 16px;
}

nav.nav-single .nav-next a {
	text-align: left;
	margin-left: 16px;
} 

nav.nav-single a:visited {
	color: black;
}

nav.nav-single h3 {
	margin-bottom: 8px;
	font-family: quasiquicksandregular;
}

nav.nav-single span.nav-previous, nav.nav-single span.nav-next  {
	display: block;
	float: left;
	width: 50%;
}

/* 
-----------------------------------------------
	Single Posts (All of the work entries are
	single posts) and general content
-----------------------------------------------
 */
.single #content, .page #content {
	padding: 0;
	margin-top: 0;
}

.single header#masthead {
	border-bottom: 1px solid black;
}

.single h1.entry-title {
	background-color: rgba(100, 100, 100, 0.6);
	padding: 24px;
	position: relative;
	z-index: 150;
	color: white;
	font-weight: 200;
	font-size: 24px;
	margin-bottom: -72px;
}

div.entry-content {
	padding: 48px;
	padding-top: 32px;
}

div.entry-content iframe.workVideo {
	margin-bottom: 24px;
}

div.work-details p {
	font-size: 14px;
	line-height: 1;
}

div.work-details {
	margin-bottom: 16px;
}

article ul {
	list-style-type: square;
	list-style-position: inside;
	margin-bottom: 2em;
	margin-left: 1em;
}

article li {
	margin-bottom: 0.5em;
}

article h4, article h3, article h2 {
	margin-bottom: 1em;
	font-family: corbert_condensedregular, helvetica, arial;
}

article blockquote {
	margin: 1em 2em;
}
/* 
-----------------------------------------------
	Footer - Main
-----------------------------------------------
 */
 
 #main-footer {
 	background-color: rgba(100, 100, 100, 0.7);
 }

/* 
-----------------------------------------------
	Galleries
-----------------------------------------------
 */
div.gallery {
	width: 776px;
	margin: auto;
}

.gallery .gallery-icon {
	width: 256px;
	height: 256px;
	float: left;
	box-sizing: border-box;
	margin-right: 4px;
	margin-bottom: 4px;
}

/* select every .gallery-icon element inside every
 3rd gallery-item */
 
.gallery-item:nth-child(3n) .gallery-icon {
	margin-right: 0px;
}

/* .gallery .gallery-icon:hover {
	border: 2px solid white;
} */

.gallery .gallery-icon a {
	border: none;
}

/* 
-----------------------------------------------
	CV Page
-----------------------------------------------
 */
 
div#cv-contact.cv-section {
	overflow: visible;
}

 .cv-year {
	font-size: 16px;
}

.cv-section {
	clear:both;
	margin: 1em 0;
	padding-top: 1em;
/*	overflow:hidden;*/
}

.cv-year {
	float: left;
	width: 64px;
	margin: 0 auto;
	padding-left: 16px;
	clear: left;
	
}

.cv-section p {
	margin: 0 !important;
	line-height:1 !important;
	font-size: 16px;
}

.cv-section ul {
	margin: 0 0 0 80px;
	list-style-type:none;
	list-style-position:outside;
	padding:0;
}

.cv-section li {
	margin: 0;
}

#education h3 {
	margin: 1em 0 1em 16px;
}

#cv-contact div {
	width: 50%;
	float: left;
}

#cv-contact ul {
	margin: 0;
}

.cv-contact-online {
	text-align:left;
}


.cv-contact-other {
	text-align:right;
}

.cv-section a {
	border-bottom: none;
}
 

/* Font Styling
-------------------------------------------------------------- */
body {

}

h1,h2,h3,h4,h5,nav a {
	font-family: quasiquicksandlight;
}

.site-title {
	font-size: 36px;
	font-weight: normal;
	color: black;
}

.site-title a {
	color: black;
	font-size: inherit;
	font-family: inherit;
	font-weight: inherit;
}

.site-title a:visited {
	color: black;
}

h1 {
	text-align: center;
}

h1.sectionTitle {
	font-weight: 100;
	color: black;
	font-size: 30px;
}

nav#site-navigation a {
	font-size: 18px;
	font-weight: 100;
	color: black;
	text-decoration: none;
	padding: 5px;
	border: none;
}

nav#site-navigation a:link {
	
}

nav#site-navigation a:hover {
	border-bottom: 1px solid black;
}

nav#site-navigation a:visited {
	color: black;
}


.entry-title {
	text-align: left;
}

h1.entry-title {
	font-weight: 100;
	color: black;
	font-size: 18px;
	text-align: left;
	margin-bottom: 1em;
}

.entry-content p {
	line-height: 1.5;
	margin-bottom: 1em;
}


a {
	color: inherit;
	border-bottom: 1px dotted black;
}

a:hover {
	color: black;
	border-bottom: 1px solid black;
}

a:visited {
	color: rgb(100, 100, 100);	
}

.work-index-entry-image a, .site-title a {
	border: none;
}

@page { 
	size:auto; 
/*	padding: 0.5in;*/
	margin: 0.5in;
}

@media print {
	
	h2 { page-break-after : avoid }
	
	
	body {
		background-color: red;
	}
	
	#masthead {
		border-bottom: none;
	}
	
	div#page {
		border: none;
		box-shadow: none;
		background-color: white;
	}
	
	#content iframe {
		display: none;
	}
	
	#content h1.entry-title {
		background-color: #646464;
		color: black;
		position: static;
		margin-bottom: 0;
	}
	
	nav {
		visibility: hidden;
	}
	
	.page-template-page-templatesno-header-image-php nav {
		display: none;
	}
	
	.page-template-page-templatesno-header-image-php #masthead {
		border-bottom: 3px double black;
		padding-bottom: 32px;
	}
	
	a {
		border: none;
	}
	
	footer.entry-meta {
		display: none;
}