html {
border: 0;
margin: 0 auto;
padding: 0;
background: #fff;
}
body {
border: 0;
margin: 0;
padding: 0;
font-family: "Times New Roman", Times, arial, helvetica, san-serif;
font-size: 1.0em;
color: #333;
line-height: normal;
}
form, fieldset { border: 0; margin: 0; padding: 0; }
a { text-decoration: none; margin: 0; padding: 0; outline: none; }
a:link, a:visited { color: #000; }
a:hover, a:active { color: #ff00de; text-decoration: none; }
a img { border: 0; margin: 0; }

/* ---- Typography ------ */
.bold, .company, span.price { font-weight: bold; }
.goddard { font-weight: bold; color: #79264b; }
.payne { font-weight: bold; color: #000; }
kbd { font-weight: bold; }

h1, h2, h3, h4, h5, h6 {
font-family: "Times New Roman", Times, arial, helvetica, san-serif;
margin: 0;
font-size: 0.9em;
font-weight: bold;
margin-bottom: 10px;
padding: 0;
text-transform: uppercase;
color: #151515;
}
input, textarea, em { font-family: "Times New Roman", Times, arial, helvetica, san-serif; }
ol, ul, pre, blockquote {
margin-top: 5px;
margin-bottom: 5px;
}
blockquote { font: 1.1em "Times New Roman", Times, arial, helvetica, san-serif; }

/* standard helper classes */

.hide, div#home h1 { display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;  /* for the benefit of IE5 Mac */ }
.alt { display: none; }

.clearing { clear: both; }
.float-left { position: relative; float: left; }
.float-right { position: relative; float: right; }

.clearfix:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */



#wrapper {
margin: 0 auto;
padding: 10px 0 0 0;
width: 990px;
position: relative;
min-height: 1px;
clear: both;
background: transparent;
}

#header {
width: 990px;
padding: 0;
position: relative;
float: left;
height: 240px;
background: url(img/ponytail-logo.png) center 35px no-repeat;
}

#pagebody {
width: 990px;
position: relative;
float: left;
clear: both;
padding-bottom: 20px;
border-top: 1px solid #2e2e2e;
border-bottom: 1px solid #2e2e2e;
}
#sidebar {
margin: 0;
width: 300px;
position: relative;
float: left;
padding: 0;
padding-top: 15px;
}
#sidebar p {
width: 300px;
}
#sidebar h2 {
clear: both;
padding-top: 10px;
padding-bottom: 22px;
padding-left: 10px;
font-weight: normal;
font-size: 1.0em;
text-transform: none;
}

#sidebar ul {
list-style-type: none;
padding: 0;
margin: 0;
}
#sidebar ul li {
float: left;
position: relative;
/* height: 275px; */
}
#sidebar ul li a span {

}
#sidebar ul li a:hover span {
display: inline;
font-weight: bold;
}

#sidebar div#cover-home {
padding-top: 12px;
clear: both;
}

#sidebar .video-box {
padding-top: 18px;
padding-bottom: 18px;
}

#sidebar .recent-entries h3 {
font-size: 1.0em;
padding-left: 10px;
padding-bottom: 16px;
}

#sidebar .recent-entries ul li {
font-size: 0.9em;
padding: 0 10px 6px 10px;
}

#sidebar div#social-icons {
height: 50px;
width: 280px;
background: url(/img/social-icons.png) no-repeat;
}
#sidebar div#social-icons h3, #sidebar div#social-icons a span {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}
#sidebar div#social-icons a#facebook-link, #sidebar div#social-icons a#twitter-link  {
float: right;
position: relative;
width: 52px;
height: 50px;
display: block;
background: transparent;
}
#sidebar div#social-icons a#facebook-link:hover {
background: url(/img/social-icons.png) -176px -62px no-repeat;
}
#sidebar div#social-icons a#twitter-link:hover {
background: url(/img/social-icons.png) -229px -62px no-repeat;
}


#maincontent {
margin: 0;
width: 690px;
min-height: 540px;
position: relative;
float: left;
padding: 0;
}

#viewer {
margin: 0;
padding: 0 100px 60px 100px;
text-align: center;
position: relative;
}
#footer {
position: relative;
float: left;
width: 990px;
padding: 10px 0 10px 0;
clear: both;
font-size: 0.8em;
}
#footer span {
padding: 0 10px 0 0;
color: #ccc;
}
#footer ul {
margin: 0;
padding: 0 10px 20px 0;
list-style-type: none;
}
#footer ul li {
margin: 0 0 5px 0;
padding: 0;
float: left;
position: relative;
padding: 0 15px 0 0;
}

#footer, #footer a {
color: #000;
}

#header div#logo a {
display: block;
height: 140px;
width: 980px;
float: left;
position: relative;
}
#header div#logo a span {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}

