@charset "utf-8";
* {
   margin: 0;
   padding: 0;
}

@font-face {
    font-family: 'LatoWebMedium';
    src: url('../fonts/Lato-Medium.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Medium.woff2') format('woff2'), /* Modern Browsers */
         url('../fonts/Lato-Medium.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Medium.ttf') format('truetype');
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

body {
   font-family: 'LatoWebMedium', Arial,Helvetica,sans-serif;
   color: #4F4F4F;
   font-size: 12px;
   overflow-y: scroll;   /* force vertical scrollbar */
}

img {
   border: 0;
}

.icon {
    border: 0 none;
    height: 20px;
    width: 20px;
}

a, .link {
   color: #971824;
   text-decoration: none;
   cursor: pointer;
}

.boldlink {
   color: #971824;
   font-weight:bold;
   text-decoration: none;
   cursor: pointer;
}

.clear {
   clear: both;
}

.clear-left {
   clear: left;
}

.clear-right {
   clear: right;
}

.ym-wide-wrapper {
   margin: 0 auto 10px auto;
}

.ym-wrapper {
   width: 900px;
   margin: 0 auto 10px auto;
}

.ym-gbox {
   margin:0;
   padding:0;
}

.inner-gl .ym-gbox {
   margin-left: 6px;    /* leave space to the previous column */
}

.ym-gr .ym-gbox {
   margin-left: 6px;    /* leave space to the previous column */
}

#project_logo {
	max-height: 80px;
}

.header-welcome {
   float: none;
	display:block;
   font-size: 12px;
   padding: 5px;
   padding-top: 8px;
   height: 12px;
}

.header_button {
   color: #FFFFFF;
   width: 70px;
   height: 30px;
   display: block;
   text-align: center;
   float: right;
   margin-left: 5px;
   padding-top: 8px;
}

#language_switcher, #theme_switcher {
   float: right;
   font-size: 12px;
   padding: 5px;
   padding-top: 8px;
   padding-right: 16px;
}

#header_menu {
   font-size: 14px;
   position:absolute;
   bottom:0px;
   right:0;
}

#main {
   background: #FFFFFF;
   min-height:400px; /* for small content */
}
#footer {
   padding: 1px;
   height: 14px;
   background: #EDEDED;
}

#interface_status {
   color: #00a651;
}

.filter_element {
   padding-right: 30px;   /* leave space to the next element */
}

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

h1 {
   color: #DFDFDF;
   font-size: 45px;
   font-weight: normal;
   text-align: right;
   text-transform: uppercase;
}

h3 {
   font-size: 14px;
   margin: 8px 0;
}

p, .row {
   margin: 8px 0;
}

form textarea {
   border: 1px solid #666;
   background-color: #F5F5F5;
   width: 270px;
   height: 60px;
}

.form_box {
   border: 1px solid #CCC;
   padding: 8px 14px;
   margin-bottom: 12px;
}

.header_bold_text {
	font-size: 20px;
	font-weight: bold;
}
.table_wide {
	width: 100%;
}
.table_search {
	 border-collapse: separate;
    border-spacing: 10px;
}

.form_box_search {
	margin-bottom: 12px;
	margin-left: 20px;
	margin-top: 30px;
}

.form_box_dashboard {
	padding: 8px 14px;
	background-image: none;
	background-repeat:no-repeat;
	color: #4F4F4F;
	height: 180px;
	background-color: #CEC9C9;
}

.image_overlay_text {
	color: #4F4F4F;
}

.form_box div {
   margin: 4px auto; /* TODO: selector is to greedy,
                        should only target divs in forms
                        to provide some space to top and bottom*/
}

.form_box #map_canvas, .form_box #map_canvas div {
   margin: 0;
}

.form_box hr {
   border: 1px solid #CCC;
   height: 1px;
   margin: 12px auto;
}

.form_box .list_img {
   width: 60px;
   text-align: center;
   padding: 3px 0px;
}

.form_box tr:hover .list_img a img {
   border-radius: 5px;
   -moz-border-radius: 5x;
   -webkit-border-radius: 5px;
}

.form_box .list_img img {
   height: 40px;
}

.form_box .reward div {
   margin-bottom: 0px;
   margin-top: 0px; /* reset greedy selector for form spaces */
}
.form_box .reward {
   margin-bottom:12px
}

.form_box .reward .ym-gbox {
  border: 1px solid #CCCCCC;
  height: 150px;
  padding: 10px 5px 5px 5px;
  text-align: center;
}

.form_box .reward .ym-gbox a img {
   max-height: 100px;
   max-width: 100px;
}

.form_box .reward .ym-gbox:hover {
  background: #FCE8EA;
}

.form_box .reward .ym-gbox:hover a img {
   border-radius: 10px;
   -moz-border-radius: 10px;
   -webkit-border-radius: 10px;
}

.tab_box {
   background-color: #eee;
   border: 1px solid #ccc;
   border-bottom-width: 0px;
   padding: 4px 8px
}

.lu_status {
   float: right;
   color: #999;
}

.iqone-error-content {
      width: 100%;
      color: #99101E;
      float: left;
      clear: both;
      margin-bottom: 5px;
}

.iqone-success-content {
      width: 100%;
      color: #008000;
      float: left;
      clear: both;
      margin-bottom: 5px;
}

.iqone-error-color {
      color: #99101E;
}

.iqone-success-color {
      color: #008000;
}

.iqone-attention-color {
      color: #99101E;
}

input[type="text"].error_fld,
input[type="password"].error_fld,
select.error_fld,
textarea.error_fld  {
   background-color: #ffedf0;
}

