/* style.css  */

html, body, img, div, h1, h2, h3, h4, h5, h6, p, form, blockquote, ul, ol, li {
	margin:0;
	padding:0;
	border-width: 0px;
}

html {
height: 100%;
}

body {
background-color: #efefef;
text-align: center;
font-size: 80%;
font-family: verdana, sans serif;
color: #000;
height: 100%;
}

/* Set page minimum Height */
#min-height {
	float: left;
	width: 1px;
	height: 125px;
}


/* Clear the div */
.clear {
clear:both;
height:1px;
overflow:hidden;
}

p {
font-size: 1.2em;
}


h1 {
font-family: verdana, serif;
color: #2e2e2e;
font-size: 2.6em;
margin: 20px 0 20px 0px;
padding: 0;
}

h2 {
color: #2e2e2e;
font-size: 1.5em;
margin: 20px 0 15px 0px;
}

h3 {
margin: 10px 0 10px 0;
}

.portfolio-header {
color: #2e2e2e;
font-size: 2.4em;
margin: 30px 0 30px 0px;
}

.top-header {
color: #2e2e2e;
font-size: 1em;
margin: 30px 0 30px 0px;
}



#navigation {
margin: 0 auto;
padding: 5px 0 0 0;
width: 1024px;
text-align: right;
}

.my-name {
font-family: verdana, serif;
font-size: 2.2em;
margin: 0;
padding: 0 0 5px 0;
color: #FFF;
}

#head {
background-color: #2e2e2e;
height: 100px;
border-bottom: 2px solid #111;
}

#content-container {
height: auto !important;
height: 100%;
margin: 0 auto -4em;
min-height: 100%;
text-align: left;
padding: 0 0 20px 0;
}

#portfolio-container {
width: 1024px;
margin: 0 auto;
}

	/* about page */
	
	#social-icons li {
	float: left;
	margin: 0;
	padding: 0 10px 0 0 ;
	}
	
	#right-photo {
	float: right;
	}
	
	.connect {
	margin-right: 210px;
	float: left;
	clear: none;
	}
	
	.about-info {
	width: 1024px;
	border-top: 1px dashed #000;
	height: 150px;
	padding: 0;
	margin: 0;
	}

#about-content p {
width: 500px;
padding: 0px 10px 20px 0px;
}

#about-content span {
font-weight: bold;
color: #333;
}

#about-content a {
color: #333;
text-decoration: none;
font-weight: bold;
}

#about-content a:hover {
color: #00c6f4;
}

.about-info ul {
margin: 0px 40px 20px 0px;
float: left;
}

.about-info ul li {
list-style-type: none;
padding: 0 0 5px 0;
}


/* portfolio home */

#portfolio-home {
float: left;
width: 1000px;
margin: 20px 0 0 0;
}

.left-image1 {
float: left;
clear: none;
margin: 0 20px 0 0;
}

.left-image2 {
float: left;
clear: none;
margin: 40px 20px 0 20px;
}

.left-text{
margin: 20px 0 0 20px;
}



#portfolio-home h3 {
font-size: 1.4em;
color: #333;
}

#portfolio-home ul li{
display: inline;
list-style-type: none;
padding: 5px 15px 5px 0;
}

/* Photography Home */


#photography-home h3 {
font-size: 1.4em;
color: #333;
}

#photography-home {
float: left;
}

#photography-home ul li{
list-style-type: none;
padding: 5px 15px 5px 0;
display: inline;
}


#top-nav {
font-size: .8em;
font-family: verdana, serif;
margin: 5px 0 5px 0;
padding: 0;
}

#top-nav a {
text-decoration: none;
color: #efefef;
}

#top-nav a:hover {
color: #d71b02;
}

#top-nav ul {
color: #efefef;
}

#top-nav ul li {
display: inline;
}

#main-navigation a {
text-decoration: none;
font-size: 1.1em;
font-family: verdana, serif;
color: #efefef;
margin: 0;
}

#main-navigation a:hover {
color: #00c6f4;
}

#main-navigation {
margin: 0;
padding: 0;
}

#main-navigation ul {
margin: 0 0 0 15px;
color: #efefef;
}

#main-navigation ul li {
display: inline;
}



.boxes {
margin: 0 auto;
padding: 0;
height: 284px;
width: 1024px;

}

.boxes form {
float :left;

}

.boxes input {
margin: 20px 0 0 32px;
padding: 5px 0 5px 0;
width: 225px;
border: 1px solid #333;
}

#name, #email, #note {
font-size: 1.2em;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border: 1px solid #333;
}

