/*----------------------------------------------------
	
	SCREEN.CSS
	
	SITE: http://www.calvagservices.co.uk
	CREATED: Thu 02.09.10 @ 16:07
	AUTHOR: Kean Richmond
	
----------------------------------------------------*/

@import url("reset.css");


/*--- 00. Common Elements ---------------------------------------------------------------------------*/

body						{background:#6F9D43; color:#FFFFFF; font-family:Arial, Helvetica, sans-serif; font-size:62.5%;}

a							{color:#FFFCB3;}
a:hover						{color:#2A4510;}

/*--- 01. Heading ---------------------------------------------------------------------------*/

h1							{font-family:Georgia, "Times New Roman", Times, serif; font-size:3em; padding:32px 0 3px 0; text-shadow:rgba(0,0,0,0.16) 1px 1px 0;}
h2							{font-family:Georgia, "Times New Roman", Times, serif; font-size:2em; padding:32px 0 3px 0; text-shadow:rgba(0,0,0,0.16) 1px 1px 0;}
h6							{font-size:1.2em; font-weight:bold; margin:15px 0 0 0;}


/*--- 02. Main Layout ---------------------------------------------------------------------------*/

#main-container				{background:url(/img/_bkg.png) center top no-repeat; margin:0 auto; padding:0 10px; position:relative; width:940px;}
#content-container			{padding:193px 0 0 0;}


/*--- 03. Header ---------------------------------------------------------------------------*/

#header						{height:193px; left:0; position:absolute; top:0; width:100%;}
#logo						{display:block; margin:42px auto 34px auto; width:267px;}


/*--- 04. Navigation ---------------------------------------------------------------------------*/

#nav						{margin:0 auto; width:717px;}
#nav li						{float:left;}
#nav a						{color:#FFFFFF; display:block; font-family:Georgia, "Times New Roman", Times, serif; font-size:1.4em; margin:0 10px; padding:7px 21px; text-decoration:none; text-shadow:rgba(0,0,0,0.16) 1px 1px 0;}
#nav a.current				{color:#FFFCB3;}
#nav a.current,
#nav a:hover				{background:#87AD56; background:rgba(0,0,0,0); background-image:-moz-linear-gradient(100% 100% 90deg, rgba(255,255,255,0.1), rgba(0,0,0,0.09)); background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,0.09)), to(rgba(255,255,255,0.1))); -moz-border-radius:20px; border-radius:20px; -moz-box-shadow:inset 1px 1px 0 rgba(0,0,0,0.16), 1px 1px 0 rgba(255,255,255,0.35); -webkit-box-shadow:/*inset 1px 1px 0 rgba(0,0,0,0.16),*/ 1px 1px 0 rgba(255,255,255,0.35); box-shadow:inset 1px 1px 0 rgba(0,0,0,0.16), 1px 1px 0 rgba(255,255,255,0.35); 
}


/*--- 05. Content ---------------------------------------------------------------------------*/

#content					{background:url(/img/_divider.png) center top no-repeat; font-size:1.2em; height:100%; overflow:hidden; padding:0 60px;}
#content p					{line-height:1.5em; padding:8px 0;}
#content .colorbox			{float:right; margin:10px 0 10px 10px; text-decoration:none;}
#content .colorbox span		{display:block; font-size:0.9em; font-weight:bold; margin:5px 0 0 0; text-align:center;}
#content img				{border:10px solid #B7CEA1; border:10px solid rgba(255,255,255,0.5);}

#content ul					{margin:10px 0 10px 6px;}
#content ul li				{background:url(/img/_bullet.jpg) 0 8px no-repeat; padding:2px 0 1px 14px;}


/*--- 06. Index Page ---------------------------------------------------------------------------*/

#banner 					{border:15px solid #B7CEA1; border:15px solid rgba(255,255,255,0.5); display:block; font-size:1.2em; height:300px; margin:0 0 47px 0; overflow:hidden; position:relative; width:910px;}
#banner li 					{background:url(/img/_banner_img.jpg) no-repeat; display:inline; float:left; height:300px; overflow:hidden; position:relative; width:750px;}
#banner span				{background:url(/img/_banner_tabs.png) no-repeat; cursor:pointer; display:block; float:left; height:300px; position:relative; text-indent:-9999px; width:51px; z-index:5;}
#banner div					{background:#000000; background:rgba(0,0,0,0.6); left:40px; margin:17px 0 0 -11px; padding:17px 40px; position:absolute; text-shadow:1px 1px 0 #000000; top:0; width:295px;}
#banner h2					{font-family:Georgia, "Times New Roman", Times, serif; font-size:2em; margin:0 0 1px 0; padding:0;}
#banner p					{line-height:1.5em; padding:8px 0;}
#banner a					{color:#FFFFFF; text-decoration:none;}
#banner a:hover				{color:#FFFCB3;}
#banner p a					{background:url(/img/_arrow_right.png) no-repeat; padding:1px 0 1px 23px;}
#banner p a:hover			{background-position:0 -17px;}
#banner li#building,
#building span				{background-position:0 -300px;}
#banner li#agricultural,
#agricultural span			{background-position:0 -600px;}
#banner li#gardening,
#gardening span				{background-position:0 -900px;}
#banner li#animal,
#animal span				{background-position:0 -1200px;}

#index #content				{background:0; padding:0 40px; -moz-column-width:260px; -webkit-column-width:260px; column-width:260px; -moz-column-gap:40px; -webkit-column-gap:40px; column-gap:40px;}


/*--- 07. Location Page ---------------------------------------------------------------------------*/

#map						{border:15px solid #B7CEA1; float:left; height:450px; margin:20px 0 0 0; width:550px;}


/*--- 08. Catalogue Page ---------------------------------------------------------------------------*/

#content ul#catalogue-list	{height:100%; margin:30px 0 0 -20px; overflow:hidden; padding:0;}
#content ul#catalogue-list li	{background:0; float:left; margin:0 0 20px 20px; padding:0;}
#catalogue-list a			{border:10px solid #B7CEA1; border:10px solid rgba(255,255,255,0.5); display:block; height:220px; overflow:hidden; position:relative; text-decoration:none; width:220px;}
#catalogue-list img			{border:0; float:none; margin:0;}
#catalogue-list span		{background:#517C28; background:rgba(0,0,0,0.7); bottom:0; color:#FFFFFF; font-weight:bold; left:0; padding:10px 0; position:absolute; text-align:center; width:100%}
#catalogue-list a:hover	span	{color:#FFFCB3;}

.link-return				{background:url(/img/_arrow_right.png) no-repeat; color:#FFFFFF; padding:1px 0 1px 23px; text-decoration:none;}
.link-return:hover			{background-position:0 -17px; color:#FFFCB3;}


/*--- 09. Contact Page ---------------------------------------------------------------------------*/

#contact form				{float:left; margin:20px 0 0 0; width:580px;}


/*--- 10. Sidebar ---------------------------------------------------------------------------*/

#sidebar					{float:right; margin:19px 0 0 0; width:220px;}
#sidebar h6					{margin:3px 0 1px 0;}
#sidebar p					{padding-top:0;}
#sidebar p span				{float:left; width:77px;}


/*--- 50. Footer ---------------------------------------------------------------------------*/

#footer						{background:url(/img/_footer_bkg.png) no-repeat; font-family:Georgia, "Times New Roman", Times, serif; font-size:1.2em; margin:50px 0 0 0; padding:42px 0 36px 0; text-align:center;}
#footer h6					{background:url(/img/_text.png) no-repeat; height:23px; margin:0 auto 12px auto; text-indent:-9999px; width:191px;}
#footer h6 + p				{text-shadow:rgba(0,0,0,0.16) 1px 1px 0;}
#copyright,
#bronco						{color:#DBE6D0; color:rgba(255,255,255,0.75); line-height:1.5em; padding:32px 0 0 0;}
#bronco						{padding:0;}
#bronco a					{color:#DBE6D0; color:rgba(255,255,255,0.75); text-decoration:none;}
#bronco a:hover				{color:#FFFFFF; text-decoration:underline;}


/*--- 51. Form Elements ---------------------------------------------------------------------------*/

#content form p				{height:100%; overflow:hidden; padding:5px 0;}
label						{float:left; font-weight:bold; margin:8px 10px 0 0; width:110px;}
input[type='text'],
textarea					{background:#D6E4C9; border:0; color:#666666; float:left; font-family:Arial, Helvetica, sans-serif; font-size:12px; padding:10px; width:200px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; -moz-box-shadow:inset 1px 1px 0 rgba(0,0,0,0.5);}
textarea					{height:130px; width:260px;}
input[type="text"]:focus,
textarea:focus				{background:#FFFFFF;}

form .required				{background:url(/img/_required.gif) no-repeat; display:block; float:left; height:7px; margin:14px 0 0 10px; text-indent:-9999px; width:44px;}
form .warning				{background:url(/img/icon_warning.png) no-repeat; display:block; float:left; height:16px; margin:9px 0 0 10px; text-indent:-9999px; width:17px;}

.formalign					{margin-left:120px;}
input[type='submit']		{background:url(/img/_buttons.png) no-repeat; border:0; color:#FFFFFF; cursor:pointer; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; height:26px; padding:0 0 3px 0; text-shadow:rgba(0,0,0,0.2) 0 -1px 0; width:100px;}
input[type='submit']:hover	{background-position:-100px 0;}

#p-security					{clear:both; display:none; height:0px; visibility:hidden;}
#p-security label			{float:none; padding:0 0 4px 0; text-align:left; width:auto;}
#p-security input[type="text"]	{display:block; float:none;}


/*--- 52. Response Elements ---------------------------------------------------------------------------*/

#msg-response				{background:url(/img/response_bkg.jpg) #FFFFFF repeat-x; border:1px solid #CCCCCC; clear:both; cursor:pointer; font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; line-height:1.3em; margin:20px 0; padding:1px; position:relative; zoom:1; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;}
#msg-response a				{color:#333333;}
#msg-response a:hover		{text-decoration:none;}
#msg-response span			{background:url(/img/response_close.gif) no-repeat; height:11px; position:absolute; right:10px; top:8px; width:10px;}
#content #msg-response ul	{margin:0;}
#content #msg-response ul li	{background:0; padding:0;}

#msg-response div			{padding:6px 46px; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;}
.msg-error					{background:url(/img/response_error.jpg) left center no-repeat; color:#B7220A;}
.msg-success				{background:url(/img/response_success.jpg) left center no-repeat; color:#0F8915;}


/*--- 53. Skip Link ---------------------------------------------------------------------------*/

#skip-link					{float:left; margin:0 0 0 -9999px; text-decoration:none;}
#skip-link:focus			{background:#333333; border-bottom:1px solid #FFFFFF; border-right:1px solid #FFFFFF; color:#FFFFFF; font-size:11px; margin:0; padding:3px 7px 3px 5px; position:relative; z-index:1000;}
/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:hidden;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
    Example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:url(/img/overlay.png) 0 0 repeat;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(/img/controls.png) -100px 0 no-repeat;}
    #cboxTopRight{width:21px; height:21px; background:url(/img/controls.png) -129px 0 no-repeat;}
    #cboxBottomLeft{width:21px; height:21px; background:url(/img/controls.png) -100px -29px no-repeat;}
    #cboxBottomRight{width:21px; height:21px; background:url(/img/controls.png) -129px -29px no-repeat;}
    #cboxMiddleLeft{width:21px; background:url(/img/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(/img/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(/img/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(/img/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:3px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:3px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:3px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0px; background:url(/img/controls.png) -75px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious.hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(/img/controls.png) -50px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext.hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(/img/loading_background.png) center center no-repeat;}
        #cboxLoadingGraphic{background:url(/img/loading.gif) center center no-repeat;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(/img/controls.png) -25px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose.hover{background-position:-25px -25px;}

/*
    The following fixes png-transparency for IE6.  
    It is also necessary for png-transparency in IE7 & IE8 to avoid 'black halos' with the fade transition
    
    Since this method does not support CSS background-positioning, it is incompatible with CSS sprites.
    Colorbox preloads navigation hover classes to account for this.
    
    !! Important Note: AlphaImageLoader src paths are relative to the HTML document,
    while regular CSS background /img are relative to the CSS document.
*/
.cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/internet_explorer/borderTopLeft.png, sizingMethod='scale');}
.cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/internet_explorer/borderTopCenter.png, sizingMethod='scale');}
.cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/internet_explorer/borderTopRight.png, sizingMethod='scale');}
.cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/internet_explorer/borderBottomLeft.png, sizingMethod='scale');}
.cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/internet_explorer/borderBottomCenter.png, sizingMethod='scale');}
.cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/internet_explorer/borderBottomRight.png, sizingMethod='scale');}
.cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/internet_explorer/borderMiddleLeft.png, sizingMethod='scale');}
.cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/img/internet_explorer/borderMiddleRight.png, sizingMethod='scale');}