header img {
		width: 100px;
		height: 40px;
		top: 80px;
		
		left:47%;
		
	    text-align: center;

	    position: fixed;
		}

header{text-align: center;
		}

header img:hover{cursor: help;}


#banson{
		padding-top: 250px;
		padding-bottom: 200px;
		}


a{    text-decoration: none; 
		cursor: help;}

h1{		width: 100%;
		cursor: help;
		font-family: avenir;
		font-size: 65px;
		text-shadow: 12px 10px 10px lightgray;
		

/*-----horzontal, vertical, blurness, color---*/

		text-align: center;
		color: #2b2b2b;}

.mainnav nav {		padding-right: 40px;
			font-family: avenir;
			text-align: center;
			
			border-radius: 5px;
			margin: 10px;
			
			
			height: 35;
			font-size: 18px;
			font-weight: bold;
			color: #000;
			text-shadow: 6px 5px 5px lightgray;
			
}
.mainnav nav a {
			padding: 15px 55px;
			text-decoration:none;
			color: #000;
}



.mainnav nav ul{ background-color: white;
		text-decoration:none;
}

.mainnav nav ul li{ display:inline-block; 
			position:relative;}

.mainnav nav ul li a:before{
		content: "";
		position: absolute;
		width: 100%;
		height: 2px;
		bottom: 0;left: 0;
		background-color: #000;
		visibility: hidden;
		-webkit-transform: scaleX(0);
		transform: scaleX(0);
		-webkit-transition: all 0.3s ease-in-out 0s;
		transition: all 0.3s ease-in-out 0s;}

.mainnav nav ul li a:hover:before {visibility: visible;transform: scaleX(1);}




.mainnav nav ul li ul{ min-width:100%;
			  opacity:0.9;
			  display:none;
              position:absolute;}
			  
.mainnav nav ul li ul li a{padding:20px;}
			  
			

.mainnav nav ul a, nav ul li:hover ul,nav ul li ul li {display:block;}

main{ width: 80%;		
	margin-left: auto;
	margin-right: auto;
	float: center;}
/*--------------------------------work page code-------------------------*/


div img {border-radius: 0px;}

.wrapper{	
			padding-top: 200px;
			text-align: right;
			

			width: 100%;
			
			
		}


.gallery img{
		
		display: block;
    	margin: auto;

    	margin:10px;
    	
    	width: 400px;
    	opacity: 0.4;

    	
			
		
			
		}

.gallery{	width: 400px;
			float:left;
			
			
			
			
			margin-left: 80px;
			margin-right: 80px;
			margin-top: 40px;
			margin-bottom: 40px;
		}
.gallery img:hover{ 
				cursor: help;
				transition: 1s ease;
				opacity: 1;
				box-shadow: 15px 15px 35px #ccc;}
.bell{
		
	font-size: 15px;
	font-family: avenir;
	text-align: center;
	opacity: 0;
	cursor: help;
	transition: 1s ease;
	padding: 50px;
  	
  	position: relative;
  	
  	text-align: center;
}

.gallery:hover .bell{
	opacity: 1;
	
}

body{background-color: white;}
footer{	padding: 100px;
		clear: both;
		float: auto;}
/*-------------------------------chair page code-------------------------*/


.leftButton
	{border:none;display:inline-block;
		padding:230px 16px;
		position: absolute;
    	top: 50%;
    	left: 0%;
		
		vertical-align:middle;overflow:hidden;
		text-decoration:none;color:inherit;
		background-color:inherit;
		text-align:center;
		cursor:help;
		}

.rightButton
	{border:none;display:inline-block;
		padding:230px 16px;
		position: absolute;
    	top: 50%;
    	right: 0%;
		
		vertical-align:middle;overflow:hidden;
		text-decoration:none;color:inherit;
		background-color:inherit;
		text-align:center;
		cursor:help;
		}
.leftButtons
	{border:none;display:inline-block;
		padding:8px 16px;
		position: absolute;
    	top: 50%;
    	left: 0%;
		
		vertical-align:middle;overflow:hidden;
		text-decoration:none;color:inherit;
		background-color:inherit;
		text-align:center;
		cursor:help;
		}

.rightButtons
	{border:none;display:inline-block;
		padding:8px 16px;
		position: absolute;
    	top: 50%;
    	right: 0%;
		
		vertical-align:middle;overflow:hidden;
		text-decoration:none;color:inherit;
		background-color:inherit;
		text-align:center;
		cursor:help;
		}




/*-------------------------------ai page code-------------------------*/


.photos{
	text-align:center;
}


.ai1 {
	
	text-align: center;
	}

.ai1 img{
	width: 100%;}

.ai2 {
	text-align: center;
}
.ai2 img{
	width: 80%;
}

.ai3 img{
	width: 40%;
	margin-left: 141.5px;
}

.ai4 img{
	width: 94.5%;
	padding-top:100px;
}

.textpadding{
	padding-top:100px;
	padding-bottom: 100px;
	width: 40%;
	margin:auto;
	font-family: avenir;
}
.textpadding1{
	padding-top:700px;
	padding-bottom: 100px;
	width: 65%;
	margin:auto;
	font-family: avenir;
}

.idea img{
	width: 80%;
	text-align: center;
}





/* how to make the photo bleed off the page-------*/
/*.titletext{width: 100%;}*/

.titletext section {
	  font-family: avenir;
	  float: left;
	  margin-left: 250px;
	  padding-top: 100px;
	  padding-bottom: 100px;
	  padding-right: 100px;

	  
	  
	  width: 36%;
}

.titletext aside p{
	font-weight: bold;
	padding-bottom: 18px;
}
.titletext aside {
	padding-top: 100px; 
	float: right;
	margin-right: 30px;
	width: 30%;
	font-family: avenir; }


.titletext nav a {
			
			text-decoration:none;
			list-style-type: none;
			color: #000;
}



.titletext nav ul{ 
	list-style-type: none;
	background-color: white;
	text-decoration:none;
	padding-left: 0px;
	
}

.titletext nav ul li{ 

			position:relative;
			margin-right: 140px;
		padding-left: 0px;
		padding-top: 15px;}

.titletext nav ul li a:before{
		content: "";
		position: absolute;
		width: 20%;
		height: 1px;
		bottom: 0;

		left: 0;
		background-color: #000;
		visibility: hidden;
		-webkit-transform: scaleX(0);
		transform: scaleX(0);
		-webkit-transition: all 0.3s ease-in-out 0s;
		transition: all 0.3s ease-in-out 0s;
	}

.titletext nav ul li a:hover:before {visibility: visible;transform: scaleX(1);
}


.titletext nav ul a, nav ul li:hover ul,nav ul li ul li {display:block;
}
/*----------------------sonosite-------------------------*/

aside img{
	margin-top: 20px;
	margin-bottom: 10px;
	width: 20%;
}

.smalllogo img{
	margin-top: 26px;
	margin-bottom: 10px;
	width: 35%;
}

.clear{
	clear: both;
}

.banner{width: 100%;
		height: 538px;
		position: relative;}


#slider{width: 100%;
		height: 538px;
		position: absolute;
		overflow: hidden;}

/*#slider img{margin-left: 150px;}*/

#next{

	text-align: center;
	line-height:50px;
	color: #ffffff;
	width:50px;
	height:50px;
	background-color:red;
	position: absolute;
	top:205px;
	right:0;
	z-index:99;
	cursor: pointer;
	opacity:.4;}