span.error_fld,
div.error_fld {
    font-weight: bold;
    color: #900;
    text-align:center;
}

div.filter {
   width: 900px;
   margin: 0 auto;
   margin-bottom: 10px;
   text-align: center;
}

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

.left {
   float:left;
}
.right {
   float:right;
}

.none,
input[type="submit"].none {
   display: none;
}

.normal {
   display: block;
}

/*START********** IQone Customization **********/
.sf-menu {
   float: right;
}

.sf-menu a.sf-with-ul {
   padding: 0 0 30px 0;
}
.sf-menu a {
   border: 0;
   padding: 0;
}

.sf-menu a,
.sf-menu a:visited {
   display:block;
   color:   #959595;
   padding: 0 0 30px 0;
   font-weight: normal;
}

.sf-menu li,
.sf-menu a li  {

   padding: 4px 10px 4px 10px;
   text-align: left;

}
.sf-menu li li {
   padding: 0 0 0 0;
}
.sf-menu li li a,
.sf-menu li li a:visited {
   padding: 4px 10px;
}
.sf-menu li,
.sf-menu li li,
.sf-menu li li li {
   background:transparent;
}
.sf-menu a:focus,
.sf-menu a:hover,
.sf-menu a:active {
   background: transparent;
   color: #a2313c;
}
.sf-menu li:hover,
.sf-menu li.sfHover {
   background: transparent;
   font-weight: bold;
   color: #a2313c;
}
.sf-menu li li a:hover {
   background:#fafafa;
}
.sf-menu ul {
   margin-left: 0px;
   background-color:#fefefe;
   border:1px solid #eee;
   border-bottom:1px solid #aaa;
   border-right:1px solid #aaa;
   margin-top:16px;
}
.sf-menu ul li {
   border-bottom:1px solid #eee;
}
ul.sf-menu li li.sfHover ul {
   left: auto; /* match ul width */
}
.sf-menu li.sfHover ul {
   top: 25px; /* match top ul list item height */
}
a > .sf-sub-indicator {
   top: 20px;
   left: 15px;
   left:40%;
}

/*END*********** IQone Customization **********/

/*START********* CSS3 Buttons *****************/
input[type=submit], input[type=reset], input[type=button], button {
   display: inline-block;
   outline: none;
   cursor: pointer;
   text-align: center;
   text-decoration: none;
   font: 14px/100% Arial, Helvetica, sans-serif;
   padding: 3px 6px 3px;

   -webkit-border-radius: 7px;
   -moz-border-radius: 7px;
   border-radius: 7px;

   -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
   -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
   box-shadow: 0 1px 2px rgba(0,0,0,.2);

   color: #4F4F4F;
   border: solid 1px #7F7F7F;
   background: #F3F3F3;
   background: -webkit-gradient(linear, left top, left bottom, from(#F3F3F3), to(#CCCCCC));
   background: -moz-linear-gradient(top,  #F3F3F3,  #CCCCCC);
   filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#F3F3F3', endColorstr='#CCCCCC');
}
input[type=submit]:hover, input[type=reset]:hover, input[type=button]:hover, button:hover {
   text-decoration: none;

   background: #f47c20;
   background: -webkit-gradient(linear, left top, left bottom, from(#F1F1F1), to(#B7B7B7));
   background: -moz-linear-gradient(top,  #F1F1F1,  #B7B7B7);
   filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#F1F1F1', endColorstr='#B7B7B7');
}
input[type=submit]:active,
input[type=reset]:active,
input[type=button]:active,
button:active {
   background: -webkit-gradient(linear, left top, left bottom, from(#CCCCCC), to(#F3F3F3));
   background: -moz-linear-gradient(top,  #CCCCCC,  #F3F3F3);
   filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#CCCCCC', endColorstr='#F3F3F3');
}

input[type=submit].red,
input[type=button].red,
input[type=reset].red,
button.red {
   padding: 4px 8px 4px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   color: #fef4e9;
   border: solid 1px #A8333F;
   background: #f78d1d;
   background: -webkit-gradient(linear, left top, left bottom, from(#EF3B4F), to(#A8333F));
   background: -moz-linear-gradient(top,  #EF3B4F,  #A8333F);
   filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#EF3B4F', endColorstr='#A8333F');
}

input[type=submit].red:hover,
input[type=button].red:hover,
input[type=reset].red:hover,
button.red:hover {
   background: #f47c20;
   background: -webkit-gradient(linear, left top, left bottom, from(#EF3B4F), to(#7F1725));
   background: -moz-linear-gradient(top,  #EF3B4F,  #7F1725);
   filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#EF3B4F', endColorstr='#7F1725');
}
button.red:hover {
   cursor: hand;
   cursor: pointer;
}
input[type=submit].red:active,
input[type=button].red:active,
input[type=reset].red:active,
button.red:active {
   color: #fcd3a5;
   background: -webkit-gradient(linear, left top, left bottom, from(#A8333F), to(#EF3B4F));
   background: -moz-linear-gradient(top,  #A8333F,  #EF3B4F);
   filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#A8333F', endColorstr='#EF3B4F');
}

/*END*********** CSS3 Buttons *****************/

/*START********* Icon Links *******************/

.ui-button {
   border: none;
   padding: 0;
   margin: 0;
   font-weight: normal;
   background: none;
}

.ui-button:hover {
   background: none;
}

.ui-button .ui-button-text {
   padding: 0 2px;
   padding-left: 18px;
   line-height: normal;
}

.view_buttons a {
   display: block;
   float: left;
   border: 1px solid #CCCCCC;
   margin-left: 5px;
   padding: 2px;
}

.view_buttons a:hover {
    background: #FCE8EA;
}

/*START********** jQuery UI Dialog **********/

.dept1-notification {
   border-color: #C9C9C9;
}
.dept1-notification .ui-dialog-titlebar {
   padding: 0 0.5em;
}
.dept1-notification .ui-dialog-content {
   text-align: left;
}
.ui-dialog .ui-dialog-buttonpane button {
    display: inline-block;
    border: none;
    box-shadow: none;
    background: #c4c4c4;
    padding: 6px;
    color: #fff;
    border-radius: 4px;
}
.ui-dialog .ui-dialog-buttonpane button:hover {
	background:#be2a36;
}
.ui-button .ui-button-text {
    padding-left: 0;
    text-transform: uppercase;
    font-weight: normal;
    font: 14px/100% Arial, Helvetica, sans-serif;
}

/*START********** Dashboard **********/
#statistics_page {
	border-collapse: separate;
    border-spacing: 5px;
    margin-top: 8px;
}

#statistics_page .dash_widget {
   border: 0px solid #CCC;
   margin-bottom: 12px; /* leave space to the following graphic */
}

#statistics_page .dash_title {
   background: #DFDFDF url("../img/gripper.png") top left no-repeat;
   width: 100%;
   height: 12px;
   cursor: move;
}

#statistics_page .dash_graph {
   width: 600px;
   height: 220px;
   margin: 8px 8px 8px 16px;
}

#statistics_page .dash_graph.small {
   width: 400px;
   height: 170px;
}

#statistics_page .medium {
   width: 125px;
}

#statistics_page .inner_dash_graph {
   width: 400px;
   height: 220px;
   margin: 8px 8px 8px 0px;
   background-color: white;
}

#statistics_page .inner_dash_graph.wide {
   width: 800px;
}

#statistics_page .inner_dash_graph.high {
   height: 300px;
}

#statistics_page .dash_graph.tiny {
   width: 268px;
   height: 155px;
}

#statistics_page .combined_statistics {
	background-color: white;
	margin: 8px 0 8px 16px;
	height: 220px;
}

#statistics_page .combined_statistics.small {
	height: 168px;
}

#statistics_page .combined_statistics.high {
	height: 520px;
}

#statistics_page .dash_graph.wide {
   width: 560px;
}

#statistics_page .dash_graph.high {
   height: 250px;
}

#statistics_page .dash_graph.s3of4,
#statistics_page .dash_legend.s3of4 {
    float: left;
}

#statistics_page .dash_text {
	width: 600px;
	height: 220px;
	margin: 8px 8px 8px 16px;
	background: white;
	padding: 10px 20px 10px 10px;
	box-sizing: border-box;
}

#statistics_page .dash_text.wide {
	width: 1216px;
}

