/* ---------------------------------------------------------------------
        GLOBAL STYLES - UNIVERSAL SELECTORS AND CLASSES
------------------------------------------------------------------------

These are default styles that every page needs to inherit */

 
/* ********* TYPOGRAPHY ********* */

body {
	font-size:15px;
	font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif;
	line-height:1.134;
	color:#5d5d5d;
	padding-bottom:15px;
}

h1 {
    font-family: "Times New Roman", Times, Georgia, serif;
	font-size:40px;
	font-weight:normal;
	line-height:1;
	color: #3e2354;
	letter-spacing: -0.35px;
	margin-bottom:16px;
}


h2 {
    font-family: "Times New Roman", Times, Georgia, serif;
	font-size: 20px;
	font-weight:bold;
	line-height:1.1;
	color:#46275f;
	margin-bottom:15px;
}

h3 {
	font-size: 15px;
	font-weight:bold;
	line-height:1.134;
	color:#46275f;
	margin-bottom:0px;
}

h4 {/*unused*/
	font-size: 10px;
	font-weight: bold;
	line-height:1.2;
	color: #1c52ac;
	margin-bottom:2px;
}
 
h5 { /*unused*/
	font-size:11px;
	font-weight:bold;
	line-height:1.364;
	margin-bottom: 0;
}

p {
    line-height:1.267;
    margin:0 0 15px 0; 
}

p.introtext {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.112;
    color: #454545;
    margin-bottom: 8px;
}

strong {font-weight:bold;}
em, dfn {font-style:italic;}

blockquote {margin:0;font-style:normal;}
dfn {font-weight:bold;}
sup, sub {line-height:0;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre {margin:1.5em 0;white-space:pre;}
pre, code, tt {font:1em 'andale mono', 'lucida console', monospace;line-height:1.5;}
dl {margin:0 0 1.5em 0;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}


table {width:100%;}
tfoot {font-style:italic;}

.hide {display:none;}

.clear {clear:both;height:0;overflow:hidden}
.left {float:left;}
.right {float:right}

hr {display:none;}


::selection {
	background: #ffc3f2; /* Safari */
	}
::-moz-selection {
	background: #ffc3f2; /* Firefox */
}

/* ********* GLOBAL LINKS ********* */

a {
	color:#021933;
	text-decoration:none;
}

a:hover, a:focus {
	color:#767676;
	text-decoration:none;
	outline: none;
}

a.frame {
    position: absolute;
    left: 0;
    top: 0;
    width: 182px;
    height: 135px;
    background: url(../images/frame.png) left top no-repeat;
    overflow: hidden;
    z-index: 2;
}

a.frame:hover, a.frame:focus {
    background-position: left bottom;
}

/* Buttons */

a.button {
    display: block;
    height: 17px;
    background-position: left top;
    background-repeat: no-repeat;
    text-indent: -9999px;
    overflow: hidden;
}

a.button:hover, a.button:focus {
    background-position: left bottom;
}

a.button.visit-website-button {
    float: right;
    width: 89px;
    background-image: url(../images/button-visit-website.png);
}


/* ********* FORMS ********* */

form li {
	float:left;
	clear:left;
	margin-bottom:8px;
}

legend {
    display: none;
}

#postcode-form {
    margin-bottom:14px;
}

/* Labels */

label {
	float:left;
    font-size:12px;
	line-height:12px;
}

label.label1 {
	width:62px;
	line-height:24px;
	margin-right:14px;
	font-size:14px;
	font-weight:bold;
	color:#666666;
	text-align:right;
}

#postcode-form label {
    width: 90px;
    padding-top: 5px;
    padding-left: 10px;
    margin-right: 6px;
    
    font-family: "Times New Roman", Georgia, Times, serif;
    font-size: 20px;
    font-weight: bold;
    line-height: 1;
    color: #731791;
}

li.checkbox-container label {
	width:200px;
	font-size:12px;
	vertical-align:middle;
	padding:0 0 5px 0;
}

label span.required {
	color:#064b9f;
	line-height:1;
}

/* Inputs */

input {
	margin:0;
	padding:0;
	
	font-family:Arial, Verdana, Tahoma, Geneva, sans-serif;
	font-weight:bold;
	border:none;
	overflow:hidden;
	line-height:13px;
	outline:none;
}

