body {
	font-family: 'Source Sans Pro', sans-serif;
    font-family: 'Marcellus SC', serif;
	font-family: 'Playfair Display SC', serif;
	font-family: 'Almendra SC', serif;
	font-family: 'Alegreya SC', serif;
	font-family: 'Advent Pro', sans-serif;
	font-family: 'Rosario', sans-serif;
	font-family: 'Asul', sans-serif;
	background-color:white;
	text-align: center;
	text-decoration: none;
}



#gradient {	
	width:90%;
	background-color: none;
	margin: 0 auto;

}

#gasFurnace {	
	margin: 0 auto;
	width: 75%;

}
#blueSystem{
	margin: 0 auto;
	width: 100%;
	padding-top:100px;
	padding-bottom: 100px;
}

#detailsSystem,#gradientSystem,#outlinesSystem{
	maegin-top: 100px;
	margin-bottom: 100px;
	width: 100%;
}
	


#wrapper {
	background-image:url(../_images/cherrytreelight2.png),
					 url(../_images/sumiko.png);

			  
	background-position:top, right, top;		
	background-attachment: fixed, fixed, scroll;
	background-repeat:no-repeat, no-repeat, no-repeat;
	overflow-x:hidden;
	padding:2%;
	margin: 0 auto;
}

/* Navigation */
nav {
	width:100%;
	margin: 0 auto;
	background-color: white;
	background-attachment: fixed;
	position:fixed;
	z-index: 999;
	box-shadow:  10px 1px 5px #666;
	
}

.topmenu {
	text-decoration: none;
	margin-bottom: 0px;
	height: 60px;
	padding-top: 0%;
	padding-right: 2%;
	padding-bottom: 0%;
	padding-left: 2%;

}
.logo {
	float:left;
}
.link {
	float:right;
	margin-top: 20px;
}
	
.iconsocialmedia {
	margin-left: 10px;
	margin-top: 20px;
	float: right;	
}
#behanceLink {
	width: 40px;
	height: 40px;
	background-image: url(../_images/behance.png);
	background-repeat:no-repeat;
}
#behanceLink:hover  {
	background-position: center bottom;
}
#linkedInLink {
	width: 40px;
	height: 40px;
	background-image:url(../_images/linkedin.png);
	background-repeat:no-repeat;
}
#linkedInLink:hover  {
	background-position: center bottom;
}
#resumeLink {
	width: 40px;
	height: 40px;
	background-image: url(../_images/resume.png);
	background-repeat:no-repeat;
}
#resumeLink:hover  {
	background-position: center bottom;
}
#aboutLink {
	width: 40px;
	height: 40px;
	background-image: url(../_images/about.png);
	background-repeat:no-repeat;
}
#aboutLink:hover  {
	background-position: center bottom;
}
#hvacLink {
	width: 104.712px;
	height: 40px;
	background-image: url(../_images/cascade.png);
	background-repeat:no-repeat;
}
#graylogo {
	width: 200px;
	height: 80px;
	background-image: url(../_images/graylogo.png);
	background-repeat:no-repeat;
}
#graylogo:hover  {
	background-position: center bottom;
}


/* Fonts */
h1 { 
	text-shadow: 3px 3px 6px rgba(0,0,0,.6);
	font-family: "Playfair Display SC", serif;
	font-size:60px;
}

h1:first-letter{
	font-size:80px;
}

h2 {
	text-shadow: 3px 3px 3px rgba(0,0,0,.5);
	font-family: 'Source Sans Pro', sans-serif;
	font-size:36px;
	text-transform: uppercase;
}
h3 {
	color: black;
	font-family: 'Source Sans Pro', sans-serif;
	font-size:24px;
}
h4 {
	color: black;
	font-family: 'Source Sans Pro', sans-serif;
	font-size:24px;
	text-transform: uppercase;
}

a {
	text-decoration: none;
	}
p {	
	color: black;
	font-family: 'Source Sans Pro', sans-serif;
	font-size:20px;
		
}


/* Main */

section {
	margin: 0 auto;
	width: 100%;
	height: 100%;
}


.mainname {
	text-align: center;
	padding-top: 60px;
	margin:0px 0px 80px 0px;
	width: 100%;

}