#statistics_page .dash_text.medium {
	height: 340px;
}

#statistics_page .dash_text.high {
	height: 520px;
}

#statistics_page .dash_text.small {
	width: 400px;
	height: 170px;
}

#statistics_page .dash_text.combined {
   margin: 0;
}

#statistics_page .wide_header {
	padding-top: 35px;
	padding-left: 10px;
	padding-bottom: 10px;
}

/* Display TAGLIB style fix */
.pagelinks {
   display: block;
   margin-top: 2px;
   margin-bottom: 5px;
}

/*START********* Data Tables **********/
.data_table {
   width: 100%;
   border-spacing: 0px;
   margin-top: 12px;
   border-bottom:1px solid #CCCCCC;
}

.fixed_data_table {
	table-layout: fixed;
	overflow: hidden;
   width: 100%;
   border-spacing: 0px;
   margin-top: 12px;
   border-bottom:1px solid #CCCCCC;
}

.data_table td,
.fixed_data_table td {
   padding: 1px 3px;
   border-top: 1px solid #DDDDDD;
}

.data_table tr:hover,
.fixed_data_table tr:hover {
   background: #FCE8EA;
}

.data_table th,
.fixed_data_table th {
   border-bottom: 1px solid #CCCCCC;
   padding-bottom: 4px;
   padding: 1px 3px;
}

.data_table thead tr:hover,
.fixed_data_table thead tr:hover {
   background: none;
}

.data_table .int_input_col,
.fixed_data_table .int_input_col {
   width: 100px;
}

.data_table .buttons_col,
.fixed_data_table .buttons_col {
   width: 60px;
   text-align: right;
}

.data_table .buttons_col_large,
.fixed_data_table .buttons_col_large {
   width: 90px;
   text-align: right;
}

/*END*********** Data Tables **********/

.store_picker {
	width: 253px;
}

.date_picker,
.date_picker[type=text] {
   width: 120px;
}

.sales-area-picker {
	width: 206px;
}

.radio_buttons_group label {
	margin-right: 10px;
	margin-left: 3px;
}

.checkBoxRadioWrapper + label {
	float: left;
	margin-top: 6px;
}

.radio_buttons_group input {
	margin-top: 5px;
}

.dynamic_data_table .number,
.data_table .number {
	text-align: right;
	padding-right: 20px;
	width: 30px;
}

.dynamic_data_table .wide_number,
.data_table .wide_number {
	text-align: right;
	padding-right: 20px;
	width: 80px;
}

.ingredient {
   display: inline-block;
}

#code_label {
	padding: 8px 0px 0px 0px;
}

#valid {
	padding: 0px 0px 0px 20px;
}

img.avatar {
	width:58px;
	height:58px;
}

img.post-image,
img.thumb {
	max-width:300px;
	max-height:300px;
}

.right_box {
	text-align: right;
}

