/* SHREWSBURY INTERNATIONAL CARTOON FESTIVAL CSS DOCUMENT */

/* COLOURS */
/* RED :: #E21D2D */

/** GLOBAL **/

* {
	margin: 0;
	padding: 0;
}

body {
	font: 14px/16px "Comic Sans MS", Geneva, Arial, Helvetica, sans-serif;
	background: #E21D2D;
}

/** CONTAINER **/

#container {
	position: absolute;
	width: 820px;
	left: 50%;
	margin-left: -410px;
	background: url(../images/borders.jpg) repeat-y top left;
}

/** HEAD **/

#head {
	background: url(../images/header.jpg) top left;
	width: 800px;
	height: 390px;
	margin-left: 10px;
}

#head h1 {
	display: none;
}

/** SIDEBAR **/

#sidebar {
	float: left;
	width: 180px;
	height: 650px;
	margin-left: 10px;
}

#sidebar ul {
	list-style: none;
	margin-left: 30px;
	margin-top: 50px;
	text-indent: -5000px;
}

#sidebar ul li {
	width: 115px;
	height: 63px;
	display: block;
}

#sidebar li a {
	width: 115px;
	height: 63px;
	display: block;
}

#sidebar img {
	position: absolute;
	left: 35px;
	bottom: 35px;
	border: 0px;
}

#homebtn {
	background: url(../images/homebtn.jpg) no-repeat top center;
}

#eventsbtn {
	background: url(../images/eventsbtn.jpg) no-repeat top center;
}

#picsbtn {
	background: url(../images/picsbtn.jpg) no-repeat top center;
}

#roomsbtn {
	background: url(../images/roomsbtn.jpg) no-repeat top center;
}

#mapbtn {
	background: url(../images/mapbtn.jpg) no-repeat top center;
}

#linksbtn {
	background: url(../images/linksbtn.jpg)  no-repeat top center;
}

#contactsbtn {
	background: url(../images/contactsbtn.jpg) no-repeat top center;
}

#flashbtn {
	background: url(../images/flashbtn.jpg) no-repeat top center;
}

/** CONTENT **/

#content {
	float: left;
	clear: right;
	width: 600px;
	margin-right: 10px;
	margin-top: 30px;
	border-left: #E21D2D 2px solid;
	padding-bottom: 50px;
	min-height:600px;
	height:auto !important;
	height:525px;
}

#content img {
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 15px;
}

#content p {
	margin-left: 25px;
	margin-right: 25px;
	margin-top: 10px;
}

#content ul {
	margin-left: 45px;
	margin-right: 25px;
	margin-top: 10px;
	list-style: none;
}

#content li a{
	color: #E21D2D;
	text-decoration: none;
}

#content li a:hover{
	text-decoration: underline;
}

#top {
	position: absolute;
	bottom: 50px;
	left: 500px;
	font-size: 12px;
	font-weight: bold;
	color: #000;
	text-decoration: none;
	background: url(../images/top.jpg) no-repeat top right;
	padding-top: 20px;
	display: block;
	width: 16px;
}

#top:hover {
	color: #E21D2D;
}

img#photo {
	border: #E21D2D 2px solid;
	margin-left: 80px;
	margin-top: 40px;
}

img#pic {
	margin-left: 80px;
	margin-top: 20px;
}

#content a {
	color: #E21D2D;
	text-decoration: none;
}

#content a:hover {
	color: #E21D2D;
	text-decoration: underline;
}
/** PAGE HEADERS **/

#headhome {
	background: url(../images/home.jpg) no-repeat top center;
	text-indent: -5000px;
	width: 71px;
	height: 38px;
	margin-left: 25px;
}

#headevents {
	background: url(../images/events.jpg) no-repeat top center;
	text-indent: -5000px;
	width: 105px;
	height: 38px;
	margin-left: 25px;
}

#headpics {
	background: url(../images/pics.jpg) no-repeat top center;
	text-indent: -5000px;
	width: 77px;
	height: 38px;
	margin-left: 25px;
}