div#home h1, #issues h1, #stockists h1, #subscribe h1, #news h1, div#features h1, div#fashion h1 {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}

div#home {
padding-left: 10px;
}

div#maincontent div#flashbox {
position: relative;
width: 680px;
height: 525px;
display: block;
padding: 0;
margin: 0;
}



/* -- Magazine navigation -- */

#navbar2 img {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}

div#navbar2 {
height: 120px;
width: 990px; 
}

ul#nav2 {
margin: 0;
padding: 30px 0 20px 0;
list-style-type: none;
position: relative;
float: left;
}

ul#nav2 span {
height: 0;
width: 0;
overflow: hidden;
position: absolute;  /* for the benefit of IE5 Mac */
}

ul#nav2 li { 
position: relative;
float: left;
padding: 0;
text-transform: uppercase;
font-size: 0.8em;
}

ul#nav2 li a { display: block; text-decoration: none; position: relative;  }

ul#nav2 li.skipnav {
width: 40px;
height: 30px;
}

a#nav2_home { background: url(/img/navbar.png) 0 0 no-repeat; width: 75px; height: 30px; }
a#nav2_blog { background: url(/img/navbar.png) -75px 0 no-repeat; width: 116px; height: 30px; }
a#nav2_issues { background: url(/img/navbar.png) -191px 0 no-repeat; width: 127px; height: 30px; }
a#nav2_fashion { background: url(/img/navbar.png) -318px 0 no-repeat; width: 135px; height: 30px; }
a#nav2_features { background: url(/img/navbar.png) -453px 0 no-repeat; width: 144px; height: 30px; }
a#nav2_subscribe { background: url(/img/navbar.png) -597px 0 no-repeat; width: 174px; height: 30px; }
a#nav2_stockists { background: url(/img/navbar.png) -772px 0 no-repeat; width: 141px; height: 30px; }


a#nav2_home:hover { background-position: 0 -48px; }
a#nav2_blog:hover { background-position: -75px -48px; }
a#nav2_issues:hover { background-position: -191px -48px; }
a#nav2_fashion:hover { background-position: -318px -48px; }
a#nav2_features:hover { background-position: -453px -48px; }
a#nav2_subscribe:hover { background-position: -597px -48px; }
a#nav2_stockists:hover { background-position: -772px -48px; }

a#nav2_home.selected { background-position: 0 -96px; }
a#nav2_blog.selected { background-position: -75px -96px; }
a#nav2_issues.selected { background-position: -191px -96px; }
a#nav2_fashion.selected { background-position: -318px -96px; }
a#nav2_features.selected { background-position: -453px -96px; }
a#nav2_subscribe.selected { background-position: -597px -96px; }
a#nav2_stockists.selected { background-position: -772px -96px; }




li.show {
text-indent: 0;
}
a.show {
color: #000;
font-size: 1.0em;
text-indent: 0;
height: 20px;
width: 200px;
display: inline;
}
ul#nav2 li a span {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}

/* -- Issue Box -- */

div.issue-title {
width: 990px;
position: relative;
clear: both;
}
div#features div.issue-1, div#fashion div.issue-1 {
background: url(/img/issue-1.gif) 0 24px no-repeat;
height: 50px;
}
div#features div.issue-2, div#fashion div.issue-2 {
background: url(/img/issue-2.gif) 0 24px no-repeat;
height: 50px;
}
div#features div.issue-3, div#fashion div.issue-3 {
background: url(/img/issue-3.gif) 0 24px no-repeat;
height: 50px;
}
div#features div.issue-4, div#fashion div.issue-4 {
background: url(/img/issue-4.gif) 0 24px no-repeat;
height: 50px;
}
div#features div.issue-5, div#fashion div.issue-5 {
background: url(/img/issue-5.gif) 0 24px no-repeat;
height: 50px;
}
div#features div.issue-6, div#fashion div.issue-6 {
background: url(/img/issue-6.gif) 0 24px no-repeat;
height: 50px;
}

div.issue-title span {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}
div.issue-1, div.issue-2, div.issue-3, div.issue-4, div.issue-5, div.issue-6 {
width: 150px;
height: 18px;
display: block;
}
div.issue-1 {
background: url(/img/issue-1.gif) 0 -2px no-repeat;
}
div.issue-2 {
background: url(/img/issue-2.gif)  0 -2px no-repeat;
}
div.issue-3 {
background: url(/img/issue-3.gif)  0 -2px no-repeat;
}
div.issue-4 {
background: url(/img/issue-4.gif)  0 -2px no-repeat;
}
div.issue-5 {
background: url(/img/issue-5.gif)  0 -2px no-repeat;
}
div.issue-6 {
background: url(/img/issue-6.gif)  0 -2px no-repeat;
}