/* *** blog entry preview *** */
#preview_content {
	width: 100%;
	height: 590px;
}

.story-preview {
	border-style: none;
}

.dashboard_statistics,
.dashboard_sub_statistics {
	width: 100%;
}

.dashboard_statistics th.title,
.dashboard_statistics td.title {
	width: 60%;
}

.dashboard_statistics th.range,
.dashboard_statistics td.range {
	width: 20%;
	text-align: right;
}

.dashboard_statistics th.total,
.dashboard_statistics td.total {
	width: 20%;
	text-align: right;
}

.dashboard_statistics th.states,
.dashboard_statistics td.states {
	width: 8%;
	text-align: right;
}

#unrated {
    padding-left: 30px;
}

#wish_image {
    height: 200px;
}

#wish_complete {
	float: right;
}

.voided_order {
    color: #99101E;
}

.data_table .small {
	 width: 40px;
}

#wish_category_id {
	width: 255px;
}

#frontend_image_delete {
	float:right;
}

.frontend_image_delete {
	float:right;
}

/* *** new design ***/

body {
	background-color: #ededed;
}

form input[type=text],
.detail_view_list input[type=text],
form textarea,
.detail_view_list textarea,
form select,
.detail_view_list select,
form .text,
.detail_view_list .text,
.input_element,
.error_fld,
.format_example {
	box-sizing:border-box;
	padding:5px 25px 5px 5px;
	outline:none;
	background:#fff;
	color:#4f4f4f;
	font:12px/1.4 'LatoWebMedium', arial !important;
}

.format_example {
	white-space: nowrap;
}

form input[type=text],
form input[type=password],
form textarea,
form select,
.input_element {
	padding:5px 25px 5px 5px;
	border:solid 1px #c4c4c4;
	border-radius:4px;
}
.ui-widget-content {
	background:#fff !important;
}

form select[disabled],
form select[readonly=true] {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

select[disabled]::-ms-expand,
select[readonly=true]::-ms-expand {
    display: none;
}

.ym-wide-wrapper.wide_style {
	margin:0 auto;
	position:relative;
	background:url(../img/main-navi.png) repeat-y top left;
}

#spinner_overlay {
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	left:0;
	z-index: 16777271;
	display:none;
}
#spinner_background {
	width:100%;
	height:100%;
	position:relative;
	background:#515151;
	opacity:0.5;
}
#spinner_icon {
	position:absolute;
	top:50%;
	left:50%;
	margin-top:-12.5px;
	margin-left:-12.5px;
	color:#fff;
}
#iqone-main-content {
	margin-left:220px;
}

#iqone-main-navi {
	width:220px;
	background:#515151;
	position:absolute;
	top:0;
	left:0;
	padding:10px 0;
}
#iqone-main-navi .sf-menu {
	float:none;
	padding:0;
	margin:0;
}
#iqone-main-navi > .sf-menu  > li > a {
	padding:20px 30px 20px 50px;
	font-size: 1.2em;
	text-transform:uppercase;
	font-weight:bold;
}
#iqone-main-navi > .sf-menu > li.start > ul {
	display:block;
}
#iqone-main-navi .sf-menu li {
	float:none;
	padding:0;
	list-style:none;
	margin:0;
}
#iqone-main-navi .sf-menu li ul {
	position:static;
	background:#515151;
	border:none;
	width:auto;
	display:none;
	margin:20px 0;
}
#iqone-main-navi .sf-menu li ul li {
	border:none;
}
#iqone-main-navi .sf-menu li a {
	color:#a9a9a9;
	display:block;
}
#iqone-main-navi .sf-menu li ul li a:hover {
	background:#727272;
}
#iqone-main-navi > .sf-menu > li.active > a {
	color:#fff;
}
#iqone-main-navi .sf-menu > li > ul > li > a {
	padding:3px 30px 3px 50px;
	text-transform:uppercase;
	color:#fff;
}
.subMenuItems li.active {
	background:#727272;
}
#theme_language_box {
	margin-left:10px;
	margin-top:32px;
	margin-bottom:20px;
	float:right;
}
#logout_block {
    margin-top: 20px;
	padding:0 20px 0 0;
	float:right;
}
#logout_button_wrap {
	display:block;
	float:none;
}
.header_button {
	color:#c4c4c4;
	width:auto;
	height:auto;
	float:none;
	display:inline;
}
#logout_button {
	height:40px;
	width:40px;
	background:url(../img/logout.png) no-repeat 50%;
	display:block;
	float:none;
	margin:0 auto;
	border: none;
	box-shadow: 0 0px 0px;
	border-radius: 0;
}
#anonymous_block {
	float:right;
	padding-right:20px;
}

.ui-navi-link {
	position: relative;
}

.ui-navi-link > a:before {
	font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
	font-size: 22px;
    padding-right: 0.5em;
    position: absolute;
    left: 15px;
    opacity: 0.5;
}

.ui-navi-link.active > a:before {
	color: #727272;
}

#naviLink_dashboard_frame > a:before {
	content: "\f012";
}

#naviLink_loyalty > a:before {
	content: "\f06e";
}

#naviLink_stores > a:before {
	content: "\f015";
}

#naviLink_campaigns > a:before {
	content: "\f0e5";
}

#naviLink_sweepstakes > a:before {
	content: "\f005";
}

#naviLink_report_frame > a:before {
	content: "\f02b";
}

#naviLink_iqone > a:before {
	content: "\f187";
}

#naviLink_revenue_reference_frame > a:before {
	content: "\f0c0";
}

#naviLink_store_frame > a:before {
	content: "\f015";
}

