/*
Theme Name: Phoenix Ink Tattoo
Theme URI: http://jasonjohnsondesign.com/
Description: The custom design for Phoenix Ink Tattoo.
Version: 1.0
Author: Jason Johnson
Author URI: http://jasonjohnsondesign.com/
Tags: Tattoos, Ink
*/

/* Colors
#FCEE21 - Yellow
*/


/* --------------- Meyer Reset --------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

/* --------------- General Styles --------------- */

body {
    font-size: 75%;
    font-family: Times, Palatino, serif;
    line-height:1.4;
    background: #6d6e71;
}

p {
    margin-bottom: 1.4em;
}

a {
    color: #000;
}

a:hover {
    text-decoration:none;
}

strong {
    font-weight:bold;
}

#content ul {
    margin-bottom: 1.4em;
}

#content li {
    margin-left: 16px;
    list-style-type: disc;
    margin-bottom: .35em;
}


/* --------------- Layout Styles --------------- */

.post-edit-link {
    white-space: nowrap;
}

#page {
    width: 871px;
    margin: 0 auto;
    padding: 10px 20px;
}

#header {
    height:332px;
    margin-bottom:-15px;
}

#header h1 a {
    background: url(images/header.png) no-repeat left top;
    height:332px;
    display:block;
    text-indent: -999em;
}

#nav-photos {
    margin: 0 auto;
    width: 604px;
    height: 214px;
    position: relative;
}

#content {
    width: 544px;
    background: #d1d2d4;
    margin: 0 auto -20px auto;
    padding: 25px 30px 0 30px;
    overflow: hidden;
}

#footer {
    margin: 0 auto;
    width: 649px;
    height: 161px;
    padding-top: 100px;
    background: url(images/footer_bg.png) no-repeat left top;
}

#footer p {
    text-align:center;
    
}


/* --------------- Home page --------------- */

.homepage-content .post {
    width: 330px;
    float:left;
}

.news-box-container {
    background: url(images/news_box_bottom_bg.png) no-repeat left bottom #939598;
    padding-bottom: 15px;
    float:right;
    width: 187px;
}

.news-box {
    width: 157px;
    padding: 15px 15px 0 15px;
    background: url(images/news_box_top_bg.png) no-repeat 0 0 #939598;
    color: #fff;
    float:right;
}

.news-box h2 {
    font-size: 1.5em;
    margin-bottom: .5em;
    color: #373536;
}

.news-box h3 a {
    font-size: 1.167em;
    color: #fff;
    text-decoration:none;
}

.news-box h3 a:hover {
    color: #FCEE21;
    text-decoration:underline;
}

.home .entry {
    font-size: 1.167em;
}

/* --------------- Post Pages --------------- */
.post h2 {
    font-size: 1.75em;
    color: #373536;
}

#commentform textarea {
    width: 544px;
}

#respond h3, h3#comments {
    color: #373536;
    font-size: 1.5em;
}

.navigation {
	display: block;
	text-align: center;
	margin-bottom: 2.8em;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left;
	}

/* --------------- Navigation --------------- */

ul#nav {
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	margin:0 auto;
	width:604px;
	height: 38px;
	position:absolute;
	bottom: 17px;
	left:0;
	z-index:1000;
}

ul#nav li {
    display:inline;
}

ul#nav li a {
	background-image:url(images/nav_sprite.png);
	display:block;
	float:left;
	height:38px;
	text-indent:-9999px;
}

/* Home */
ul#nav li.page-item-2 a {
	background-position:0 0;
	width:107px;
}

/* Artists */
ul#nav li.page-item-7 a {
	background-position:-107px 0;
	width:114px;
}

/* Aftercare & Piercing */
ul#nav li.page-item-9 a {
	background-position:-221px 0;
	width:252px;
}

/* Contact */
ul#nav li.page-item-11 a {
	background-position:-473px 0;
	width:131px;
}

.page-id-2 ul#nav li.current_page_item a,
ul#nav li.page-item-2 a:hover, ul#nav li.page-item-2 a:focus {
    background-position:0 -38px;
}

.page-id-7 ul#nav li.current_page_item a,
ul#nav li.page-item-7 a:hover, ul#nav li.page-item-7 a:focus {
    background-position:-107px -38px;
}

.page-id-9 ul#nav li.current_page_item a,
ul#nav li.page-item-9 a:hover, ul#nav li.page-item-9 a:focus {
    background-position:-221px -38px;
}

