/*
Document   : style
Created on : Apr 30, 2013, 9:48:07 PM
Author     : Mary T. Cusack
Description:
Purpose of the stylesheet follows.
*/
@import url(http://fonts.googleapis.com/css?family=Fauna+One|Muli);



@font-face {
	font-family: 'type';
  	src:url('typewriter.ttf') ;
  	font-weight: normal;
	font-style: normal;
}





@font-face {
	font-family: 'codebold';
  	src:url('CodeBold.otf') ;
  	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Neuropol';
  	src:url('Neuropol.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'gunship';
  	src:url('gunship.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}



@font-face {
	font-family: 'lucinda';
  	src:url('lucinda.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}




html, body {height:100%; padding:0; margin:0;



background:navy;
	color: yellow;
	font-family: Calibri;
}


#thankyou{

	font-size:25px;
}
.curtain {height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; background-attachment:fixed; z-index:20; position:relative;}


.curtain a.scrollup {display:block; width:47px; height:25px; background:url(../images/v-arrows.png) -1px -28px; position:absolute; right:5% ; top:10px; z-index:150; cursor:pointer;}
.curtain a.scrolldown {display:block; width:47px; height:25px; background:url(../images/v-arrows.png) -1px -85px; position:absolute; right:5%; bottom:20px; margin-left:-23px; z-index:2000; cursor:pointer;}
.curtain a.scrollup:hover {background-position:left 0;}
.curtain a.scrolldown:hover {background-position:left -56px;}


#c1 {background-image:url('../images/history.jpg');}
#c0 {background-image: url('../images/nutshell.jpg');}
#c2 {background-image:url('../images/experience.jpg');}
#c3 {	background-image:url('../images/projects.jpg');}
#c4 {	background-image:url('../images/skills.png');}
#c5 {	background-image:url('../images/portfolio.jpg');}
#c6 {background-image: url('../images/nutshell.jpg');}


.curtain h1 {
padding:50px 0 0 0; 


	font-family: 'gunship';
  font-size:20px;

opacity: 0.60;
  text-shadow:0 0 2px rgba(0,0,0,0.8);


position:relative;
top:100px;
left:15px;
 z-index:100;}

.curtain h1 .cap {
position:relative;
top:12px;	
	font-size: 40px;
}


#nutshell {
	background-image: url('../images/nutshell.jpg');
		background-repeat: inherit;
	
	}
	
	
	#bio {
		background-image:url('../images/history.jpg');
		background-repeat:inherit;
		color:navy;
		margin-top:-15px;
	}
	
#bio.curtain a.scrolldown {
	bottom:30px;
}
	

#skills.curtain a.scrollup {
	
margin-top:50px;
}
	

#experience.curtain a.scrollup {
	
margin-top:50px;
}


	#experience {
		background-image:url('../images/experience.jpg');
	}
	
		#projects {
		background-image:url('../images/projects.jpg');
		
	
		
	}
	

	
	
			#skills {
		background-image:url('../images/skills.png');
		color:#fafad2;			
	
		
	}
	
	#portfolio {
		background-image:url('../images/portfolio.jpg');
	}
	
	#contactme {
	background-image: url('../images/nutshell.jpg');
		background-repeat: inherit;
	
	}
	
	
	
@media only screen and (max-width: 768px) {
.curtain h1 {font:normal 50px/60px arial, sans-serif;}
}
@media only screen and (max-width: 680){
.curtain h1 {font:normal 35px/50px arial, sans-serif;}
}

#nutshell .wrapper {
width: 80%;
height:80%;
margin-top:15%;
margin-left:10%;


	
		font-family: Calibri;
	font-size: 15px;
	font-weight: normal;
	/*+placement:shift 0px 0px;*/

	
	
	
	
	
	
}

#bio .wrapper {
width: 80%;
margin-top: -2%;
margin-left:10%;


	
		font-family: Calibri;
	font-size: 5px;
	font-weight: normal;
	/*+placement:shift 0px 0px;*/

	
	
	
	
	
	
}




#experience .wrapper {
width: 80%;
margin-top: -2%;
margin-left:10%;

background:transparent;	
		font-family: Calibri;
	font-size: 14.7pt;
	font-weight: normal;
	/*+placement:shift 0px 0px;*/
		color: #621b1b;
}


#resume {
position: relative;
top:15px;
	font-size:60px;
	
	text-shadow: 0px 0px 10px rgba(255,255,255,0.6), 0px 0px 30px rgba(255,255,255,0.4), 0px 0px 50px rgba(255,255,255,0.3), 0px 0px 180px rgba(255,255,255,0.3);
	
	/*text-shadow: 0px 3px 0px #b2a98f,
             0px 14px 10px rgba(0,0,0,0.15),
             0px 24px 2px rgba(0,0,0,0.1),
             0px 34px 30px rgba(0,0,0,0.1);*/
}

#resumelink {
	
position: relative;
top:15px;
left:25px;
	font-size:50px;
	color: #b8860b;



}

#resumelink a:hover{
	
	text-shadow: 0px 0px 10px rgba(255,255,255,0.6), 0px 0px 30px rgba(255,255,249,0.4), 0px 0px 50px rgba(255,255,255,0.3), 0px 0px 180px rgba(255,255,255,0.3);

}

#resumelink a:visited {
	color: #b8860b;
}

#bio .spacer {
height:127px;
}

