/**
@project        : Tony Patterson Sports Grounds
@url            :
@author         :
@author-info    :
@version        : 0.10

CHANGELOG:
**/

/*************************************************** BASE ITEMS **/


*{
margin:0;
padding:0;
behavior:url(iepngfix.htc);
}

body, html{
margin:0;
padding:0;
font:100% arial, verdana, sans-serif;
}

/**
 * LINE-HEIGHT
 *
 * Default line-height based on font-size rather than "computed-value"
 * @see: http://www.w3.org/TR/CSS21/visudet.html#line-height
 */
body * {line-height:1.7em;}

/**
 * HEAD
 */
h1, h2, h3, h4, h5{
margin:0;
padding:0;
font-family:arial, verdana, sans-serif;
}

h2{
margin:0 0 4px;
color:#F9E41F;
font:128% normal arial, verdana, sans-serif;
}

h3{
margin:0 0 15px;
color:#333;
font:152% normal arial, verdana, sans-serif;
}

/**
 * P
 *
 * Set the font size in % for a consistent change in size according to user settings
 */
p{
margin:0;
padding:0;
font-size:84.5%;
}

/**
 * A
 *
 */
a{
color:#000;
text-decoration:none;
}

a:hover{
}

/**
 * IMAGE
 *
 * Remove border from image, rollover border for image a tags
 */
img{border:0;}

/**
 * FORM ELEMENTS
 *
 * 99% for safari; 100% is too large
 */
select, input, textarea{font:99% sans-serif;}

/**
 * Bump up !IE to get to 13px equivalent
 */
pre, code{font:115% monospace;}

/**
 * HIDE
 */
.hide{
position: absolute;
left:-9999px;
}

/**
 * Clear floating elements
 */
.cleaner{
clear:both;
height:1px;
}

/*************************************************** POSITIONAL **/

.wrapper{
margin:0 auto;
width:790px;
}

/*************************************************** CONTENT **/

#content{
margin:60px 0;
}

/*************************************************** LINKS LIST **/

#links-list .footer, #gallery-list .footer{
clear:both;
}

#links-list{
font-size:84.5%;
}

#links-list ul{
width:33%;
float:left;
}


#links-list a:hover{
color:#FB1C00;
}

/*************************************************** IMAGES LIST **/

#gallery-list #videos, #gallery-list #images{
width:790px;
float:left;
}

#gallery-list #images{ float:right; }

#gallery-list li{
margin:0 10px 10px 0;
padding:0;
float:left;
border:5px solid #AAAAAA;
width:70px;
height:70px;
overflow:hidden;
}

#gallery-list li:hover{
border:5px solid #475429;
}

/*************************************************** GENERIC **/

.orange{ color:#FB1C00; }

.padded{ padding:20px; }

.divider{
width:500px;
height:3px;
background:#FFF url(../images/div.jpg) no-repeat 0 0;
}

#content .more-link a{
padding:0 0 2px 0;
border-bottom:1px dotted #475429;
}

#content .more-link a:hover{
padding:0 0 2px 0;
border-bottom:1px dotted #FB1C00;
}

#content .text-block-left{
margin:0 0 40px 0;
float:left;
width:470px;
}

#content .text-block-right{
margin:0 0 40px 0;
float:right;
width:470px;
}

#content .text-block-left p, #content .text-block-right p{
margin:0 0 20px 0;
}

#content .image-block{
margin:25px 0 20px 0;
width:465px;
color:#FB1C00;
font-size:13px;
}

#content .inner-page-navigation, #content .image-display-block{
width:224px;
float:left;
}

#content .inner-page-navigation .no-border{ border:0; }

#content .inner-page-navigation ul{
padding:5px 20px 10px;
list-style-type:none;
background:#FFFFB3;
}

#content .inner-page-navigation li{
border-bottom:1px dotted #4D7300;
}

#content .inner-page-navigation a{
padding:3px;
color:#4D7300;
text-decoration:none;
display:block;
font-size:16px;
}

