﻿/******************************************************************************
 * DOCUMENT SECTIONS 
 *****************************************************************************/
html 
{
    overflow: scroll;
}
body {
	margin: 0;
	padding: 0;
	height: 100%;
	font-family: Trebuchet MS;
	font-size: 12px;
}

.background-day 
{
	background: url('/Content/images/backgrounds/bg-day.jpg') 50% 0 repeat-x #4d91be;
}

.background-night
{
	background: url('/Content/images/backgrounds/bg-night.jpg') 50% 0 repeat-x #4d91be;
}

.background-day-si 
{
	background: url('/Content/images/backgrounds/bg-day-si.jpg') 50% 0 repeat-x #4d91be;
}

.background-night-si
{
	background: url('/Content/images/backgrounds/bg-night-si.jpg') 50% 0 repeat-x #4d91be;
}


#web-page {
	margin: 0 auto;
	width: 1000px;
	background-color: transparent;
	position: relative;
	top: 10px;
}
#flags 
{
    background-color: transparent;
    height: 20px;
    text-align: right;
}
#logo 
{
    background-color: transparent;
    height: 40px;
}
#administration-buttons 
{
    background-color: transparent;
    height: 22px;
    text-align: right;
}

div.admin-button 
{
    display: block;
    background-color: #00ccff;
    float: right;
    height: 18px;
    padding-top: 4px;
    padding-left: 20px;
    padding-right: 20px;
    margin-left: 2px;
    /*border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;*/
    
    /* firefox's individual border radius properties */
    -moz-border-radius-topleft: 10px; 
    -moz-border-radius-topright: 10px; 
    -moz-border-radius-bottomleft: 0px;
    -moz-border-radius-bottomright: 0px;

    /* webkit's individual border radius properties */
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;
    
    /* CSS3 */
    border-radius: 10px 10px 0px 0px;
}

div.admin-button a 
{
    color: white;
    text-decoration: none;
}

#header-buttons-search {
	height: 32px;
	background-color: #0dc1fc;
	/*border-top: 1px solid white;*/
	border-top: none;
	border-bottom: 1px solid white;
}
#header-buttons {
	float: left;
}
#header-search {
	float: right;
	background-color: #0dc1fc;
	padding-top: 4px;
	padding-right: 7px;
	width: 200px;
}
#header-slideshow
{
    height: 201px;
}

#header-slideshow .main_view
{
    border-bottom: 1px solid white;
}
#novelties {
	height: 260px;
}
#main-content {
	min-height: 500px;
	background-color: white;
}
#sidebar {
	width: 240px;
	background: white;
	float: left;
}
#sidebar-categories-title 
{
    width: 230px;
    height: 25px;
    background: url('/Content/images/title-box-sidebar.png') no-repeat;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: auto;
    font-family: "Trebuchet MS";
    font-size: 18px;
    color: white;
    text-align: center;
    padding-top: 5px;
}
#main-area {
	width: 750px;
	height: 100%;
	float: left;
	padding-left: 10px;
	padding-top: 10px;
}
#page-title {
	width: auto;
	height: 25px;
	background: url('/Content/images/title-box-main.png') no-repeat;
	padding-top: 6px;
	padding-left: 10px;
}

#page-title h1 
{
	font-family: "Trebuchet MS";
	font-size: 18px;
    color: white;	
}

#footer {
	height: 32px;
	background: url('/Content/images/bg-footer.png') no-repeat;
	color: white;
}

#footer-social-connections 
{
    float: left; 
    width: 200px; 
    height: 40px;
    padding-left: 10px;
}

#footer-copyright 
{
    float: left; 
    width: 600px; 
    padding-top: 9px;
    text-align: center;
}

#paging-controls{
	
}

#paging-prev{
	float: left;
	width: 50%;
	text-align:right;
		
}

#paging-next{
	float: left;
	width: 50%;
}


#paging-prev img{
	margin-right: 50px;	
}

#paging-next img{
	margin-left: 50px;	
}


#products-grid, #video-grid
{
    margin-top: 5px;
}