#naviLink_person_frame > a:before {
	content: "\f0cb";
}

#naviLink_customer_activity_frame > a:before {
	content: "\f1da";
}

#naviLink_sales_area_frame > a:before {
	content: "\f0e8";
}

#naviLink_annual_revenue_frame > a:before {
	content: "\f200";
}

#naviLink_campaign_frame > a:before {
	content: "\f0e5";
}

#naviLink_event_frame > a:before {
	content: "\f005";
}

#naviLink_event_participation_frame > a:before {
	content: "\f006";
}

#naviLink_news_frame > a:before {
	content: "\f09e";
}

#naviLink_content > a:before {
	content: "\f07b";
}

#naviLink_cms_page_frame > a:before {
	content: "\f02b";
}

#naviLink_user_frame > a:before {
	content: "\f007";
}

#naviLink_message_content_frame > a:before {
	content: "\f0e0";
}

#naviLink_blogs > a:before {
	content: "\f030";
}

form input[disabled],
form input[readonly],
form textarea[disabled],
form textarea[readonly],
form select[disabled],
form select[readonly] {
	border:solid 1px #fff !important;
}
form select[disabled],
form select[readonly] {
	display:none;
}

.page-header {
	background: #fff;
	height: auto; /* overwrite */
	min-height: 100px;
	position: relative;
}
#anonymous_block {
	float:right;
}

.page-header #project_logo_block {
	position: absolute;
    top: 50%;
    transform: translateY(-50%);
   	width:220px;
}

#project_logo_block a {
	display:block;
}

#project_logo {
	display:block;
	margin: 0 auto;
}

#project_title {
	position:absolute;
	width:auto;
	left:110%;
	top:50%;
	transform: translateY(-50%);
}

#project_title h1 {
	white-space: nowrap;
	font-size:30px;
}

#main {
	background:transparent;
}

.table-panel h2.dynamic_data_table_heading,
.table-panel h3.dynamic_data_table_heading {
	padding:10px;
}

.frame_box {
   margin: 15px 15px 0 15px;
   background:#fff;
   box-sizing:border-box;
   padding:10px;
}

.frame_box.table-panel {
	padding:0 0 5px 0;
}

.ui-dialog-content .frame_box {
	margin:0;
	padding:0;
}
.ym-g50 .frame_box {
	margin: 15px 15px 0 0;
}
.ym-g50:first-child .frame_box {
	margin: 15px 15px 0 15px;
}
.frame_box h2, 
.frame_box h3 {
	font-weight:normal;
	text-transform: uppercase;
}
.frame_box h2:first-child, 
.frame_box h3:first-child {
	margin-top:0;
}

.frame_box form > div:not(.sub-panel),
.frame_box form > div.sub-panel > div:not(.right_buttons),
.frame_box form > div > div > div > div.combined,
.frame_box form > div.cms-block > div:not(.sub-panel) {
   margin: 4px auto;
   position:relative;
}

h2.dynamic_data_table_heading,
h3.dynamic_data_table_heading {
	display:inline-block;
}

.text_left h1 {
	text-align: left;
	padding-left: 10px;
	padding-top: 4px;
}

.text_right {
	text-align: right;
	padding-right: 10px;
}

.ym-grid-wrap {
	background:#ededed;
}
#fullSearchFormWrapper {
	padding:10px;
}

#tabContentFullSearch .ym-gbox > div {
	overflow:hidden;
	margin: 4px auto;
}
#tabContentFullSearch .ym-gbox > div:last-child {
	margin-bottom:0;
}
#fullSearchFormWrapper .ym-g50 {
	width:42.5%;
}
#tabContentFullSearch .label {
	padding: 7px 0;
}
#tabContentFullSearch #submit_search {
	float:right;
	margin:5px 0;
}

.dynamic_data_table {
   width: 100%;
   border-spacing: 0px;
   box-sizing:border-box;
}

.dashboard_sub_statistics th.total,
.dashboard_sub_statistics th.range,
.dashboard_sub_statistics td.total,
.dashboard_sub_statistics td.range {
	text-align: right;
}

.dashboard_sub_statistics th,
.dashboard_sub_statistics td {
	padding:0px 5px 0px 0px;
}

.sub_header_list {
	color: #c4c4c4;
	font-weight:normal;
}

.dynamic_data_table tr:hover td {
	background:#fce8ea;
}

.dynamic_data_table th {
	padding:10px;
	margin-bottom: 10px;
	background:#b6142b;
	color:#fff;
	text-align:left;
}

.dynamic_data_table th a {
	color:#fff;
	font-weight:normal;
}

.dynamic_data_table td {
	padding:5px 10px;
	background:#fff;
}

.dynamic_data_table tr:last-child td .show_button {
	bottom:13px;
}
.frame_box .dpt-pagination {
	overflow: hidden;
    float: right;
    margin: 0;
}

.frame_box .pagebanner {
	margin-top:15px;
    margin-right: 10px;
	float:right;
}

.frame_box .pagelinks {
   margin-top:8px;
   float:right;
}

.pagelinks strong, .pagelinks a, .detail_paging a {
	color:#fff;
	float:left;
	padding:6px 10px;
	border-radius: 4px;
	margin-right:2px;
}

.detail_paging {
	overflow:hidden;
	padding:0 0 10px 0;
}

.pagelinks strong {
	background:#b6142b;
}

.pagelinks a,
.detail_paging a {
	background:#c4c4c4;
}
.pagelinks a:hover,
.detail_paging a:hover {
	background:#FCE8EA;
}
.detail_paging a.active_detail {
	background: #b6142b;
}