/* -- Cover Box Homepage -- */

div#sidebar a.home-cover { border: 1px solid #707070; float: left; position: relative; }

div#sidebar a.home-cover:hover {
border: 1px solid #ff00de;
}

div#sidebar a.home-cover img {
border: 1px solid #fff;
display: block;
}


.cover-box {
float: left;
position: relative;
width: 300px;
padding-top: 60px;
}

.cover-box a {
width: 300px;
height: 400px;
display: block;
background: url(/img/issue1-cover-300x400.jpg) no-repeat;
margin-bottom: 40px;
}
.cover-box a span {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}

/* -- Product List Box -- */

div#products {
clear: both;
float: left;
position: relative;
width: 990px;
padding: 30px 0 20px 0;
}

div.product-list-box {
width: 324px;
float: left;
position: relative;
}
div.product-list-box img {
float: left;
position: relative;
margin: 0 20px 20px 0;
}
div.product-list-box form {
float: left;
position: relative;
width: 130px;
}
div.product-list-box h2 {
float: left;
position: relative;
width: 130px;
}

/* -- Issues Box Homepage -- */

#issues {
padding-top: 23px;
clear: both;
}

#issues ul {
width: 300px;
height: 80px;
display: block;
padding: 0;
margin: 0;
list-style-type: none;
background: url(/img/issues-back.gif) no-repeat;
}
#issues ul li {
float: left;
position: relative;
}
#issues ul li a { display: block; text-decoration: none; position: relative;  }

a#issue1 { height: 80px; width: 32px;  }
a#issue2 { height: 80px; width: 41px;  }
a#issue3 { height: 80px; width: 41px;  }
a#issue4 { height: 80px; width: 41px;  }
a#issue5 { height: 80px; width: 41px;  }
a#issue6 { height: 80px; width: 41px;  }

a#issue1:hover, a#issue1.selected { background: url(/img/issue1-over.gif) no-repeat; }
a#issue2:hover, a#issue2.selected { background: url(/img/issue2-over.gif) no-repeat; }
a#issue3:hover, a#issue3.selected { background: url(/img/issue2-over.gif) no-repeat; }
a#issue4:hover, a#issue4.selected { background: url(/img/issue2-over.gif) no-repeat; }

#issues li a span {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}

/* ----- This Issue Box --- */

#sidebar div.this-issue {
width: 300px;
height: 32px;
background: url(/img/this-issue-back.gif) no-repeat;
}
#sidebar div.this-issue span {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}


/* ----- Sections -- */

div#fashion, div#features {
padding-top: 35px;
clear: both;
float: left;
position: relative;
width: 990px;
}


div#issues h2 {
padding: 10px 0;
color: #999;
font-weight: normal;
font-size: 0.8em;
clear: both;
}


/* ----- Next page --- */

div#next-prev {
float: left;
position: relative;
width: 990px;
height: 30px;
padding-top: 10px;
}
div#next-prev a {
float: right;
position: relative;
width: 35px;
height: 20px;
background: url(/img/next.gif) no-repeat;
display: block;
}
div#next-prev a:hover {
background-position: 0 -37px;
}
div#next-prev span {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}



/* ----- Articles navigation --- */

div.articles-nav {
width: 315px;
float: left;
position: relative;
}
div.articles-nav h1 {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}

div.articles-nav ul {
width: 300px;
padding: 0;
margin: 0;
list-style-type: none;
padding-bottom: 180px;
}
div.articles-nav ul li {
font-size: 1.1em;
}
div.articles-nav ul li.highlight a {
color: #ff00de;
font-weight: normal;
}

a.highlight {
color: #ff00de;
font-weight: bold;
}
div.article-credits {
font-size: 0.9em;
color: #222;
}
div.article-credits h3 {
font-weight: bold;
font-size: 0.9em;
padding: 0;
margin: 0;
color: #222;
}


/* Homepage sections list ------ */
#fashion-list, #features-list {
float: left;
position: relative;
width: 700px;
margin-bottom: 20px;
clear: both;
}


/* #fashion-list h2, #features-list h2 {
width: 300px;
height: 30px;
position: absolute;
top: 0;
left: -300px;
padding: 0;
margin: 0;
}
#fashion-list h2 {
background: url(/img/features.gif) right top no-repeat;
}
#features-list h2{
background: url(/img/fashion.gif) right top no-repeat;
} */
#fashion-list h2 span, #features-list h2 span {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}


/* Articles list --------- */