div.terms-of-use-content, div.about-company-contents
{
	color: gray;
	font-family: Trebuchet MS;
	margin: 10px;
	line-height: 15px;
}

div.about-company-contents ul
{
    margin-left: 20px;
}

div.main-pane-left 
{
    float: left;
    width: 500px;
    padding-top: 5px;
}

div.main-pane-right 
{
    float: left;
    background-image: url(/Content/images/product-details-right-bg.png);
    background-repeat: no-repeat;
    width: 198px;
    min-height: 330px;
    position: relative;
    margin-left: 20px;
    margin-top: 5px;
    padding-top: 5px;
    padding-left: 22px;
}

.field-validation-error
{
    color: #ff0000;
}

#noscript-warning
{
    background-color: red; 
    font-size: 40px;
    width: 800px;
    height: 100px;
    position: absolute;
    top: 350px;
    left: 350px;
    z-index: 1000;
    padding: 50px;
    text-align: center;
}

.validation-summary-errors li
{
    color: red;
    list-style-type: none;
}

.editor-label 
{
    font-family: Trebuchet MS;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: 1px;
    color: gray;
}

.extended-width input.text-box
{
    width: 600px;
}

/******************************************************************************
 * MAIN MENU
 *****************************************************************************/
ul#header-buttons {
	margin: 0;
	padding: 0;
	list-style: none;
}
ul#header-buttons li {
	display: block;
	position: relative;
	float: left;
}
li ul {
	display: none;
}
ul#header-buttons li a {
	width: 150px;
	height: 24px;
	text-align: center;
	font-family: Trebuchet MS;
	font-size: 14px;
	display: block;
	text-decoration: none;
	color: #ffffff;
	padding-top: 8px;
	background: #0dc1fc;
	white-space: nowrap;
	border-right: 1px solid #c4efff;
}
ul#header-buttons li a:hover {
	background: #617f8a;
}
ul#header-buttons li:hover ul {
	display: block;
	position: absolute;
	z-index: 3;
}
ul#header-buttons li:hover li a {
	width: 150px;
	height: 20px;
	float: none;
	font-size: 11px;
	text-align: left;
	padding-left: 10px;
	padding-top: 2px;
}
ul#header-buttons li:hover a {
	background: #617F8A;
}
ul#header-buttons li:hover li a:hover {
	background: #95A9B1;
}
/******************************************************************************
 * SEARCH
 *****************************************************************************/
div.search {
	border: none;
	width: 175px;
	margin: 0 auto;
	background: transparent;
	height: 24px;
}
.search input, .search button {
	border: none;
	float: left;
}
.search input#search-textbox {
	color: #808080;
	font-size: 13px;
	width: 145px;
	height: 16px; 
	padding: 5px 2px 3px 2px;
	background: #616161 url('/Content/images/search_bg.png') no-repeat;
	/*margin-right: 5px;*/
}
.search input#search-textbox:focus {
	background: #616161 url('/Content/images/search_bg.png') no-repeat left -24px;
	outline: none;
}
.search button.btn {
	width: 24px;
	height: 24px;
	cursor: pointer;
	text-indent: -9999px;
	background: #fbc900 url('/Content/images/search_bg.png') no-repeat top right;
}
.search button.btn:hover {
	background: #fbc900 url('/Content/images/search_bg.png') no-repeat bottom right;
}
.ui-autocomplete 
{
    z-index: 101 !important;
}

div.nothing-was-found
{
	width: 300px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 100px;
	font-size: 16px;
	color: gray;
	font-family: Trebuchet MS;
}

/******************************************************************************
 * SLIDESHOW
 *****************************************************************************/