#experience .content {
width: 80%;
margin-top: -2%;
margin-left:10%;


	
		font-family: Calibri;
	font-size: 14.7pt;
	font-weight: normal;
	/*+placement:shift 0px 0px;*/

	
	
	
	
	
	
}

.projectheading  {
position:relative;
top:100px;
left:25px;
	font-family:codebold;
	font-size:40px;
}


.skillshead  {
position:relative;
top:100px;
left:25px;
	font-family:type;
	font-size:50px;

				text-shadow: -1px -1px 1px #fff, 1px 1px 1px #000;
	color: #fffaf0;
	opacity: 0.7;
	
	
}

li.skillList{

	font-family:type;
	font-size: 20px;
}

li.skillList li {
		font-family:type;
}

#mySkills {


	position: relative;
	left:230px;
}
.proj{
		position: relative;
	top:200px;
}



.sitesIcreated {
		position: relative;
	top:200px;
		font-family:'lucinda';
		color: #6e3a14;
}

.sitesIcreated li{
		font-family:'lucinda';
		color: #6e3a14;
}


.sitesIcreated li a:visited {
	color: #6e3a14;
}

.sitesIcreated li a {
	color: #6e3a14;
}


.proj ul{

}
.proj li {
		font-family:codebold;
		font-size:25px;
}


.mypath{
position:relative;
text-align:center;
font-family: 'gunship';
  font-size:35px;
  
  
  
  background-color: #0000cd;
  -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;
  
  
}


#bio ul{
	margin-left:15%;
}




#portfoliohead {
	position:relative;
	top:100px;
	left:250px;
	font-family:'lucinda';
	font-size:60px;
	color:#621b1b;
  background: -webkit-linear-gradient(#d2691e, #583013);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
	
	
	
}


.precontact{
	position:relative;
	font-size:25px;
	top:200px;
	left:50px;
	width:75%;

}




#contactdiv{ 

opacity: 0.92;
z-index: 1000; 
    position: relative;
    top: -680px;
    left: -10px;
    height:100%;
    width:100%;
    background: #000;
    display: none;
       font-family: 'Fauna One', serif;
       color: black;
}

/* #onclick{
   padding:3px;
   color:green;
   cursor:pointer;
	padding:5px 5px 5px 15px;
   width:70px;
   color:white;
   background-color:#123456;
   box-shadow:1px 1px 5px grey;
   border-radius:3px;
}*/

button {
margin-top:250px;
margin-left:150px;
  background: #ede27c;
  background-image: -webkit-linear-gradient(top, #ede27c, #d4d464);
  background-image: -moz-linear-gradient(top, #ede27c, #d4d464);
  background-image: -ms-linear-gradient(top, #ede27c, #d4d464);
  background-image: -o-linear-gradient(top, #ede27c, #d4d464);
  background-image: linear-gradient(to bottom, #ede27c, #d4d464);
  -webkit-border-radius: 30;
  -moz-border-radius: 30;
  border-radius: 30px;
  -webkit-box-shadow: 0px 1px 11px #e8ed9f;
  -moz-box-shadow: 0px 1px 11px #e8ed9f;
  box-shadow: 0px 1px 11px #e8ed9f;
  font-family: Arial;
  color: #251fcf;
  font-size: 23px;
  padding: 4px 15px 4px 15px;
  border: solid #3030ba 5px;
  text-decoration: none;
}

button:hover {
  background: #f6fc3c;
  background-image: -webkit-linear-gradient(top, #f6fc3c, #d9d134);
  background-image: -moz-linear-gradient(top, #f6fc3c, #d9d134);
  background-image: -ms-linear-gradient(top, #f6fc3c, #d9d134);
  background-image: -o-linear-gradient(top, #f6fc3c, #d9d134);
  background-image: linear-gradient(to bottom, #f6fc3c, #d9d134);
  text-decoration: none;
}

.form{
    border-radius:2px;
    padding:20px 30px;
    box-shadow:0 0 15px;
    font-size:14px;
    font-weight:bold;
    width:350px;
    margin:20px 250px 0 35px;
    float:left;
}

input{
    width:100%;
    height:35px;
    margin-top:5px;
    border:1px solid #999;
    border-radius:3px;
    padding:5px;
}	

input[type=button]{
    background-color:#123456;
    border:1px solid white;
    font-family: 'Fauna One', serif;
    font-Weight:bold;
    font-size:18px;
    color:white;
    width:49%;
}
textarea{
    width:100%;
    height:80px;
    margin-top:5px;
    border-radius:3px;
    padding:5px;
    resize:none;
}

#contact{   
    width:350px;
    margin:0px;
    background-color:white;
    font-family: 'Fauna One', serif;
    position: relative;
    border: 5px solid rgb(90, 158, 181);
    margin-top: -20;
}
.img{
    float: right;
    margin-top: -35px;
    margin-right: -37px;
}
#contact{
    left: 50%;
    top: 50%;
    margin-left:-210px;
    margin-top:-255px;
}


LI
{
	margin: 0px 0px 0px 13px;
	/*+placement:shift 0px 8px;*/
	position: relative;
	left: 0px;
	top: 8px;
	font-family: Calibri;
	font-size: 18.7pt;
}
UL
{
	list-style: none;
}
A
{
	text-decoration: none;
	color: #F2F474;
	/*[disabled]font:inherit;*/
}