/*Scotland in Picture
*/
/*@import "lightbox.css";*/
@import "lhs.css";

body {
background: none;
background-color:#f4f4f4;
font-family: Arial,Helvetica,sans-serif,"MS sans serif";
color: #000066;
font-size:82.5%;
margin: 0px;
padding: 0px;
text-align: center; 
}

p{font-family: Arial, Helvetica, sans-serif, "MS sans serif";}

textarea{font-size: 0.85em; font-family: Verdana, Arial}

/***************** genereal links *****************/
a.para_links:link   {font-family:Arial,Helvetica,sans-serif,"MS sans serif";text-decoration:underline;color:#000066;background-color:transparent;}
a.para_links:visited{font-family:Arial,Helvetica,sans-serif,"MS sans serif";text-decoration:underline;color:#000066;background-color:transparent;}
a.para_links:active {font-family:Arial,Helvetica,sans-serif,"MS sans serif";text-decoration:underline;color:#000066;background-color:transparent;}
a.para_links:hover  {font-family:Arial,Helvetica,sans-serif,"MS sans serif";color:#000066;background-color:#85A6D7;}

i.caption {font-size:x-small; text-align:right;}
/* BORDERS */

.border_grey { border-style:solid; border-width:1px; border-color:#999999; }

/* SHOPPING CART */

.cellMain {background-color:#85A6D7; font-weight:bold; border-bottom-style:solid; border-bottom-width:1px; border-bottom-color:#999999; border-right-style:solid; border-right-width:1px; border-right-color:#999999; }
.rowEnd { font-weight:bold;  border-bottom-style:solid; border-bottom-width:1px; border-bottom-color:#999999; }
.cartTable { border-top-style:solid; border-top-width:1px; border-top-color:#999999; }

h1{color:#336699;padding-bottom:0; margin-bottom:0;font-size: 1.8em;}
h2{color:#336699;padding-bottom:0; margin-bottom:0;font-size: 1.6em;}
h3{color:#336699;padding-bottom:0; margin-bottom:0;font-size: 1.4em;}

.front{text-align:right; margin:0; padding-right:0;}


/* divs */
 #wrapper
{padding-left:10px; padding-right:10px;  padding-bottom:10px;  padding-top:10px;  margin:0; text-align:center;
margin: 0 auto;
min-width: 900px;
width:90%;
max-width:1100px;
border: 1px solid #ccc;
background-color:#FFFFFF;
}

#headers_container  {
background-color:#fff;
border-bottom: 1px solid #ccc;
padding-bottom: 5px; 
}

#toprow  {
font-size: 0.9em;
text-align: left;
background-color:#336699;
background-position:left;
background-repeat: repeat-y;
border-top: 1px solid #fff;
border-left: 0px solid #fff;
border-right: 0px solid #fff;
border-bottom: 1px solid #fff;
min-width: 800px;
min-height:0.9em;
}

#subhead  {
font-family: Verdana, Arial,Helvetica,sans-serif,"MS sans serif";
font-size: 0.9em;
clear: both;
text-align: left;
font-weight:bold;
color:#ffffff;
background-color:#336699;
border-top: 1px solid #fff;
border-left: 0px solid #fff;
border-right: 0px solid #fff;
border-bottom: 1px solid #fff;
min-width: 800px;
}

#bottomrow  {
font-family: Verdana, Arial,Helvetica,sans-serif,"MS sans serif";
font-size: 0.9em;
clear: both;
text-align: center;
background-color:#FFFFFF;
margin-top:5px;
margin-bottom:5px;
padding-top:5px;
padding-bottom:5px;
border-top: 1px solid #336699;
border-left: 0px solid #ccc;
border-right: 0px solid #ccc;
border-bottom: 1px solid #336699;
min-width: 800px;
}

#bannercontainercontainer { border:0; text-align:left; }

#bannercontainer {
background:none;
background-color:#ffffff; 
background-position: top left;
background-repeat:no-repeat; 
height:120px; 
}


#bannerleft  {
background-repeat:no-repeat; 
min-width:215px; 
text-align: left;
float:left;
}

#bannerright  {
text-align: right;
float:right; 
min-width:680px; 
background-repeat:no-repeat;
border:0;
margin:0;
padding:0;
width:410px; 
}


#container {float: left; width:84%; min-width: 800px; text-align: left; 	 
padding-left:20px; padding-right:0px;background-color:#FFFFFF;
min-height:300px;}

#navigation{text-align:left;background-color: #FFFFFF; float: left;width: 10%; display:block; }
.nav{background-color: #FFFFFF;  padding-left: 2px;padding-bottom: 2px; padding-top: 2px; border-top: 0px solid #CCC; border-bottom: 1px solid #CCC;  margin-bottom:2px;}
.nav:hover{background-color: #85A6D7;}

.front_cont{width:100%; margin-top:5px;  display:block; }
.left{float:left; width: 45%; text-align:left; display:block;}
.right{float:right; width: 51%; text-align:left; display:block;}
.front_bottom_cont{width:100%; margin-top:5px; display:block; float:right;}

.container_gifts{width:100%; display:block; background:#000099; vertical-align:top; }
.gifts{float:left; text-align:left; vertical-align:top; margin:2px; }

.details_img{float:left; width:100%; vertical-align:top;}
.details_container{float:left;width:100%; min-width:790px;}
.details_size{float:left; margin-right:20px;}
.details_pricing{float:left; border:solid 1px #999999;background:#ffffff;}

#txtHint{background-color: #FFFFFF;}
#txtHint2{background-color: #FFFFFF;}
#txtHint2{background-color: #FFFFFF;}

#textFeild{background-color: #FFFFFF;}

#cartPrice{background-color: #FFFFFF;}

#error,
.status,
.explanation_note{margin:0 10px 10px 10px;padding:10px;border:solid 1px #dd3c10;background:#ffebe8;}
.created{margin:0 20px 20px;}

.hidden
{
background-color:#FF0000;
visibility:hidden;
}

#footer_container {
border: 0;
font-style: normal;
font-weight: normal;
padding: 0px;
width: 100%;
margin: 0px auto;
}
#footer1{text-align: center;}
#footer2{font-family: Verdana, Arial,Helvetica,sans-serif,"MS sans serif"; text-align: right; font-size: 0.75em;}
	
img.noborder
{
border: 0 none;
}

form{margin: 0;}

img.frame {

background:#FFFFFF none repeat scroll 0 0;

border:4px double #999999;

}


img.grid
{
background:#FFFFFF; 
border-color:#666666;
border-style: double;
border-width:4px;
}



/* differences refers to the hover divs on the image page*/

.differences {
	margin:0.25em;
	padding:0;
	list-style:none;
	width:100%;
	float:left;
	color:#FFFFFF;
	min-width:220px;
	min-height:220px;
	}
	


.differences li{
	margin:0.25em;
	min-width:220px;
	min-height:220px;
	padding:0;
	float:left;
	background:url(../images/diff-tabs-top-wide.gif) no-repeat 0 100%;
	}
	

.differences li#diff {
margin-right:0;
}


.picture_grid{
text-align:center;
}

.img_grid{
	list-style:none;
	text-align:center;
	min-width:220px;
	min-height:220px;
	float:left;
	color:#FFFFFF;
}

.cat_grid{
margin:0.5em;
	padding:0;
	list-style:none;
	text-align:center;
	float:left;
	color:#000000;
}


.differences div {
	font-size:0.94em;
	padding:0;
	min-width:220px;
	min-height:220px;
	background:url(../images/diff-tabs-bottom-wide.gif) no-repeat 0 100%;
	}
	
	/* for Internet Explorer */
/*\*/
* html .differences div {
height: 220px;
}
/**/
	
.differences li:hover{
	background-position:0 100%;

	}
	
.differences a:hover {
	background-position:0 100%;
	
	}	
.differences li:hover div {
	background-position:-220px 100%;
	}
	
	
#differences p {
	margin:0;
	width:144px;
	min-height:8em;
	padding:0 0 27px 0;
	background-repeat:no-repeat;
	background-position:50% 100%;
	}


table.offers  {
border:thin;
border: 1px solid #EEEEEE;
font-size: 80%;
width:100%;


}

table.offers tr { vertical-align: top;
text-align: left; }

td.offers{
border: 1px solid #EEEEEE;
background-color:#EEEEEE;
height:118px;
}

td.offers2{
width:150px;
background-color:#EEEEEE;
border: 1px solid #EEEEEE;
height:118px;

}

table.cart  {
border:thin;
border-color:#EEEEEE;
font-size: 100%;
width:80%;
margin: 2%;

}

table.cart tr { vertical-align: top;
text-align: left; }

table.cart td, th {

border: 1px solid #EEEEEE;
padding: 1px;

}

table.price  {
border:solid;
border-color:#000000;
font-size: 100%;
margin: 2%;
}
table.price td, th, tr {
color:#000066;
border: 1px solid #333;
padding: 1px;

}

caption
{background-color:#85A6D7;
text-align:left;
font-weight:bold;
}



.flash {
position: absolute;
    z-index: 0;

}

/* trigger button */
.download_now {
display:block;
cursor:pointer;


}

/* mouseover state */
.download_now:hover {
	background-position:0 -88px ;	
}

/* clicked state */
.download_now:focus {
	background-position:0 -88px;
}

/* tooltip styling */
.tooltip {
	display:none;
	background:url(images/black_arrow_big.png);
	height:260px;
	width:445px;
	color:#fff;
	font-weight:normal;
	z-index:50000;
	position: absolute;
}

/* tooltip styling */
.tooltip2 {
	display:none;
	/*background:url(images/black_arrow_big.png);*/
	height:320px;
	width:220px;
	color:#fff;
	font-weight:normal;
}





/* the overlayed element */ 
.simple_overlay { 
     
    /* must be initially hidden */ 
    display:none; 
     
    /* place overlay on top of other elements */ 
    z-index:10; 
     
    /* styling */ 
    background-color:#FFFFFF; 
     
    width:375px;     
    min-height:140px; 
    border:1px solid #666; 
     
    /* CSS3 styling for latest browsers */ 
    -moz-box-shadow:0 0 90px 5px #000; 
    -webkit-box-shadow: 0 0 90px #000;     
} 
 
/* close button positioned on upper right corner */ 
.simple_overlay .close { 
    background-image:url(images/close.png); 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}

/* styling for elements inside overlay */ 
.details { 
    position:absolute; 
    top:15px; 
    right:15px; 
    font-size:11px; 
    color:#000; 
    width:150px; 
} 
 
.details h3 { 
    color:#336699; 
    font-size:15px; 
    margin:0 0 -10px 0; 
}

/* get rid of those system borders being generated for A tags 
a:active {
  outline:none;
}*/

:focus {
  -moz-outline-style:none;
}



/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 680px;
	height:120px;

	/* custom decorations */
	border:1px solid #ccc;
	/*background:url(http://flowplayer.org/tools/img/global/gradient/h300.png) repeat-x;*/
}

/*
	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;
}

/* single scrollable item */
.scrollable img {
	float:left;
	margin:20px 5px 20px 21px;
	background-color:#fff;
	padding:2px;
	border:1px solid #ccc;
	cursor:pointer;
	width:100px;
	height:75px;
	
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}

/* active item */
.scrollable .active {
	border:2px solid #CCC;
	z-index:9999;
	position:relative;
}


/* this makes it possible to add next button beside scrollable */
.scrollable {
	float:left;	
}

div.scrollable div.items a { 
    float: left;
    display: block;
    text-align: center;
}


/* prev, next, prevPage and nextPage buttons */
a.browse {
	background:url(images/hori_large.png) no-repeat;
	display:block;
	width:30px;
	height:30px;
	float:left;
	margin:40px 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; }

/* up and down */
a.up, a.down		{ 
	background:url(images/vert_large.png) no-repeat; 
	float: none;
	margin: 10px 50px;
}

/* up */
a.up:hover  		{ background-position:-30px 0; }
a.up:active  		{ background-position:-60px 0; }

/* down */
a.down 				{ background-position: 0 -30px; }
a.down:hover  		{ background-position:-30px -30px; }
a.down:active  	{ background-position:-60px -30px; } 


/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
} 	


/* the overlayed element */
.simple_overlay {
	
	/* must be initially hidden */
	display:none;
	
	/* place overlay on top of other elements */
	z-index:10000;
	
	/* styling */
	background-color:#333;
	
	width:675px;	
	min-height:200px;
	border:1px solid #666;
	
	/* CSS3 styling for latest browsers */
	-moz-box-shadow:0 0 90px 5px #000;
	-webkit-box-shadow: 0 0 90px #000;	
}

/* close button positioned on upper right corner */
.simple_overlay .close {
	background-image:url(images/close.png);
	position:absolute;
	right:-15px;
	top:-15px;
	cursor:pointer;
	height:35px;
	width:35px;
}


/* the large image. we use a gray border around it */
#img {
	border:1px solid #666;
}

/* "next image" and "prev image" links */
.next, .prev {
	
	/* absolute positioning relative to the overlay */
	position:absolute;
	top:40%;	
	border:1px solid #666;	
	cursor:pointer;
	display:block;
	padding:10px 20px;
	color:#fff;
	font-size:11px;
	
	/* upcoming CSS3 features */
	-moz-border-radius:5px;
	-webkit-border-radius:5px;	
}

.prev {
	left:0;
	border-left:0;
	-moz-border-radius-topleft:0;
	-moz-border-radius-bottomleft:0;
	-webkit-border-bottom-left-radius:0;
	-webkit-border-top-left-radius:0;
}

.next {
	right:0;
	border-right:0;
	-moz-border-radius-topright:0;
	-moz-border-radius-bottomright:0;
	-webkit-border-bottom-right-radius:0;
	-webkit-border-top-right-radius:0;	
}

.next:hover, .prev:hover {
	text-decoration:underline;
	background-color:#000;
}

/* when there is no next or previous link available this class is added */
.disabled {
	visibility:hidden;		
}

/* the "information box" */
.info {
	position:absolute;
	bottom:0;
	left:0;	
	padding:10px 15px;
	color:#fff;
	font-size:11px;
	border-top:1px solid #666;
}

.info strong {
	display:block;	
}

/* progress indicator (animated gif). should be initially hidden */
.progress {
	position:absolute;
	top:45%;
	left:50%;
	display:none;
}

/* everybody should know about RGBA colors. */
.next, .prev, .info {
	background:#333 !important;
	background:rgba(0, 0, 0, 0.6) url(images/h80.png) repeat-x;		
}


/* the thumbnails */
#triggers {
	text-align:center;
}

#triggers img {
	background-color:#fff;
	padding:2px;
	border:1px solid #ccc;
	margin:15px 2px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}

