@import url('reset.css');
html 
{ 
		background: #333333 url(../img/bg.png) no-repeat center top; 
		border-top:10px solid #FF1100;
		font-size:100%;
}
			
body
{		
		font-size: 1em;
		font-family: 'Open Sans', sans-serif; 
		color: #cccccc;
		overflow-y:scroll;

}

a
{
		text-decoration: none;
		color: inherit;
		transition: color .5s ease;
}


 
/* header styles begin here!! */

/* HEADER */

header
{
   		margin: 0 auto;
		position:relative;
        width:auto;
		height: 100%;
        max-width:900px;
		background: #333333;
}

/* H1-H5 */
h1
{
		padding: 10px 0 25px 0;
}

h2
{
        position:relative;
		width:auto;
        max-width:900px;
        margin:0px 0 10px auto; 
		font-family: 'Lobster', cursive;
		color:#333;
		font-size: 52px;
        font-weight: 400;
		text-align: center;
		padding: 10px 0 0 0;
		line-height:48px;
}
h3
{
        position:relative;
		width:auto;
        max-width:900px;
        margin:0 auto 5px auto; 
		font-family: 'Open Sans', sans-serif;
		font-weight: 600;
		font-style: italic;
		font-size:24px;
		text-align: center;
		color: #666;
}
h4
{
        background-color:#333333;
		font-family: 'Open Sans', sans-serif;
		font-weight: 600;
		color:#cccccc;
		font-size:16px;
        font-weight: 600;
        margin: 15px 0 0 0px;
		padding: 8px 0 4px 15px;
		width: auto;
}

h4.request
{
        margin: 0px;
		
}

h5
{
        background-color:#333333;
		font-family: 'Open Sans', sans-serif;
		color:#cccccc;
		font-size:16px;
        font-weight: 600;
		padding: 8px 0 4px 15px;
		width: auto;
}

/* Nav Menu */

nav
{
        position:absolute;
        right:0;
        bottom:0;
		z-index:10;
}

nav ul
{
        list-style:none;
}

nav ul li
{
        display:block;
        float:left;
        padding:3px 15px;
}

nav ul li a
{
       transition: all .25s ease;
}

nav ul li a:hover
{
        color:#cc0000;

}

/* SLIDESHOW */

/* Prevent the slideshow from flashing on load */

#slides
{
  display: none
}

/* Center the slideshow */
.container
{
        width:auto;
		max-width: 56.25em;
        margin: 0 auto;
        position:relative;
}

/* HOME SECTION */

#home
{
        position:relative;
		margin:0 auto;
		width:auto;
		max-width:900px;
        height:645px;
		background-color:#cccccc;
        font-family: 'Open Sans', sans-serif;
}

#home p
{
        padding: 7px 14px;
		line-height:125%;
		font-size:14px;
		text-align:left;
		background-color:#ffffff;
		color:#333;
}

#home .column1
{
		float:left;
        width:60%;
		margin-left:3%;

}
#home .column2
{
		float:right;
        width:30%;
		margin-right:3%;
}

#textbox
{		
		background-color:#ffffff;
        border-bottom: 5px solid #333;
        border-top: 2px solid #FF1100;
		
}

.contact
{
		
		font-size:10px;
		background-color:#ffffff;
		border: 2px solid #333;
		border-top: 2px solid #FF1100;
		width: auto;
}
.contact a:link 
{		
		color: #333333;
		text-decoration: underline;
		font-weight: 800;
}

.contact a:visited 
{		
		color: #333333;
		text-decoration: underline;
		font-weight: 800;
}

.contact a:hover
{		
		color: #FF1100;
		text-decoration: underline;
		font-weight: 800;
}
.social
{
		background-color:#ffffff;
		border: 2px solid #333;
		border-top: 2px solid #FF1100;
		width: auto;
}
.angie
{
		position:relative;
		width:50%;
		margin: 0 auto;
}

.fblike
{
		display: block;
		margin: 15px auto 0 auto;
}

/* GALLERY & Thumbnail Effects Style */


