/* CSSTidy 1.3: Thu, 27 Sep 2012 08:40:03 -0600 */
/*
@font-face {
	font-family: 'Anarchy Sans';
	src: url('../AnarchySans.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}
*/

body {
	color:#333;
	line-height: 20px;
	font-family:HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif;
	background: transparent url(../img/bg.jpg);
	font-size:14px;
	font-weight:300;
	margin:5px;
	padding:0;
}



header {
	height:110px;
	margin:auto;
	width:800px;
}

header h1 {
	color:#2F4F4F;
	float:right;
	height:39px;
	margin:55px 0 0;
	width:285px;
	background: transparent url(../img/joaosantacruz.com.png) no-repeat;
	background-size: 100% 100%;
}



header h1 span {
	display:none;
	font-family:Anarchy Sans, courier;
	width: 265px;
	height: 50px;
	font-size:30px;
	text-transform:lowercase;
	color:blue;
}



nav.menu {
	float:right;
	margin:0px 0 30px 100px;	
}
nav.menu ul {
	margin: 0;
	padding:0;
	text-align:right;
	width:auto;
}

nav.menu li {
	list-style-type:none;
	text-transform:uppercase;
}

nav.menu li a {
	color:#006600;
	background: #7db17d;
	font-size:18px;
	font-weight:400;
	padding:2px 5px;
	line-height: 30px;
	opacity:0.80;
}

nav.menu li a:hover {
	color:#FFF;
}

nav.menu li a.active {
	color:#FFF;
}


section {
	/*border-bottom:1px solid gray;
	border-top:1px solid gray;*/
	clear:both;
	margin:auto;
	min-height:410px;
	padding:0;
	text-align:justify;
	width:800px;
}

section p {
	line-height:18px;
}

section h1{
	font-weight: 300;
	color: #444;
}

.maincontent{
	margin: 25px 0;
}

footer {
font-family:Anarchy Sans, Courier;
font-size:10px;
height:20px;
margin:8px auto;
text-align:left;
width:800px;
}


.signature {
color:gray;
float:right;
font-size:14px;
margin:-5px 0;
}

.signature a {
color:#777;
cursor:pointer;
}


.randomObj img{
	margin-top:-60px;
	max-width: 325px;
	min-width: 300px;
	display: inline-block;
}
.randomObj p{
	float: right;
	width:200px;
	margin: 200px 10px 0;
	font-style: italic;
}



a {
color:#444;
outline:none;
text-decoration:none;
}

a img {
border:none;
}

.login {
text-align:center;
}

.login table {
margin:10px auto;
}

.login input[type=text] {
width:250px;
}

.errormessage {
color:red;
}

.newesletterLabel,.emailmeLabel,.loginLabel,.sendToFriendLabel {
color:#666;
}

label {
display:block;
float:left;
width:110px;
}

input[type=submit] {
background-color:#FFF;
border:1px solid #668;
margin-top:4px;
padding:2px;
width:50px;
}

input[type=submit]:hover {
background:#2F4F4F;
border:1px solid gray;
color:#FFF;
cursor:pointer;
}

.sendtofriend table td {
padding:5px;
}

#newRecipe {
display:none;
width:600px;
}

#newRecipe input[type=text] {
border:1px solid gray;
padding:3px;
width:500px;
}

#newRecipe select {
border:1px solid gray;
padding:3px;
width:200px;
}

#newRecipe textarea {
border:1px solid gray;
height:200px;
padding:3px;
width:500px;
}

.captchaPic {
float:left;
}

#newRecipe input[name=captcha] {
border:1px solid gray;
float:left;
letter-spacing:3px;
margin-right:10px;
padding:3px;
text-align:center;
width:70px;
}

#newRecipe input[type=submit] {
border:1px solid #FF0;
padding:3px;
width:90px;
}

.scripts {
	margin:30px 0;
	
}

.scripts p {
margin:3px 0;
padding:0;
}

.scripts h4 {
margin:15px 0 2px;
padding:0;
}

.scripts .codebox {
border:2px dashed #CCC;
margin:20px 0 10px;
padding:10px;
max-width: 630px;
}

a .readMore {
display:none;
}

.m {
background:none repeat scroll 0 0 #222;
display:block;
margin:20px 0;
padding:5px;
width:46px;
}

.porfolioTable td {
background:#FFFEF7;
border:1px dashed gray;
width:25%;
}

.porfolioTable td:hover {
border:1px dashed #6A6ACC;
}