input[type="text"] {
    float: left;
	width:250px;
	height:18px;
	padding:4px 8px 2px 8px;
	
	font-family:Arial, Verdana, Tahoma, Geneva, sans-serif;
	font-size:14px;
	font-weight:bold;
	line-height:15px;
	color:#0a386f;
	border:1px solid #a6a6a6;
	
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}

#postcode-form input {
    width: 559px;
    height: 22px;
    padding: 15px 23px 15px 23px;
    background: url(../images/input-big.png) left top no-repeat;
    
    font-family: "Times New Roman", Georgia, Times, serif;
    font-size: 20px;
    font-weight: normal;
    color: #731791;
    line-height: 23px;
    border: none;
    
    border-radius:0px;
    -moz-border-radius:0px;
    -webkit-border-radius:0px;
}

/* Select  */

select {
	float:left;
	max-width:269px;
	height:22px;
	margin-top:0px;
	font-size:11px;
	border:1px solid #b2b2b2;
	overflow:hidden;
}

/* Textarea */

textarea {
	width:250px;
	height:193px;
	padding:5px 8px;
	margin:0;
	border:1px solid #bfbfbf;
	
	font-family: Arial, Helvetica, Tahoma, Geneva, sans-serif;
	font-size:12px;
	color:#064b9f;
	line-height: 14px;
	outline:none;
	resize:none;
	overflow: auto;
}

/* Checkbox */

input.checkbox {
	float:left;
	width:13px;
	height:13px;
	margin:0 5px 0 0;
	padding:0;
	vertical-align:middle;
}

input.file-input {
	width:265px;
	height:23px;
	border:1px solid #b1b1b1;
	background:white;
	vertical-align:top;
}

/* Radio  */

input.radio {
	clear:left;
	width:13px;
	height:13px;
	margin:0 0 10px 0;
	padding:0;
	vertical-align:middle;
}

li.radios div {
	float:left;
	padding-top:5px;
}

li.radios div label {
	float:left;
	clear:none;
	line-height:13px;
	vertical-align:middle;
	padding-left:10px;
	font-weight:normal;
}

button {
	float:right;
	display:block;
	border:none;
	margin:0;
	overflow:hidden;
	cursor:pointer;
}

button::-moz-focus-inner { border: 0; }

#postcode-form button {
    width: 220px;
    height: 51px;
    margin-right: 2px;
    background: url(../images/button-search.png) left top no-repeat;
    text-indent: -9999px;
}

#postcode-form button:hover, #postcode-form button:focus {
    background-position: right top;
}

/* ********* CLEAR FIX HACK ********* */

.cf:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.cf {display: inline-block;}

/* Hides from IE-mac \*/
* html .cf {height: 1%;}				
.cf {display: block;}
/* End hide from IE-mac */



/* ---------------------------------------------------------------------
            	GLOBAL STYLES - STRUCTURAL RULES
------------------------------------------------------------------------ 

These are common styles, shared by different pages  */


/* ////////      GENERAL LAYOUT       \\\\\\\\ */

#main-container {
	min-width:1000px;
	min-height: 635px;
	background: url(../images/backgr-main.jpg) center top no-repeat;
}

#page {
   width: 943px;
   min-height: 425px;
   margin: 0 auto;
   padding: 6px 12px 0 12px;
   background-color: #fff;
   overflow: hidden;
}

.content {
    padding-left: 14px;
    padding-right: 14px;
}

#home-page .content {
    padding-top: 31px;
}

.content img {
    float: left;
    padding: 5px;
    background: #e1e1e1;
    margin-right: 19px;
    margin-left: -14px;
    margin-bottom: 5px;
    
    border-radius:8px;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
}

.content img + h1 {
    padding-top: 11px;
}

/* ////////      HEADER       \\\\\\\\ */

#header {
    position: relative;
    width: 967px;
    height: 148px;
    margin: 0 auto;
    padding-top: 44px;
    background: url(../images/page-top.png) left bottom no-repeat;
}

#header h1 {
    width: 459px;
    height: 49px;
    margin: 0 0 0 9px;
    padding: 0;
    overflow: hidden;
}

#header h1 a {
    display: block;
    width: 459px;
    height: 49px;
    font-size: 1px;
    text-indent: -9999px;
    overflow: hidden;
}

/* *** Topnav  *** */

ul#topnav {
    position: absolute;
    left: 15px;
    bottom: 23px;
    height: 38px;
    overflow: hidden;
}