#gallery
{
        background-color:#cccccc;
        width:auto;
        max-width:900px;
        margin:0 auto;
}

.tj_container{
	width:800px;
	position:relative;
	margin:0 auto;
}
.tj_nav{
	position:absolute;
	right:20px;
	top:46%;
	height:70px;
	width:39px;
}
.tj_nav span{
	width:39px;
	height:25px;
	background:transparent url(../img/prev.png) no-repeat top left;
	position:absolute;
	top:-40px;
	left:0px;
	text-indent:-9000px;
	opacity:0.7;
	cursor:pointer
	/*-webkit-transition: all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-transition: all 0.2s ease-in-out;
	*/
}
.tj_nav span.tj_next{
	background-image:url(../img/next.png);
	top:auto;
	bottom:50%;
	left:0px;
}
.tj_nav span:hover{
	opacity:1.0;
}
.tj_wrapper{
	width:90%;
	position:relative;
	margin:0px auto;
}
.tj_wrapper ul li{
	float:left;
	list-style-type: none;

}
.tj_wrapper ul li a{
	outline:none;
	display:block;
	margin:5px;
	background:transparent url(../img/bg_thumb.jpg) no-repeat center center;
}
.tj_wrapper ul li a img{
	display:block;
	width: 160px;
	border:none;
	opacity:0.7;
	-moz-box-shadow:2px 2px 4px #8e8e8e;
	-webkit-box-shadow:2px 2px 4px #8e8e8e;
	box-shadow:2px 2px 4px #8e8e8e;
	/*
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-transition: all 0.2s ease-in-out;
	*/
}
.tj_wrapper ul li a img:hover{
	opacity:1.0;
}



.thumb-screen:hover
{
        opacity:0.5;
}

/* services */

#services
{
		position:relative;
		width:auto;
		max-width:880px;
        height:auto;
		background-color:#cccccc;
		padding: 0 10px 20px;
        font-family: 'Open Sans', sans-serif;
        color:#333;
		margin:0 auto;
}

#joblist
{		
		display: block;
		width:auto;
        position:relative;
		margin:0 auto;
		max-width:800px;
		padding: 0 50px;
		line-height:25px;
        font-family: 'Open Sans', sans-serif;
        color:#333;
}

/* quotes (hidden)*/

#reviews
{
        display: none;
		width:auto;
        max-width:700px;
        margin:0 auto;
        padding:20px 0;
}
#reviews article p
{
        font-size:40px;
		line-height:38px;
		font-family: 'Yellowtail', cursive;
        text-align: center;

}
#reviews article p.name
{
        line-height:24px;
        font-family: 'Open Sans', sans-serif;
		font-size: 20px;
		font-weight: 600;
		font-style:italic;
		text-align: right;
		margin:10px 75px 0 0;
}

/* vendors & quote */

#vendors
{
		position:relative;
		background-color:#cccccc;
		font-family: 'Open Sans', sans-serif;
        color:#333;
        width:auto;
        max-width:900px;
        margin:0 auto;
		height:100%;
}



#vendors, #quote p
{
		line-height:25px;
}

.linktext
{		
		font-size:14px;
		margin:-5px 0 0 0;
		text-align:center;
}
#quote
{
        background-color:#cccccc;
        font-family: 'Open Sans', sans-serif;
        color:#333;
        width:auto;
        max-width:900px;
        margin:0 auto;
		padding: 40px 0;
}

.mailform
 {
	margin: 0 auto;
	max-width:580px;
}

#contact_form { 
	text-shadow:0 1px 0 #FFF;
	border-radius:4px;
	background:#F9F9F9;
	padding:25px;
	
}


#ff label { 
	display: block;
	cursor:pointer;
	color:#333333;
	font-weight:800;

}

input { 
	display:block;
	width:90%;
	border-radius:4px;
	background-color:#f4f4f4;
	color:#000;
	border:1px solid #5f5f5f;
	padding:5px;
	
}