.content-heading {
	position:relative;
	overflow:hidden;
	background:#fff;
	min-height:80px;
}

.content-heading h1 {
	padding:25px;
	color: #222;
	font-size:2em;
}

.content-heading .text_right h2 {
	position: absolute;
    bottom: 10px;
    right: 80px;
}

.content-heading .text_right h2 span#tabLabelFullSearch {
	font-size: 0.8em;
	color:#c4c4c4;
	font-weight:normal;
	cursor: pointer;
}

.content-heading .text_right h2 span#tabLabelFullSearch:hover {
	color:#b6142b;
}

.content-heading .text_right h2 span#tabLabelFullSearch i {
	color:#c4c4c4;
}

.content-heading .text_right h2 span#tabLabelFullSearch:hover i {
	color:#b6142b;
}

.content-heading .text_right h2 span#tabLabelFullSearch span {
	text-decoration:underline;
}

#tabContentQuickSearch {
	position:absolute;
	top:14px;
	right:5px;
}

#tabContentQuickSearch input[type=text]{
	background:#fff url(../img/magnifying-glass.png) no-repeat right 50%;
	margin-right:10px;
	width:auto;
}

input#submit_quick_search {
	background:#c4c4c4;
}

input#submit_quick_search:hover {
	background:#b6142b !important;
}

input.gray_button,
a.gray_button {
	background:#c4c4c4;
	color:#fff;
	border:none;
	border-radius: 4px;
	box-shadow:none;
	padding:6px;
	text-transform:uppercase;
}
input.gray_button:hover,
a.gray_button:hover {
	background: #b6142b;
}

input.red {
	background:#b6142b !important;
	color:#fff;
	border:none;
	border-radius: 4px;
	box-shadow:none;
	padding:6px;
	text-transform:uppercase;
}
input.red:active {
	color:#fff;
}
input.red:hover {
	background:#515151 !important;
}
input.list_gray {
	background: #c4c4c4;
	color:#fff;
	border:none;
	border-radius: 4px;
	box-shadow:none;
	padding:6px;
	text-transform:uppercase;
}
input.list_gray:hover {
	background:#b6142b;
}

.label {
	box-sizing: border-box;
}
form > div.cms-block > div,
form > div {
	width:100%;
	overflow:hidden;
}

.ym-g50 .label {
	box-sizing:border-box;
	display:block;
	float:left;
	width:25%;
}

.ym-g100 .label {
	box-sizing:border-box;
	display:block;
	float:left;
	width:50%;
}

.ym-g50 .label.ym-g33 {
	width: 33.333%;
}

.frame_box .label {
	padding:5px 0;	
}

.two_columns input[type=text],
.detail_view input[type=text],
.two_columns input[type=password],
.detail_view input[type=password],
.two_columns textarea,
.detail_view textarea,
.two_columns select,
.detail_view select,
.two_columns .text,
.detail_view .text,
.error_fld,
.format_example {
	box-sizing:border-box;	
}

.two_columns input[type=text],
.two_columns input[type=password],
.two_columns textarea,
.two_columns select,
.two_columns .text {
	display:block;
	float:left;
	width:75%;
}

.detail_view_detail_button input[type=button] {
	padding:4px 6px;
	font-size:12px;
	border-radius:3px;
}

#footer {
	padding:10px 20px;
}
.ym-grid-wrap > h2 {
	margin:10px 30px 0 30px;
}

table#item td {
	position:relative;
}
td.buttons_col {
	padding:0 10px 0 0;
}
.show_button, .delete_button {
	float:right;
	background:#c4c4c4;
	padding:2px 10px;
	border-radius:3px;
	color:#fff;
	box-sizing:border-box;
	text-transform:uppercase;
}
.show_button:hover,
.delete_button:hover,
.show_button .ui-state-hover,
.delete_button .ui-state-hover {
	background:#b6142b !important;
}
.show_button .ui-button-text,
.delete_button .ui-button-text {
	display:inline;
	text-indent:0;
	text-transform:uppercase;
}
.show_button .ui-icon-search,
.delete_button .ui-icon-search {
	display:none;
}
.highlight td {
	background:#777 !important;
	color:#fff;
}
.highlight td .show_button,
.highlight td .delete_button {
	background:#bbb;
}

.show_button_col {
	margin-left: 10px;	
}

#product_picture {
	width: 100%;
	height: 100%;
}
.detail_view {
	position:relative;
}
.detail_view_list > div {
	overflow:hidden;
}
.detail_view input[type=submit],
.cancel_button,
.preview_button,
.top_button,
.top_left_row_button {
	position:absolute;
	top:10px;
}
.top_left_row_button {
	right:160px;
}

.detail_view h3,
.detail_view h4 {
	margin-bottom: 15px;
}

.detail_view h4 {
	margin-top: 20px;
}

.table-panel.detail_view h3 {
	margin-bottom: 0px;
}

.detail_view input[type=submit],
.right_button {
	right:10px;
}
input.cancel_button {
	right:130px;
}
input.preview_button {
	display:none;
	right:160px;
}
div .bottom_space {
	margin-bottom: 20px;
}

#prize_list_block, #receipt_prize_list, .skinned, #reject_reason_block {
	margin: 0;
}

#receipt_prize_list, #reject_reason_block, .no_deco_list {
	list-style-type: none;
}

#receipt_image, #receipt_frame {
	width: 100%;
	height: 100%;
}