#topnav li {
    float: left;
    margin-right: 20px;
    height: 38px;
    overflow: hidden;
}

#topnav li a {
    display: block;
    height: 38px;
    background-position: left top;
    background-repeat: no-repeat;
    text-indent: -9999px;
    overflow: hidden;
}

#topnav li a:hover, #topnav li a:focus, #topnav li.active a {
    background-position: left bottom;
}

#topnav li#topnav-home a {
    width:79px;
    background-image: url(../images/topnav-home.png);
}

#topnav li#topnav-wedding a {
    width:145px;
    background-image: url(../images/topnav-wedding-cakes.png);
}

#topnav li#topnav-chocolate a {
    width:152px;
    background-image: url(../images/topnav-chocolate-cakes.png);
}

#topnav li#topnav-cupcakes a {
    width:103px;
    background-image: url(../images/topnav-cupcakes.png);
}

#topnav li#topnav-toppers a {
    width:132px;
    background-image: url(../images/topnav-cake-toppers.png);
}

#topnav li#topnav-size a {
    width:109px;
    background-image: url(../images/topnav-size-guide.png);
}

#topnav li#topnav-gallery a {
    width:88px;
    background-image: url(../images/topnav-gallery.png);
}


/* ////////      Infoarea       \\\\\\\\ */

.infoarea {
    clear: both;
    margin-top: 16px;
    padding: 14px 14px 7px 14px;
    background-color: #d9d9d9;
    
    font-size: 12px;
    font-weight: bold;
    line-height: 1.334;
    color: #5d5d5d;
    text-shadow:rgb(232, 232, 232) 0px 1px 0px;
    
    border-radius:4px;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
}

.infoarea p {
    font-size: 12px;
    font-weight: bold;
    line-height: 1.334;
    color: #5d5d5d;
    margin-bottom: 7px;
}


/* ////////      FOOTER       \\\\\\\\ */

#footer {
    margin-top: 11px;
    padding-left: 15px;
    
    font-size: 12px;
    font-weight: normal;
    line-height: 1;
    color: #747474;
}

#footer ul {
    float: left;
    margin-bottom:15px;
}

#footer ul li {
    display: inline;
    padding-right: 30px;
}

#footer a {
    font-size: 12px;
    font-weight: normal;
    line-height: 1;
    color: #747474;
    text-decoration: none;
}

#footer a:hover, #footer a:focus {
    color: #454545;
    text-decoration: underline;
}

#footer #mail-us {
    float: right;
    padding-right: 3px;
    font-size: 12px;
    line-height: 14px;
    color: #3e2354;
    white-space: nowrap;
}

#footer strong#copyright {
    float: left;
    clear: both;
    font-size: 12px;
    font-weight: normal;
    line-height: 14px;
    white-space: nowrap;
}


/* ---------------------------------------------------------------------
            		INDIVIDUAL PAGE STYLES
------------------------------------------------------------------------ 

These styles are used only on a specific page */


/*-----------------------------------------
 ////////          HOMEPAGE         \\\\\\\\ 
-------------------------------------------*/

h1#heading-welcome {
    width: 215px;
    height: 38px;
    background: url(../images/heading-welcome.png) left top no-repeat;
    font-size: 1px;
    text-indent: -9999px;
    overflow: hidden;
    margin-bottom:17px;
}


/* ////////      Sections       \\\\\\\\ */

ul#sections {
    width: 963px;
    margin-right: -20px;
    margin-bottom: 5px;
}

ul#sections li {
    position: relative;
    float: left;
    width: 220px;
    height: 93px;
    padding-top: 313px;
    margin-right: 20px;
    overflow: hidden;
}

ul#sections li img {
    position: absolute;
    left: 0;
    top: 0;
    width: 220px;
    height: 313px;
    overflow:hidden;
    z-index: 1;
}

ul#sections li a.frame {
    width: 220px;
    height: 313px;
    background: url(../images/frame-section.png) left top no-repeat;
}

/* *** Section-info  *** */

ul#sections li .section-info {
    width: 192px;
    height: 86px;
    padding: 7px 14px 0px 14px;
    background: url(../images/section-info-bg.png) left top no-repeat;
    
    font-size: 13px;
    line-height: 1.154;
    overflow: hidden;
}

.section-info h3 {
    font-family: "Times New Roman", Georgia, Times, serif;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.125;
    color: #ffffff;
    margin: 0 0 3px 0;
}