#pre{text-align: center;
	line-height: 50px;
	color: #ffffff;
	width:50px;height:50px;
	background-color: red;
	position: absolute;
	top:205px;
	left:0;
	z-index:99;
	cursor: pointer;
	opacity:.4;}

.banner:hover #next{opacity:1;
					transition: all .5s ease-out;
					-webkit-transition: all .5s ease-out;
					-ms-transition: all .5s ease-out;}

.banner:hover #pre{opacity:1;
				transition: all .5s ease-out;
				-webkit-transition: all .5s ease-out;
				-ms-transition: all .5s ease-out;}

/*-------------------------------resume page code-------------------------*/

.resume{ 
		padding-top: 200px;
		text-align: center;
		padding-bottom: 50px; 
		margin-left: auto;
		margin-right: auto;}
.resume img {
	
	margin-left: auto;
	margin-right: auto;
	width: 43%;
	box-shadow: 15px 15px 35px #ccc; 
}
/*-------------------------------about page code-------------------------*/

.thumbnail {
  max-width: 40%;
}

.italic { font-style: italic; }
.small { font-size: 0.8em; }

/** LIGHTBOX MARKUP **/

.lightbox {
	/** Default lightbox to hidden */
	display: none;

	/** Position and style */
	position: fixed;
	z-index: 999;
	width: 100%;
	height: 100%;
	text-align: center;
	top: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
}

.lightbox img {
	/** Pad the lightbox image */
	max-width: 32%;
	max-height: 90%;
	margin-top: 2%;
}

.lightbox:target {
	/** Remove default browser outline */
	outline: none;

	/** Unhide lightbox **/
	display: block;
}

.about{ 
		padding-top: 200px;
		padding-left: 500px
		padding-bottom: 50px; }
		
.about img {
	
	margin-left: auto;
	margin-right: auto;
	width: 60%;
}

.distext{ 
	margin-left: 250px;
	padding-top: 180px;
	font-family: avenir;

} 



section{
	float: right;
	width: 45%;
}
aside{float: left;
		width: 45%;}


/*--------------joehan is hot---------------------*/