#image_container {
	position:relative;
}
#rotate_panel {
	display:none;
	position:absolute;
	bottom:10px;
	right:10px;
	padding:10px;
	background:#fff;
	border:solid 1px #ddd;
}
.checkBoxRadioWrapper {
	position:relative;
	float:left;
}
.checkBoxRadioOverlay {
	position:absolute;
	top:0;
	left:0;
	height:40px;
	width:40px;
}
.formEditable {
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}
.text.formEditable {
	padding-left: 7px !important;
}
.details_button {
	padding: 3px 6px !important;
}
.ym-g25.details_button{
	width:auto;
	max-width:25%;
}
.ym-g33.details_button {
	width:auto;
	max-width:33%;
}
.button_bar {
	padding:10px;
}
.detail_view_form input[type=radio],
.detail_view_form input[type=checkbox],
.ui-dialog-content .frame_box form div input[type=radio],
.ui-dialog-content .frame_box form div input[type=checkbox] {
	margin-top: 7px;
	margin-bottom: 7px;
}
.detail_view_form input[type=radio],
.detail_view_form input[type=checkbox] {
	margin-left:5px;	
}

#loginBox {
	min-height:300px;
}
#login_box_inner {
	max-width:400px;
	position:relative;
	box-sizing:border-box;
	padding:10px;
	/*margin:0 auto;*/
}
#login_box_inner .label,
#login_box_inner input[type=checkbox] {
	padding-top: 7px;
	padding-bottom: 7px;
}
#login_box_inner input {
	box-sizing: border-box;
}
.input_element.check_radio {
	border:none;
}

.role_container {
	float: left;
	width:45%;
}

.role_entry:HOVER{
	color: #fff;
	background-color: #4f4f4f;
	cursor: pointer;
}

#dialog_confirm_delete_user,
#dialog_confirm_delete_access_right{
	float:left; 
	margin:12px 12px 20px 0;
}

#user_role_panel .role_entry_list{
	
}

#user_role_panel .task_entry_list{
	padding-left:10%;
}

#user_role_panel .operation_entry_list{
	padding-left:20%
}

@media screen and (max-width: 760px) {
	/* Linearisation for Grid- and Column-Module, based on CSS class .linearize-level-1 */
	.linearize-level-1, 
	.linearize-level-1 > [class*="ym-c"], 
	.linearize-level-1 > [class*="ym-g"],
	#tabContentFullSearch [class*="ym-g"] [class*="ym-gbox"] {
		/* linearization for grids and columns module */
		display: block;
		float: none;
		padding: 0;
		margin: 0; 
		width: auto !important;
	}

	/* removed direct > relation to ignore additional container */
	.linearize-level-1 [class*="ym-g"] [class*="ym-gbox"] {
		/* set from box properties */
		margin-left: 15px;
		margin-right: 15px;
		margin-bottom: 12px;
		padding: 8px 14px;
		overflow: hidden;
	}
}
@media screen and (max-width: 680px) {
	#login_box_inner .ym-g25,
	#login_box_inner .ym-g75 {
		width:100%;
	}
	#login_box_inner .ym.gl {
		float:none;
	}
}

@media screen and (max-width: 1140px) {
  /* Linearisation for Grid- and Column-Module, based on CSS class .linearize-level-1 */
  .linearize-level-1, 
  .linearize-level-1 > [class*="ym-c"], 
  .linearize-level-1 > [class*="ym-g"] {
    /* linearization for grids and columns module */
    display: block;
    float: none;
    padding: 0;
    margin: 0;
    width: auto !important;
  }
  .linearize-level-1 > [class*="ym-c"] > [class*="ym-cbox"], 
  .linearize-level-1 > [class*="ym-g"] > [class*="ym-gbox"] {
    /* reset defined gutter values */
    margin: 0;
    padding: 0;
    /* optional for containing floats */
    overflow: hidden;
  }
}
@media screen and (max-width: 960px) {
  /* Linearisation for Grid- and Column-Module, based on CSS class .linearize-level-2 */
  .linearize-level-2, 
  .linearize-level-2 > [class*="ym-c"], 
  .linearize-level-2 > [class*="ym-g"] {
    /* linearization for grids and columns module */
    display: block;
    float: none;
    padding: 0;
    margin: 0;
    width: auto !important;
  }
  .linearize-level-2 > [class*="ym-c"] > [class*="ym-cbox"], 
  .linearize-level-2 > [class*="ym-g"] > [class*="ym-gbox"] {
    /* reset defined gutter values */
    margin: 0;
    padding: 0;
    /* optional for containing floats */
    overflow: hidden;
  }
}

h4.description {
	color: #c4c4c4;
    font-size: 1.1em;
    padding: 0 0 25px 25px;	
    font-weight: normal;
}

div.right_buttons input[type=button] {
	float: right;
	margin-left: 5px;
}

div.left_buttons input[type=button] {
	float: left;
	margin-right: 5px;
}

#statistics_page .ym-g33 {
        width: 616px;
        height: 240px;
}

#statistics_page .ym-g33.wide {
        width: 1200px;
        overflow: auto;
}

#statistics_page .ym-g33.high {
        height: 520px;
}

#statistics_page .ym-g33.medium {
        height: 360px;
}

#statistics_page .ym-g33.small {
        width: 416px;
        height: 200px;
}

#progressbar {
	width: 80%;
	margin-top: 20px;
}

#code_validation_result {
	padding-left: 10px;
}

.ym-g32 {
	width: 33.333%
}
#statistics_page > .ym-g66 {
	width: 1232px;
	height: 240px;
	overflow: auto;
}

#statistics_page > .ym-g66.small {
	width: 832px;
	height: 200px;
}

#statistics_page > .ym-g66.wide {
	width: 1232px;
}

#statistics_page > .ym-g66.high {
	height: 540px;
}