#content .inner-page-navigation a:hover, #content .inner-page-navigation .selected, h5.selected{
color:#FB1C00;
}

#content .inner-page-navigation .top,
#content .inner-page-navigation .bottom{
width:224px;
height:15px;
background:#FFFFB3 url(../images/standard-menu-top.gif) no-repeat 0 0;
border:0;
}

#content .inner-page-navigation .bottom{
background:#FFF url(../images/standard-menu-bottom.gif) no-repeat 0 0;
}

/*************************************************** HOMEPAGE **/

#content ul{
margin:0;
padding:0;
list-style-type:none;
}

#content .home-navigation li, #content .block-link{
padding:0;
margin:0 0 60px 0;
float:left;
width:185px;
height:258px;
}

#content li#design{
margin-right:16px;
background:transparent url(../images/design_btn_home.jpg) no-repeat 0 0;
}

#content li#construction{
margin-right:18px;
background:transparent url(../images/construction_btn_home.jpg) no-repeat 0 0;
}

#content li#renovation{
margin-right:16px;
background:transparent url(../images/renovation_btn_home.jpg) no-repeat 0 0;
}

#content li#maintenance{
background:transparent url(../images/maintenance_btn_home.jpg) no-repeat 0 0;
}

#content #news{
clear:both;
color:#333;
background:#DBE3CC;
}

#content #news .news-item{
padding:10px 2px 20px;
}

#content #news p.date{
margin:0;
color:#333;
}

#content #news .news-item .content{
width:650px;
}

#content #news h4{
margin:0;
padding:0;
color:#FB1C00;
font-size:130%;
font-weight:normal;
}

#content #news h5{
margin:0;
padding:0;
font-size:100%;
font-weight:normal;
}

#content .more-link{
margin:10px 0 0 0;
text-align:right;
}

/*************************************************** DESIGN SERVICES & CONSULTANCY **/

#content .design-steps{
float:right;
width:216px;
height:230px;
background:transparent url(../images/design-service-steps.gif) no-repeat 0 5px;
}

#content .next-section-link{
text-align:center;
position:relative;
top:140px;
font-weight:bold;
}

#content .view-current-projects{
width:80px;
height:80px;
background:transparent url(../images/view-current-projects.png) no-repeat 0 0;
position:relative;
top:-30px;
left:150px;
}

#content .view-current-projects a{
width:80px;
height:80px;
display:block;
}

/*************************************************** PRODUCTS/STAFF (LIST) **/

#content .product, #content .staff-member{
clear:both;
display:block;
height:150px;
}

#content .product p,
#content .product h4{
margin:0;
padding:0;
}

#content .product p{
margin:0 0 30px 0;
padding:0;
}

#content .text{
width:360px;
float:right;
}

#content .product img{
width:100px;
height:100px;
float:left;
}

/*************************************************** STAFF **/

#content .staff-member{
margin-top:20px;
}

#content #company-information{
float:right;
width:240px;
background:#FFFFB3;
}

#content #company-information p{
margin:0 0 30px 0;
line-height:1.5em;
}

#content #company-information p.opening{
font-size:16px;
}

#content .staff-member img{
margin:0 20px 0 0;
width:130px;
height:130px;
float:left;
}

#content .staff-member .text{
width:320px;
float:right;
}

/*************************************************** CONSTRUCTION **/

