@import "blitzer/jquery-ui-1.10.1.custom.less"; 

/* watch: http://127.0.0.1:8080/test.htm#!watch */
/* replace for textarea: ui-bg_highlight-soft_35_222222_1x100.png */

/* overrides to fix button z-order bug, comment there in the jquery css file */
.ui-button { display: inline-block; padding: 0; margin-right: .1em; cursor: pointer; text-align: center; zoom: 1; overflow: visible; margin-bottom: 5px;

    background: #f4001c;
    color: white;
    font-weight: bold;
    border-radius: 8px;
} 

.ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { float: left; margin-left: 5px; margin-top: 5px; }

.jqx-widget .jqx-grid-cell, .jqx-widget .jqx-grid-column-header, .jqx-widget .jqx-grid-group-cell {
border-color: #d0d0d0 !important;
}
/*.jqx-widget-content-ui-smoothness {
  border-color: #ffffff !important;
}*/





body,
.jqx-widget,
.jqx-widget-content,
.jqx-fill-state-normal,
.ui-widget,
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button,
.btnUpSelect
 {
	font-family: Arial, sans-serif !important;
	
}



html {
	height: 100%;
	bzzackground-color: rgb(242,242,242);
}

body {
	margin: 0;
	height: 100%;
	background-color: rgb(242,242,242);
	
	font-size: 16px;
	/*color: #4e4d50;*/
	color: #4e4d50;
}



.loadercontainer {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 200,200,200, .55 ) 

}

#codepanel {

  margin: 0 auto;
  padding: 25px 25px 25px 25px;
  position: absolute;
  left: 50%;
  top: 30%;
  transform: translateY(-50%);  
  transform: translateX(-50%);    
  border: #cccccc solid 1px;
  background: white;
  border-radius: 15px;
  box-shadow: 1px 2px 3px 0 rgba(111, 111, 111, 0.65), 2px 6px 12px 0 rgba(111, 111, 111, 0.3), 3px 8px 15px 0 rgba(111, 111, 111, 0.45)   
}

.usercomments {
    box-sizing: border-box;
    width: 100%;
    padding: 0;
    margin: 0;
    overflow: auto;
    overflow-y: hidden;
    border: 1px solid #e7e7e7;
    padding: 10px;
    color: #f4001c;
    font-family: Tahoma, sans-serif;
    border-radius: 10px;
}

.loaderpanel {
  width: 190px;
  height: 35px;
  margin: 0 auto;
  padding: 25px 25px 25px 25px;
  position: relative;
  left: 50%;
  top: 40%;
  margin-left: -45px;
  margin-top: -30px;
  border: #cccccc solid 1px;
  background: white;
  border-radius: 15px;
  box-shadow: 1px 2px 3px 0 rgba(111, 111, 111, 0.65), 2px 6px 12px 0 rgba(111, 111, 111, 0.3), 3px 8px 15px 0 rgba(111, 111, 111, 0.45) 
  
}

@keyframes pound {
	to { transform: scale(1.7); box-shadow: 1px 2px 3px 0 rgba(190, 111, 111, 0.65), 2px 6px 12px 0 rgba(190, 111, 111, 0.3), 3px 8px 15px 0 rgba(111, 111, 111, 0.45) }
}

.loadertext {
  position: absolute;
  font-size: 13px;
  margin-top: 10px;
  letter-spacing: 6px;
  margin-left: 55px;
  padding: 0px;
}

ul.loaderset {
 padding: 0;
}