#statistics_page .dash_graph_two_rows {
	width: 1218px;
	height: 220px;
	margin: 8px 8px 8px 8px;
}

#statistics_page .dash_graph_two_rows.small {
	width: 818px;
	height: 170px;
}

.footnote {
	font-size: 0.75em;
    font-style: italic;
    float: left;
    width: 100%;
    position: relative;
    top: 186px;
    left: 8px;
}

.footnote.medium {
    top: 316px;
}

.dynamic_data_table td.table-separator {
	padding: 0px 0px;
}

.dash_text h2,
.dash_text.combined h2 {
	color: rgb(79, 79, 79);
	font: bold 16px "Trebuchet MS",Verdana,sans-serif;
    padding-bottom: 5px;
    position: absolute;
}

.dash_text table {
    margin: 20px 0px 0px 10px;
}

/******************************************************************** 
 * IDG-553
 * define consistent color effects for all iqloyalty UI elements 
 * Todo: after approving and some training to handle all this stuff here:
 * adjust the base styles and remove this overriding styles then (TiloNN)
 *******************************************************************/
	
/* table */
	/* table - selected row */
	.highlight td {
	    background: #B6142B !important;
	    color: #fff;
	}
    /* table - selected row details button */
    .highlight td .show_button {
        visibility:hidden;
    }	
	/* table - hover  */
	.dynamic_data_table tr:hover td {
	}
	/* table - head  */
	.dynamic_data_table th {
	    color: #cccccc;
	    background: #727272;
	}
	.dynamic_data_table th.sortable {
	    vertical-align: top;
	}
	.dynamic_data_table th a{
        color: #cccccc;
	    display: block;
	}
    .dynamic_data_table th a:hover {
        color: white;
    }	
	.dynamic_data_table th.sorted a {
        color: white;	
	}
	.dynamic_data_table th.sortable:hover {
	}
	.dynamic_data_table th.sortable:hover {
	}
	.dynamic_data_table th.sortable.sorted:hover {
	}
	
/* pagination */
	/* pagination - active  */
	.pagelinks strong {
	    background: #B6142B;
	}
	/* pagination - standard  */
	.pagelinks a, .detail_paging a {
	    background: #727272;
	}
	/* pagination - hover  */
	.pagelinks a:hover, .detail_paging a:hover {
	    background: #515151;
	}
	
/* buttons */
	/* buttons - standard  */
	.gray_button,
	.show_button {
	    color: white !important;
	    background: #727272  !important;
	}
	.gray_button:hover,
	.show_button:hover {
	    color: white !important;
	    background: #515151  !important;
	}
	/* buttons - tables, hover row  */
	.highlight td .show_button {
	    color: white !important;
	    background: #515151  !important;
	}
	input#submit_quick_search:hover {
	    background: #515151 !important;
	}
	
/* menu */
	/* main menu  */
	#iqone-main-navi {
	   background-color: #727272;
	   padding: 0;
	}
	/* all menu entries */
    .sf-menu li {
        background: #727272;
    }
    /* all menu entry titles */
    #iqone-main-navi .sf-menu li a, 
    #iqone-main-navi .sf-menu > li > ul > li > a {
        color: #ccc;
    }
	/* submenu */
    #iqone-main-navi .sf-menu li ul {
       background-color: #666;
       margin-top: 0;
       margin-bottom: 0;
       padding-top: 20px;
       padding-bottom: 20px;
    }
    /* enfolded submenu headline */
    #iqone-main-navi .active.subMenu > a {
        background-color: #515151;
        color: white;
    }     
    /* hover of all menu entries */
    #iqone-main-navi a:hover,
    #iqone-main-navi .sf-menu li ul li a:hover {
        background-color: #515151;
    }    
    /* active menu entry and its hover */
	#iqone-main-navi .active > a,
	#iqone-main-navi .sf-menu li ul li.active a,
    #iqone-main-navi .sf-menu li ul li.active a:hover {
	    background-color: #B6142B;
	    color: white;
	}
/******************************************************************** 
 * IDG-565
 * Add sort icons to sortable table columns
 * Todo: after approving and some training to handle all this stuff here:
 * adjust the base styles and remove this overriding styles then (TiloNN) */
 
 /* sortable column */
 .dynamic_data_table th {
    position: relative;
    padding: 10px;
    font-weight: normal;
 }
 .dynamic_data_table th.sortable a {
    padding-left: 12px;
 }
 .dynamic_data_table th.sortable a:before {
    content: "\f175\f176";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    color: #aaa;
    font-size: 12px;
    position: absolute;
    top: 11px;
    left: 5px;    
 } 
 .dynamic_data_table th.sorted a:before {
    color: #fff;
 }  
  .dynamic_data_table th a:hover:before {
    color: #fff;
 }  
 /* asc */ 
 .dynamic_data_table th.sortable.sorted.order1 a:before {
    content: "\f160";
 }
 /* desc */
 .dynamic_data_table th.sortable.sorted.order2 a:before {
    content: "\f161";
 }
 
 .image-preview {
	width: 100%;
}

.colour-preview {
  height: 25px;
  width: 25px;
  border-radius: 50%;
  display: inline-block;
  border: 2px solid black;
}

.color-circle {
  position: relative;
  margin: 1px auto;
  width: 20px;
  height: 20px;
  border-radius: 20px;
}

.red {
  background-color: red;
}
.green {
  background-color: green;
}
.yellow {
  background-color: yellow;
}

.cms-block {
  border: 1px solid #CCCCCC;
  padding: 5px 5px 5px 5px;
  width: 99%;
}