@charset "UTF-8";

/*   MACKENZIE WEDDING FILMS CSS
     DEVELOPED BY JAMIE STERLING
	 www.jamiesterling.co.uk
     FEB 2011
*/


/* YUI RESET CSS */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}



/* Mackenzie Wedding FIlms CSS */
body {
	background: #f4efdc;
}

.container {
	width:760px;
	margin:50px auto;
}

.top {
	background:url('img/top.png') no-repeat;
	height:87px;
}

.middle {
		background:url('img/middle.png');
		margin:0;
		padding:0;
}

.bottom {
		background:url('img/bottom.png') no-repeat;
		height:22px;
}

h1 {
	text-indent:-1000em;
	width: 244px;
	height: 45px;
	background: url(img/mwf-logo.png);
	float:left; 
	margin: 23px 0 0 20px;	
}

.nav { float:right; margin: 43px 25px 0 0; }
.nav li { float: right; margin: 0 0 0 15px; }
.nav li a { text-decoration: none; color: #351742; font-family:Georgia, "Times New Roman", Times, serif; font-style: italic; font-size: 12px; }
.nav li a:hover { text-decoration: underline; }


.heading {
	color: #351742;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	font-size:33px;
	text-align:center;
	font-weight:normal;
	padding-top:40px;
	padding-bottom:5px;
}

h2 {
	color: #351742;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	font-size:21px;
	font-weight:normal;
	padding-top:50px;
	padding-bottom: 10px;
}

.clear {
	clear:both;
}

p.intro {
	color: #827B65;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:center;
	margin-bottom:40px;
	margin-top:10px;
}

p {
	color: #827B65;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	margin-top:7px;
	line-height: 20px;
}

.hd {
	
	font-size:10px;
	color:#999
	
}

h3 {
	color: #351742;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	font-size:18px;
	text-align:center;
	font-weight:normal;
	padding-bottom:30px;
}

h3 a{
	color: #351742;
	font-weight:normal;
	text-decoration:underline;
}

h3 a:hover{
	color: #351742;
	font-weight:normal;
	text-decoration:none;
}

.videoframe {
	margin:0 0 10px 51px;
	padding:9px;
	border: 1px solid #E5DBA8;
	background: #FFF;
	-moz-box-shadow: 0 0 15px #CCC;
 	-webkit-box-shadow: 0 0 15px #CCC;
  	box-shadow: 0 0 15px #CCC;
}

.attribution {
	color: #EFEFEF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	text-align:center;
}

.attribution a{
	color: #EFEFEF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	text-align:center;
	text-decoration:underline;
}

.attribution a:hover{
	color: #000;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	text-align:center;
	text-decoration:underline;
}

.width656 { width: 656px; margin: 10px auto 0; }

.col3 { float:left; width: 218px; }
.col3 p { margin-right: 20px; }


.package { margin-top: 40px; float:left; width: 204px; height: 520px; position: relative; }
.package h3 { margin-top: 20px; font-size: 21px; padding-bottom: 10px;}
.package h3 strong { font-style: italic; font-weight: bold; }
.package h4 {
	color: #351742;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	font-size:18px;
	text-align:center;
	font-weight:normal;
	padding-bottom:10px;
}

.package ul { padding: 0; margin: 10px; auto; width: 90%; border-top: 1px solid #F2EDD7;}
.package li { padding: 8px 5px; margin: 0; list-style: none; border-bottom: 1px solid #F2EDD7; color: #827B65; font-family: sans-serif !important; text-align: center; font-size: 12px;}

.package a { width: 90%; background: #351742 url(img/grad.png) repeat-x; color: #FFF; padding: 7px 0; font-family: Georgia, Serif; font-style: italic; margin: 5px auto; text-decoration: none; display: block; text-align: center; position: absolute; left: 5%; bottom: 5px;
webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}


.package a:hover { background: #351742;}

.lily { border: 1px solid #E5DBA8; border-right:none;
-webkit-border-top-left-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomleft: 10px;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;}

.rose {border: 4px solid #E5DBA8; margin-top: 20px; width: 234px; height: 560px;
-moz-box-shadow: 0 0 15px #CCC;
 	-webkit-box-shadow: 0 0 15px #CCC;
  	box-shadow: 0 0 15px #CCC;
  	webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
  	}
  	
 .rose h3 { font-size: 23px; }
 .rose h4 { font-size: 20px; padding-bottom:15px;}
 .rose p { margin: 0; text-align: center; font-size: 11px; line-height: normal; padding-bottom: 10px;}
 .rose a { padding: 16px 0; bottom: 8px; }
  	
  	
.orchid {border: 1px solid #E5DBA8;border-left:none;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-bottomright: 10px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;}


.sml { margin-top: 20px;}
.sml p {font-size: 11px; line-height: 16px;}
.sml p strong { font-size: 12px; color: #351742; font-weight: normal; }
.sml a { font-size: 12px; color: #351742; text-decoration: none;}
.sml a:hover { text-decoration: underline; }

.col2 { float:left; width: 416px; border: 1px solid #F2EDD7; webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px; margin: 20px 0 50px; padding: 10px;}

.purple { border: 1px solid #351742 !important; }

.col4 { float: left; width: 200px; color: #351742; font-family: sans-serif; font-size: 13px; }
.col4 p {margin:0;}

.col4 input { width: 120px; padding: 3px 6px; border:none; border-bottom: 1px solid #CCC; outline: none; display: inline; margin-bottom: 10px; }

.col4 select { width: 120px; padding: 3px 6px;  outline: none; display: inline; margin-bottom: 10px; }

.col4 textarea { width: 180px; height: 70px; padding: 3px 6px;  outline: none; display: inline; margin:5px 0 10px; border: 1px solid #CCC;}

.col4 input[type=submit] { width: 192px; background: #351742 url(img/grad.png) repeat-x; color: #FFF; padding: 7px 0; font-family: Georgia, Serif; font-style: italic; text-decoration: none; display: block; text-align: center;
webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-size: 14px;
cursor: pointer;
}

.col4 input[type=submit]:hover { background: #351742;}


.left { margin-left:40px !important;}

/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 600px;
	height:170px;

	/* custom decorations */

}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;
}

.items div {
	float:left;
	width:600px;
}

/* single scrollable item */
.scrollable .items a {
	float:left;
	margin:10px 4px;
	background-color:#fff;
	padding:5px;
	border:1px solid #ccc;
	width:130px;
	height:127px;
	border: 1px solid #E5DBA8;
	background: #FFF;
	-moz-box-shadow: 0 0 5px #DDD;
 	-webkit-box-shadow: 0 0 5px #DDD;
  	box-shadow: 0 0 5px #DDD;
	color: #666;
	font-size: 13px;
	text-decoration: none;
}

.scrollable .items a img { margin-bottom: 7px; width: 130px; height: 90px; }
.scrollable .items a:hover { color: #333; }

/* active item */
.scrollable .active {
	position:relative;
	cursor:default;
}

/* this makes it possible to add next button beside scrollable */
.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
	background:url(img/hori_large.png) no-repeat;
	display:block;
	width:30px;
	height:30px;
	float:left;
	margin:60px 10px;
	cursor:pointer;
	font-size:1px;
}

/* right */
a.right 				{ background-position: 0 -30px; clear:right; margin-right: 0px;}
a.right:hover 		{ background-position:-30px -30px; }
a.right:active 	{ background-position:-60px -30px; } 


/* left */
a.left				{ margin-left: 0px; } 
a.left:hover  		{ background-position:-30px 0; }
a.left:active  	{ background-position:-60px 0; }

/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
} 	



.ui-widget-header { background: #E5DBA8 url(img/grad.png) repeat-x !important; border: #E5DBA8 !important;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background: #EFE8CB url(img/grad.png) repeat-x !important; border: #E5DBA8 !important;}
.ui-widget-header .ui-state-active { background: #FFF url(img/grad.png) repeat-x !important; border: #E5DBA8 !important;} 



/* Component containers
----------------------------------*/
.ui-widget { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 0.7em/*{fsDefault}*/; }
.ui-widget .ui-widget { font-size: 1em; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1em; }
.ui-widget-content { border: 1px solid #E5DBA8/*{borderColorContent}*/; background: #FFF/*{bgContentRepeat}*/; color: #222222/*{fcContent}*/; }
.ui-widget-content a { color: #222222/*{fcContent}*/; }
.ui-widget-header { border: 1px solid #E5DBA8/*{borderColorHeader}*/; background: #E5DBA8/*{bgColorContent}*/ url(img/grad.png) repeat-x/*{bgHeaderRepeat}*/; color: #222222/*{fcHeader}*/; font-weight: bold; }
.ui-widget-header a { color: #222222/*{fcHeader}*/; }

/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #d3d3d3/*{borderColorDefault}*/; background: #e6e6e6/*{bgColorDefault}*/ url(images/ui-bg_glass_75_e6e6e6_1x400.png)/*{bgImgUrlDefault}*/ 50%/*{bgDefaultXPos}*/ 50%/*{bgDefaultYPos}*/ repeat-x/*{bgDefaultRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #555555/*{fcDefault}*/; }
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #555555/*{fcDefault}*/; text-decoration: none; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #999999/*{borderColorHover}*/; background: #dadada/*{bgColorHover}*/ url(images/ui-bg_glass_75_dadada_1x400.png)/*{bgImgUrlHover}*/ 50%/*{bgHoverXPos}*/ 50%/*{bgHoverYPos}*/ repeat-x/*{bgHoverRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcHover}*/; }
.ui-state-hover a, .ui-state-hover a:hover { color: #212121/*{fcHover}*/; text-decoration: none; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #aaaaaa/*{borderColorActive}*/; background: #ffffff/*{bgColorActive}*/ url(images/ui-bg_glass_65_ffffff_1x400.png)/*{bgImgUrlActive}*/ 50%/*{bgActiveXPos}*/ 50%/*{bgActiveYPos}*/ repeat-x/*{bgActiveRepeat}*/ !important; font-weight: bold/*{fwDefault}*/; color: #212121/*{fcActive}*/; }
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #212121/*{fcActive}*/; text-decoration: none; }
.ui-widget :active { outline: none; }

/* Interaction Cues
----------------------------------*/
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight  {border: 1px solid #fcefa1/*{borderColorHighlight}*/; background: #fbf9ee/*{bgColorHighlight}*/ url(images/ui-bg_glass_55_fbf9ee_1x400.png)/*{bgImgUrlHighlight}*/ 50%/*{bgHighlightXPos}*/ 50%/*{bgHighlightYPos}*/ repeat-x/*{bgHighlightRepeat}*/; color: #363636/*{fcHighlight}*/; }
.ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: #363636/*{fcHighlight}*/; }
.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cd0a0a/*{borderColorError}*/; background: #fef1ec/*{bgColorError}*/ url(images/ui-bg_glass_95_fef1ec_1x400.png)/*{bgImgUrlError}*/ 50%/*{bgErrorXPos}*/ 50%/*{bgErrorYPos}*/ repeat-x/*{bgErrorRepeat}*/; color: #cd0a0a/*{fcError}*/; }
.ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #cd0a0a/*{fcError}*/; }
.ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #cd0a0a/*{fcError}*/; }
.ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; }
.ui-priority-secondary, .ui-widget-content .ui-priority-secondary,  .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; }
.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }

/*
 * jQuery UI Datepicker @VERSION
 *
 * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Datepicker#theming
 */
.ui-datepicker { width: 17em; padding: .2em .2em 0; }
.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; }
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; }
.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }
.ui-datepicker .ui-datepicker-prev { left:2px; }
.ui-datepicker .ui-datepicker-next { right:2px; }
.ui-datepicker .ui-datepicker-prev-hover { left:1px; }
.ui-datepicker .ui-datepicker-next-hover { right:1px; }
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px;  }
.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; }
.ui-datepicker select.ui-datepicker-month-year {width: 100%;}
.ui-datepicker select.ui-datepicker-month, 
.ui-datepicker select.ui-datepicker-year { width: 49%;}
.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }
.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: normal; border: 0;  }
.ui-datepicker td { border: 0; padding: 1px; }
.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }
.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi { width:auto; }
.ui-datepicker-multi .ui-datepicker-group { float:left; }
.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; }
.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; }
.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; }
.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; }
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; }
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; }
.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; }
.ui-datepicker-row-break { clear:both; width:100%; }

/* RTL support */
.ui-datepicker-rtl { direction: rtl; }
.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; }
.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; }
.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; }
.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; }
.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; }
.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; }
.ui-datepicker-rtl .ui-datepicker-group { float:right; }
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; }

/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
.ui-datepicker-cover {
    display: none; /*sorry for IE5*/
    display/**/: block; /*sorry for IE5*/
    position: absolute; /*must have*/
    z-index: -1; /*must have*/
    filter: mask(); /*must have*/
    top: -4px; /*must have*/
    left: -4px; /*must have*/
    width: 200px; /*must have*/
    height: 200px; /*must have*/
}
.ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }

.ui-icon { width: 16px; height: 16px; background-image: url(img/ui-icons_222222_256x240.png)/*{iconsContent}*/; }
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-icon-circle-triangle-s { background-position: -64px -192px; }
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
.ui-icon-circle-triangle-n { background-position: -96px -192px; }