@charset "utf-8";
/*  CSS Document for ORANGE */
/*
******************************************************************************************************

Title:			main.css
Browser(s): 	All 

Author: 		Marko Prljić (http://www.markoprljic.iz.hr)
Created: 		23.11.2008

******************************************************************************************************
*/


/*-------------------------------DEFINE BODY PROPERTIES----------------------------------------*/

/*DO NOT EDIT ANYTHING INSIDE BODY PROPERTIES*/

* {
	margin: 0 auto 0 auto; /* GLOBAL RESET */
	padding: 0;
}
body{
	margin: 0 auto 0 auto;
	font-size: 62.5%; 
	font-family: Arial, Sans-Serif; 
	font-weight:normal;
	line-height: 150%; 
	color:#333;
	background: #E3E6E4 url(images/bg.jpg) top left repeat-x; 
	behavior:url("hover.htc");

}

div, p, ul, h2, h3, h4, img{
	padding:0px; margin:0px; border:none;
}
ul{
	list-style-type:none;
}
.spacer{
	clear:both; 
	font-size:0px; 
	line-height:0px;
}

a { outline:none; /* Remove Firefox's dotted borders */ text-decoration:none; color:#999999; }
a:hover{ color:#333;}
a img { border:none;} /* Remove IE's blue borders */


h1 {border:none; margin:0; padding:10px 0 0 10px; width:129px;}
h2 {font-size: 3em; border:none; margin:0; padding:0; }
h3 {
	font-size: 1.6em;
	border:none;
	margin:0;
	padding:0;
	color:#666699
}
h4 {font-size: 1.4em; border:none; margin:0; padding:0; color:#993333}
h5 {font-size: 1em; border:none; margin:0; padding:0;}
h6 {font-size: 1.2em; border:none; margin:0px 0 10px 0px; padding:0; color:#993333;}
p  {font-size: 1.2em; padding:10px 0 0 0;}
.hr{border-bottom:1px solid #CCCCCC; border-left:none; border-right:none; border-top:none; margin:10px 0 10px 10px; padding:0; width:940px;}
.hr_s{border-bottom:1px solid #CCCCCC; border-left:none; border-right:none; border-top:none; margin:10px 0 10px 0; padding:0; width:200px;}
.left{float:left; padding:0 10px 0 0;}
.right{float:right; }
.stroke{ border:1px solid #CCCCCC;}

/*-------------------------------END----------DEFINE BODY PROPERTIES----------------------------------------*/
#wrapper{width:960px; height:100%; margin:0 auto; padding:0;}
/*------------------------------HEADER--------------------------------*/

#header{ height:100%; padding:0;}
.teaser{ padding:10px 0 0 10px;}
#quotes{height:100%; padding:0; float:right; position:relative}
#menu{float:right; padding:0; margin:-15px 10px 0 0; width:515px}
#menu_left{float:left; padding:0; margin:5px 5px 5px 5px; width:100%; height:inherit; font-size:14px}
#menu a{float:right; text-align:left; text-decoration:none; font-size:1.4em;  padding:0 5px 2px 5px; color:#000000; display:block; border:none; }
#menu a:hover {color:#fff; background-color:#006699; } /*Chanage bg color on menu item hover*/
#menu a.current {color:#fff; background-color:#66cccc;
} /*Chanage bg color on menu item active*/

/*------------------------------CONTENT--------------------------------*/

.box{ width:200px; height:125px; padding:10px; margin:10px; float:left; display:inline; overflow:hidden; background:#E3E6E4 url(images/bg_box.jpg) top left repeat-x; border-bottom:none; border-left:none; border-right:none; border-top:2px solid #66c0dd;}
.box2{ width:190px; height:100%; padding:10px; margin:10px; float:left; display:inline; overflow:hidden; background:#E3E6E4 url(images/bg_box.jpg) top left repeat-x; border-bottom:none; border-left:none; border-right:none; border-top:2px solid #66c0dd;}
.box3{ width:190px; height:100%; padding:10px; margin:10px; float:left; display:inline; overflow:hidden; top left repeat-x; }
.box2up{ width:225px; height:100%; padding:10px; margin:10px; float:left; display:inline; overflow:hidden; top left repeat-x; }
.boxpromo{ width:200px; height:125px; padding:10px; margin:10px; float:left; display:inline; overflow:hidden; background:#FDC82F url(images/bg_boxpromo.jpg) top left repeat-x; border-bottom:none; border-left:none; border-right:none; border-top:2px solid #993333;}

.box:hover{ width:200px; height:125px; padding:10px; margin:10px; float:left; display:inline; overflow:hidden; background:#E3E6E4 url(images/bg_box_hover.jpg) top left repeat-x; border-left:none; border-right:none; border-top:2px solid #135193;}
.boxpromo:hover{ width:200px; height:125px; padding:10px; margin:10px; float:left; display:inline; overflow:hidden; background:#FDC82F url(images/bg_boxpromo_hover.jpg) top left repeat-x; border-left:none; border-right:none; border-top:2px solid #135193;}

.center{ margin:30px 60px 20px 60px;}
.main{float:left; padding:0; margin:10px 0 0 10px; width:690px; display:inline;}
.side{float:right; padding:10px; margin:10px; width:200px; height:100%; display:inline; background-color:#E3E6E4; border-bottom:none; border-left:none; border-right:none; border-top:2px solid #66c0dd;}
.side p{font-size: 1.1em; padding:0;}
.news{ padding:0;}
.quote{ background:url(images/quote.png) top left no-repeat; margin:20px 0 0 0; display:inline-block; overflow:hidden;}
.quote p{ padding:10px;}
.quote p.signature{ color:#000; font-size:1em; font-style:italic;}
ul{ padding:5px; margin:5px 0 0 20px;}
ul li{ list-style:disc; font-size:100%; color:#fffff; padding:0 0 0px 0;}
ul.a { list-style-type:square; font-size:1.2em; line-height:150%; color:#333;}

.arrow {background: url(images/arrow.gif) left center no-repeat; padding-left: 20px; margin-top: 8px;}

.boldcrimson {color: #993333;font-weight: bold;}


/*------------------------------FOOTER--------------------------------*/

#footer{ width:960px; padding:10px; height:100%; margin:0;}

/*------------------------------MAIL FORM--------------------------------*/

form#two {width:100%;padding:0;margin-top:5px;}
form#two fieldset {width:100%;padding:5px 0 0 0;font-family:Arial, sans-serif;margin-bottom:0.5em;border: 0;font-size: 11px;}
form#two input {border:1px solid #ccc;padding:0.5em 0 0 0.5em;margin-bottom:0.6em; width:400px; height:20px; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000;}
form#two value{font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#999999;}
form#two textarea {width:660px;height:15em;border:1px solid #ccc;padding:0.5em;overflow:auto; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000;}
form#two #button1 { float:left; color:#ffffff;padding:0;cursor:pointer;width:50px;margin:20px 20px 0 0;border:none;font-family: Arial, sans-serif;font-size: 10px; background-color:#993333;}
form#two #button1:hover{margin:20px 20px 0 0;color:#000000;font-family: Tahoma, Arial, Helvetica, sans-serif;font-size: 10px;border:1px solid #cccccc;}

/*------------------------------LINK STYLES--------------------------------*/

a:link {color: #006699}
a:active {color: #666699}
a:visited {color: #9999CC}
a:hover {color: #000000}


/*------------------------------ LIGHTBOX CSS --------------------------------*/

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 12px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }


/* ---------- Two Column CSS ---------- */

.csscolumns {
	overflow:hidden;
	width: 100%;
}
/* Note: adding larger margins or padding to columns requires that you decrease the width setting proportionally. If you add padding to the container, the same applies. */ 

#col_one_2 {
	margin: 0;
	float: left;
	width:48%;
}
#col_two_2 {
	margin: 0 0 0 12px; /* Puts a 12 pixel space between columns (left side) */
	float: left;
	width:48%;
}