/* @group common stuff and main structure */
body, html, ol, ul, li, dl, dt, dd, form, h1, h2 , h3, h4, h5, p {margin: 0; padding: 0;}
ul, li, ul li {list-style-type: none;}     


body {background: #000 url(/images/backgrounds/body_back.jpg) repeat-y 50% 1200px; font: 100.1%  "Lucida Grande", Lucida, Verdana, sans-serif; text-align: center;}

a:link, a:visited {color: #235E85; text-decoration: none;}
a:hover {color: #2973A5; text-decoration: underline;}

#outer_container {background: url(/images/backgrounds/container_back.jpg) no-repeat 50% 0;}
#main_container {min-height: 1400px; height: auto !important; height: 1400px; margin: 0 auto; padding-bottom: 80px; position: relative; width: 990px;}
#header {background: url(/images/backgrounds/main_photo-1.jpg) no-repeat 375px 0; height: 370px; position: relative; width: 100%;}
#header ul {position: absolute; left: 760px; text-align: left; top: 10px; font: 1.1em "Trebuchet MS", Verdana, Arial;}
#header ul li {margin: 0 0 3px;}
#header ul a:link, #header ul a:visited {background: url(/images/buttons/links_flower.png) no-repeat -200px 50%; color: #fff; display: block; padding: 2px 0 0 30px;}
#header ul a:hover {background-position: 0 50%; text-decoration: none;}

#main_content {margin-left: 120px; text-align: left; width: 750px;}

body#gigs #header a#gigs_link, body#biog #header a#biog_link, body#music #header a#music_link, body#photos #header a#photos_link, body#paintings #header a#paintings_link, body#links #header a#links_link, body#contact #header a#contact_link, body#guestbook #header a#guestbook_link, body#guestbook_add #header a#guestbook_link, body#diary #header a#diary_link, body#shop a#shop_link {background-position: 0 50%; color: #fff;}

.side_content {position: absolute; right: 55px; top: 350px; width: 150px;}
.cols {width: 50%;}
.col1 {float: left;}
.col2 {float: right;}

/* mailing list form */
#contact_form {background: url(/images/backgrounds/join_the_mailing_list.png) no-repeat 20px 0; left: 85px; padding: 15px 0 0; position: absolute; top: 90px; width: 240px;}
#contact_form h2 {font-size: 0.9em; margin: 0; text-align: center; text-transform: capitalize;}
#contact_form .form_row {padding: 6px 18px; text-align: left;}
#contact_form label {color: #463E2C; display: block; font: 0.7em "Trebuchet MS", Verdana, Arial; letter-spacing: 1px; line-height: 0.9em; padding: 0; text-align: left; text-transform: capitalize;}
#contact_form .form_row input {background: url(/images/backgrounds/paper.jpg) repeat 0 0; border: 1px solid #D3B99D; -moz-border-radius: 10px; -webkit-border-radius: 10px; height: 16px; padding: 2px 4px; width: 190px;}
#contact_form .form_row_button {margin: 0; padding: 0; text-align: right;}
#contact_form .form_row_button input {margin: 0;}

body#contact #main_content .msg_box h2 {color: #CCC6C1; margin: 0.5em 0 0.2em; text-align: center;}
#main_content .msg_box {background: #333; border: 1px solid #E9E3DE; -moz-border-radius: 10px; -webkit-border-radius: 10px; opacity: 0.7; padding: 10px;}
#main_content .msg_box p {color: #CCC6C1; text-align: center; font: 0.9em Tahoma, Arial, Helvetica, Geneva, sans-serif; letter-spacing: 1px;}
#main_content .msg_box ul {margin: 1em 0;}
#main_content .msg_box ul li {color: #fff; margin: 5px 0; text-align: center; font: 1em Tahoma, Arial, Helvetica, Geneva, sans-serif;}

#footer_links {background: url(/images/backgrounds/footer_back.png) no-repeat 50% 20px; bottom: 0; clear: both; font-size: 0.7em; left: 0; letter-spacing: 1px; padding: 40px 0 20px; position: absolute; text-align: center; text-transform: uppercase; width: 990px;}
/* @end */


/* @group text */
h1 {font: bold 2.3em "Trebuchet MS", Verdana, Arial; left: 70px; line-height: 0.8em; position: absolute; top: 20px; text-align: right;}
#main_content p {color: #343B3F; font-size: 0.8em; line-height: 1.5em; margin: 0 0 1em;}
h2, body#contact #main_content h3 {color: #4B361F; font: 1.1em "Trebuchet MS", Verdana, Arial; letter-spacing: 1px; margin: 3em 0 1em; text-transform: uppercase;}
h2 span {font-size: 0.8em; text-transform: capitalize;}
#header h1 a:link, #header h1 a:visited {color: #333;}
#header h1 a:hover {color: #2973A5; text-decoration: none;}
#header h2#page_title {color: #494949; display: block; text-transform: uppercase; font-size: 1.1em; letter-spacing: 1px; margin: 0; position: absolute; right: 50px; text-align: right; top: 320px;}
/* @end */

/* @group page specific styles */
/* welcome page */
body#welcome, body#welcome #outer_container {background: #000; text-align: center;}
body#welcome #main_content {text-align: center;}
a#welcome_image {background: url(/images/backgrounds/front-lace.jpg) no-repeat 50% 0; display: block; margin: 20px auto 30px; padding: 340px 0 10px; width: 500px;}
body#welcome #main_content {color: #fff;}
body#welcome #main_content h2 {margin: 20px 0 0;}
body#welcome #main_content p {margin: 0;}
body#welcome #main_content h2 {color: #9E8871;}
body#welcome #main_content p {color: #d4d4d4;}


/* gigs */
body#gigs h3 {clear: left; color: #494949; float: left; font-size: 0.8em; margin: 0; width: 135px;}
body#gigs #main_content p {font-size: 0.8em; margin: 0 20px 2em 150px; text-align: left;}
body#gigs h2 {clear: both;}

/* biog */
ul.discography {font-size: 0.8em; margin: 0 0 1em 40px;}
ul.discography li {list-style-type: none; margin-bottom: 5px;}
ul.discography li em {color: #4B361F; font-style: normal;}

/* music */
.music_player {float: right; margin: 0 10px 10px 0; width: 160px;}
.music_heading {float: left; margin: 10px 10px 0 140px; width: 370px;}
#main_content .music_heading p {font-size: 0.9em; line-height: 1.6em;}
.albumcover {clear: both; display: block; min-height: 140px; height: auto !important; height: 140px; padding-left: 140px;}
/*.albumcover p, .albumcover ol {font-size: 0.8em;}*/
/*.albumcover ol {color: #343B3F; margin: 0 0 10px;}
.albumcover ol li {margin: 2px 0;}*/
.lucyandthewolves {background: url(/images/album_covers/lucyandthewolves_front_smaller.jpg) no-repeat 0 0;}
/*#main_content .lucyandthewolves p {margin-bottom: 0;}*/
.tillireachthesea {background: url(/images/album_covers/reachthesea_front_smaller.jpg) no-repeat 0 0;}
.milkmaidsandarchitects {background: url(/images/album_covers/milkmaids_front_smaller.jpg) 0 0 no-repeat;}
.bimbling {background: url(/images/album_covers/bimbling_smaller.jpg) 0 0 no-repeat;}
.rolling {background: url(/images/album_covers/rollingcover.jpg) 0 0 no-repeat;}
.real {background: url(/images/album_covers/real_cover.jpg) 0 0 no-repeat;}
.view_cart {clear: right;}

/* shop */
.shop_heading .view_cart {float: right;}
body#shop .albumcover p strong {display: block;}

/* photos */
ul#gallery {margin: 1em 20px; overflow: hidden;}
ul#gallery li {float: left; min-height: 165px; height: auto !important; height: 165px; margin: 15px 10px;}
ul#gallery li a {display: block;}
ul#gallery li a img {border: 3px solid #fafafa;}

/* links */
body#links #main_content ul, body#links p {font-size: 0.8em; margin-left: 140px;}
body#links #main_content ul li {margin: 0 0 0.5em;}

/* contact */
body#contact #main_content h2, body#contact #main_content h3 {margin-bottom: 0;}
body#contact #main_content p {margin-left: 20px;}
body#contact #main_contact a {display: block;}

/* guestbook */
.guestbook_form h2 {margin-top: 0;}
.guestbook_entry {background: url(/images/backgrounds/paper.jpg) repeat 0 0; border: 1px solid #4B361F; -moz-border-radius: 10px;
-webkit-border-radius: 10px; overflow: hidden; padding: 10px;}
.guestbook_entry span {display: block;}
.guestbook_entry span em {font-size: 0.7em; font-style: normal;}
body#guestbook #main_content .guestbook_entry {margin: 1em 40px;}
body#guestbook .user_details {clear: left; color: #494949; float: left; font-size: 0.8em; margin: 0; width: 135px;}
body#guestbook #main_content .guestbook_entry p {float: right; width: 500px;}


.guestbook_form {margin-left: 40px;}
.form_row_submit {text-align: left; margin-top: 1em;}
body#guestbook_add .guestbook_form h2 {font-size: 1.1em; font-weight: normal; letter-spacing: 2px; line-height: 1.2em;}

#main_content label {display: block; font-size: 0.7em; line-height: 1.5em;}
#main_content label span {font-size: 0.8em;}
#main_content div.form_row, #main_content div.form_row_textarea {padding: 7px 0;}
#main_content div.form_row label, #main_content div.form_row_textarea label {color: #4B361F; display: block; width: 420px; letter-spacing: 1px; padding-right: 4px; font: bold 0.8em "Trebuchet MS", Verdana, Arial;} 
#main_content div.form_row_button {text-align: right; width: 244px;}
#main_content .form_row input, #main_content .form_row_textarea textarea, #main_content .form_row textarea {background: #fff; border: 2px solid #4B361F;} 
#main_content div.form_row input {-moz-border-radius: 10px; -webkit-border-radius: 10px; font-size: 1em; padding: 3px; width: 380px;}
#main_content div.form_row textarea {-moz-border-radius: 10px; -webkit-border-radius: 10px; font-size: 1em; height: 180px; padding: 3px; width: 380px;}
.date_of_birth_container {visibility: hidden;}
.date_of_birth_container input {background: #e8ebf1; border: 1px solid #e8ebf1;}
.date_of_birth_container label {color: #e8ebf1; font-size: 0.7em;}

body#guestbook_add .errors ul {font-size: 0.9em; letter-spacing: 1px;}

body#guestbook .old_guestbook {font-size: 0.8em;}
body#guestbook .old_guestbook p {font-size: 1em; margin: 1em 0 0; line-height: 1.3em;}


/* diary */
/*#diary .post {background: url(/images/backgrounds/paper.jpg) repeat 0 0; border: 1px solid #4B361F; -moz-border-radius: 10px;
-webkit-border-radius: 10px; margin: 1em 40px; overflow: hidden; padding: 10px;}
#diary .post_left {clear: left; color: #494949; display: block; float: left; font-size: 0.7em; margin: 0; width: 135px;}
#diary #main_content .post p {float: right; width: 500px;}*/



/* @end */

/* @group tour and new album pages */
body#tour, body#milkmaids_architects {text-align: center; margin: 0px; padding: 0px; vertical-align : middle;}
body#tour #mainbox, body#milkmaids_architects #mainbox {width: 750px; margin-right: auto; margin-left: auto; position: relative; top: 0px; z-index: 1; text-align: center; min-height: 1000px;}
body#tour #mainbox {background: url(../images/back_tour.jpg) 0 0 no-repeat;}
body#milkmaids_architects #mainbox {background: url(../images/back_milkmaids.jpg) 0 0 no-repeat;}
body#tour #tour_dates {position: absolute; left: 175px; top: 330px; width: 400px; background: #fffcf3; color: #333; border-bottom: 2px solid #333; border-right: 2px solid #333; font-family: 'Lucida Grande', 'Trebuchet MS', Verdana, Arial, Sans-Serif; font-size: 0.8em; line-height: 1.5em;}
body#milkmaids_architects #album_info {position: absolute; left: 120px; top: 250px; width: 230px; background: #fffcf3; color: #333; border-top: 2px solid #333; border-left: 2px solid #333; border-right: 1px solid #fff; border-bottom: 1px solid #fff; font-family: 'Lucida Grande', 'Trebuchet MS', Verdana, Arial, Sans-Serif; font-size: 0.8em; line-height: 1.5em;}

body#milkmaids_architects #album_info p {margin-left: 5px; margin-right: 5px;}
body#tour #mainlinksbox, body#milkmaids_architects #mainlinksbox {position: absolute; top: 300px; text-align: left; overflow: auto; left: 5px; width: 115px; height: 486px; font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 12px; z-index: 3;}

body#tour #mainlinksbox a:link, body#tour #mainlinksbox a:visited, body#milkmaids_architects #mainlinksbox a:link, body#milkmaids_architects #mainlinksbox a:visited {color: #666666; text-decoration: none;}
body#tour #mainlinksbox a:active, body#milkmaids_architects #mainlinksbox a:active {color: #666666; text-decoration: none;}
body#tour #mainlinksbox a:hover, body#milkmaids_architects #mainlinksbox a:hover {color: #cc0000; text-decoration: underline;}

body#tour div#tour_dates a, body#milkmaids_architects #album_info a {color: #000; text-decoration: none; font-weight: bolder;}
body#tour div#tour_dates a:link, body#tour div#tour_dates a:visited, body#milkmaids_architects #album_info a:link, body#milkmaids_architects #album_info a:visited {color: #000; text-decoration: none; font-weight: bolder;}
body#tour div#tour_dates a:hover, body#milkmaids_architects #album_info a:hover {color: #000; text-decoration: underline; font-weight: bolder;}
body#tour div#tour_dates a:active, body#milkmaids_architects #album_info a:active {color: #000; text-decoration: none; font-weight: bolder;}


/* @end */


@media screen and (max-device-width: 480px){
/*--- iPhone only CSS here ---*/
#outer_container {background-image: url(/images/backgrounds/container_back-ios.jpg)}
}

@media screen and (max-device-width: 1024px){
/*--- iPad only CSS here ---*/
#outer_container {background-image: url(/images/backgrounds/container_back-ios.jpg)}
}