/* Winchelsea Designs General Stylesheet January 2011 written by Peter King - Rules by Classes */



/*  ========== BELOW ARE RULES RELATING TO BASIC PAGE STRUCTURE ==========  */


 body { 

background:#292929;
font-family:Arial, Helvetica, Verdana, sans-serif;
color:#ffffff;
text-align:center;
direction:ltr;
margin:0;
padding:0;

} 

#container {

width:930px;
margin-left:auto;
margin-right:auto;

}

/* Containing envelope 930px wide used for all page content */


/* ========== BELOW ARE RULES RELATING TO TITLE SECTION ========== */
 
#sitetitle {

float:left;
width:620px;
padding-top:25px;
padding-bottom:10px;
text-align:left;

}

/* Website title floated left at top of page */


#viewbasket {

margin-left:640px;
padding:10px 10px 0 10px;
text-align:center; 

} 

/* Div showing contents of Shopping Basket at top right of page */

#basket {

margin-bottom:10px;

}

/* Shopping Basket image within viewbasket div at top right of page */

#currencychange {
 
font-size:12px;
color:#ffff00;
text-align:center;

}

/* Warning note within viewbasket div regarding change to another currency used on reset page */ 

/*  ========== END OF RULES RELATING TO TITLE SECTION ========== */


/*  ========== BELOW ARE RULES RELATING TO NAVIGATION BAR ========== */  
	   

#navbar {

width:100%;
padding:10px 0 10px 0;
background:#556677;
    background: -webkit-gradient(linear, left top, left bottom, from(#8899aa), to(#556677));
    background: -moz-linear-gradient(top,  #8899aa,  #556677);
border:1px outset #556677;	
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
    border-radius:4px;
clear:both;

}

/* Div holding ul #navlist */

#navlist {

list-style:none;
padding:0;
margin:0;
text-align:left;

}

#navlist li {

display:inline;
font-size:24px;

}

#navlist a {

font-size:24px;
text-decoration:none;
color:#ffffff;
padding:10px 25px 10px 25px;

}

#navlist a:hover {

background:#485965;
    background: -webkit-gradient(linear, left top, left bottom, from(#788995), to(#384955));
    background: -moz-linear-gradient(top,  #788995,  #384955);

}

#navlist a#active {

color:#aabbcc;

}

/* ========== END OF RULES RELATING TO NAVIGATION BAR ========== */


/* ========== BELOW ARE RULES RELATING TO MAIN CONTENT SECTION OF PAGE ========== */

#main {

float:left;
width:620px;
text-align:center;
margin-top:10px;

}

/* Wrapper containing main content section of each page floated left */

.panel290 {

width:290px;
display: inline;
float: left;
position: relative;
margin-right:10px;
margin-bottom: 10px;
text-align:center;

}

/* Panel containing thumbnail image and centralised caption on Cards and Prints index pages */

#panel615 {

width:615px;
display: inline;
float: left;
position: relative;
margin-bottom: 15px;
text-align:center;

}

/* Panel containing image and centralised caption on individual Cards and Prints pages */

.paneltext {

text-align:justify;

}

/* Text block within panel above when panel not used for image and caption */

.faalinkimg {

float:left;
margin-right:15px;
border:1px outset #cccccc;

}

/* Image linking to FAA Giclee Prints and Digital Cards pages */

.addtobasket {

padding-top:10px;
padding-bottom:10px;

}

/* Div wrapping buttons on cards and prints pages giving padding at top and bottom - For IE to work properly */

#gallerywrap {

margin-top:20px;

}

/* Div wrapping Gallery on FAA Cards and Prints pages giving a margin at the top */
		 
#gallery {

width:100%;
list-style-type:none;
margin-left:0;
padding-left:0;
display:inline;

}

/* Div containing image gallery on FAA Cards and Prints pages */

#gallery li {

background:#556677;
border-color:#dddddd #bbbbbb #aaaaaa #cccccc;
border-style:solid;
border-width:1px;
color:inherit;
display:inline;
float:left;
margin-right:3px;
margin-top:3px;
padding:4px;
position:relative;

}

/* Individual gallery items on FAA Cards and Prints pages */

#gallery img {

background:#ffffff;
border-color:#aaaaaa #cccccc #dddddd #bbbbbb;
border-style:solid;
border-width:1px;
padding:2px;
vertical-align:top;
width:100px;
height:100px;

}

/* Images within the above gallery items */