/*--Main Container--*/
.main_view {
	float: left;
	position: relative;
}
/*--Window/Masking Styles--*/
.window {
	height: 200px;
	width: 1000px;
	overflow: hidden;
/*--Hides anything outside of the set width/height--*/position: relative;
}
.image_reel {
	position: absolute;
	top: 0;
	left: 0;
}
.image_reel img {
	float: left;
}
/*--Paging Styles--*/
.paging {
	position: absolute;
	bottom: 0px;
	right: -7px;
	width: 178px;
	height: 47px;
	z-index: 100; /*--Assures the paging stays on the top layer--*/
	text-align: center;
	line-height: 40px;
	background: url('/Content/images/banner-slideshow/paging_bg2.png') no-repeat;
	display: none; /*--Hidden by default, will be later shown with jQuery--*/
}
.paging a {
	padding: 5px;
	text-decoration: none;
	color: #fff;
}
.paging a.active {
	font-weight: bold;
	background: #920000;
	border: 1px solid #610000;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
}
.paging a:hover {
	/*font-weight: bold;*/
	background: #920000;
}
/******************************************************************************
 * jCarouselLite NOVELTIES DISPLAY
 *****************************************************************************/
#novelties a.prev, #novelties a.next {
	display: block;
	/*float: left;*/
	width: 65px;
	height: 200px;
	text-decoration: none;
}
#novelties a.next {
	background: url("/Content/images/novelties-carousel/btnNext.png") right 60px no-repeat;
	position: absolute;
	left: 958px;
	top:320px;
}
#novelties a.next:hover {
	background-image: url("/Content/images/novelties-carousel/btnNextHover.png");
}
#novelties a.prev {
	background: url("/Content/images/novelties-carousel/btnPrev.png") right 60px no-repeat;
	position: absolute;
	left: -25px;
	top: 320px;
}
#novelties a.prev:hover {
	background-image: url("/Content/images/novelties-carousel/btnPrevHover.png");
	position: absolute;
}
#novelties a:hover, #novelties a:active {
	border: none;
	outline: none;
}
#novelties .jCarouselLite {
	float: left;
	background-color: transparent;
	position: relative;
	visibility: hidden;
	left: -5000px;
	height: 200px;
	margin-top: 29px;
	margin-bottom: 29px;
	margin-left: 20px;
	margin-right: 20px;
}
#novelties ul {
	margin: 0;
}

#novelties li div.carousel-item {
	/*background-color: #02a1d9;*/
	width: 200px;
	height: 200px;
	margin: 0px 20px;
}

.carousel-item-img 
{
	border-top: 1px solid #bbbbbb;
	border-left: 1px solid #bbbbbb;
	border-right: 1px solid #bbbbbb;
	background-color: white;
}

.carousel-item-img img {
	width: 198px;
	height: 131px;
	/*border-top: 1px solid grey;
	border-left: 1px solid grey;
	border-right: 1px solid grey;*/
	border: none;
}

.carousel-item-details {
	width: 200px;
	height: 68px;
	background-image: url(/Content/images/novelties-carousel/detailsBg.png);
	text-align:	center;	
	border: none;
}

.carousel-item-details:hover {
	background-image: url(/Content/images/novelties-carousel/detailsBgHover.png);
}

.carousel-item-details-id 
{
    padding-top: 2px;
    height: 12px;
    font-size: 12px;
    font-weight: bolder;
    color: White;
    text-align:	center;
}

.carousel-item-details-name 
{
    margin-top: 2px;
    height: 20px;
    font-size: 10px;
	text-align:	center;
	color: White;
}

.carousel-item-details-button 
{
    padding-top: 15px;
}

.carousel-item-details-button  a:link, .carousel-item-details-button  a:visited, .carousel-item-details-button  a:hover
{
    color: black; 
    text-decoration: none; 
}

.carousel-item-details-button  a:active
{
    color: white; 
    text-decoration: none; 
}


/******************************************************************************
 * PRODUCTS GRID
 *****************************************************************************/

.product-item {
	/*border:thin gray solid;*/
}

div.product-item-img 
{
    width: 178px;
	height: 120px;
	border-top: 1px solid #bbbbbb;
	border-left: 1px solid #bbbbbb;
	border-right: 1px solid #bbbbbb;
}

.product-item-img img {
	width: 178px;
	height: 120px;
}


.product-item-details {
	width: 180px;
	height: 59px;
	background-image: url(/Content/images/productDetailsBg.png);
	text-align:	center;	
	padding-top: 2px;
}

