* {margin: 0; padding: 0; outline: none;}

.clear {clear: both;}
.hidden {display: none;}

hr {clear: both; border: none; padding-bottom: 5px; border-top: 1px #999999 dotted;}
img {border: none;}

li {list-style: none;}

body {
	font-family: Georgia, "Century Schoolbook", "Times New Roman", Times, Serif;
	color: #666666;
	font-size: 100%;
	text-align: center;
}

.homepage {background: #000000;}

a:link {color: #666666; text-decoration: none;}
a:visited {color: #999999; text-decoration: none;}
a:hover {color: #666666; text-decoration: underline;}
a:active {color: #666666; text-decoration: none;}

p {font-size: 0.8em; line-height: 1.4em; margin-bottom: 1.4em;}
li {font-size: 0.7em;}

.homepage #wrapper {z-index: 1000;}

#wrapper {
	position: relative;
	margin: 0 auto;
	width: 900px;
	text-align: justify;
}

.bg {
	width: 100%;
	min-height: 100%;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 500;
}

h5 a {		/* logo */
	display: block;
	width: 39px;
	height: 38px;
	text-indent: -9000%;
	margin-top: 20px;
}

h1 {		/* El Oso esta Despierto */
	width: 900px;
	height: 95px;
	text-indent: -9000%;
}

.homepage h5 {background: url(../images/beerinblik_lgo.png) no-repeat; margin-top: 150px;}
.homepage h1 {background: url(../images/eloso_lgo.png) no-repeat;}
.portfolio h1 {background: url(../images/eloso_lgo_bw.png) no-repeat;}
.portfolio h5 {background: url(../images/beerinblik_lgo_bw.png) no-repeat;}

/* Markup for the menus */

#menu {position: relative; float: right; width: 550px; font-family: Arial, Helvetica, Sans-serif; top: -17px;}

#menu ul {float: right;}
#menu li {float: left; margin-right: 20px;}
#menu li a {display: block; padding: 3px; text-transform: uppercase; font-size: 11px;}
#menu .nav_last {margin-right: 0;}	
#menu a:link {text-decoration: none; color: #999999;}
#menu a:visited {text-decoration: none; color: #999999;}
#menu a:hover {color: #000000;}
#menu a:active {text-decoration: none; color: #999999;}
#menu .current a {color: #000000;}

.homepage #menu a:link {text-decoration: none; color: #ffffff;}
.homepage #menu a:visited {text-decoration: none; color: #ffffff;}
.homepage #menu a:hover {color: #000000;}
.homepage #menu a:active {text-decoration: none; color: #ffffff;}

.portfolio h1, .shop h1 {background: url(../images/eloso_lgo_bw.png) no-repeat;}
.portfolio h5, .shop h5 {background: url(../images/beerinblik_lgo_bw.png) no-repeat;}

/* Markup for the layout */

#content {
	position: relative;
	top: 20px;
}

#sidebar {
	float: left;
	position: relative;
	width: 250px;
}

#sidebar p {font-size: 11px; margin-top: 20px;}

#main_content {
	float: right;
	position: relative;
	width: 600px;
	min-height: 450px;
	top: 40px;
}

.shop #main_content {width: 650px;}
.season_img {padding: 25px 0 25px 0;}

/* Markup for the shop */

.shop_itm {
	width: 135px;
	height: 160px;
	float: left;
	margin: 0 0 25px 25px;
}
.shop_itm img {border: 1px #cccccc solid;}

.price {float: left; padding-left: 10px; color: #000000;}
.prod_name {float: right; font-family: Arial; Helvetica, Sans-serif;}
.order {float: right;}
.order a {display: block; width: 55px; height: 21px; background: url(../images/order_btn.png) no-repeat; text-indent: -9000%;}
.order a:hover {background: url(../images/order_btn_o.png) no-repeat;}

.col_one {width: 48%; float: left;}
.col_two {width: 48%; float: right;}

h6 {color: #cccccc; margin-top: 30px; font-size: 0.5em;}
h6 a {color: #cccccc; text-decoration: none;}

.message {
	margin-left: 15px;
	padding: 15px;
	background: #f5f5f5;
		border-radius: 8px;
		-moz-border-radius: 8px;
		-webkit_border-radius: 8px;	
}

.shop_menu {margin-top: 10px; padding-top: 10px; padding-left: 150px; border-top: 1px #999999 solid;}
.shop #sidebar span {position: relative; top: -7px; font-size: 11px; padding-left: 15px; font-style: italic; color: #999999;}

/* Extra markup for the about page */

.about p {font-family: Arial, Helvetica, Sans-serif; color: #000000; float: right; text-transform: uppercase; font-weight: bold;}
.about h6 {
	float: right;
	clear: both;
	font-weight: normal;
	margin: 0 0 40px 0;
}
.about h6 a {
	display: block;
	width: 200px;
	height: 19px;
	text-indent: -9999%;
	background: url(../images/birdseye_logo.png) no-repeat;
}

/* Coda Slider */

.stripViewer .panelContainer .panel ul {
	text-align: left;
	margin: 0 15px 0 30px;
}

/* These 2 lines specify style applied while slider is loading */
.csw {width: 100%; height: 450px; background: #fff; overflow: scroll}
.csw .loading {margin: 200px 0 300px 0; text-align: center}

.stripViewer { /* This is the viewing window */
	position: relative;
	overflow: hidden; 
	margin: auto;
	width: 600px; /* Also specified in  .stripViewer .panelContainer .panel  below */
	height: 450px;
	clear: both;
/*	border: 1px #999999 solid; */
}

.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
	position: relative;
	left: 0; top: 0;
	width: 100%;
	list-style-type: none;
	/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
}

.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
	z-index: 100;
	float:left;
	height: 100%;
	position: relative;
	width: 600px; /* Also specified in  .stripViewer  above */
}

.stripViewer p {padding-left: 1em; font-style: italic; color: #000000;}
.stripviewer a {color: red;}
.stripNavL, .stripNavR { /* The left and right arrows */
	z-index: 500;
	position: absolute;
	text-indent: -9000em;
}

.stripNavL a, .stripNavR a {
	display: block;
	height: 450px;
	width: 50px;
}

.stripNavL {
	left: -45px;
	background: url(../images/prev.png) no-repeat;
}

.stripNavR {
	top: 0;
	right: -46px;
	background: url(../images/next.png) no-repeat;
}

.stripNavL a:hover {background: url(../images/prev_o.png) no-repeat;}
.stripNavR a:hover {background: url(../images/next_o.png) no-repeat;}

/* Extra merkup for the administration panel */

#admin {
	font-family: Arial, Helvetica, Sans-serif;
}
#admin #main_content {
	float: right;
	position: relative;
	width: 600px;
	min-height: 450px;
	top: 40px;
	padding-left: 15px;
	font-size: 11px;
}
#admin #sidebar {text-align: left; font-size: 18px;}
#admin #sidebar li {
	background: #f5f5f5;
	padding: 5px;
	margin-bottom: 15px;
	font-size: 11px;
		border-radius: 8px;
		-moz-border-radius: 8px;
		-webkit_border-radius: 8px;	
}
#admin #sidebar .product_select {padding: 0px; margin: 0px;}
#admin #sidebar li a {display: block;}
#admin #sidebar li a:hover {text-decoration: none;}
#admin li img {float: left; margin: 0 10px 25px 0;}
#admin li {list-style: none; clear: both;}
#admin .product {margin-bottom: 30px;}

#admin fieldset {border: none;}
#admin legend {font-size: 18px; margin-bottom: 25px;}
#admin legend small {font-size: 10px;}
#admin .product_info {
	float: left; width: 70%;
	margin-right: 15px;
}

#admin .product_img {float: right; width: 20%; margin-top: 45px;}
#admin .product_img img {border: 1px #e8e8e8 solid; margin-bottom: 15px; position: relative;}
#admin .product_img span {float: left; width: 135px; margin-bottom: 5px;}
#admin .product_img .caption {
	display: block;
	width: 16px;
	height: 16px;
	z-index: 2;
	position: absolute;
	top: 70px;
	left: 570px;
	background: url(../images/camera_add_32.png) left no-repeat;
}

#admin .upload_img label {float: left; display: block; width: 80px; margin-bottom: 10px; font-size: 10px;}
#admin .upload_img input {float: left; display: block; width: 12px; margin-bottom: 10px;}
#admin .upload_img .error_file {float: right; width: 240px; line-height: 18px; color: red;}

#admin form {
	background: #f5f5f5; 
	padding: 15px;
		border-radius: 8px;
		-moz-border-radius: 8px;
		-webkit_border-radius: 8px;
}

#admin select {margin-bottom: 8px;}
#admin label, #admin .form_input, #admin textarea {
	display: block;
	margin-bottom: 8px;
	padding: 5px;
	border: none;
}
#admin label {float: left; width: 10%; clear: both;}
#admin textarea, #admin select, #admin .form_input {float: left; margin-left: 40px;}
#admin span {float: right; text-align: left; font-size: 9px; width: 90px;}
#admin .form_input, #admin textarea {width: 200px;}
#admin .form_delete {float: right;}

#admin .shop_itm {position: relative;}
#admin .admin_home_delete {
	background: none;
	position: relative;
	top: 8px;
	right: -128px;
	width: 16px;
	height: 16px;
	padding: 0px;
}
#admin .admin_home_delete:hover {margin-left: 1px;}
#admin .query_result {color: green;}

#login #main_content {width: 60%;}
#login #sidebar {width: 25%;}
#login form {
	float: left;
	width: 250px;
		border-radius: 8px;
		-moz-border-radius: 8px;
		-webkit_border-radius: 8px;
}
.login input, .login textarea {float: none; display: block; padding: 5px; margin-bottom: 10px; width: 150px;}
.login label {line-height: 16px;}
.login .login_btn {width: 70px; border: 1px #999999 solid; background: #e8e8e8;}
#login #main_content img {float: left; margin-top: 10px;}