#headrooms {
	background: url(../images/rooms.jpg) no-repeat top center;
	text-indent: -5000px;
	width: 93px;
	height: 38px;
	margin-left: 25px;
}

#headmap {
	background: url(../images/maps.jpg) no-repeat top center;
	text-indent: -5000px;
	width: 79px;
	height: 38px;
	margin-left: 25px;
}

#headlinks {
	background: url(../images/links.jpg) no-repeat top center;
	text-indent: -5000px;
	width: 93px;
	height: 38px;
	margin-left: 25px;
}

#headcontacts {
	background: url(../images/contacts.jpg) no-repeat top center;
	text-indent: -5000px;
	width: 98px;
	height: 38px;
	margin-left: 25px;
}

#headcatalogue {
	background: url(../images/catalogue.jpg) no-repeat top center;
	text-indent: -5000px;
	width: 109px;
	height: 48px;
	margin-left: 25px;
}

/** DATA LISTINGS **/

.listing:after {
	content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.listing, .gethere {
	position: relative;
	width: 580px;
	background: #FFF;
	margin: 20px 0 0 5px;
	padding: 10px 10px 0 10px !important;
	padding: 10px 10px 0 20px;
	font-size: 10px;
	border: #E21D2D 2px solid;
}

.gethere {
	font-size: 12px;
}

.gethere h4, caption {
	margin-top: 20px;
}

h4, caption {
	font-weight: bold;
	color: #FFF;
	font-size: 16px;
	background: #E21D2D;
	width: 570px;
	line-height: 40px;
	padding-left: 10px;
}

h5 {
	font-size: 14px;
	font-weight: bold;
	margin: 25px 0 20px 25px;
}

h6 {
	font-size: 12px;
	font-weight: bold;
	font-style: italic;
	margin: 20px 0 10px 25px;
}

.clearer {
	clear: both;
}

.listing ul, .gethere ul {
	float: left;
	margin-right: 25px;
	margin-bottom: 15px;
}

.listing img {
	margin: 10px 25px 10px 0;
	border: 1px solid #f00;
	float: left;
}

.listing p {
	clear: left;
	padding: 0;
}

.listing p img {
	float: none;
	margin: 0;
	border: 0;
	background: #999999;
}

.listing span ul {
	width: 210px;
}

.listing span img {
	float: right;
	clear: right;
	margin-left: 10px;
}

.thisway {
	background: url(http://www.shropshirefamilyfun.com/images/redarrow.gif) 0 50% no-repeat;
	padding-left: 20px;
	margin-top: 10px;
}

.listing a, .gethere a {
	font-size: 12px;
	font-weight: bold;
}

p.right {
	float: right;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-right: 5px;
	clear: none;
}

p.right a{
	color: #E21D2D;
	text-decoration: none;
}

p.right a:hover{
	text-decoration: underline;
}

table#border {
	border-bottom: #E21D2D 2px solid;
}

.listing table, .gethere table{
	width: 100%;
}

.gethere table td, .lines td {
	border-bottom: 1px solid #eee;
}

/* Reg Form */

#regform  {	
	margin: 20px;
}

#regform fieldset {
	border: 2px solid #e21d2d;
	padding: 10px;
}

#regform fieldset legend {	
	font-weight: bold;
}

#regform fieldset ol {
	list-style: none;
}

#regform fieldset ol li {
	margin: 5px 0;
}

#regform fieldset ol li label {
	display: -moz-inline-stack;
	display: inline-block;
	width: 200px;
}

#regform fieldset p {
	font-style: italic;
	color: #F00;
	margin: 0 10px 5px 10px;
}

#regform #btn {
	background: #fff;
	border: 2px solid #e21d2d;
	padding: 5px 10px;
	margin: 10px 0;
}

/** FOOTER **/

#foot {	
	float: right;
	width: 580px;
	height: 40px;
	margin-right: 30px !important;
	margin-right: 15px;
	margin-left: 10px;
	border-top: #E21D2D 2px solid;
}