#send {
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border: 1px solid #333;
float : right;
width: 75px;
margin: 10px 30px 10px 0;
font-size: 1.3em;
}

.boxes textarea {
margin: 20px 0 0 32px;
padding: 0px 0 5px 0;
width: 225px;
height: 140px;
font-size: 1.2em;
border: 1px solid #333;
}

.response {
color: #333;
font-size: 1.4em;
margin: 10px 15px 0 0;
float: right;
}


.box1 {
margin: 0 70px 0 0;
float: left;
clear: none;
background-image: url(../images/bluebox3.png);
background-position: left top;
background-repeat: no-repeat;
width: 290px;
height: 290px;
}


.box2 {
margin: 0 70px 0 0;
float: left;
clear: none;
background-image: url(../images/redbox2.png);
background-position: left top;
background-repeat: no-repeat;
width: 290px;
height: 290px;
}


.box3 {
margin: 0;
float: left;
clear: none;
background-image: url(../images/purplebox2.png);
background-position: left top;
background-repeat: no-repeat;
width: 290px;
height: 290px;
}


.boxes h2 {
font-family: verdana, sans serif;
padding: 20px 0 0 30px;
margin: 0px;
font-size: 2.5em;
color: #FFF;
}

.boxes .punchline {
float: right;
clear: both;
padding: 60px 20px 0 30px;
margin: 0px 0 30px 0;
font-size: 1.4em;
color: #fff;
}


.boxes .fadetext {
text-align: left;
padding: 5px 30px 0 30px;
margin: 0px;
font-size: 1.1em;
color: #fff;
}




#outer-footer {
float: left;
	width: 100%;
clear: both;
height: 100px;
border-top: 2px solid #000;
background-color: #2e2e2e;
}

#footer {
width: 1024px;
margin: 0 auto;
padding: 0;

}

#footer p {
font-family: verdana, sans serif;
color: #fff;
font-size: 0.9em;
margin: 20px 15px 0 0;
float: right;
}

.screen-shot {
float: left;
clear: none;
width: 450px;
padding: 0 0 0 20px;
text-align: left;

}

.next-project {
width: 500px;
text-align: right;
font-size: 1.2em;
margin: 10px 0 0 0px;
padding: 10px 0px 10px 0;
border-top: 1px dotted #000;
border-bottom: 1px dotted #000;
}

.next-project a {
text-decoration: none;
padding: 0px 5px opx 0px;
color: #333;
}

.next-project a:hover {
text-decoration: none;
padding: 0px 5px opx 0px;
color: #00c6f4;
}

.previous {
float: left;
}

#client-box {
width: 480px;
margin: 0px 0 20px 5px;
padding: 5px 0 5px 0;
border-top: 1px dotted #000;
border-bottom: 1px dotted #000;
}

#client-box p {
font-size: 1em;

line-height: 1.6em;



}

#client-box a {
color: #00c6f4;

text-decoration: none;
}

#client-box a:hover {
color: #dc4fc2;

}

#left-content {
float: left;
}

#left-content p {
font-size: 1.1em;
padding: 0 10px 0 0;
}

/* Photography Styles */

	

	.pano-gallery {
	padding: 0px;
	margin: 0px;
	float: left;
	width: 1024px;
	border-bottom: 1px dashed #333;
	padding: 0 0 20px 0;

	}
	
	.people-photos {
	float: left;
	width: 1024px;
		border-bottom: 1px dashed #333;
padding: 0 0 20px 0;

	}
	
	.places-photos {
	width: 1024px;
	margin: 0;
	float: left;
	clear: none;
		border-bottom: 1px dashed #333;
padding: 0 0 20px 0;
}

.hdr-objects {
margin: 0;
width: 1024px;
	float: left;
	clear: none;

}
		.photo-gallery img {
		border: 2px solid #2E2E2E;
		padding: 0px;
		margin: 0px 10px 10px 0;
		}
		
		.photo-gallery img:hover {
		border: 2px solid #FC746D;
		}
		

/* JQuery Styles*/



#slider {
  width: 1024px;
  margin: 0 auto;
  position: relative;
}

.scroll {
  height: 390px;
  overflow: auto;
  position: relative; /* fix for IE to respect overflow */
  clear: left;
}

.scrollContainer div.panel {
  padding: 0px;
  height: 390px;
  width: 1024px; /* change to 560px if not using JS to remove rh.scroll */
}

.right-btn {
float: right;
}

#left-btn {
float: left;
margin-left: 815px;
}

