/*------------------------------------------------------------------
						Steven Johnston @ CoCreate
						for
						CoCreate
						09/04/2009

						Version 1.0

						Project: Fun Photo Certificate

						**Please annotate amendments and log below**
						--------------------------------------------
						Amendments


						--------------------------------------------
##Designers Notes
-----------------
Colours
-------

--------------------------------------------------------------------*/
*{
    padding:0;
    margin:0;
}
html{
    min-height:100%;
    margin:0 0 1px 0;
}
body{
    background:url(../images/bg_body.gif) repeat-x #A47CB7;
}
img{
    border:none;
}
/*---------------------------
		Structure
-----------------------------*/
#wrapper{
    width:1050px;
    margin:40px auto 0 auto;
}
#topindex{
    background-image:url(../images/bg_topindex.png);
}
#topindextop{
    height:1px;
    width:1px;
}
#logo{
    position:absolute;
}
#purple, #content{
    float:left;
    width:940px;
    margin:15px 45px 0 65px;
    background-image:url(../images/bg_purple_middle.gif);
}
#purpletop, #purplebottom, #contenttop, #contentbottom{
    width:940px;
    height:19px;
}
#purpletop, #contenttop{
    background-image:url(../images/bg_purple_top.gif);
}
#purplebottom, #contentbottom{
    background-image:url(../images/bg_purple_bottom.gif);
}
#purpletext{
    margin-left:220px;
    width:250px;
}
#purpletextwide{
    margin-left:220px;
    width:700px;
}
#mainimage{
    position:absolute;
    margin:46px 0 0 545px;
    z-index:1000;
}
#createcert{
    margin:35px 0 0 65px;
}
#topindexbottom{
    clear:both;
    width:900px;
    height:1px;
    margin-top:35px;
}
#bottomindex{    
    width:977px;
    margin-left:49px;
}
#samples, #order{
    float:left;
    width:186px;
    height:230px;
    margin-right:3px;
}
#samples{
    background-image:url(../images/see_sample.png);
}
#order{
    background-image:url(../images/order.png);
}
#tags{
    position:absolute;
    z-index:1000;
    margin:5px 0 0 12px;
}
#samples a img{
    margin:190px 0 0 5px;
}
#addinstant{
    float:left;
    width:390px;
    height:230px;
    margin-left:5px;
    margin-right:9px;
    background-image:url(../images/bg_bottomindex_wide.png);
}
#addphotos{
    position:absolute;
    z-index:1000;
    margin:5px 0 0 0;
}
#addinstant a img{
    margin:190px 0 0 8px;
}
#envelope{
    position:absolute;
    margin:30px 0 0 3px;
}
#order a img{
    position:absolute;
    margin:190px 0 0 5px;
    z-index:1000;
}
#paypal{
    float:left;
    background-image:url(../images/bg_bottomindex_narrow.png);
    width:186px;
    height:230px;
    margin-left:9px;
}
#paypallogo{
    margin:30px 0 0 11px;
}
#creditspacer{
    clear:both;
    width:900px;
    height:1px;
}
#credits{
    background-color:#84277A;
    width:954px;
    margin:20px 0 20px 54px;
    height:23px;
    padding:6px;
}
#credits p{
    margin:4px 0 0 20px;
}
#pagetop{
    width:1050px;
    height:48px;
    background-image:url(../images/bg_page_top.png);
}
#pagemiddle{
    width:1050px;
    background-image:url(../images/bg_page_middle.png);
}
#pagemiddlebottom{
    clear:both;
    width:900px;
    height:1px;
}
#pagebottom{
    width:1050px;
    height:20px;
    background-image:url(../images/bg_page_bottom.png);
}
#contenttextleft{
    float:left;
    width:460px;
    margin-left:220px;
}
#contenttextright{
    float:right;
    width:200px;
    margin:40px 20px 0 40px;
}
#contentend{
    clear:both;
    width:1px;
    height:1px;
}
#contentendcontact{
    margin-bottom:20px;
    clear:both;
    width:1px;
    height:1px;
}
#faqs{
    font-size:0.9em;    
}
.leftcol{
    width:110px;
}
.rightcol{
    width:350px;
}
.longtext{
    width:330px;
    padding:0 5px 0 5px;
}
.shorttext{
    width:110px;
    padding:0 5px 0 5px;
}
.longtextarea{
    width:330px;
    height:60px;
    padding:0 5px 0 5px;
}
.radio{
    width:40px;
    text-align:left;
    padding-left:5px;
}
.layoutmiddle,.layoutright{
    padding-left:40px;
}
.colorselect{
    padding-left:0;
}
.fileselector{
    background-color:white;
}
.submitcert{
    margin-top: 25px;
}
#orderform{
    margin-top:25px;
}
.ordercert{
    float:right;
}
#nametable, #fortable, #fromtable, #layouttable, #colortable, #filetable, #addresstable, #postcodetable, #telephonetable, #emailtable, #enquirytable{
    margin:18px 0 18px 0;
}
#contenttextright ul{
    margin-left:20px;
    list-style:outside;
}
#contenttextright p{
    padding-top:15px;
}
#contentwide{
    float:left;
    width:700px;
    margin:0 20px 0 220px;
}
#preview{
    margin: 10px 0 0 20px;
}
#buttons{
    margin-left:25px;
}
#errorback{
    margin-top:40px;
}
#makechanges, #proceed{
    float:left;
    margin:20px 0 10px 15px;
}
#paypalfloat{
    position:absolute;
    z-index:1000;
    margin:385px 0 0 520px;
}
#createcertificate{
    margin:15px 0 0 0;
}
#inspiredtext{
    float:left;
    margin:30px 0 30px 80px;
    width:300px;
}
#inspiredpics{
    float:left;
}
.previous, .next{
    padding-top:40px;
    width:75px;
}
.next{
    padding-left:14px;
}
.previous:hover, .next:hover{
    cursor:pointer;
}
#camera{
    float:left;
    z-index:1200;
    position:absolute;
    margin:215px 0 0 760px;
}
#cameralow{
    float:left;
    z-index:1200;
    position:absolute;
    margin:370px 0 0 760px;
}
#certtilt{
    float:left;
    z-index:1201;
    position:absolute;
    margin:290px 0 0 52px;
}
#certtiltx2{
    float:left;
    z-index:1202;
    position:absolute;
    margin:250px 0 0 85px;
}
#address a p{
    margin:15px 0 20px 0;
}
.submit{
    width:120px;
}
.linkdiv{
    display:block;
    margin:190px 0 0 5px;
    width:170px;
    height:30px;
}
#buttonarea{
    width:460px;
    margin-top:15px;
}
#contshopping{
    float:left;
}
#totals{
    clear:both;
    float:right;
}
.pricelabel{
    width:129px;
}
.subtotal, .vat, .totalamount{
    text-align:left;
    width:69px;
}
#checkout{
    float:right;
}
#paymentdetails{
    width:460px;
}
#country{
    float:right;
    font-size:0.8em;
    margin-right:32px;
}
/*---------------------------
		   Menu
-----------------------------*/
#menu{
    float:right;
    width:700px;
    margin:15px 43px 0 0;
}
#menu ul{
    list-style:none;
}
#menu ul li{
    float:left;
    background-image:url(../images/menu_tab.gif);
    width:114px;
    height:27px;
    margin-left:2px;
    text-align:center;
    padding-top:6px;
}
#menu ul li a{
    text-decoration:none;    
}
/*---------------------------
       Payment Form
-----------------------------*/
.long{
    width:260px;
}
.postcode{
    width:90px;
}
.cvv2, .issuenumber{
    width:45px;
}
#details tr{
    margin:4px 0 4px 0;
}
#payment{
    float:right;
}
/*---------------------------
		  Basket
-----------------------------*/
#basketheader{
    margin-top:25px;
    padding:8px;
    border-bottom:1px #FFFFFF dotted;
}
#basketheader ul{
    list-style:none;
}
#basketheader ul li{    
    float:left;
}
#headerbottom, .rowbottom, .spacerdiv{
    clear:both;
    width:1px;
    height:1px;
}
.basketitem{
    padding:8px;
    border-bottom:1px #FFFFFF dotted;
}
.photo{
    float:left;
    text-align:left;
    width:120px;
}
.description{
    float:left;
    margin-left:8px;
    width:120px;
}
.quantity, .price, .total{
    float:left;
    width:60px;
}
.quantity, .price, .total{
    text-align:center;
}
.quantoption{
    width:24px;
    margin-left:8px;
}