#design {
	float: left;
	margin-top: 5px;
	margin-left: 10px;
	font-size: 10px;
}

#design a {
	text-decoration: none;
	color: #000000;
}

#design a:hover {
	text-decoration: underline;
	color: #E21D2D;
}

#copy {
	float: right;
	margin-top: 5px;
	margin-right: 10px;
	font-size: 10px;
}

#copy a {
	text-decoration: none;
	color: #000000;
}

#copy a:hover {
	text-decoration: underline;
	color: #E21D2D;
}

#content h3 {
	color: #e22332;
	margin: 20px;
}

#content .containerpic {
	margin: 20px 0 0 30px;
}

#content .containerpic a img {
	border: 1px solid #000;
	padding: 3px;
}

/* accommodation search */

#content #accommodationsearch {
	margin-left: 10px;
}

#content #accommodationsearch p {
	margin-left: 0;
	margin-bottom: 10px;
}

#content #accommodationsearch fieldset {
	border: 2px solid #C62626;
	background: #FCEDED url(http://www.shropshiretourism.co.uk/images/accom_fieldset_bg.png) repeat-x left top;
	width: 48%;
	float: left;
	margin-bottom: 10px;
}

#content #accommodationsearch #rating {
	margin-left: 1%;
	height: 95px;
}

#content #accommodationsearch #rating img {
	border: 0;
}

#content #accommodationsearch #rating input {
	display: none;
}

#content #accommodationsearch #location {
	margin-left: 1%;
	height: 105px;
}

#content #accommodationsearch #all {
	border: 2px solid #99CCCC;
	background: #C4E1E1 url(http://www.shropshiretourism.co.uk/images/all_fieldset_bg.png) repeat-x left top;
	width: 98%;
	float: left;	
}

#content #accommodationsearch #type {
	height: 212px;
	margin-bottom: 20px;
}

#content #accommodationsearch #oswestry {
	border: 2px solid #E0E451;
	background: #EBED87 url(http://www.shropshiretourism.co.uk/images/oswestry_fieldset_bg.png) repeat-x left top;
	width: 48%;
	float: left;
}

#content #accommodationsearch #shrewsbury {
	border: 2px solid #F3BC3E;
	background: #F7D17B url(http://www.shropshiretourism.co.uk/images/shrewsbury_fieldset_bg.png) repeat-x left top;
	width: 48%;
	float: left;
	margin-left: 1%;
}

#content #accommodationsearch #northshrop {
	border: 2px solid #E3D0AF;
	background: #F3ECDE url(http://www.shropshiretourism.co.uk/images/northshrop_fieldset_bg.png) repeat-x left top;
	width: 48%;
	float: left;	
}

#content #accommodationsearch #telford {
	border: 2px solid #C9DD7E;
	background: #DEEAB0 url(http://www.shropshiretourism.co.uk/images/telford_fieldset_bg.png) repeat-x left top;
	width: 48%;
	float: left;
	margin-left: 1%;	
}

#content #accommodationsearch #southshrop {
	border: 2px solid #A6C4A0;
	background: #CCDDC8 url(http://www.shropshiretourism.co.uk/images/southshrop_fieldset_bg.png) repeat-x left top;
	width: 48%;
	float: left;
	height: 215px;
}

#content #accommodationsearch #bridgnorth {
	border: 2px solid #C59DB5;
	background: #DDC6D3 url(http://www.shropshiretourism.co.uk/images/bridgnorth_fieldset_bg.png) repeat-x left top;
	width: 48%;	
	float: left;
	margin-left: 1%;
	height: 215px;
}

#content #accommodationsearch #surround {
	border: 2px solid #CCC;
	background: #EBEBEB url(http://www.shropshiretourism.co.uk/images/surround_fieldset_bg.png) repeat-x left top;
	width: 98%;	
}

#content #accommodationsearch fieldset legend {
	color: #C62626;
	font-weight: bold;
	background: #fff;
	font-size: 95%;
}