.section-info p {
    font-size: 13px;
    line-height: 1.154;
    color: #dac3f2;
    margin: 0 0 6px 0;
}

.section-info a.action-link {
    font-weight: bold;
    color: #f9f9f9;
    text-decoration: none;
}

.section-info a.action-link:hover, .section-info a.action-link:focus {
    color: #f9f9f9;
    text-decoration: underline;
}


/*-----------------------------------------
 ////////          SEARCH         \\\\\\\\ 
-------------------------------------------*/

#search {
    padding-left: 3px;
}

/* *** Search Results *** */

#search-results {
    float: left;
    width: 326px;
    margin-top: -4px;
}

#search-results h1 {
    margin-bottom: 5px;
}

#search-results ul {
    position: relative;
    height: 707px;
    overflow:  auto;
}

#search-results ul li {
    position: relative;
    float: left;
    width: 254px;
    min-height: 20px;
    padding: 14px 10px 11px 36px;
    border-bottom: 1px solid #d6d6d6;
}

#search-results ul li.odd {
    background-color: #e1e1e1;
}

#search-results ul li .results-details {
    float: left;
    width: 150px;
}

#search-results ul li h3 {
    font-size: 14px;
    font-weight: bold;
    line-height: 1.143;
    color: #3e2354;
    letter-spacing: 0;
    margin: 0;
}

#search-results ul li h4 {
    font-size: 11px;
    font-weight: bold;
    line-height: 1.182;
    color: #351338;
    letter-spacing: 0;
    margin: 0;
}

#search-results ul li h3 span {
    position: absolute;
    left: 10px;
    top: 13px;
    display: block;
    width: 20px;
    height: 20px;
    background: url(../images/number-backgr.png) left top no-repeat;
    
    font-size: 11px;
    font-weight: bold;
    line-height: 20px;
    color: #fff;
    text-align: center;
}

#search-results ul li strong {
    display: block;
    margin-top: -1px;
    margin-bottom: 5px;
    
    font-size: 10px;
    font-weight: normal;
    line-height: 12px;
    color: #5d5d5d;
}


/* *** Map *** */

#map {
    float: right;
    width: 598px;
    height: 728px;
    margin-top: 10px;
    margin-bottom: 7px;
    margin-right: 2px;
    border: 5px solid #e1e1e1;
}

#map img {
    display: block;
}


/*-----------------------------------------
 ////////          GALLERY         \\\\\\\\ 
-------------------------------------------*/

#gallery-container {
    padding-left: 3px;
    margin-bottom: 19px;
    overflow: hidden;
}

ul#gallery {
    overflow: hidden;
}

ul#gallery li {
    position: relative;
    float: left;
    width: 182px;
    padding-top: 141px;
    padding-bottom: 18px;
    margin-left: 7px;
    
    font-size: 13px;
    line-height: 1.154;
    color: #585858;
    text-align: center;
    overflow: hidden;
}

ul#gallery li.first {
    clear: left;
    margin-left: 0;
}

ul#gallery li img {
    position: absolute;
    left: 5px;
    top: 5px;
    display: block;
    width: 172px;
    height: 125px;
    overflow: hidden;
    z-index: 1;
}

ul#gallery li h3 {
    font-size: 13px;
    font-weight: normal;
    line-height: 1.154;
    color: #585858;
    letter-spacing: 0;
    margin: 0;
    text-align: center;
}

/* *** Tables  *** */

.table-container {
    float: left;
    width: 445px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.table-container.left {
    margin-right: 25px;
}

.table1 {
    width: 445px;
    margin-top: 6px;
}

.table1 tr:first-child {
    height: 30px;
}

.table1 tr.odd {
    background: #eeeded;
}


.table1 th {
    padding: 0 17px;
    
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    background: #d9d9d9;
    color: #5D5D5D;
    text-shadow:0 1px 0 #E8E8E8;
}

.table1 tr:first-child th:first-child {
    -webkit-border-top-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    border-top-left-radius: 4px;
}

.table1 tr:first-child th:last-child {
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topright: 4px;
    border-top-right-radius: 4px;
}

.table1 td {
    padding: 3px 17px;
    
    font-size: 12px;
    color: #9a9a9a;
}

.table1 td.col1 {
    width: 90px;
}

.table1 td.col2, .table1 td.col3 {
    text-align: center;
} 