/* ========== END OF RULES RELATING TO MAIN CONTENT SECTION OF PAGE ========== */


/* ========== BELOW ARE RULES RELATING TO RIGHT-HAND COLUMN ON PAGE ========== */

#right  {

margin-top:10px;
margin-left:640px;

}

/* Right-hand column wrapper on each page */


#pagetitle {

font-size:24px;
font-weight:normal;
text-align:center;
margin-top:15px;
margin-bottom:20px;

}

/* Title of each page above description in right-hand column */


#righttext {

padding-left:20px;
padding-right:20px;
padding-bottom:10px;
text-align:justify;

}

/* Text block within right-hand column */

#currency {

margin-top:20px;
font-size:15px;
border:1px solid #ffffff;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
border-radius:4px;	

}

/* Section relating to payment in other currencies in right-hand column */

#currency2 {

font-size:15px;
font-weight:bold;
color:#ffffff;
background:#556677;
    background: -webkit-gradient(linear, left top, left bottom, from(#778899), to(#556677));
    background: -moz-linear-gradient(top,  #778899,  #556677);
border:1px outset #556677;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
border-radius:4px;	

}

/* Section relating to choice of currencies in right-hand column on site index page only */

.note {

border:1px outset #ffffff;

}

/* Border around image of banknote in currency section */

/* ========== END OF RULES RELATING TO RIGHT-HAND COLUMN ========== */


/* ========== BELOW ARE RULES RELATING TO THE FOOT OF EACH PAGE ========== */

#foot {
 
width:100%;
margin-top:20px;

}

/* Div containing section at foot of each page */

#copyright {

font-size:10px;
text-align:center;
margin-top:10px;
margin-bottom:10px;

}

/* Copyright Statement at foot of each page */

/* ========== END OF RULES RELATING TO THE FOOT OF EACH PAGE ========== */


/* ========== BELOW ARE OTHER GENERAL STRUCTURAL AND LINK ELEMENTS ========== */

.clear {
	
clear:both;
content:' ';
display:block;
font-size:0;
line-height:0;
overflow:hidden;
visibility:hidden;
width:0;
height:0;

} 

/* Divs or paragraphs used as horizontal spacer elements clearing both sides */

a {

color:#ffffff;
text-decoration:none;

}

/* Text links not underlined unless specifically stated */

a:hover {

text-decoration:underline;

}

/* Underline on text links when mouse hovers unless specifically stated */

a img {

border:none;

}

/* No borders on image links */

/* ========== END OF RULES RELATING TO GENERAL STRUCTURAL AND LINK ELEMENTS ========== */


/* ========== BELOW ARE OTHER GENERAL RULES RELATING TO TEXT, IMAGES AND BUTTONS ========== */

.text {

font-size:15px;

}

/* Regular captions and text */

.textbold {

font-size:15px;
font-weight:bold;

}

/* Regular captions & text bold  */ 

.minitext {

font-size:12px;

}

/* Small size text */

.image {

margin-top:20px;
border:1px outset #cccccc;

}

/* Margin above and border around image */

.mini {

margin-top:20px;
border:1px outset #cccccc;

}

/* Margin above and border around thumbnail images */

.title {

font-size:18px;
margin-top:10px;
margin-bottom:5px;

}

/* Title below thumbnail images */

