/*----------------------------------------------------
	
	SCREEN.CSS
	
	SITE: www.himalayangarden.com
	CREATED: Wed 18.11.09 @ 09:43
	AUTHOR: Kean Richmond
	
----------------------------------------------------*/

@import url("reset.css");


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

html						{background:url(/img/_bkg_ftr.jpg) fixed bottom right no-repeat;}
body						{background:url(/img/_bkg.png) repeat-x; color:#636363; font-family:Arial, Helvetica, sans-serif; font-size:62.5%;}


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

h1							{color:#9DA84B; font-size:3em; margin:30px 0 10px 0;}
h2							{color:#4F2057; font-size:2em; font-weight:bold; margin:20px 0 10px 0;}

/*--- 02. Global Layout Elements ---------------------------------------------------------------------------*/

#main_container				{margin:0px auto; position:relative; padding:0 15px; width:960px;}
#content_container			{height:100%; overflow:hidden; padding:168px 0 0 0;}
#index #content_container,
#location #content_container{padding-top:453px;}


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

#header						{left:15px; position:absolute; top:0; width:960px;}
#logo						{display:block; float:left; margin:18px 0 0 15px;}

#header ul					{float:right; margin:39px 0 35px 0;}
#header li					{float:left;}
#header li a				{color:#FFFFFF; display:block; font-size:1.2em; font-weight:bold; margin:0 3px; padding:6px 14px; text-decoration:none; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;}
#header li a:hover			{background:#9DA84B;}
#header li a.current		{background:#FFFFFF; color:#4F2057;}

#banner						{clear:both; height:320px; padding:18px; position:relative; width:924px;}
#banner[id]					{background:url(/img/_banner_frame.png) no-repeat;}

.opening_times				{background:url(/img/_bkg_blackopacity60.png); background:rgba(0,0,0,0.6); color:#FFFFFF; height:296px; padding:12px; position:absolute; right:18px; top:18px; width:201px;}
.opening_times h3			{color:#C8DC35; font-size:4.8em; font-weight:bold; line-height:1em; margin:5px 0;}
.opening_times p			{font-size:2.4em; font-weight:bold; line-height:1.2em;}
.opening_times p.ftr_note	{font-size:1.1em; font-weight:normal; margin:32px 0 0 0;}

#open h4					{font-size:1.8em; font-weight:bold; line-height:0.9em; margin:39px 0 25px 0;}
#open h4 span				{font-size:0.66em;}
#closed h4					{font-size:1.4em; font-weight:bold; line-height:1.25em; margin:22px 0 17px 0;}
#closed h4 span				{color:#C8DC35;}
#closed p.ftr_note			{margin-top:25px;}
#closed strong				{display:block; font-size:1.1em; line-height:1.1em; padding:0 0 3px 0;}
#closed strong span			{font-size:0.9em;}


/*--- 04. Content Elements ---------------------------------------------------------------------------*/

#content					{display:inline; float:left; padding:0 0 0 18px; width:675px;}
#index #content				{background:url(/img/_plants.png) 18px 0 no-repeat; padding:0 0 0 243px; width:450px;}
#content p					{font-size:1.2em; line-height:1.4em; padding:7px 0;}

#content ul					{list-style:disc; margin:20px 40px;}
#content li					{font-size:1.2em; padding:7px 0;}

#map						{height:320px; width:924px;}
#content ul#tab_links		{height:100%; list-style:none; margin:0; overflow:hidden;}
#content ul#tab_links li 	{float:left;}
#content ul#tab_links li a	{background:#4F2057; color:#FFFFFF; cursor:pointer; display:block; font-weight:bold; margin:0 6px 0 0; padding:6px 14px; text-decoration:none; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;}
#content ul#tab_links li a.current	{background:#9DA84B;}

.gallery_list				{height:1%; margin:10px 0!important; overflow:hidden;}
.gallery_list li			{border:4px solid #9DA84B; float:left; height:134px; margin:5px; padding:1px!important; overflow:hidden;}
.gallery_list li img		{}


/*--- 05. Side Column Elements ---------------------------------------------------------------------------*/

#side_column				{display:inline; float:right; margin:0 18px 0 0; width:225px;}

#side_column a				{color:#FFFFFF; display:block; font-size:1.1em; margin:14px 0 0 0; padding:98px 10px 16px 10px; text-decoration:none;}
#side_column a span			{display:block; font-size:1.27em; font-weight:bold; padding:0 0 4px 0;}

#brochure					{background:url(/img/_brochure_image.jpg) 10px 10px no-repeat #4F2057;}
#brochure:hover				{background-color:#724D79;}
#orderplants				{background:url(/img/_orderplants_image.jpg) 10px 10px no-repeat #9DA84B;}
#orderplants:hover			{background-color:#AFB96D;}

.address					{font-size:1.2em; line-height:1.4em; margin:20px 10px;}
.address strong				{color:#4F2057;}


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

#footer						{background:url(/img/_border_dots.gif) repeat-x; clear:both; color:#999999; font-size:1.1em; margin:30px auto; padding:7px 0; text-align:center; width:761px;}
#footer p					{padding:2px;}
#footer p a					{color:#999999; text-decoration:none;}
#footer p a:hover			{color:#4F2057;}


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

.common_form				{padding:30px 0;}
.common_form p				{clear:both; overflow:hidden; padding:5px 0!important;}

label						{float:left; font-weight:bold; padding:5px 5px 0 0; width:120px;}
input[type='text'],
textarea					{background:#F7F7F7; border:1px solid #C1C1C1; border-bottom:1px solid #DEDEDE; border-right:1px solid #DEDEDE; color:#666666; float:left; font-family:Arial, Helvetica, sans-serif; font-size:12px; margin:0 0 0 5px; padding:5px 6px;}
textarea					{height:150px; width:400px;}
input[type='text']:focus,
textarea:focus				{background:#FFFFFF; border:1px solid #4F2057;}

input[type='submit']		{background:#4F2057; border:0; color:#FFFFFF; cursor:pointer; display:block; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; margin:0 0 0 130px; padding:6px 14px; text-decoration:none; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;}
input[type='submit']:hover	{background:#9DA84B;}

.optional					{background:url(/img/icon_optional.gif) no-repeat; display:block; float:left; height:13px; margin:6px 0 0 6px; text-indent:-9999px; width:53px;}
.required					{background:url(/img/icon_required.gif) no-repeat; display:block; float:left; height:13px; margin:6px 0 0 6px; text-indent:-9999px; width:53px;}
.hidden						{background:url(/img/icon_hidden.gif) no-repeat; display:block; float:left; height:13px; margin:6px 0 0 -4px; text-indent:-9999px; width:44px;}
.warning					{background:url(/img/icon_warning.png) no-repeat; display:block; float:left; height:17px; margin:4px 0 0 6px; text-indent:-9999px; width:17px;}

.input_100					{width:86px;}
.input_125					{width:111px;}
.input_150					{width:136px;}
.input_200					{width:186px;}
.input_250					{width:236px;}
.input_300					{width:286px;}

#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_box		{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!important; 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;}

#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;}


/*--- 100. Link Elements ---------------------------------------------------------------------------*/

a							{color:#4F2057;}
a:hover						{color:#9DA84B;}


/*
    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');}