.jzTimetableMain {
background: #3f4c6b; /* Old browsers */
background: -moz-linear-gradient(top,  #3f4c6b 0%, #3f4c6b 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3f4c6b), color-stop(100%,#3f4c6b)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #3f4c6b 0%,#3f4c6b 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #3f4c6b 0%,#3f4c6b 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #3f4c6b 0%,#3f4c6b 100%); /* IE10+ */
background: linear-gradient(to bottom,  #3f4c6b 0%,#3f4c6b 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3f4c6b', endColorstr='#3f4c6b',GradientType=0 ); /* IE6-9 */

border-radius:10px;
margin:0;
padding:5px 15px 5px;
display: inline-block;
}

.jzTimetable {
clear:both;
list-style:none;
}

.jzTimetable ul {
border-radius:5px;
clear:both;
display:block;
height:66px;
list-style:none;
overflow:hidden;
padding:2px;
width:765px;
}

.jzTimetable li {
background:url(../img/charbg.png);
color:#3f4c6b;
text-shadow: 1px 1px #FFF;
float:left;
font-family:Arial;
font-size:40px;
height:63px;
line-height:63px;
margin:2px 1px;
text-align:center;
vertical-align:middle;
width:43px;
box-shadow: 1px 2px 2px #333;
}

.jzTimetableBottomMsg {
color:#EEE;
display:block;
margin:35px 0 10px;
text-align:center;
}

.stripes {
color:#FFF;
height:400px;
margin:5px 0;
overflow:hidden;
text-align:center;
width:100%;
}

.stripe:hover {
background:red!important;
font-size:18px!important;
}

.projectsMosaic {
margin:5px 0;
text-align:center;
}

.projectsMosaic .project {
border:3px solid #EEE;
display:inline-block;
height:143px;
margin:5px;
padding:0;
width:143px;
}

.projectsMosaic .project span {
background:#000;
color:#FFF;
display:block;
height:25px;
line-height:25px;
opacity:0.8;
padding:5px;
text-align:left;
vertical-align:middle;
}

.projectsMosaicYearSeparator {
border-bottom:1px solid #EEE;
margin:10px 0;
text-align:left;
}

.projectsList {
border-collapse: collapse;
display:table;
margin:5px 0;
}

.projectsList .project {
border-bottom:1px solid #EEE;
display:table-row;
padding:10px 0 1px;
}

.projectsList .project .cell1,.projectsList .project .cell2,.projectsList .project .cell3 {
display:table-cell;
vertical-align:top;
padding: 0 0 10px;
}

.projectsList .project img:hover {
box-shadow:1px 1px #CCC;
opacity:1;
}

.projectsList img {
box-shadow:1px 1px #777;
height:80px;
margin:0 10px 0 0;
opacity:0.9;
width:80px;
}

.projectsList .cell2 div {
margin-top:-2px;
}

.projectsList .cell3 {
font-size:20px;
line-height:35px!important;
margin:0 5px 0 0;
text-align:right;
}

.projectsList .cell3 .type {
display:block;
font-size:20px;
}

.projectsList .cell3 .year {
display:block;
font-size:30px;
}

.active,footer nav li a:hover,a:hover {
color:#333;
}

a .back_link,.login p,.login h1 {
text-align:left;
}

.login input[type=submit],.emailme input[type=submit],.sendtofriend input[type=submit] {
float:right;
}

input[type=text],textarea {
border:1px solid #668;
padding:2px;
width:250px;
}

@media screen and (max-width: 768px) {   
    body{
	width:100%;
    }
    header{
	height:60px;
    }
    header .breadcrumbs {
	margin: 8px 0 0 1px !important;
    }
    header nav ul {
	float: left !important;
    }
    header, section, footer{
	width:95%;
	padding:0;
	margin-left:5px;
	margin-right:5px;
    }
    .title{
	margin:10px 0 0px;
	float:none;
	display:block;
	font-size:16px;
	/*height:18px;*/
	width: 100%;
    }

.maincontent{
	display: inline-block;
	margin:0 5px;
}
.stripes{
	height:10px !important;
}

section{
	min-height:10px;
}

    header nav ul{
	margin: 15px 0 0;
	float:none;
	text-align: left;
	width: 100%;
    }
    header nav ul li{
	padding:0 10px 0 0;
    }

	footer nav ul {
		position:relative;
	}
	footer nav li {
		display: inline;
		list-style-type: none;
		padding-right: 13px;
		background: PaleGreen;
		margin: 10px 0;
		float: none;
		display:block;
	}
	
	footer nav li a{
		display: block;
		padding: 10px;
	}
	

	.signature {
	    color: gray;
	    display: block;
	    font-size: 11px;
	    text-align: center;
	    clear: both;
	    padding: 0px 12px;
	}
	footer{
		text-align:center;
	}
	.jzTimetable ul {
		width:99%;
		text-align: center;
	}
	.jzTimetable li {
		display:inline-block;
		float:none;
	}
}