.tagline {
	margin-top: -60px;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 24px;
}


.portLinks {
	width: 100%;
	text-align: center;
	display: inline-block;
	margin: 0 auto;
	text-decoration: none;
	color: black;

}

/* Dropdown */
#webExamples,#designExamples,#prodExamples {
	float:left;
	width: 33.33%;
	text-align: center;
	margin: 0 auto;
	text-decoration: none;
	margin-bottom: 20px;
	
	}
.webDropdown,.designDropdown,.prodDropdown{
	padding-top: 100px;
	text-decoration: none;
	color: black;

}
.webDropdown {
	background-image:url(../_images/PDXRecyclerRespontn.png);
	background-repeat: no-repeat;
	background-position: top center;
}
.designDropdown {
	background-image:url(../_images/trimettn.png);
	background-repeat: no-repeat;
	background-position: top center;


}
.prodDropdown {
	background-image:url(../_images/screenprintsepstn.png);
	background-repeat: no-repeat;
	background-position: top center;

}
/* Slides */
.images {	
	float: right;

}
#appdetails,#respondetails,#analytics,#trimet,#appdesign,#graphic,#adidasprod,#nikeprod,#separations,#kindred,#socialmedia,#directmailers,#print,#tshirtdesign {
	text-wrap: normal;
	padding: 0px 10%;
	text-align: left;
}

#webdesign,#design,#production{
	border-top: 1px inset #999;
	border-bottom: 1px inset #999;
	margin: 0 auto;
	padding: 2%;
	text-align: center;
}

 .custom-button {
            display: inline-block;
            background-color: #000;
            color: #fff;
            font-family: 'Myriad Pro', sans-serif;
            font-size: 1vw;
            padding: .75vw 1.5vw;
            border: none;
            border-radius: 10px;
            cursor: pointer;
            text-align: center;
        }

        .custom-button:hover {
            background-color: #666666;
        }
.custom-button2 {
            display: inline-block;
            background-color: #000;
            color: #fff;
            font-family: 'Myriad Pro', sans-serif;
            font-size: 1vw;
            padding: .5vw 1.5vw;
            border: none;
            border-radius: 10px;
            cursor: pointer;
            text-align: center;
        }

        .custom-button2:hover {
            background-color: #666666;
        }



.slidestyle {
	width: 97%;
	padding: 10px 3% 10px 3%;
	background-color:rgba(255,255,255,.8);
	border-radius: 10px 10px 10px 10px;
	box-shadow: 5px 5px 10px #020202;
}

footer {
	width: 100%;
	height: 40px;

	}
/* Resume About*/
.resume,.about{
	width: 80%;
	margin: 0 auto;
	background-color: rgba(255,255,255,.8);
	border-radius: 10px 10px 10px 10px;
	text-align: left;
	padding: 5%;
}

.resume p{
	list-style:square;

}
.descript {
	text-shadow: 1px 1px 6px rgba(0,0,0,.2);
	font-family: 'Almendra SC', serif;
	font-size: 24px;
}
.smdescript {
	font-family: 'Almendra SC', serif;
	font-size: 20px;
}
.smrdescript {
	font-family: 'Almendra SC', serif;
	font-size: 18px;
}

.about p{
	text-indent: 10px;
	}
.about p:first-letter{
	text-shadow: 1px 1px 3px rgba(0,0,0,.2);
	font-family: 'Almendra SC', serif;
	font-size: 32px;
	
	}

/* Responsive to Device*/
@media screen and (min-width: 1440px) {
   #wrapper {
	   background-image:url(../_images/cherrytreelightmed.png),
					 url(../_images/sumikobig.png);
			  
	background-position:top, top right, top;		
	background-attachment: fixed, fixed, scroll;
	background-repeat:no-repeat, no-repeat, no-repeat;
	overflow-x:hidden;
	padding:2%;
   
}


@media screen and (min-width: 1919px) {
   #wrapper {
	background-image:url(../_images/cherrytreebig.png),
					 url(../_images/sumikobig.png);
			  
	background-position:top, top right, top;		
	background-attachment: fixed, fixed, scroll;
	background-repeat:no-repeat, no-repeat, no-repeat;
	overflow-x:hidden;
	padding:2%;
   
}

}