.product-item-details:hover {
	background-image: url(/Content/images/productDetailsBgHover.png);
}

.product-item-details-id 
{
    height: 12px;
    font-size: 12px;
    font-weight: bolder;
    color: White;
	text-align:	center;
}

.product-item-details-name 
{
    margin-top: 2px;
    height: 20px;
    font-size: 10px;
	text-align:	center;
	color: White;
}

.product-item-details-button
{
    padding-top: 10px;
}

.product-item-details-button a:link, .product-item-details-button a:visited, .product-item-details-button a:hover, 
.product-item-details-button a:active
{
    color: black; text-decoration: none; 
}

/******************************************************************************
 * PRODUCT DETAILS TAB
 *****************************************************************************/

div#product-details-tabs 
{
	border: none;
	background: white/*{bgColorContent}*/ url(/Content/themes/base/images/ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/;
	color: #222/*{fcContent}*/;
}

div#product-details-tabs .ui-widget-header 
{
    border: none;
    background: transparent;
}

div.product-details-left
{
    float: left;
    width: 500px;
}

div.product-details-right, div.promotions-right
{
    float: left;
    background-image: url(/Content/images/product-details-right-bg.png);
    background-repeat: no-repeat;
    width: 220px;
    min-height: 450px;
    position: relative;
    top: -55px;
    margin-left: 17px;
    padding-top: 5px;
}

div#product-details-tabs .ui-tabs-panel
{
    padding: 0px;
    padding-top: 10px;
}

div.product-feature img
{
    float: left;
}

div.product-feature span
{
    float: left;
    width: 170px;
    padding-left: 5px;
    height: 34px;
    margin-top: 5px;
    /*word-wrap: break-word;*/
}

div.product-description
{
    min-height: 190px;    
}

div.product-stock-order
{
    min-height: 75px;    
}

div.product-stock
{
    float: left;
    width: 300px;        
}

div.product-packaging
{
    float: left;
    width: 200px;         
}

div.product-dimensions-weight
{
    min-height: 133px;    
}

div.product-dimensions
{
    float: left; 
    width: 149px;   
}

div.product-weight
{
    float: left;
    width: 149px;        
}

div.product-thumbnail-images
{
    float: right;        
}

.font-for-details
{
    font-family: Trebuchet MS;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: 1px;
    color: gray;
}

div.social-plugins
{
    position:absolute;
    bottom: 0;
    margin-left: 5px;   
}

div.breadcrumb-menu 
{
    font-family: Trebuchet MS;
    font-size:10px;
    padding-left: 5px;
    padding-top: 4px;
}

div.breadcrumb-menu a 
{
    color: gray;
    text-decoration: none;
}

div.order-placing-succeeded 
{
    font-weight: bold;
    color: green;
}


/******************************************************************************
 * PRODUCTS PAGER
 *****************************************************************************/
.pager 
{
	margin: 8px 3px;
	padding: 3px;
	text-align: center;
}

.pager .disabled 
{
	border: 1px solid #ddd;
	color: #999;
	margin-top: 4px;
	padding: 3px;
	text-align: center;
}

.pager .current 
{
	background-color: #06c;
	border: 1px solid #009;
	color: #fff;
	font-weight: bold;
	margin-top: 4px;
	padding: 3px 5px;
	text-align: center;
}

.pager span, .pager a
{
	margin: 4px 3px;
}

.pager a 
{
	border:1px solid #c0c0c0;
	padding:3px 5px;
	text-align:center;
	text-decoration:none;
}

/******************************************************************************
 * NEWS
 *****************************************************************************/

#sidebar-news-title
{
    width: 230px;
    height: 25px;
    background: url('/Content/images/title-box-news.png') no-repeat;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: auto;
    font-family: "Trebuchet MS";
    font-size: 18px;
    text-align: center;
    padding-top: 5px; 
    color: white;
}

#sidebar-news ul
{
    list-style: none;
}

.news-row, .commercial-row, .order-row, .order-position-row
{
    line-height: 20px;
}

/******************************************************************************
 * CONTACTS
 *****************************************************************************/
div.contact-item 
{
    /*padding-top: 5px;
    padding-left: 10px;
    padding-right: 10px;*/
    padding: 5px;
}

div.contact-item-photo 
{
    float: left;
}

div.contact-item-data 
{
    float: left;
    padding-left: 20px;
    color: gray;
}

div.sending-success-message 
{
	width: 300px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 100px;
	font-size: 16px;
	color: gray;
	font-family: Trebuchet MS;
}

div.contact-editor 
{
    margin-top: 10px;
}

div.contact-editor-label
{
    float: left;
    width: 100px;
}

div.contact-editor-field 
{
    float: left;
}

div.contact-editor-label-message
{
}

div.contact-editor-field-message
{
}

textarea.contact-editor-message-value 
{
    width: 500px;
    height: 150px;
    margin-top: 5px;
}

span.contact-editor-error-message 
{
    color: red;
}

div.send-mail-right 
{
    float: left;
    background-repeat: no-repeat;
    width: 198px;
    min-height: 330px;
    position: relative;
    margin-top: 5px;
    padding-top: 5px;
    padding-left: 22px;
}



/******************************************************************************
 * ERROR PAGE
 *****************************************************************************/
#error-page {
	margin-left: auto;
	margin-right: auto;
	margin-top: 150px;
	width: 500px;
	height: 400px;
	background-color: white;
	
	padding-top: 100px;
	font-family: Trebuchet MS;
	font-size: 25px;
	color: gray;
	text-align: center;
}