#accommodation #centre #accommodationsearch #all legend, #accommodation #centre #accommodationsearch #oswestry legend, #accommodation #centre #accommodationsearch #shrewsbury legend, #accommodation #centre #accommodationsearch #northshrop legend, #accommodation #centre #accommodationsearch #telford legend, #accommodation #centre #accommodationsearch #southshrop legend, #accommodation #centre #accommodationsearch #bridgnorth legend, #accommodation #centre #accommodationsearch #surround legend {
	color: #000;
}

#content #accommodationsearch fieldset ul {
	float: left;
	list-style: none;
	margin-left: 1%;
}

#content #accommodationsearch fieldset ul li label {
	display: inline-block;
	width: 235px !important;
	width: 200px;
	font-size: 90%;
}

#content #accommodationsearch #rating ul {
	margin-top: 15px;
}

#content #accommodationsearch #rating ul li {
	float: left;
	margin-left: 58% !important;
	margin-left: 5%;
}

*:first-child+html #content #accommodationsearch #rating ul li {
	margin-left: 12%;
}

#content #accommodationsearch #rating ul li label {
	width: 20px;
}

#content #accommodationsearch #searchbtn {
	float: right;
	border: 2px solid #c62626;
	background-color: #fceded;
	margin: 10px 0;
	padding: 2px 15px;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 70%;
	cursor: pointer;
}

/* accommodation + attractions searchresults */

#content .accomresult {
	float: left;
	width: 100% !important;
	width: 90%;
	border: 2px solid #C62727;
	margin-bottom: 20px;
	margin-left: 6px;
	background: url(http://www.shropshiretourism.co.uk/images/tools_bg.png) repeat-x bottom left;
} 

#content .accomresult .resultinfo {
	float: left;
	width: 100%;
	border-bottom: 2px solid #C62727;
	background: url(http://www.shropshiretourism.co.uk/images/accom_fieldset_bg.png) repeat-x bottom left;
}

#content .accomresult h1 {
	font-size: 120%;
	background: #C62727;
	color: #fff;
	padding: 6px 0;
	text-indent: 10px;
	margin-bottom: 10px;
}

*:first-child+html #content .accomresult h1 {
	margin-bottom: 0;
}

#content .accomresult .resultinfo .thumbimg {
	float: left;
	margin-left: 10px;
	border: 1px #000 solid;
	width: 115px;
	margin-bottom: 10px;
}

#content .accomresult .ratingimg {
	float: right;
	border: 0;
	width: 80px;
	margin-right: 0.7%;	
}

#content .accomresult .ratingimg1 {
	float: right;
	width: 70px;
	margin-right: 0.7%;
	border: 1px solid #ccc;
	background: #fff;
	padding: 5px;	
}

#content .accomresult ul {
	width: 280px;
	list-style: none;
	margin: 0;
	margin-left: 135px;
	border-right: 1px solid #C62727;
	font-size: 90%;
}

#content .accomresult p {
	margin-left: 10px;
	margin-bottom: 5px;
}

#content .accomresult .moreinfo  {
	float: right;
	margin-right: 10px;
}

#content .accomresult .bookable {
	float: right;
	clear: right;
	margin-right: 10px;
	margin-bottom: 0;
}

#content .accomresult .moreinfo a, .accomresult .bookable a {
	background: url(http://www.shropshiretourism.co.uk/images/atrract_arrows.png) center right no-repeat;
	padding-right: 12px;
	text-decoration: none;
	font-weight: bold;
	color: #000;
}

#content .accomresult .moreinfo a, .accomresult .bookable a {
	background-image: url(http://www.shropshiretourism.co.uk/images/accom_arrows.png);
}

#content .accomresult .email {
	padding-right: 12px;
	text-decoration: none;
	color: #000;
}

#content .accomresult .moreinfo a:hover, .accomresult .bookable a:hover {
	color: #C62727;
	text-decoration: underline;
}