/*---------------------------
		Credits Menu
-----------------------------*/
#creditmenu{
    float:right;
    margin-right:5px;
}
#creditmenu ul{
    list-style:none;
}
#creditmenu ul li{
    float:left;
    padding:0 10px 0 10px;
    text-align:center;
}
#creditmenu ul li a{
    text-decoration:none;
}
#copyright{
    padding-top:1px;
}
/*---------------------------
		 Typography
-----------------------------*/
body{
    font-family:Arial,Helvetica,sans-serif;
}
#menu ul li a{
    color:black;
    font-size:0.7em;
    font-weight:normal;
}
#creditmenu ul li a{
    color:white;
    font-size:0.7em;
}
#creditmenu ul li a:hover{
    text-decoration:underline;
}
#menu ul li a:hover{
    color:white;
}
#purpletext, #purpletextwide{
    color:white;
}
#purpletext p, #purpletextwide p, #content p, table{
    font-size:0.85em;
    line-height:1.5;
    margin:6px 0 6px 0;    
}
#purpletextwide p{
    margin-bottom:20px;
}
#content{
    color:white;
}
#credits p{
    color:white;
    font-size:0.7em;
}
#contenttextright, #contenttextright ul{
    font-size:0.9em;
}
#contenttextright p, #contenttextright ul{
    line-height:1.9;
}
#contentwide p{
    line-height:1.8;
}
#inspiredtext p{
    color:#84277A;
    font-size:0.8em;
    margin:10px 0 10px 0;
}
#address h2{
    font-weight:normal;
    font-size:1.4em;
}
#address a{
    text-decoration:none;
    color:white;
}
#address a:hover{
    text-decoration:underline;
}
#basketheader, .basketitem{
    font-size:0.8em;
}
.selected{
    color:white;
}
.bold, #basketheader{
    font-weight:bold;
}
.violet{
    color:#BB9ECA;
    font-weight:bold;
}
.larger{
    font-weight:bold;
    font-size:1.2em;
}