/******************************************************************************
 * GOOGLE MAPS
 *****************************************************************************/
div#map-canvas 
{
    text-align: center;
    font-size: 20px;
}

/******************************************************************************
 * NEWS
 *****************************************************************************/
li.news-menu a {
    display: block;
    text-decoration: none;
    color: gray;
    padding-left: 20px;
    padding-top: 3px;
    padding-bottom: 3px;
    background: white;
    border-bottom: 1px solid #F8F8F8;
    font-family: Trebuchet MS;
    font-size: 11px;
}

div.news-content 
{
    padding: 5px;
    line-height: 15px;
    letter-spacing: 1px;
    color:gray;
}

/******************************************************************************
 * PROMOTIONS TAB
 *****************************************************************************/

div#promotions-tabs {
	border: none;
	background: white/*{bgColorContent}*/ url(/Content/themes/base/images/ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/;
	color: #222/*{fcContent}*/;
}

div#promotions-tabs .ui-widget-header {
    border: none;
    background: transparent;
}

div.promotions-left
{
    float: left;
    width: 500px;
}

div.promotions-right
{
    float: left;
    background-image: url(/Content/images/product-details-right-bg.png);
    background-repeat: no-repeat;
    width: 200px;
    min-height: 435px;
    position: relative;
    top: -40px;
    margin-left: 17px;
    padding: 5px 10px 0px 10px
}

div.promotions-right ul
{
    padding-left: 20px;
}

div#promotions-tabs .ui-tabs-panel  
{
    padding: 0px;
    padding-top: 10px;
}

/******************************************************************************
 * ORDERS AND ORDER POSITIONS
 *****************************************************************************/

.order-position-row td, .order-row td
{
    padding-left: 15px;
    padding-right: 15px;
}

.order-views-section 
{
    margin-top: 20px;
}

.order-views-section a 
{
    margin-right: 20px;
}

.new-order-section 
{
    margin-top: 20px;
}

.orders-list-section 
{
    margin-top: 20px;
}

.print-order 
{
    float: right;
    margin-right: 20px;
}

.print-order img 
{
    width: 18px;
}

.total-price
{
    margin-top: 10px;
    margin-bottom: 10px;
}

.order-status-selector-active a 
{
    background-color: orange;
}


.catalogueLink 
{
 margin-left: -20px;
 width: 220px;
 height:60px;
 display:block;
 background:transparent url('/Content/images/home/catalog.png') center top no-repeat;
}

.catalogueLink:hover {
   background-image: url('/Content/images/home/catalog-roll.png');
}