.page-id-11 ul#nav li.current_page_item a,
ul#nav li.page-item-11 a:hover, ul#nav li.page-item-11 a:focus {
    background-position:-473px -38px;
}

a {
	outline-style:none;
	outline-width:medium;
}

/* --------------- Artists Page --------------- */
#post-7 .photo-group {
    float:left;
    position:relative;
    margin-bottom: 45px;
}

#post-7 .entry img {
    float:left;
    margin: 0 15px 0 0;
}

#post-7 .entry img.last {
    margin-right: 0;
}

#post-7 div.names {
    position:absolute;
    left:-30px;
    bottom:45px;
    height: 28px;
    width: 604px;
    background: #000;
    padding-top: 9px;
}

a.artist1 {
    display:block;
    height: 25px;
    width: 97px;
    background: url(images/names_on_black.png) no-repeat 0 0;
    text-indent: -999em;
    float:left;
    margin-left:68px;
}

a.artist2 {
    display:block;
    height: 25px;
    width: 168px;
    background: url(images/names_on_black.png) no-repeat 0 -100px;
    text-indent: -999em;
    float:left;
    margin-left:53px;
}

a.artist3 {
    display:block;
    height: 25px;
    width: 118px;
    background: url(images/names_on_black.png) no-repeat 0 -200px;
    text-indent: -999em;
    float:left;
    margin-left:42px;
}

a.artist1:hover {
    display:block;
    height: 25px;
    width: 97px;
    background: url(images/names_on_black.png) no-repeat 0 -300px;
    text-indent: -999em;
    float:left;
    margin-left:68px;
}

a.artist2:hover {
    display:block;
    height: 25px;
    width: 168px;
    background: url(images/names_on_black.png) no-repeat 0 -400px;
    text-indent: -999em;
    float:left;
    margin-left:53px;
}

a.artist3:hover {
    display:block;
    height: 25px;
    width: 118px;
    background: url(images/names_on_black.png) no-repeat 0 -500px;
    text-indent: -999em;
    float:left;
    margin-left:42px;
}

/* --------------- Gallery Page --------------- */
.artist-gallery-page .col1 {
    float:left;
    width: 220px;
}

.artist-gallery-page .artist-name-jay {
    background: url(images/names_on_black.png) 30px 11px no-repeat #000;
    width:277px;
    height:38px;
    margin: 27px 0 1.4em -30px;
    text-indent: -999em;
}

.artist-gallery-page .artist-name-robb {
    background: url(images/names_on_black.png) 30px -89px no-repeat #000;
    width:277px;
    height:38px;
    margin: 27px 0 1.4em -30px;
    text-indent: -999em;
}

.artist-gallery-page .artist-name-shannon {
    background: url(images/names_on_black.png) 30px -189px no-repeat #000;
    width:277px;
    height:38px;
    margin: 27px 0 1.4em -30px;
    text-indent: -999em;
}

.artist-gallery-page .col2 {
    float:right;
    width: 297px;
}

.artist-gallery-page .artist-pic {
    margin-bottom: 25px;
}

.artist-gallery-page ul.other-artists {
    float:right;
    width:297px;
}

#content .artist-gallery-page ul.other-artists li {
    list-style-type:none;
    margin:0;
    display:block;
    float:right;
    width: 297px;
}

.artist-gallery-page ul.other-artists li.robb a {
    background: url(images/artist_names_link.png) no-repeat 0 -100px;
    float:right;
    width: 186px;
    height: 40px;
    display:block;
    text-indent:-9999px;
}

.artist-gallery-page ul.other-artists li.robb a:hover {
    background: url(images/artist_names_link.png) no-repeat 0 -400px;
}

.artist-gallery-page ul.other-artists li.shannon a {
    background: url(images/artist_names_link.png) no-repeat 0 -200px;
    float:right;
    width: 139px;
    height: 40px;
    display:block;
    text-indent:-9999px;
}

.artist-gallery-page ul.other-artists li.shannon a:hover {
    background: url(images/artist_names_link.png) no-repeat 0 -500px;
}

.artist-gallery-page ul.other-artists li.jay a {
    background: url(images/artist_names_link.png) no-repeat 0 0;
    float:right;
    width: 118px;
    height: 40px;
    display:block;
    text-indent:-9999px;
}

.artist-gallery-page ul.other-artists li.jay a:hover {
    background: url(images/artist_names_link.png) no-repeat 0 -300px;
}

/* --------------- Contact Page --------------- */
.contact-info {
    float:left;
    width: 250px;
}

.google-maps {
    float:right;
    width: 260px;
}