#content .accomresult .email {
	padding-right: 12px;
	text-decoration: none;
	color: #000;
}

#content .accomresult .email:hover {
	text-decoration: underline;
	color: #C62727;	
}

#content .stats {
	background: #F1B8B8;
	width:100% !important;
	width:90%;
	float: left;
	margin-bottom: 20px;
	margin-left: 6px;
	padding: 0;
	padding-bottom: 2px;
	border: 2px solid #C62727;
}

#content .stats p {
	float: left;
	clear: left;
	color: #000;
	margin: 2px 0 2px 5px;
	width: 220px;
}

#content .stats .rightstats {
	float: right;
	clear: right;
	margin: 2px 5px 2px 0;
	width: 340px;
	text-align: right;
}

#content .stats a {
	color: #000;
	text-decoration: none;
	font-size: 95%;
}

#content .stats a:hover {
	text-decoration: underline;
}

#content #detailsholder .tooltips {
	background: url(http://www.shropshiretourism.co.uk/images/tools_bg.png) repeat-x bottom left;
	border: 2px solid #C62626;
	margin: 5px 0;
	padding: 3px;
	float: left;
	clear: both;
	width: 100%;
}

#content #detailsholder .tooltips a {
	color: #000;
	font-size: 85%;
	font-weight: bold;
	background: url(http://www.shropshiretourism.co.uk/images/accom_arrows.png) no-repeat center right;
	padding-right: 15px;
	margin-left: 18%;
} 

#content #detailsholder .tooltips h5 {
	margin: 0;
	padding: 0;
}

/* accommodation + attractions details */

#content #detailsholder {
	margin-left: 5px;
}

#content #detailsholder p {
	margin-left: 10px;
	margin-bottom: 5px;
}

#content #detailsholder #detailheader {
	float: left;
	width: 100%;
	background: #fff url(http://www.shropshiretourism.co.uk/images/tools_bg.png) bottom;
	border: 2px solid #C62626;
	margin-bottom: 10px;
}

#content #detailsholder #detailheader a {
	float: right;
	clear: right;
	color: #000;
	font-weight: bold;
	font-size: 85%;
	background: url(http://www.shropshiretourism.co.uk/images/accom_arrows.png) no-repeat right center;
	padding-right: 15px;
	margin-right: 10px;
}

#content #detailsholder #detailheader h1 {
	float: left;
	font-size: 100%;
	background: #C62626;
	color: #fff;
	padding: 6px 0;
	width: 50%;
	padding-left: 10px;
}

#content #detailsholder .short {
	clear: none;
	width: 49%;
}

#content #detailsholder h2 {
	clear: both;
	width: inherit;
	background: #F1B8B8;
	color: #000;
	font-size: 80%;
	text-indent: 10px;
	padding: 2px 0;
}

#content #detailsholder img {
	float: right;
	clear: right;
	width: 290px;
	border: 1px solid #000;
	margin: 0 0 10px 10px;
} 

#content #detailsholder img.accessimg {
	width: 50px;
	float: left;
	margin-top: 10px;
}

#content #detailsholder #facdiv img {
	width: auto;
	float: none;
	margin-top: 5px;
}

#content #detailsholder ul {
	font-size: 90%;
	margin-bottom: 20px;
	margin-left: 10px;
}

#content #detailsholder ul li {
	margin: 0;
	padding: 0;
	line-height: 1.1em;
}

#content #detailsholder a {
	text-decoration: none;
	color: #C62626;
}

#content #detailsholder a:hover {
	text-decoration: underline;
}

#content #detailsholder .ratingimg {
	float: left;
	width: 95px;
	border: 0;
	margin-top: 10px;
	margin-left: 2px;
}

#content #detailsholder .ratingimg1 {
	float: left;
	width: 85px;
	margin-left: 2px;
	border: 1px solid #ccc;
	background: #fff;
	padding: 5px;
	margin-top: 10px;
}

/* accommodation price table */