.button  a {

font-size:15px;
color:#ffffff;
background:#0078a5;
    background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
    background: -moz-linear-gradient(top,  #00adee,  #0078a5);
padding-left:15px;
padding-top:7px;
padding-right:15px;
padding-bottom:7px;
border:1px outset #00678e;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
border-radius:4px;	

}

/* Blue Link Button */

.button  a:hover {

font-size:15px;
color:#ffffff;
text-decoration:none;
background:#00476e;
    background: -webkit-gradient(linear, left top, left bottom, from(#0095ff), to(#00476e));
    background: -moz-linear-gradient(top,  #0095ff,  #00476e);
padding-left:15px;
padding-top:7px;
padding-right:15px;
padding-bottom:7px;
border:1px inset #00678e;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
border-radius:4px;	

}

/* Blue Link Button when hovering */

.greenbutton  a {

font-size:15px;
color:#ffffff;
background:#8fc957;
    background: -webkit-gradient(linear, left top, left bottom, from(#8fc957), to(#5c9425));
    background: -moz-linear-gradient(top,  #8fc957,  #5c9425);
padding-left:15px;
padding-top:7px;
padding-right:15px;
padding-bottom:7px;
border:1px outset #8fc957;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
border-radius:4px;	

}

/* Green Link Button */

.greenbutton  a:hover {

font-size:15px;
color:#ffffff;
text-decoration:none;
background:#8fbb44;
    background: -webkit-gradient(linear, left top, left bottom, from(#8fbb44), to(#5c8825));
    background: -moz-linear-gradient(top,  #8fbb44,  #5c8825);
padding-left:15px;
padding-top:7px;
padding-right:15px;
padding-bottom:7px;
border:1px inset #8fbb44;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
border-radius:4px;	

}

/* Green Link Button when hovering */

.linkbutton  a {

font-size:16px;
color:#292929;
background:#ffffff;
    background: -webkit-gradient(linear, left top, left bottom, from(ffffff), to(#f0f0f0));
    background: -moz-linear-gradient(top,  #ffffff,  #f0f0f0);
padding-left:15px;
padding-top:7px;
padding-right:15px;
padding-bottom:7px;
border:1px outset #cccccc;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
border-radius:4px;	

}

/* Misc Link Button */

.linkbutton  a:hover {

font-size:16px;
color:#292929;
text-decoration:none;
background:#f0f0f0;
    background: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#eeeeee));
    background: -moz-linear-gradient(top,  #f0f0f0,  #eeeeee);
padding-left:15px;
padding-top:7px;
padding-right:15px;
padding-bottom:7px;
border:1px inset #cccccc;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
border-radius:4px;	

}

/* Misc Link Button when hovering */

.minibutton  a {

font-size:11px;
font-weight:bold;
color:#ffffff;
background:#292929;
    background: -webkit-gradient(linear, left top, left bottom, from(494949), to(#292929));
    background: -moz-linear-gradient(top,  #494949,  #292929);
padding-left:5px;
padding-top:3px;
padding-right:5px;
padding-bottom:3px;
margin-left:5px;
margin-right:5px;
border:1px outset #cccccc;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
border-radius:4px;	

}

/* Mini Link Button */

.minibutton  a:hover {

font-size:11px;
font-weight:bold;
color:#ffffff;
text-decoration:none;
background:#191919;
    background: -webkit-gradient(linear, left top, left bottom, from(#393939), to(#191919));
    background: -moz-linear-gradient(top,  #393939,  #191919);
padding-left:5px;
padding-top:3px;
padding-right:5px;
padding-bottom:3px;
margin-left:5px;
margin-right:5px;
border:1px inset #cccccc;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    -khtml-border-radius:4px;
border-radius:4px;	

}

/* Mini Link Button when hovering */


/* ========== BELOW ARE STYLES SPECIFICALLY FOR CHECKOUT PAGES ========== */

#checkout { 

background:#ffffff;
font-family:Arial, Helvetica, Verdana, sans-serif;
color:#043163;
text-align:center;
direction: ltr;
margin:0;
padding:0;

} 

/* Body of Basket, Cardscustomer and Cardspay pages only with white background and dark text */

#shoppingbasket2 {

width:100%;
margin-top:10px; 
margin-left:auto;
margin-right:auto;
font-size:13px;
color:#ffffff;
text-align:center;

}

/* Shoppingbasket2 is the notice at head of Shopping Basket page regarding contents of Shopping Basket. */

#basketcontents {

width:100%;
margin-top:20px;
margin-left:auto;
margin-right:auto;
font-size:15px;
background:#ffffff;
color:#333333;
text-align:center;

}

/* The div containing the dynamically generated basket contents on the Shopping Basket Page */

#sectionheader {

width:100%;
font-size:13px;
font-weight:bold;
color:#043163;
text-align:center;
padding-bottom:2px;

}

/* Section header contains the descriptive headings for the dynamically generated basket contents */

#basketcontents table td {

width:155px;
padding-top:5px;
padding-bottom:5px;

}

/* Detailed dynamically generated contents of Shopping Basket set out as a table with cells 155px wide */

#linkbuttons {

padding-top:10px;
padding-bottom:10px;
text-align:center;

}

/* Div wrapping the 3 buttons at the foot of the Basket page */

#midlink {

margin-left:50px;
margin-right:50px;

}

/* Margin to left and right of the central button at the foot of the Basket page */

#paypalbutton {

background:#8fc857;
padding: 1px 20px 1px 20px;
border:1px outset #8fc857;

}

/* Borders and background-colour around PayPal link button on Cardspay page only */


        


/*  PK 4th February 2011  */


        

        