/* the active thumbnail */
#triggers a.active img {
	outline:1px solid #000;

	/* show on top of the expose mask */
	z-index:9999;
	position:relative;
}


/* root element for tabs  */
ul.css-tabs {  
	margin:0 !important; 
	padding:0;
	height:30px;
	border-bottom:1px solid #999;	 	
}

/* single tab */
ul.css-tabs li {  
	float:left;	 
	padding:0; 
	margin:0;  
	list-style-type:none;	
}

/* link inside the tab. uses a background image */
ul.css-tabs a { 
	float:left;
	font-size:13px;
	display:block;
	padding:5px 30px;	
	text-decoration:none;
	border:1px solid #CCC;	
	border-bottom:0px;
	height:18px;
	background-color:#efefef;
	color:#777;
	margin-right:2px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright:4px;
	position:relative;
	top:1px;	
}

ul.css-tabs a:hover {
	background-color:#F7F7F7;
	color:#333;
}
	
/* selected tab */
ul.css-tabs a.current {
	background-color:#ddd;
	border-bottom:1px solid #CCC;	
	color:#000;	
	cursor:default;
}

	
/* tab pane */
div.css-panes div {
	display:none;
	border:1px solid #CCC;
	border-width:0 1px 1px 1px;
	min-height:150px;
	padding:15px 20px;
	background-color:#FFF;	
}