#content #detailsholder #accomprice {
	border: 2px solid #C62727;
	border-collapse: collapse;
	text-align: center;
	margin-bottom: 20px;
	background: #FCEDED url(http://www.shropshiretourism.co.uk/images/accom_fieldset_bg.png) top left repeat-x;
	margin-left: 0;
	margin-top: 10px;
}

#content #detailsholder #accomprice th {
	background: #C62727;
	color: #fff;
	padding: 6px 3px;
	font-size: 90%;
} 

#content #detailsholder #accomprice td {
	border-left: 1px solid #C62727;
	border-right: 1px solid #C62727;
	padding: 10px 10px;
	font-size: 80%;
} 

#content #detailsholder #accomprice #tools {
	background: url(http://www.shropshiretourism.co.uk/images/tools_bg.png) bottom left repeat-x;
	border-top: 1px solid #C62727;
	margin: 0;
	padding: 0;
}

#content #detailsholder #accomprice #tools h4 {
	float: left;
	font-size: 90%;
	font-weight: bold;
	text-decoration: underline;
	background: 0;
	color: #000;
	text-align: left;
	width: auto;
}

#content #detailsholder #accomprice #tools a {
	color: #000;
	float: left;
	font-size: 95%;
	font-weight: bold;
	background: url(http://www.shropshiretourism.co.uk/images/accom_arrows.png) right center no-repeat;
	margin-left: 50%;
	padding-right: 15px;
	margin-top: 10px;
}

*:first-child+html #content #detailsholder #accomprice #tools a {
	margin-left: 20%;
}

/* accommodation + attractions contact form */

#contactholder {
	margin-left: 5px;
}

#content form#contactform {
	color: #000;
}

#content form#contactform input, #accommodation form#contactform select {
	border: 1px #C62626 solid;
	width: 15em;
}

#content form#contactform .rooms {
	width:4em;
}

#content form#contactform .cb {
	border: 0;
}

#content form#contactform .btn {
	border: #C62626 2px solid;
	background: #F1B8B8;
	margin: 0 10px 10px 5px;
	padding: 4px 10px;
	float: right;
	text-transform: uppercase;
	font-weight: bold;
	width: auto;
	cursor: pointer;
}

#content form#contactform fieldset {
	margin-bottom: 10px;
	border: none;
	border-top: 1px solid #C62626;
	background: url(bg.gif) repeat-x left bottom;
}

#content form#contactform legend {
	padding: 5px;
	font-weight: bold;
	color: #C62626;
}

#content form#contactform label {
	display: inline-block;
	line-height: 1.8;
	vertical-align: top;
	color: #000;
	font-weight: 100;
	width: 175px; /* Width of labels */
}

#content form#contactform fieldset li {
	list-style: none;
	padding: 5px 10px 7px;
	background: url(divider.gif) repeat-x left bottom;
}

#content form#contactform em {
	font-weight: bold;
	font-style: normal;
	color: #f00;
}

#content form#contactform h1 {
	text-align: center;
	width: 100%;
	color: #000;
	font-family:Garamond, Verdana, Arial, Helvetica;
	font-size:21px;
	margin-top: 20px; 
	letter-spacing: 4px;
	font-weight: 100; 
}

#content form#contactform ul {
	margin-bottom: 20px;
	margin-left: 10px;
}

#content form#contactform .hr {
	width: 100%;
	clear: both;
	border-bottom: 2px solid #C62626;
	margin-bottom: 10px;
	padding-top: 10px;
}

*:first-child+html #content form#contactform .hr {
	padding-top: 0;
}

#content form#contactform img {
	float: right;
	border: 1px solid #000;
	margin-top: 10px;
}

#content form#contactform a {
	color: #C62626;
	text-decoration: none;
}

#content form#contactform a:hover {
	text-decoration: underline;
}

#content form#contactform h2 {
	width: 100%;
	float: left;
	clear: both;
	color: #fff;
	background: #C62626;
	text-indent: 10px;
	padding: 5px 0;
	font-size: 100%; 
}

/* CSS END */