.sendButton {
	cursor:pointer;
	-moz-box-shadow:inset 0px 1px 0px 0px #cccccc;
	-webkit-box-shadow:inset 0px 1px 0px 0px #cccccc;
	box-shadow:inset 0px 1px 0px 0px #cccccc;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #cccccc), color-stop(1, #ff1100) );
	background:-moz-linear-gradient( center top, #cccccc 5%, #ff1100 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#ff1100');
	background-color:#ff1100;
	border:1px solid #333333;
	color:#ffffff;
	font-family:Arial;
	font-size:14px;
	width:25%;
	font-weight:bold;
	text-shadow:1px 1px 0px #333333;
}
.sendButton:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff1100), color-stop(1, #cccccc) );
	background:-moz-linear-gradient( center top, #ff1100 5%, #cccccc 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff1100', endColorstr='#cccccc');
	background-color:#ff1100;
}

.work {
	display:block;
	width:90%;
	border-radius:4px;
	background-color:#f4f4f4;
	color:#000;
	border:1px solid #5f5f5f;
	padding:5px;
    height: 200px;
}

footer
{
		margin: 0 auto;
		position:relative;
        width:auto;
		height: 25px;
        max-width:900px;
		background: #333333;
		text-align: center;

}
.bottomnav
{
		position:relative;
		

}	

.bottomnav ul
{		
		display: block;
		width: 500px;
		text-align: center;
		margin: 0 auto;
}

.bottomnav ul li
{
		display: inline-block;
		
}

/* MISC */
.arrow
{
        position:relative;
        display:block;
		width:auto;
        max-width:900px;
        margin:0 auto 10px auto; 
}
.clear
{
        clear:both;
}
.hidden
{
        position:absolute;
        clip: rect(1px 1px 1px 1px); /* IE6 & 7 */
        clip: rect(1px, 1px, 1px, 1px);
}



/* iphone(portrait and landscape) ----------- */
@media only screen and (max-device-width: 500px) {

.arrow
{
		width: 100%;
}

.container
{
       display:none;
}

/* Nav Menu */
header
{
        margin: 0 auto;
		position:relative;
        width: auto;
		height: auto;
        max-width:900px;
		background: #333333;
}

h1
{
		position:relative;
		width:auto;
        max-width:900px;
        margin:0px 0 10px auto; 
		text-align: center;
		padding: 10px 0 0 0;
}

h2
{
		font-size: 40px;
}
h3
{
        position:relative;
		width:auto;
        max-width:900px;
        margin:0 0 5px auto; 
		font-family: 'Open Sans', sans-serif;
		font-weight: 600;
		font-style: italic;
		font-size:18px;
		text-align: center;
		color: #666;
}
nav
{
        position:relative;
		text-align:center;
		padding: 0 0 10px 0;}

nav ul
{
        list-style:none;
}

nav ul li
{
        display:block;
        float:none;
        padding:3px 15px;
}
.bottomnav
{
		position:relative;
		display: none;
}	
}
/* ipad(portrait and landscape) ----------- */
@media only screen and (max-device-width: 768px) {



.arrow
{
		width: 80%;
}

h4
{
       
		width: auto;
		
}

h4.request
{
        margin: 10px 0 0 0;
		width: auto;
}
h5
{
		width: auto;
}
#home
{
       height:100%;
		
}

#home .column1
{
		display:block;
		float:none;
        width: auto;
		margin-left: 0;
		
}

#home .column2
{
		display:block;
		float: none;
		width: 100%;
		margin-right: 0;
}

#gallery
{
        padding:10px auto 0 auto;
}


.contact
{
		display:block;
		width: 100%;
		border: 0px;
		border-bottom: 5px solid #333;
        border-top: 2px solid #FF1100;
}
.social
{
		width: 100%;
		border: 0px;
		border-bottom: 5px solid #333;
        border-top: 2px solid #FF1100;
}
#joblist
{		
		display: block;
		width:auto;
        position:relative;
		margin:0 auto;
		max-width:800px;
		padding: 0 5px 0 20px;
		line-height:22px;
		font-size:14px;
        font-family: 'Open Sans', sans-serif;
        color:#333;
}
}