ul.navigation li {
float: right;
display: inline;
padding: 0 0px 0 0px;
margin: 0;
}

ul.navigation {
font-size: 1.2em;
margin: 0 20px 0 5px;
padding: 10px 0 0px 0px;
height: 25px;
border-bottom: 1px dashed #333;

}


ul.navigation a {
margin: 0;
    padding: 10px;
    color: #333;
    text-decoration: none;
}

ul.navigation a:hover {
color: #00c6f4;

}

ul.navigation a.selected {
color: #000;


}

ul.navigation a:focus {
    outline: none;
}

/*
.scrollButtons {
    position: absolute;
    top: 43px;
    cursor: pointer;
}

.scrollButtons.left {
    left: -30px;
}

.scrollButtons.right {
    right: -30px;
}

*/


/* Tab Navigation */


ul.tabNavigation {
		    list-style: none;
		    margin: 10px 0 0 5px;
		    padding: 10px 0 10px 0;
		    background-color: #ccc;
		    			width: 480px;
		}

		ul.tabNavigation li {
		    display: inline;
		    padding: 0;
		    margin: 0;
		}

		ul.tabNavigation li a {
		    padding: 10px;
		    background-color: #ccc;
		    color: #000;
		    text-decoration: none;
		}

		ul.tabNavigation li a.selected,
		ul.tabNavigation li a:hover {
		    background-color: #333;
		    color: #fff;
		}
		
		ul.tabNavigation li a:focus {
			outline: 0;
		}

		div.tabs > div {
			height: 600px;
			width: 480px;
			padding: 5px;
			margin-top: 3px;
		}
		
		div.tabs > div h2 {
			margin-top: 0;
		}
		
		#description {
		padding: 5px;
		}

		#description p {
		padding: 10px 10px 0 0 ;
		}

		#casestudy {
		}

		#projects {
				padding: 5px;

		}
		
		#testimonial  p {
				padding: 10px 10px 0 0 ;

		}

ul.hover_block {
margin: 0 0 0 0px;
}

	ul.hover_block li {
			list-style:none;
			float:left;
			background: #efefef;
			padding: 10px 56px 15px 0px;
			width: 200px; 
			position: relative;
			margin: 0; 
			}

		ul.hover_block li a {
			display: block;
			position: relative;
			overflow: hidden;
			height: 160px;
			width: 200px;
			padding: 10px;
			color: #000;
			font: 1.2em/1.0 Verdana, Arial, sans-serif;
			line-height: 1.3em;
		}

		ul.hover_block li a { text-decoration: none; }

		ul.hover_block li img {
			position: absolute;
			top: 0;
			left: 0;
			border: 0;
		}
		
		
		
		.image-popup {
		float: left;
		margin: 0 auto;

		padding: 0 20px 0 0;
    width: 75px;
    height: 75px;
    position: relative;
}

div.image-popup em {
		background-image: url(../images/popup_bg.png);
		background-repeat: no-repeat;
		background-position: top left;
			width: 332px;
			height: 283px;
			padding: 15px 0 0 0;
			position: absolute;
			top: -330px;
			left: 0px;
			text-align: center;
			text-indent: 0px;

    z-index: 2;
    display: none;

}

.image-thumb {
    width: 75px;
    height: 75px;
    margin: 0 auto;
    display: block;
    -moz-border-radius: 8px;
-webkit-border-radius: 8px;
border: 1px solid #333;
}

.image-thumb:hover {
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border: 1px solid #d71b02;
}


/* Services Pop ups */

		.service-popup {
		float: left;
		margin: 0 auto;

		padding: 0px 30px 0 0;
    width: 150px;
    height: 150px;
    position: relative;
}

div.service-popup p {
		background-image: url(../images/popup_bg2.png);
		background-repeat: no-repeat;
		background-position: top left;
			width: 332px;
			height: 231px;
			padding: 40px 0px 0 15px;
			margin: 0 20px 0 0;
			top: -300px;
			left: -10px;
			text-align: left;
			text-indent: 0px;

    z-index: 2;
    display: none;

}

.service-thumb {
    width: 150px;
    height: 150px;
    margin: 0 auto;
    display: block;
}



.proj {
float: left;
padding: 0 20px 0 0;
}

.proj img {
border: 2px solid #333;
}

.proj a {
font-weight: bold;
color: #333;
font-size: 1.1em;
}

.contact-paragraph {
width: 500px;
}

	


.service-info {
float: left;
clear: left;
padding: 30px 50px 0 0;
}

.service-info a {
font-weight: bold;
color: #333;
}