﻿html, body, form { height: 100%; min-height: 100%; margin: 0; padding: 0; background: url(images/background.png) repeat;*/ }
* { -moz-box-sizing: border-box; box-sizing: border-box; }
html { font-size: 65.5% 1em; font-family: Calibri, Arial; color: #333; }
body.login { background: none; }
form { /*position: relative; min-height: 100%; height: auto !important;*/ }
input[type=text], input[type=password], textarea, select { padding: 5px 8px; border: 1px solid #d82128; outline: none; width: 50px; }
input[type=button], input[type=submit], input[type=reset] { padding: 0 10px; line-height: 1.5em; background-color: #d82128; color: #fff; text-transform: uppercase; border: 1px solid #d82128; border-radius: 15px; cursor: pointer; }
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover { opacity: .75; }
input[type=text].watermark { text-transform: uppercase; font-style: normal; }
fieldset { font-family: Calibri, Arial; font-size: 1em; }
select { padding-right: 6px; }
a > img { border: none; }
a > figure > img { border: none; }
.hidden { display: none; }
.i-b { display:inline-block; }

form { position: relative; min-height: 100%; height: auto !important; }

div.departments table tr td, div.departments table tr th { text-align: left; }

div.product-rank ul { float: left; list-style-type: none; }
div.product-rank > fieldset > ul > li { height: 170px; border:  1px solid black; margin: 5px; float: left; width: 259px; background-color: #fff; }
div.product-rank ul li a { float: left; display: block; width: 120px; height: 150px; line-height: 150px; text-align: center; display: table-cell; vertical-align: middle; }
div.product-rank ul li a > img { max-width: 120px; max-height: 150px; vertical-align: middle; }
div.product-rank ul li input[type="text"] { width: 40px; }
div.product-rank ul li div { float: left;  }
div.product-rank ul li div span { display: block; }

header { height: 60px; background-color: #991007; }
header div.logo { float: left; width: 265px; padding: 16px 17px 17px; background-color: #BD1717; text-align: center; }
header div.user { float: right; padding: 11px; }
header div.user span, header div.user input { float: right; }
header div.user span.username { margin: 5px 70px 0 0; padding-left: 35px; height: 28px; line-height: 28px; text-transform: uppercase; background: url(images/icons/icon-user.png) no-repeat left center; color: #fff; }
header div.heading { float: left; padding: 3px; }
header div.heading h1 { position: relative; margin: 5px 30px; padding-left: 70px; font-weight: normal; line-height: 1.7em; font-size: 1.6em; text-transform: uppercase; color: #fff; }
header div.heading h1 span { position: absolute; left: 15px; width: 45px; height: 44px; background: url(images/icons/tile-sub-26.png) no-repeat; text-indent: -9999px; }
header div.heading h1 span.article { background-position: 0 -660px; }
header div.heading h1 span.category { background-position: 0 -440px; }
header div.heading h1 span.slideshow { background-position: 0 -484px }
header div.heading h1 span.mail { background-position: 0 0; }
header div.heading h1 span.group { background-position: 0 -220px; }
header div.heading h1 span.menu { background-position: 0 -704px; }
header div.heading h1 span.carousel { background-position: 0 -44px; }
header div.heading h1 span.look { background-position: 0 -176px; }
header div.heading h1 span.document { background-position: 0 -396px; }
header div.heading h1 span.product { background-position: 0 -88px; }
header div.heading h1 span.photoalbum { background-position: 0 -528px; }
header div.heading h1 span.store { background-position: 0 -264px; }
header div.heading h1 span.page { background-position: 0 -352px; }
header div.heading h1 span.group { background-position: 0 -220px; }
header div.heading h1 span.shipping { background-position: 0 -132px }
header div.heading h1 span.image { background-position: 0 -308px; }
header div.heading h1 span.config { background-position: 0 -616px; }
header div.heading h1 span.user { background-position: 0 -572px; }

/*nav.main { height: 20px; background-color: #d82128; }*/
div#default { position: absolute; top: 60px; bottom: 0; width: 100%; min-height: 510px; background-color: #000; background-repeat: repeat; /*background: url(images/dotted-background.png) repeat;*/ }
div#default > div { margin: 0 auto; width: 1000px; }

div#body { position: absolute; top: 60px; bottom: 0; width: 100%; min-height: 510px; /*background-color: #fff; background-repeat: repeat;*/ background: url(images/dotted-background.png) repeat; }
div#body > div { float: left; }
div#body > div.menu-sub-main { width: 55px; min-height: 100%; background-color: #403E3D;  background-repeat: repeat;}
div#body > div.options { position: absolute; left: 55px; width: 210px; min-height: 100%; background-color: #BDBDBC; background-repeat: repeat; }
div#body > div.content { position: absolute; left: 265px; right: 0; min-width: 595px; }

div#body div.options > section { padding: 15px 10px; }

div#body div.options section.toolbar { background-color: #BDBDBC; }
div#body div.options section.toolbar ul { margin-left: 0; }
div#body div.options section.toolbar hr { margin-right: 24px; color: #fff; background-color: #fff; border: none; height: 1px; }

section.toolbar ul { margin: 0; padding: 0; list-style: none; }
section.toolbar hr { margin-left: 25px; }
section.toolbar a { display: block; width: 30px; height: 28px; margin-bottom: 5px; text-indent: 38px; line-height: 2.4em; white-space: nowrap; color: #000; text-transform: uppercase; font-size: .8em; text-decoration: none; background: url(images/icons/tile_actions-11.png) no-repeat; cursor: pointer; }
section.toolbar a:hover { text-decoration: underline; }
section.toolbar a.new { background-position: 0px 0px; /*background: url(images/icons/new.png) no-repeat;*/ }
section.toolbar a.edit { background-position: 0px -56px; /*background: url(images/icons/edit.png) no-repeat;*/ }
section.toolbar a.delete { background-position: 0px -28px; /*background: url(images/icons/delete.png) no-repeat;*/ }
section.toolbar a.publish { background-position: 0px -84px; /*background: url(images/icons/published.png) no-repeat;*/ }
section.toolbar a.unpublish, section.toolbar a.clear { background-position: 0px -112px; /*background: url(images/icons/unpublished.png) no-repeat;*/ }
section.toolbar a.archive { background-position: 0px -140px; /*background: url(images/icons/archive.png) no-repeat;*/ }
section.toolbar a.close { background-position: 0px -168px; /*background: url(images/icons/close.png) no-repeat;*/ }
section.toolbar a.save { background-position: 0 -224px; }
section.toolbar a.save-new { background-position: 0 -252px; }
section.toolbar a.save-close { background-position: 0 -280px; }
section.toolbar a.lock { background-position: -72px -21px; }
section.toolbar a.unlock { background-position: -72px -42px; }
section.toolbar a.synchronize { background-position: 0 -196px; }
section.toolbar a.none { background: none; }

div#body div.options section.filter { background-color: #D7D7D7; }
div#body div.options section.search { background-color: #ECECEC; }
div#body div.options > section input[type=text], div#body div.options > section select { width: 190px; margin-bottom: 8px; background-color: #ECECEC; }

div#body div.options section.search { background-color: #ECECEC; }
div#body div.options section.search > div { position: relative; }
div#body div.options section.search > div > input[type="submit"] { background: #A70F08 url(images/icons/icon-search.png) no-repeat center center; text-indent: -9999px; position: absolute; top: 1px; right: 1px; border: 0; border-radius: 0; height: 23px; padding: 0; display: block; width: 24px; }
div#body div.options > section input[type=text], div#body div.options > section select { width: 190px; margin-bottom: 8px; background-color: #fff; color: #B8B8B8; text-transform: uppercase; font-size: 11px; }

div#body div.content h1 { position: relative; margin: 5px 10px; padding-left: 55px; line-height: 1.7em; font-size: 1.6em; text-transform: uppercase; color: #284970; }
div#body div.content h1 span { position: absolute; left: 0; width: 45px; height: 40px; background: url(images/icons/tile-sub-35.png) no-repeat; }
div#body div.content span.article { background-position: -45px 0; }
div#body div.content span.category { background-position: -90px 0; }
div#body div.content span.slideshow { background-position: -135px -40px }
div#body div.content span.group { background-position: -90px 0px; }
div#body div.content span.mail { background-position: -90px -40px; }
div#body div.content span.form { background-position: -90px -80px; }
div#body div.content span.social-media { background-position: -45px -80px; }

/* Main toolbar */
div#body div.menu-sub-main nav { margin: 0; }
div#body div.menu-sub-main ul { list-style: none outside none; margin: 0; padding: 0; }
div#body div.menu-sub-main ul li { text-align: center; display: table-cell; height: 43px; float: left; vertical-align: middle; width: 55px; }
div#body div.menu-sub-main ul li:hover { border-left: 2px solid #DC0714; background: url(images/icons/menu-icon-hover.png) no-repeat; width: 55px; }
div#body div.menu-sub-main ul li.active { border-left: 2px solid #DC0714; background: url(images/icons/menu-icon-hover.png) no-repeat; width: 55px; }
div#body div.menu-sub-main a { display: inline-block; width: 45px; height: 40px; text-indent: -999px; background: url(images/icons/tile-main-45.png) no-repeat; cursor: pointer; }
div#body div.menu-sub-main a.article { background-position: -45px 0; }
div#body div.menu-sub-main a.category { background-position: -90px 0; }
div#body div.menu-sub-main a.slideshow { background-position: -135px -40px }
div#body div.menu-sub-main a.group { background-position: -90px 0px; }
div#body div.menu-sub-main a.mail { background-position: -90px -40px; }
div#body div.menu-sub-main a.form { background-position: -90px -80px; }
div#body div.menu-sub-main a.social-media { background-position: -45px -80px; }

div#body div.menu-sub-main ul li.active a { background-position-x: 0; }
div#body div.menu-sub-main a { display: inline-block; width: 33px; height: 33px; text-indent: -999px; margin: 5px; background: url(images/icons/tile-sub-35.png) no-repeat; /*background: url(images/icons/tile-sub-35.png) no-repeat;*/ cursor: pointer; }
div#body div.menu-sub-main a.article { background-position: -33px -495px; }
div#body div.menu-sub-main a.category { background-position: -33px -330px; }
div#body div.menu-sub-main a.slideshow { background-position: -33px -363px }
div#body div.menu-sub-main a.mail { background-position: -33px 0; }
div#body div.menu-sub-main a.group { background-position: -33px -220px; }
div#body div.menu-sub-main a.menu { background-position: -33px -528px; }
div#body div.menu-sub-main a.carousel { background-position: -33px -33px; }
div#body div.menu-sub-main a.look { background-position: -33px -132px; }
div#body div.menu-sub-main a.document { background-position: -33px -297px; }
div#body div.menu-sub-main a.product { background-position: -33px -66px; }
div#body div.menu-sub-main a.photoalbum { background-position: -33px -396px; }
div#body div.menu-sub-main a.store { background-position: -33px -198px; }
div#body div.menu-sub-main a.page { background-position: -33px -264px; }
div#body div.menu-sub-main a.group { background-position: -33px -165px; }
div#body div.menu-sub-main a.shipping { background-position: -33px -99px }
div#body div.menu-sub-main a.image { background-position: -33px -231px; }
div#body div.menu-sub-main a.config { background-position: -33px -462px; }
div#body div.menu-sub-main a.user { background-position: -33px -429px; }

div#body div.menu-sub-main a.article:hover { background-position: 0 -495px; }
div#body div.menu-sub-main a.category:hover { background-position: 0 -330px; }
div#body div.menu-sub-main a.slideshow:hover { background-position: 0 -363px }
div#body div.menu-sub-main a.mail:hover { background-position: 0 0; }
div#body div.menu-sub-main a.group:hover { background-position: 0 -220px; }
div#body div.menu-sub-main a.menu:hover { background-position: 0 -528px; }
div#body div.menu-sub-main a.carousel:hover { background-position: 0 -33px; }
div#body div.menu-sub-main a.look:hover { background-position: 0 -132px; }
div#body div.menu-sub-main a.document:hover { background-position: 0 -297px; }
div#body div.menu-sub-main a.product:hover { background-position: 0 -66px; }
div#body div.menu-sub-main a.photoalbum:hover { background-position: 0 -396px; }
div#body div.menu-sub-main a.store:hover { background-position: 0 -198px; }
div#body div.menu-sub-main a.page:hover { background-position: 0 -264px; }
div#body div.menu-sub-main a.group:hover { background-position: 0 -165px; }
div#body div.menu-sub-main a.shipping:hover { background-position: 0 -99px }
div#body div.menu-sub-main a.image:hover { background-position: 0 -231px; }
div#body div.menu-sub-main a.config:hover { background-position: 0 -462px; }
div#body div.menu-sub-main a.user:hover { background-position: 0 -429px; }


/*div#body div.menu-sub-main a.form { background-position: -90px -80px; }
div#body div.menu-sub-main a.social-media { background-position: -45px -80px; }*/
/* End main toolbar*/

/* Gridview */
table.gridview { width: 100%; }
table.gridview th, table.gridview td { padding: 6px 8px; text-align: center; }
table.gridview th.left, table.gridview td.left { text-align: left; }
table.gridview th.right, table.gridview td.right { text-align: right; }
table.gridview th { color: #fff; background-color: #3C3C3B; }
table.gridview th a { display: block; color: #fff; text-decoration: none; text-transform: uppercase; }
table.gridview th a:hover { text-decoration: underline; }
table.gridview tr { background-color: #fff; }
table.gridview tr.alternate { background-color: #ECECEC; }
table.gridview tr td > input[type=text] { text-align: center; }
table.gridview tr td > a { color: #000; }
/* End gridview */

/* Form */
div.form ul { margin: 0; padding: 0; list-style: none; }
div.form > fieldset, div.panel > fieldset { position: relative; margin-bottom: 10px; padding: 40px 10px 10px; border: 1px solid #6D6D6C; border-top: 0; background-color: #e7f5ff; font-size: 1em; font-family: Calibri, Arial; }
div.form > fieldset > legend, div.panel > fieldset > legend { position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 26px; background-color: #3C3C3B; }
div.form > fieldset > legend h2, div.panel > fieldset > legend h2 { margin: 0; padding: 0 10px; line-height: 1.3em; font-size: 1.3em; color: #fff; text-transform: uppercase; }
div.form > fieldset > ul > li, div.panel > fieldset > ul > li { position: relative; float: left; margin: 5px; }
div.form label { display: block; min-width: 200px; padding-left: 8px; text-transform: uppercase; font-size: .85em; }
div.form input[type=text], div.form input[type=password], div.form textarea, div.form select { width: 200px; border: 1px solid #808080; }
div.form input[type=checkbox] { margin-left: 8px; float: left; }
div.form label.tooltip { padding-left: 18px; background: url(images/icons/icon-info.png) no-repeat left 2px; }
div.form label.tooltip span { position: absolute; width: 18px; height: 18px; top: 0; left: 0; text-indent: 18px; overflow: hidden; z-index: 500; }
div.form label.tooltip span:hover { width: 100%; min-height: 100%; height: auto; padding: 5px; text-indent: 0; background-color: #fecc00; }
div.form span.checkbox label { display: inline-block; }
div.form li.full-width { width: 98%; padding: 0; }
/* End form */

div.manage-page fieldset ul li { float: none; }
div.manage-page fieldset ul li span { margin-right: 20px; }

/* Tabs */
div.tabs div.tabs-heading li { float: left; padding: 0 10px; line-height: 1.6em; margin-right: 3px; border: 1px solid #d82128; border-radius: 5px 5px 0 0; background-color: #d82128; color: #fff; cursor: pointer; }
div.tabs div.tabs-heading li.active { border-bottom-color: #f2faff; background-color: #f2faff; color: #333; cursor: default; }
div.tabs div.tabs-content { margin-top: -1px; padding: 10px; border: 1px solid #d82128; background-color: #f2faff; }
div.tabs div.tabs-content > ul > li { display: none; }
div.tabs div.tabs-content > ul > li.active { display: block; }
div.tabs div.tabs-content > ul > li > ul > li { position: relative; float: left; min-height: 55px; margin: 5px; }
/* End tabs */

/* Status icons */
span.archived, span.published, span.unpublished, span.public, span.registered, span.locked, span.unlocked, span.approved, span.disapproved, a.archived, a.published, a.unpublished, a.public, a.registered, a.locked, a.unlocked, a.approved, a.disapproved { display: inline-block; width: 18px; height: 21px; background: url(images/icons/tile-options-6.png) no-repeat; }
span.archived, a.archived { background-position: -18px 0; }
span.published, a.published, span.approved, a.approved { background-position: -54px; /*background: url(images/icons/published-overview.png) no-repeat; width: 18px; height: 18px;*/ }
span.unpublished, a.unpublished, span.disapproved, a.disapproved { background-position: -37px; }
span.public, a.public, span.unlocked, a.unlocked { background-position: -72px 0; width: 21px; }
span.registered, a.registered, span.locked, span.locked { background-position: -94px; }
/* End status icons */

/* Article Images */
table.imagesOverview tr { display: table-row; height:100%; }
table.imagesOverview tr td .content { padding: 10px; margin: 0 5px 5px 0; border: 1px solid #989898; border-radius: 5px; background-color: #FFF; text-align:center; color: #000; }
table.imagesOverview tr td .content a { color: #000; text-decoration: none;}
table.imagesOverview tr td .content .image-upload { position: relative; text-align:center; }
table.imagesOverview tr td .content .image-upload img { border: 1px solid black; max-width: 100%; max-height: 100%;vertical-align: middle;z-index:1; }
table.imagesOverview tr td .content .image-upload .imgCont input {z-index: 999;position: absolute; top:20px;opacity: 0;filter: alpha(opacity = 0);-ms-filter: "alpha(opacity=0)"; cursor:pointer; width:135px;left:10px; }
table.imagesOverview tr td .content .image-upload label { cursor:pointer; min-width: 150px; padding: 0; height: 89px; width: 200px; }
table.imagesOverview tr td .content .image-upload div.image > span { cursor: pointer; }
table.imagesOverview tr td.cat .content { background-color:#BDBDBC; color: #000; }
table.imagesOverview tr td.first .content { background-color:transparent; border: none; color: #000; }
table.imagesOverview tr td.first .title { font-weight:bold; text-transform:uppercase; text-decoration:underline; min-width: 50px; display: block; }
table.imagesOverview tr td.first label { min-width:inherit; height:20px;}
table.imagesOverview tr td.first input[type="checkbox"] {  }
table.imagesOverview tr td .content .image-upload a.left { background: url('images/icons/arrow-left.png'); text-indent: -9999px; width:24px; display: block;float: left; }
table.imagesOverview tr td .content .image-upload a.right { background: url('images/icons/arrow-right.png'); text-indent: -9999px;width:24px; display: block;float: right; }
table.imagesOverview tr td .content .image-upload > div.pos { float: left; }
table.imagesOverview tr td .content .image-upload > div.pos > span { float: left; }
.image-info { vertical-align:bottom; margin-bottom: 10px; position: absolute; top: 0; }
.image-info p 
.image-info p a.left { background: url('images/icons/arrow-left.png'); text-indent: -9999px; width:24px; display: block;float: left; }
.image-info p a.right { background: url('images/icons/arrow-right.png'); text-indent: -9999px;width:24px; display: block;float: right; }
table.imagesOverview tr td .content .image-upload > div.image { width: 120px; display: table-cell; vertical-align: middle; text-align: center; }
table.imagesOverview tr td .content .image-upload > div.image input[type=file] { z-index: 999;position: absolute; top:0px;opacity: 0;filter: alpha(opacity = 0);-ms-filter: "alpha(opacity=0)"; cursor:pointer;  height: 100px;width: 170px;left:20px; }
table.imagesOverview tr td .content .image-upload > div.image input[type=text] { margin: 10px 0; }
table.imagesOverview tr td .content a.delete { background: url(images/icons/tile-options-24.png) no-repeat -24px -21px; text-indent: -9999px;width:24px; display: block; position: absolute;top:-10px;right:-10px; height:21px; }
.upload table tr td label { display:inline-block; }

/* Images overview */
ul.images-overview { margin: 0; padding: 0; list-style: none; }
ul.images-overview li { float: left; height: 120px; margin: 0 25px 15px 0; padding: 10px; border: 1px solid #989898; border-radius: 5px; background-color: #fff; }
ul.images-overview li:hover { border-color: #d82128; }
ul.images-overview div.move { margin: 10px 0 0 10px; text-align: center; }
ul.images-overview div.move a { display: block; margin-left: 16px; }
ul.images-overview div.move input[type=text] { width: 40px; text-align: center; }
ul.images-overview div.image { position: relative; }
div.photoalbum ul.images-overview div.image input[type=image] {  }  
div.look ul.images-overview div.image { height: 110px; width: 90px; text-align: center; }
div.look ul.images-overview li { width: 115px; }
ul.images-overview div.image input[type=image] { max-height: 100px; max-width: 100px; padding: 1px; border: 1px solid #000; padding: 1px; border: 1px solid #000; }
ul.images-overview div.image a.delete { position: absolute; top: -8px; right: -10px; width: 24px; height: 21px; background: url(images/icons/tile-options-24.png) no-repeat -24px -21px; cursor: pointer; }

ul.images-overview div.image > img { display: table-cell; height: 100px; width: 110px; padding: 1px; border: 1px solid #000; }
ul.images-overview div.image > a.delete { text-indent: -9999px; position: absolute; top: -8px; right: -10px; width: 24px; height: 21px; background: url(images/icons/tile-options-24.png) no-repeat -24px -21px; cursor: pointer; } 
.image-upload > input { display: none;}
.inputimage { cursor: pointer; }
/* End images overview */


.spinner { position: fixed;top: 50%;left: 50%;margin-left: -50px; /* half width of the spinner gif */margin-top: -50px; /* half height of the spinner gif */text-align:center;z-index:1234;overflow: auto;width: 100px; /* width of the spinner gif */height: 102px; /*hight of the spinner gif +2px to fix IE8 issue */}
table.imagesOverview tr td .content .image-upload img.noborder { border: none; }

div.box-position { width: 100px; margin: 0 auto; }
div.box-position > input[type="text"] { text-align: center; width: 50px; }

/* Profile Overview */
ul.profiles-overview {  list-style: none; }
ul.profiles-overview > li { float: left; width: 95%; min-height: 100px; margin: 0 25px 15px 0; padding: 10px; border: 1px solid #989898; border-radius: 5px; background-color: #fff; }
ul.profiles-overview > li:hover { border-color: #d82128; }
ul.profiles-overview li ul { list-style: none; margin: 0; padding: 0; }
ul.profiles-overview li ul li { float: left; width: 100%; border-bottom:1px solid #ccc; width:100%; padding:3px; display: block; }
ul.profiles-overview li ul li div.stock { float: left;  width: 60%; }
ul.profiles-overview li ul li div { float: left; width: 40%; display: block; }

/* End Profile Overview */

/* Control panel */
div.control-panel { padding: 20px; }
div.control-panel ul { list-style: none outside none; margin: 0; padding: 0; }
div.control-panel li { float: left; margin-right: 15px; margin-bottom: 15px; }
div.control-panel a { position: relative; display: inline-block; /*width: 130px; height: 120px; background-color: #fff; border: 1px solid #989898; border-radius: 5px;*/ cursor: pointer; color: #333; text-decoration: none; }
div.control-panel a:hover { border-color: #d82128; }
div.control-panel figure { display: block; height: 160px; margin: 0; text-align: center; padding: 17px; border: 1px solid #4D4D4D; background-color: #4D4D4D; }
div.control-panel span { display: block; height: 109px; width: 108px; background: url(images/icons/tile-main-37.png) no-repeat; text-indent: -9999px; }
div.control-panel figure:hover span.article { background-position: -864px 0px; }
div.control-panel span.article { background-position: -866px -108px; }
div.control-panel figure:hover span.category { background-position: -1188px 0px; }
div.control-panel span.category { background-position: -1190px -108px; }
div.control-panel figure:hover span.user { background-position: -972px 0px; }
div.control-panel span.user { background-position: -974px -108px; }
div.control-panel figure:hover span.config { background-position: -1404px 0px; }
div.control-panel span.config { background-position: -1407px -108px; }
div.control-panel figure:hover span.mail { background-position: -648px 0; }
div.control-panel span.mail { background-position: -649px -108px; }
div.control-panel figure:hover span.photoalbum { background-position: -540px 0px; }
div.control-panel span.photoalbum { background-position: -541px -108px; }
div.control-panel figure:hover span.slideshow { background-position: -108px 0px; }
div.control-panel span.slideshow { background-position: -108px -108px; }
div.control-panel figure:hover span.document { background-position: -216px 0px; }
div.control-panel span.document { background-position: -216px -108px; }
div.control-panel figure:hover span.carousel { background-position: -1080px 0; }
div.control-panel span.carousel { background-position: -1082px -108px; }
div.control-panel figure:hover span.shipping { background-position: -1620px 0; }
div.control-panel span.shipping { background-position: -1623px -108px; }
div.control-panel figure:hover span.page { background-position: -432px 0; }
div.control-panel span.page { background-position: -433px -108px; }
div.control-panel figure:hover span.store { background-position: -756px 0; }
div.control-panel span.store { background-position: -757px -108px; }
div.control-panel figure:hover span.product { background-position: -1512px 0; }
div.control-panel span.product { background-position: -1515px -108px; }
div.control-panel figure:hover span.look { background-position: -1728px 0; }
div.control-panel span.look { background-position: -1731px -108px; }
div.control-panel figure:hover span.group { background-position: -324px 0; }
div.control-panel span.group { background-position: -325px -108px; }
div.control-panel figure:hover span.menu { background-position: 0 0; }
div.control-panel span.menu { background-position: 0 -108px; }
div.control-panel figure:hover span.image { background-position: -1296px 0; }
div.control-panel span.image { background-position: -1298px -108px; }
div.control-panel figcaption { position: absolute; bottom: 7px; text-transform: uppercase; line-height: 0.8em; font-size: 1.0em; text-align: center; vertical-align: top; color: #828282; margin: 0 auto; width: 122px; }
div.control-panel figure:hover { border: 1px solid #4D4D4D; }
div.control-panel figure:hover figcaption { color: #fff; }
/* End control panel */

/* Notification */
div.notification { min-height: 30px; padding: 8px 25px 8px 50px; font-size: 1.3em; text-transform: uppercase; line-height: 1.3em; }
div.notification > span.status { background: url(images/icons/icon-status-5.png) no-repeat; height: 30px; width: 30px; float: left; margin-right: 35px; }
div.notification.success { color: #fff; background-color: #96c11f; }
div.notification.success > span.status { background-position: 0 0; }
div.notification.succes ul li:before { content: ''; position: absolute; left: 0; width: 30px; height:  30px; background: url(images/icons/icon-status-5.png) no-repeat; background-position: 0 0;   }
div.notification.error { color: #fff; background-color: #d82128; }
div.notification.error > span.status { background-position: -30px 0; }
div.notification.error ul li:before { content: ''; position: absolute; left: 0; width: 30px; height:  30px; background: url(images/icons/icon-status-5.png) no-repeat; background-position: -30px 0;   }
div.notification.warning { color: #fff; background-color: #fecc00; }
div.notification.warning ul li:before { content: ''; position: absolute; left: 0; width: 30px; height:  30px; background: url(images/icons/icon-status-5.png) no-repeat; background-position: -60px 0;   }
div.notification.warning > span.status { background-position: -60px 0; }
div.notification.question { color: #fff; background-color: #ee7202; }
div.notification.question > span.status { background-position: -90px 0; }
div.notification.question ul li:before { content: ''; position: absolute; left: 0; width: 30px; height:  30px; background: url(images/icons/icon-status-5.png) no-repeat; background-position: -90px 0;   }
div.notification ul { margin: 0; padding: 0; list-style: none; }
div.notification ul li { position: relative; padding-left: 65px; }
/* End notification */

/* Login */
.background { background-repeat:no-repeat; /* custom background-position */  background-position:50% 50%; /* ie8- graceful degradation */ background-position:50% 50%9 !important; }

.fullscreen,
.content-login { width:100%; min-height:100%; height: 100%; position: absolute; }

.not-fullscreen,
.not-fullscreen .content-login,
.fullscreen.not-overflow,
.fullscreen.not-overflow .content-login { height:100%; overflow:hidden; }

/* content centering styles */

div#login { min-height: 604px; height: 100%; }
div#login > div { position: absolute; width: 100%; }
div#login > header { top: 0; height: 10%; background-color: #fff; }
div#login > div.body { top: 10%; bottom: 10%; min-height: 484px; z-index: 50; }
div#login > footer { bottom: 0; height: 10%; background-color: #fff; }

div#login div.centered { position: absolute; top: 50%; left: 50%; width: 410px; height: 484px; margin: -242px 0 0 -230px; }
div#login div.logo { position: relative; width: 410px; padding: 25px 0; text-align: center; background-color: #BD1717; }
div#login div.logo:after { content: ''; position: absolute; border-left: 20px solid transparent; border-right: 20px solid transparent; border-top: 20px solid #BD1717; top: 88px; left: 48%; }
div#login div.panel { width: 410px; height: 280px; padding: 25px 2px 0 3px;  background: #575656 repeat; }
div#login ul.login-form { width: 210px; height: 220px; margin: 0 auto; padding: 0; /*padding: 25px 50px 0 50px;*/ list-style: none; margin-top: 50px; }
div#login ul.login-form li { margin-bottom: 15px; }
div#login ul.login-form li.username { }
div#login ul.login-form li.username label, div#login ul.login-form li.password label { width: 210px; height: 25px; color: #fff; font-size: 0.9em; padding-left: 30px; background: url(images/icons/arrow-login.png) no-repeat left center; }
div#login ul.login-form li.username input, div#login ul.login-form li.password input { width: 210px; height: 19px; padding: 0 0 0 5px; border: none; }
div#login ul.login-form li.username label {  }
div#login ul.login-form li.password label { }
div#login ul.login-form li.login { width: 205px; margin-top: 25px; padding-top: 15px; text-align: center; }
div#login ul.login-form li.login input { width: 210px; height: 50px; border-radius: 0; text-transform: uppercase; font-size: 1.1em; background: #757474 url(images/icons/login.png) no-repeat 120px center; border: none; text-align: left; padding-left: 60px; }

div#login div.notification { position: absolute; top: 88px; left: 0; right: 0; }
/* End login */

/* Image search */
div#article-images { width: 800px; padding: 25px; }
div#article-images div.search ul { margin: 0; padding: 0; list-style: none; }
div#article-images div.search li { float: left; width: 220px; margin: 5px; padding: 10px; border: 1px solid #333; background-color: #fff; text-align: center; }
div#article-images div.search div.image { display: table-cell; width: 200px; height: 200px; line-height: 200px; vertical-align: middle; }
div#article-images div.search div.image img { max-width: 200px; max-height: 200px; vertical-align: middle; }
div#article-images div.search div.info { text-align: center; }
div#article-images table.gridview { background-color: #fff; }
div#article-images table.gridview th { background-color: #d4d0c8; text-align: left; }
div#article-images table.gridview th, div#article-images table.gridview td { padding: 5px 10px; vertical-align: top; border: 1px solid #000; border-collapse: collapse; }
div#article-images div.search .ajax-loader { position: absolute; top: 30px; left: 225px; z-index: 1000; }
/* End image search */

.arrow-up, .arrow-right, .arrow-down, .arrow-left, .arrow-up.light, .arrow-right.light, .arrow-down.light, .arrow-left.light { display: inline-block; width: 8px; height: 8px; background: url(images/icons/tile-arrows-8.png) no-repeat; }
.arrow-up { background-position: -16px 0; }
.arrow-right { background-position: -8px 0; }
.arrow-down { background-position: -24px 0; }
.arrow-left { background-position: 0 0; }
.arrow-up.light { background-position: -16px -8px; }
.arrow-right.light { background-position: -8px -8px; }
.arrow-down.light { background-position: -24px -8px; }
.arrow-left.light { background-position: 0 -8px; }

.flt-rt { float: right; }
.flt-lt { float: left; }
.pad-10 { padding: 10px; }
.w-100 { width: 100%; }
.w-66 { width: 66%; }
.w-60 { width: 60%; }
.w-55 { width: 55%; }
.w-45 { width: 45%;  }
.w-33 { width: 33.33%; }

br.clear, li.clear { display: block; clear: both; }
.error { color: #f00; }
.watermark { color: #B8B8B8; }
.strong { font-weight: bold; }
.black { background-color: #f00; }
.hide { display: none; }

/* Article Images */
table.imagesOverview tr { display: table-row; height:100%; }
table.imagesOverview tr td .content { padding: 10px; margin: 0 5px 5px 0; border: 1px solid #989898; border-radius: 5px; background-color: #FFF; text-align:center; color: #000; }
table.imagesOverview tr td .content a { color: #000; text-decoration: none;}
table.imagesOverview tr td .content .image-upload { position: relative; text-align:center; }
table.imagesOverview tr td .content .image-upload img { border: 1px solid black; max-width: 100%; max-height: 100%;vertical-align: middle;z-index:1; }
table.imagesOverview tr td .content .image-upload .imgCont input {z-index: 999;position: absolute; top:20px;opacity: 0;filter: alpha(opacity = 0);-ms-filter: "alpha(opacity=0)"; cursor:pointer; width:135px;left:10px; }
table.imagesOverview tr td .content .image-upload label { cursor:pointer; min-width: 150px; padding: 0; height: 89px; width: 200px; }
table.imagesOverview tr td .content .image-upload div.image > span { cursor: pointer; }
table.imagesOverview tr td.cat .content { background-color:#DFB4B4; color: #FFF; }
table.imagesOverview tr td.first .content { background-color:transparent; border: none; color: #000; }
table.imagesOverview tr td .content .image-upload a.left { background: url('images/icons/arrow-left.png'); text-indent: -9999px; width:24px; display: block;float: left; }
table.imagesOverview tr td .content .image-upload a.right { background: url('images/icons/arrow-right.png'); text-indent: -9999px;width:24px; display: block;float: right; }
table.imagesOverview tr td .content .image-upload > div.pos { float: left; }
table.imagesOverview tr td .content .image-upload > div.pos > span { float: left; }
.image-info { vertical-align:bottom; margin-bottom: 10px; position: absolute; top: 0; }
.image-info p 
.image-info p a.left { background: url('images/icons/arrow-left.png'); text-indent: -9999px; width:24px; display: block;float: left; }
.image-info p a.right { background: url('images/icons/arrow-right.png'); text-indent: -9999px;width:24px; display: block;float: right; }
table.imagesOverview tr td .content .image-upload > div.image { width: 120px; display: table-cell; vertical-align: middle; text-align: center; }
table.imagesOverview tr td .content .image-upload > div.image input[type=file] { z-index: 999;position: absolute; top:0px;opacity: 0;filter: alpha(opacity = 0);-ms-filter: "alpha(opacity=0)"; cursor:pointer;  height: 100px;width: 170px;left:20px; }
table.imagesOverview tr td .content .image-upload > div.image input[type=text] { margin: 10px 0; }
table.imagesOverview tr td .content a.delete { background: url(images/icons/tile-options-24.png) no-repeat -24px -21px; text-indent: -9999px;width:24px; display: block; position: absolute;top:-10px;right:-10px; height:21px; }

table.imagesOverview tr td .content .image-upload img.noborder { border: none; }

div.box-position { width: 100px; margin: 0 auto; }
div.box-position > input[type="text"] { text-align: center; width: 50px; }

/* PAGE COMPONENT */
.manage-page { width: 100%; height: auto; margin: 0; padding: 0;}
/*.manage-page > fieldset { background-color: #e7f5ff !important;}*/
.manage-page .row { width: 100%; height: 140px; margin-bottom:10px; border:1px solid black; padding: 10px; display: block; position:relative; }
.manage-page a { text-decoration: none; font-weight: bold; color: #FFF; font-size: 10pt; text-transform: uppercase; background-color: #d82128; padding: 0 3px 0px 3px; margin-bottom: 5px; }
.manage-page a:hover { background-color: #d82128; }
.manage-page .row .column { border: 1px solid black; float: left; background-color:#fff; display:inline-block; height: 120px; margin:0 10px 0 0; padding: 30px 10px 10px 10px; position: relative;  }
.manage-page .row .column select { clear: both; float: right; }
.manage-page .row .column a { text-decoration: none; font-weight: bold;font-size: 12pt;margin-bottom: 0px; padding:0 3px 0 3px; line-height: 12pt; }
.manage-page .row .column a.delete { position: absolute; top: 3px; right: 3px; background: url(images/icons/tile-options-24.png) no-repeat -24px -21px; text-indent: -9999px; width: 24px; height: 21px; }
.manage-page .row .column a.right { position: absolute; bottom: 3px; right: 3px; }
.manage-page .row .column a.left { position: absolute; bottom: 3px; left: 3px; }
.manage-page .row .actions { position: absolute; top: 10px; right: 10px;height: 100px;}
.manage-page .row .actions a { float: right; clear:both; width: 120px;text-align:center;}

/* COMPONENT COLLECTION */
.component-collection { width: 100%; height: auto; margin: 0; padding: 0;}
/*.manage-component-collection > fieldset { background-color: #e7f5ff !important;}*/
.component-collection .row { width: 100%; margin-bottom:10px; border:1px solid black; padding: 10px; display: inline-block; position:relative; }
.component-collection .row .actions label { min-width:initial; }
.component-collection a { text-decoration: none; color: #FFF; font-size: 10pt; text-transform: uppercase; background-color: #991007; padding: 2px 5px; margin: 5px; }
.component-collection a:hover { background-color: #d82128; }
.component-collection .row .column { border: 1px solid black; float: left; background-color:#fff; display:inline-block; margin:0 10px 0 0; padding: 30px 10px 30px 10px; position: relative; width:255px; }
.component-collection .row .column label { display:block; clear:both; }
.component-collection .row .column select { clear: both; float: right; display:block; width:100%; }
.component-collection .row .column a { text-decoration: none; font-weight: bold;font-size: 12pt;margin-bottom: 0px; padding:0 3px 0 3px; line-height: 12pt; }
.component-collection .row .column a.delete { position: absolute; top: 3px; right: 3px; background: url(images/icons/tile-options-24.png) no-repeat -24px -21px; text-indent: -9999px; width: 24px; height: 21px; }
.component-collection .row .column a.right { position: absolute; bottom: 3px; right: 3px; }
.component-collection .row .column a.left { position: absolute; bottom: 3px; left: 3px; }
.component-collection .row .items { width:100%; clear:both;  padding-top:10px; }
.component-collection .row .actions { position: relative; float:left; display:inline-block; clear:both; border:1px solid #777; padding:5px 0;}
.component-collection .row .actions a { float: left; text-align:center; margin:0 5px;}
.component-collection .row .actions span { float: left; width: 120px;text-align:left; }

.component-collection .row .column > div.image { width: 120px; vertical-align: middle; clear:both; }
.component-collection .row .column > div.image .image-upload { text-align: center; }
.component-collection .row .column > div.image input[type=file] { z-index: 999;position: absolute; top:0px;opacity: 0;filter: alpha(opacity = 0);-ms-filter: "alpha(opacity=0)"; cursor:pointer; width:40px;left:20px; }
.component-collection .row .column > div.image label { cursor:pointer; min-width: 150px; padding: 0; width: 240px; position:relative; padding-top: 20px; }
.component-collection .row .column > div.image img { max-width: 100%; max-height: 100%;vertical-align: middle;z-index:1; padding:5px 0 0 0; display:inline-block; height:80px; }
.component-collection .row .column > div.image .tabs { width:230px; }
.component-collection .row .column > div.image .tabs label { height:initial; text-align:left; padding-left:15px; padding-top:0;  }

/* User Roles */

.user-roles input[type="text"].search { margin:0 5px 5px 5px; width:50%; }
.user-roles .seasons-selection { width: 33.33%; float:left; display:inline-block; text-transform:uppercase;  }
.user-roles table.seasons { width: 100%; max-height: 300px; overflow-y: scroll;   }
.user-roles table.seasons tbody tr:hover { background-color:#BD1717; color:#FFF; }
.user-roles table.seasons thead tr td { border:none; background-color:#3C3C3B; color:#FFF;}
.user-roles table.seasons tbody tr td { float:none; border-bottom: 1px solid #BD1717; cursor:move; min-height:20px; max-height:32px; padding:5px; margin-bottom:5px; max-height: 20px; }
.user-roles table.seasons tbody tr td .options { float:right; }
.user-roles table.seasons tbody tr td .options label { display:inline-block; min-width:20px; }
.user-roles table.seasons tbody tr td .options input { float:initial; }
.user-roles table.seasons tbody tr td .options select { width:130px; height:17px; padding:0 }

/* User Customers */

.users input[type="text"].search { margin:0 5px 5px 5px; width:50%; }
.users fieldset a { float:right; color:#000; font-size:12px; margin-bottom:5px; }
.users .customers-selection { width: 33.33%; float:left; display:inline-block; text-transform:uppercase;  }
.users table.customers { width: 100% !important;  max-height: 300px; overflow-y: scroll; }
.users table.customers tbody tr:hover { background-color:#BD1717; color:#FFF; }
.users table.customers thead tr td { border:none; background-color:#3C3C3B; color:#FFF;}
.users table.customers tbody tr td { float:none; border-bottom: 1px solid #BD1717; cursor:move; min-height:20px; max-height:32px; padding:5px; margin-bottom:5px; max-height: 20px; }
.users table tr.activated { background-color:rgba(51, 204, 51, 0.8) }
.users table tr.mail-sent { background-color:rgba(255, 140, 0, 0.8) }
.dataTables_wrapper .dataTables_filter {float: right;text-align: right;margin-bottom: 5px;}
/* Spinner */
#spinner { height: 100%;width: 75%;position: fixed;z-index: 50;text-align:center; display:none;}
#spinner img { padding-top: 350px;}

.htmlcolorpreview { height: 20px; width:20px; border:1px solid black; }