div.image-list-box {
width: 330px;
height: 230px;
float: left;
position: relative;
}
div.image-list-box a {
float: left;
position: relative;
border: 1px solid #707070;
}
div.image-list-box a img {
border: 4px solid #fff;
display: block;
}
div.image-list-box a:hover {
border: 1px solid #ff00de;
}
#fashion div.image-list-box h2, #features div.image-list-box h2 {
display: none; margin: 0; height: 0; width: 0; overflow: hidden; position: absolute;
}


/* Covers list --------- */


div.cover-list-box {
width: 330px;
height: 450px;
float: left;
position: relative;
}
div.cover-list-box a {
float: left;
position: relative;
border: 1px solid #707070;
}
div.cover-list-box a img {
border: 4px solid #fff;
display: block;
}
div.cover-list-box h2 {
text-align: center;
color: #000;
}


/*  Columns -------- */

div.column1 {
width: 324px;
float: left;
position: relative;
padding-top: 30px;
}
div.column2 {
width: 324px;
float: left;
position: relative;
padding-top: 30px;
}
div.column3 {
width: 324px;
float: left;
position: relative;
padding-top: 30px;
}

div.column1 h2, div.column2 h2, div.column3 h2 {
padding-left: 0;
}

div.column1 ul, div.column2 ul, div.column3 ul {
padding-bottom: 15px;
padding-left: 0;
margin: 0;
list-style-type: none;
font-size: 0.8em;
}


div.column1 p, div.column2 p, div.column3 p {
font-size: 0.8em;
padding-right: 30px;
}

#stockists div.column1 ul li, #stockists div.column2 ul li, #stockists div.column3 ul li {
padding-bottom: 15px;
} 


/* ----- Article Titles Issue 1 --- */



div.entry {
width: 675px;
float: left;
position: relative;
}

div#home div.entry {
width: 700px;
}

div.entry div.image-box {
width: 340px;
float: left;
position: relative;
}
div.entry div.image-box-small {
width: 225px;
float: left;
position: relative;
}
div#home div.entry div.image-box {
padding-top: 10px;
height: 230px;
}
div#home div.entry div.image-list-box {
padding-bottom: 10px;
width: 230px;
height: 180px;
}
div#home div.entry div.image-list-box img {
width: 210px;
}
div#home div.entry div.image-list-box h2 {
font-size: 0.9em;
padding: 6px 0 6px 15px;
text-align: left;
text-transform: none;
font-weight: normal;
clear: both;
}

div.entry div.image-box-large {
float: left;
position: relative;
}

div.entry div.article-box, div.entry div.article-box1 {
float: left;
position: relative;
width: 330px;
color: #222;
}

div.entry div.article-box1 {
width: 360px;
}
div.entry div.article-box ul, div.entry div.article-box1 ul {
padding: 0;
padding-bottom: 15px;
margin: 0;
list-style-type: none;
font-size: 0.8em;
}

div.entry div.image-box p, div.entry div.image-box-large p, div.entry div.image-box-small p, div.entry div.article-box p, div.entry div.article-box1 p {
color: #222;
font-size: 0.8em;
width: 325px;
}
div.entry div.image-box-large p {
padding-left: 345px;
}
div.entry div.first {
padding-left: 0;
}






/* ----- Image Viewer --- */

#framebox {
margin-left: 30px;
text-align: center;
}
#framebox h2 {
text-align: center;
font-weight: normal;
font-size: 0.9em;
}
#frame {
background: #fff;
padding: 0;
text-align: left;
position: relative;
height: 540px;
}
#frame img {
border: 0;
margin: 0;
display: block;
}
div#frame h2 {
display: block;
margin: 0;
border: 0;
padding-right: 30px;
position: relative;
}

div#frame img#selected-image {
position: relative;
top: 0;
left: 0;
}
div#viewer div#framebox div#frame {
text-align: center;
margin: 0 auto;
position: relative;
height: 800px;
}
div#viewer div#framebox div#frame img {
border: 0;
margin: 0 auto;
display: block;
position: relative;
}

#prevpic {
float: left;
position: absolute;
left: 0;
width: 150px;
background: transparent;
z-index: 9;
}
#prevpic a {
position: absolute;
float: left;
left: -25px;
display: block;
width: 150px;
height: 540px;
z-index: 10;
background: url(img/left-grey.gif) no-repeat;
}
#nextpic {
float: right;
position: absolute;
right: 0;
width: 150px;
background: transparent;
z-index: 9;
}
#nextpic a {
position: absolute;
float: right;
right: 0;
display: block;
width: 150px;
height: 540px;
z-index: 10;
background: url(img/right-grey.gif) top right no-repeat;
}
#prevpic a:hover {
display: block;
background: url(img/left.gif) no-repeat;
}
#nextpic a:hover {
display: block;
background: url(img/right.gif) top right no-repeat;
}
a#expander {
display: block;
z-index: 8;
position: relative;
}