#content .testimonial1{
margin:20px 0 0 0;
width:316px;
height:260px;
background:transparent url(../images/Testimonials01.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

#content .testimonial2{
margin:20px 0 0 0;
width:316px;
height:300px;
background:transparent url(../images/Testimonials02.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

#content .testimonial3{
margin:20px 0 0 0;
width:316px;
height:301px;
background:transparent url(../images/Testimonials03.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

#content .testimonial4{
margin:20px 0 0 0;
width:316px;
height:259px;
background:transparent url(../images/Testimonials04.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

#content .testimonial5{
margin:20px 0 0 0;
width:316px;
height:291px;
background:transparent url(../images/Testimonials05.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

#content .testimonial6{
margin:20px 0 0 0;
width:316px;
height:310px;
background:transparent url(../images/Testimonials06.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

#content .testimonial7{
margin:20px 0 0 0;
width:316px;
height:320px;
background:transparent url(../images/Testimonials07.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

/** **/

#content .testimonial8{
margin:20px 0 0 0;
width:316px;
height:310px;
background:transparent url(../images/Testimonials08.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

#content .testimonial9{
margin:20px 0 0 0;
width:316px;
height:320px;
background:transparent url(../images/Testimonials09.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

#content .testimonial10{
margin:20px 0 0 0;
width:316px;
height:420px;
background:transparent url(../images/Testimonials10.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

#content .testimonial11{
margin:20px 0 0 0;
width:316px;
height:320px;
background:transparent url(../images/Testimonials11.gif) no-repeat 0 0;
position:relative;
left:-27px;
}

/*************************************************** RENOVATION **/

#content .small-video{
margin:20px 0 0 0;
width:224px;
height:260px;
}

#content img.grid-item{
float:right;
}

#content p.grid-item {
float:left;
width:40%;
padding-right:10px;
}

#content .inner-content-block{
margin:30px 0 0 0;
}

#content .section-title{
clear:both;
}

/*************************************************** PROJECTS **/

#content .projects{
margin-bottom:50px;
float:left;
}

#content .project-info{
width:370px;
float:right;
}

#content .quote{
margin:0 0 50px 0;
}

#content .project-info p{
margin:10px 0 0 0;
}

#content .project-info .signature{
margin:0 0 60px 0;
font-size:17px;
font-weight:normal;
text-align:right;
}

#content .project-info h3{
color:#333;
font-size:26px;
font-weight:normal;
}

#content .project-info h4{
margin:10px 0 0 0;
color:#333;
font-size:16px;
font-weight:normal;
}

#content .projects ul{
list-style-type:none;
}

#content .projects li{
margin:0 0 20px 0;
width:380px;
height:90px;
background:transparent url(../images/project_out.gif) no-repeat 0 0;
}

#content .projects li img{
width:90px;
height:90px;
float:left;
}

#content .projects li{
display:block;
}

#content .projects a{
padding-top:25px;
padding-left:20px;
height:65px;
display:block;
font-size:20px;
color:#222;
line-height:1em;
}

#content .projects sup{
line-height:1em;
}

#content .projects .wrapper{
padding:20px 0 0 60px;
}

#content .projects a:hover{
background:#F9E41F;
}

#content .project-title{
height:28px;
padding:16px 0 0;
font-size:24px;
color:#222;
display:block;
letter-spacing:-0.5px;
}

/***** PHOTO VIEWER **/

#photo-viewer ul{
margin:5px 0 20px;
padding:0;
list-style-type:none;
width:370px;
}

#photo-viewer li{
display:inline;
}

#photo-viewer img, #photo-viewer a{
margin:0 2px 0 0;
font-size:13px;
font-weight:bold;
}

#photo-viewer img{
border:1px solid #DDD;
padding:4px;
}

#photo-viewer a{
padding-left:3px;
text-decoration:none;
color:#000;
}

#photo-viewer a br{
height:5px;
}

#photo-viewer a:hover, #photo-viewer .selected{
color:#FB1C00;
}


/*************************************************** FOOTER **/

#footer{
margin:0;
width:100%;
background:#475429 url(../images/m-section-bg.gif) repeat-x 0 0;
text-align:center;
font-size:84.5%;
}

#footer ul{
padding:0 0 20px;
list-style-type:none;
}

#footer li{
margin:0 4px;
display:inline;
}

#footer p{
padding:20px 0 0;
color:#FFF;
text-transform:uppercase;
}

#footer a{
color:#F9E41F;
text-decoration:none;
text-transform:uppercase;
font-size:92%;
}

#footer a:hover{
color:#FFF;
}