.loaderset li{
  list-style: none;
  display: block;
  float:left;
  width: 0.3em;
  height: 2em;
  margin: 0 0.6em 0 0;
  
  background: #635863;
  background: -moz-linear-gradient(top, #635863 0%, #3d353b 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#635863),  color-stop(100%,#3d353b));
  background: -webkit-linear-gradient(top, #635863 0%,#3d353b 100%);
  background: -o-linear-gradient(top, #635863 0%,#3d353b 100%);
  background: -ms-linear-gradient(top, #635863 0%,#3d353b 100%);
  background: linear-gradient(to bottom, #d55656 0%,#7a6c7a 100%);
  
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, 0.0), 1px 1px 1px 0 rgba(0, 0, 0, 0.0), 1px 1px 1px 0 rgba(0, 0, 0, 0.0);
  
  animation: pound 1s ease-in-out infinite alternate;
   animation-delay:0.05s;
  transform-origin: bottom;
}
.loaderset li:nth-child(2){
  animation-delay:0.20s;
}
.loaderset li:nth-child(3){
  animation-delay:0.35s;
}
.loaderset li:nth-child(4){
  animation-delay:0.50s;
}
.loaderset li:nth-child(5){
  animation-delay:0.65s;
}
.loaderset li:nth-child(6){
  animation-delay:0.80s;
}
.loaderset li:nth-child(7){
  animation-delay:0.95s;
  margin-right: 0;
  padding-right: 0;
 }


.ssmodal {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .55 ) 
                url('../images/ajax-loader.gif') 
                50% 50% 
                no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.ajaxloading {
    
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.ajaxloading .loadercontainer {
    display: block;
}

a {	color: #c9006b;
	text-decoration: none; 
	
	cursor: pointer; 
}

a:hover { color: #c9006b; text-decoration: none; bo00000rder-bottom:solid 1px;}
.link {	color: #c9006b; text-decoration: none; border-bottom:dotted 1px;}
.link:hover { color: #c9006b; text-decoration: none; border-bottom:solid 1px;}
.linkg {	color: #4e4d50; text-decoration: none; border-bottom:dotted 1px;}
.linkg:hover { color: #c9006b; text-decoration: none; border-bottom:solid 1px;}
.linkn {	color: #c9006b; text-decoration:underline ; border-bottom:dotted 1px;}
.linkn:hover { color: #c9006b; text-decoration: none; border-bottom:solid 1px;}

h1 { color:#f4001c; font-weight: normal; font-size: 2.0em; font-family: Arial, sans-serif;  margin: 10px 0px 10px -3px; text-transfxxorm:upxxpercase;}
h2 { font-family: Arial, sans-serif; font-size: 1.7em; font-weight: normal; color: #b76d70; margin: 25px 0 9px 5px; text-trxxansform:uppexxrcase; text-align:left; padding-top: 0px;  }
h3 { font-family: Arial, sans-serif; font-size: 1.5em; font-weight: normal; color: #000; xxline-height: 26px; text-traxxnsform:uppxxercase; }
h4 { font-family: Arial, sans-serif; font-size: 1.5em; font-weight: normal; color: #000; line-height: 18px; padding: 0; font-style:normal; margin: 24px 0 24px 0;}

h5 { font-family: Arial, sans-serif; font-size: 1.2em; font-weight: normal; color: #000; xxline-height: 0px; text-tranxxsform:uppxxercase; margin: 15px 0 10px 6px; }
h6 { font-family: Arial, sans-serif; font-size: 1.1em; font-weight: normal; color: #000; xxline-height: 21px; margin: 0; padding: 0; font-style:normal; }



h7 { font-family: Arial, sans-serif; font-size: 1.1em; font-weight: normal; color: #c9006b; text-transform:none; padding-top: 0px;}
h8 { font-family: Arial, sans-serif; font-size: 2em; color: #000; xxline-height: 26px; text-transfoxrm:upperxcase; text-align:left; padding-top: 0px; border-top: #dabee6 1px dotted; }
h9 { font-family: Arial, sans-serif; font-size: 1.6em; font-weight: normal; color: #c9006b; xxline-height: 24px; }

.small {
	font-size: 11px;
	line-height: 23px;
}

input,select {
	.ui-widget-content;
	.ui-state-default;
	.ui-corner-all;   
	font-weight: normal;     
	padding: 9px 7px 9px 7px;
	/* margin: 3px 3px 3px 3px; */
	font-family: Arial, sans-serif; font-size: 1.0em;
	background-position: top;
	background-repeat: repeat;  
	bxxorder: #ff0000 solid 1px;
	background: rgb(242,242,242);
}
input[type=button] {
  cursor: pointer; 
}



div[role="numberInput"] {
  background: rgb(242,242,242);
  margin: 2px 10px 2px 2px;
  .ui-corner-all;   
}
div[role="numberInput"] input {
	background: rgb(242,242,242) !important;
}

.fieldsuffix {
  float: left;
  margin-top: 10px;
  margin-left: 3px;
  margin-right: 13px;
}
.fieldinsideinfolabel {
  color: #c0c0c0 !important;
}
.fieldinsidehighlight {
  background-color: rgb(255,255,200) !important;
}


.gridbuttoncontainer {
  overflow: hidden; position: relative; margin: 3px;
}
.gridbutton {
  display: none; float: left; border: #ffffff solid 1px; margin-left: 10px;
}
.gridbutton img {
  position: relative; margin-top: 2px;
}
.gridbutton span {
  margin-left: 4px; position: relative; top: -3px;
}


textarea {
	 .ui-widget-content;
	 .ui-state-default;
	 .ui-corner-all;
	padding: 6px 6px 6px 6px;
	margin: 3px 3px 3px 3px;
	font-weight: normal;
	fzzont-size: 16px;
	background-position: top;
	background-repeat: no-repeat;
	border: #b0b0b0 solid 1px;
	background: rgb(242,242,242);
}

button span {
xxfont-weight: normal;
foxxnt-size: 13px;
}


#pagelayoutheader {
  position: relative;
  xxheight: 95px;
  max-width: 1108px;
  margin-left: 36px;
}

#pagelayoutheader hr {
  xmargin-top: 30px;
}

#pagerootcontainer {
  min-height: 100%;
  max-width: 1180px;
  margin: 0px auto;
}

#pagelayoutcontent {
  min-height: 100%;
  max-width: 1180px;
  margin: 0px auto;
  background: white;
}
  
#pagecontentbox {
	margin: 0 6% 0 6%;
}


#topmenucontainer {
	position: relative;
	width: 100px;
	height: 1px;
	left: 100px;
}

#topmenuleft {
	position: absolute;
	height: 36px;
	width: 14px;
	background: url('../images/back_topmenu_left.jpg') 0 0 no-repeat;
}

#topmenumid {
	position: absolute;
	height: 36px;
	width: 397px;
	left: 14px;
	background: url('../images/back_topmenu_mid.jpg') 0 0 repeat-x;
	padding-top: 9px;
	padding-left: 5px;
}

.topmenutext {
	text-decoration: none;
	color: #4e4d50;
	border-bottom: 0;
}

.topmenutext:hover {
	text-decoration: none;
	color: #4e4d50;
	border-bottom: dotted 1px;
}

.topmenusep { 
	color: rgb(0,0,0);
	padding: 0 7px 0 7px;
}

#topmenuright {
	position: absolute;
	height: 36px;
	width: 14px;
	top: 0;
	right: 0;
	background: url('../images/back_topmenu_right.jpg') 0 0 no-repeat;
}

#moodlogo {
	xxposition: absolute;
	height: 36px;
	width: 103px;
	top: 10px;
	left: 30px;
	xxmargin: 7px 31px;
	background: url('../images/mood-logo.gif') 0 0 no-repeat;
}

#pageliner {
	height: 11px;
	max-width: 968px;
	top: 70px;
	left: 70px;
	position: relative;
	background: url('../images/back_pageliner.jpg') 0 0 repeat-x;
}

#menu {
	position: absolute;
	top: 60px;
    left: 400px;
	height: 20px; margin:0 auto;
	margin-left:0px; background: #fff; font-size: 13px; float: right;
}

#menu ul#nav { margin:0; padding:0;}
#menu ul#nav li {
	display: block;	float: right; 
	height: 20px;
	background: none; padding: 0px; margin: 0;
	list-style-position: none; font-size: 13px;
}
#menu ul#nav li a {
	display: block;	float: left;
	height: 20px;
	color: #777777; text-decoration: none; font-weight:normal; border-bottom: 0;
	line-height: 20px; text-align:center;
	margin:0 15px; padding: 0 0px; 
}
#menu ul#nav li a:hover,
#menu ul#nav li.current a {
	color: #000; background: none; background:url('../images/dotted-underline-pink.gif') bottom left repeat-x; border-bottom: 0;
}

hr {
    background: url('../images/shade.gif') repeat-x scroll center top transparent;
    border-top: 1px solid #999999;
	border-left: 0;
	border-bottom: 0;
	border-right: 0;
	height: 10px;
    color: #4e4d50;
    font-size: 10px;
    margin: 0 auto;
	margin-top: 25px;
    padding-top: 20px;
    text-align: left;
    max-width: 960px;
}

#footer {
    font-size: 10px;
    height: 50px;
    margin: 0 auto;
	margin-top: 15px;
    padding-top: 5px;
    text-align: left;
    max-width: 960px;
}

.footer-left {
    float: left;
    height: 30px;
    padding: 0;
    text-align: left;
    width: 530px;
}
.footer-left a {
    background: none repeat scroll 0 0 transparent;
    color: #4e4d50;
    text-decoration: none;
}
.footer-right {
    color: #4e4d50;
    float: left;
    height: 30px;
    margin-left: 125px;
    padding: 0;
    text-align: right;
    width: 305px;
}
.footer-right a {
    background: none repeat scroll 0 0 transparent;
    color: #4e4d50;
    text-decoration: none;
}
.footer-right a:hover {
    background: none repeat scroll 0 0 transparent;
    color: #000000;
    text-decoration: none;
}

.clearfix {
	clear: both;
}
.xclearfix:after {
	visibility: hidden;
	dixxsplay: block;  /* firefox nmo like */
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .xclearfix             { zoom: 1; } /* IE6 */
*:first-child+html .xclearfix { zoom: 1; } /* IE7 */

.divPanel {
    display:none;
    position:fixed;
    z-index:900;
    background:url('../images/back_pagefader_50B.png');
	height: 100%;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

.divPanel_area {
	display:none;
	z-index:900;
    position:fixed;
    background-color:#fff;
	xxbackground-image:url('../images/editorlogo.jpg');
	background-repeat: no-repeat;
	background-position: right top;
    padding:10px;
    border:1px solid #444;
    border-radius:20px;
	box-shadow: 5px 5px 5px #4a4a4a;
    top: 50%;
    left: 48%;
    margin-left: -158px !important;
    margin-top: -141px !important;
}

#divUploaderHolder {
  max-width: 300px;
}

#divNoticeBox{
    display:none;
    position:fixed;
    z-index:900;
    background:url('../images/back_pagefader_50B.png');
    top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

#divNoticeBox_area{
	z-index:901;
    position:relative;
    margin:100px auto;
    background:#fff;
    max-width:500px;
    height:300px;
    padding:23px;
    border:1px solid #444;
    border-radius:20px;
	box-shadow: 5px 5px 5px #4a4a4a;
}

#btnNoticeClose {
	z-index:902;
    bottom:20px;
	left: 50%;
	width: 160px;
	margin-left: -80px;
	position: absolute;
}


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

.ui-datepicker, .ui-timepicker {
  box-shadow: 0px 0px 12px #606060;
  border: #b0b0b0 solid 1px;
}
   
/* css for timepicker */
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px;}
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; }
.ui-timepicker-rtl dl dd { margin: 0 65px 10px 10px; }


/*
 * jquery.selectBoxIt.css 2.0.0
 * Author: @gregfranko
 */

/* Div container holding the dropdown list */
.selectboxit-container {
  padding: 2px 0 0 3px;   /* MANUALLY ADDED */
  display: inline-block;
  /* Prevents text selection */
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: -moz-none;
  ms-user-select: none;
  -o-user-select: none;
  user-select: none;
vertical-align: middle;
padding-bottom: 2px;
}

/* Dropdown List Box */
.selectboxit-container .selectboxit {
  width: 180px; /* Width of the dropdown list box */
  height: 30px; /* Height of the select box */
  cursor: pointer;
  padding: 0;
  display: block;
  border-radius: 6px;
}

.selectboxit-container .selectboxit.selectboxit-disabled {
  cursor: default;
}

/* Dropdown list Default Icon Positioning */
.selectboxit-default-icon {
  float: left;
}

/* Dropdown List Box Text */
.selectboxit-text {
  font-size: 14px;
  font-family: Arial, sans-serif;
  text-indent: 5px;
  line-height: 30px;
  overflow: hidden;
  float: left;
  white-space: nowrap;
}

/* Dropdown List Options List*/
.selectboxit-container .selectboxit-options {
  min-width: 180px; /* Minimum Width of the dropdown list box options */
  font-size: 14px;
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
  list-style: none;
  position: absolute;
  overflow: auto;
  cursor: pointer;
  display: none;
  z-index: 9999999999999;
  outline: none;
  top: auto;
  bottom: auto;
  left: auto;
  right: auto;
  -moz-box-shadow: none; /* Firefox */
  -webkit-box-shadow: none; /* Safari, Chrome */
  box-shadow: none; /* CSS3 */
  border-radius: 6px;
}

/* Overrides Bootstrap drop down option style */
.selectboxit-options .selectboxit-option.active .selectboxit-option-anchor {
  color: #fff;
}

.selectboxit-option .selectboxit-option-anchor {
  padding: 0px 3px;
  line-height: 30px;
}

/* Dropdown List Individual Options */
.selectboxit-option, .selectboxit-optgroup-header {
  line-height: 30px; /* Height of Individual Select Box Options */
  text-indent: 5px; /* Horizontal Positioning of the select box option text */
  overflow: hidden;
  white-space: nowrap;
  list-style: none;
  margin: 0;
}

/* The first drop down option */
.selectboxit-option-first {
  border-top-right-radius: 6px;
  border-top-left-radius: 6px;
}

/* The last drop down option */
.selectboxit-option-last {
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
}

/* Dropdown List Optgroup Headers */
.selectboxit-optgroup-header {
  font-weight: bold;
}

/* Dropdown List Optgroup Options */
.selectboxit-optgroup-option {
  text-indent: 20px;
}

/* Dropdown List Optgroup Header hover psuedo class */
.selectboxit-optgroup-header[data-disabled='true']:hover {
  cursor: default;
}

/* Dropdown List Down Arrow Container (if an image is not used) */
.selectboxit-arrow-container {
  /* Positions the down arrow */
  width: 30px;
  float: right;
}

/* Dropdown List Down Arrow */
.selectboxit .selectboxit-arrow-container .selectboxit-arrow {
  /* Horizontally centers the down arrow */
  margin: 0 auto;
  display: block;
}

/* Dropdown List Individual Option Icon Positioning */
.selectboxit-option-icon {
  float: left;
}








.ribbon-wrapper-green {
  width: 85px;
  height: 88px;
  overflow: hidden;
  position: absolute;
  top: 0px;
  right: 0px;
}

.ribbon-green {
  font: bold 15px Sans-Serif;
  color: #333;
  text-align: center;
  text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg);
  position: relative;
  padding: 7px 0;
  left: -5px;
  top: 15px;
  width: 120px;
  background-color: #F77E8C;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#F77E8C), to(#F4001C)); 
  background-image: -webkit-linear-gradient(top, #F77E8C, #F4001C); 
  background-image:    -moz-linear-gradient(top, #F77E8C, #F4001C); 
  background-image:     -ms-linear-gradient(top, #F77E8C, #F4001C); 
  background-image:      -o-linear-gradient(top, #F77E8C, #F4001C); 
  color: #FFF;
  -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
  -moz-box-shadow:    0px 0px 3px rgba(0,0,0,0.3);
  box-shadow:         0px 0px 3px rgba(0,0,0,0.3);
}

.ribbon-green:before, .ribbon-green:after {
  content: "";
  border-top:   3px solid #E58AED;   
  border-left:  3px solid transparent;
  border-right: 3px solid transparent;
  position:absolute;
  bottom: -3px;
}

.ribbon-green:before {
  left: 0;
}
.ribbon-green:after {
  right: 0;
}


#debug {
  width: 900px;
  height: 300px;
  bottom: 0px;
  left: 0px;
  position: absolute;
  background: #ffffcc;
  z-index:    9999;
}







@fontsizelabelbigger: 20px;
@fontsizeinputbigger: 24px;
@fontsizemedium: 18px;

@media screen and (max-width: 1280px) {
  select {
    font-size: @fontsizeinputbigger;
    min-width: 343px !important;
  }
  input {
    font-size: @fontsizeinputbigger;
  }
  input:not(.gridcollector):not(.ui-button):not(.timepicki-input) {
    min-width: 328px !important;
  }
  input.gridcollector {
    width: 29% !important;
  }
  .normal-label {
    font-size: @fontsizelabelbigger !important;
    min-width: 300px !important;
  }
  .xxxpriceform-label {
    font-size: @fontsizelabelbigger !important;
    min-width: 300px !important;
  }
  .priceform-formrow {
    min-width: 100px !important;
  }
}

@media screen and (max-width: 768px) {
  input.gridcollector {
    width: 100% !important;
  }
}

@media screen and (max-width: 360px) {
  select {
    font-size: @fontsizemedium;
    min-width: 250px !important;
  }
  input {
    font-size: @fontsizemedium;
  }
  input:not(.gridcollector):not(.ui-button):not(.timepicki-input) {
    min-width: 227px !important;
  }
  input.gridcollector {
    width: 100% !important;
  }
  .normal-label {
    font-size: @fontsizemedium !important;
    min-width: 250px !important;
  }
  .priceform-label {
    font-size: @fontsizemedium !important;
    min-width: 250px !important;
  }
}