﻿.datepicker {
    margin-right:8px;
    position:relative;
    display:inline-block;
}

.datepicker .calender {
    position:absolute;
    top:100%;
    left:0px;
    background-color:#eee;
    width:168px;
    -webkit-user-select: none;  
    -moz-user-select: none;    
    -ms-user-select: none;      
    user-select: none;
    z-index:5;
}

.datepicker .calender:hover {
    cursor:default;
}

.datepicker .calender .head {
    text-align:center;
    background:#428bca;
    color:#fff;
    position:relative;
}

.datepicker .prev, .datepicker .next {
    position:absolute;
    width:0px;
    height:0px;
    border-top:6px solid transparent;
    border-bottom:6px solid transparent;
    top:4px;
}

.datepicker .prev:hover, .datepicker .next:hover {
    cursor:pointer;
}

.datepicker .calender .head .prev {
    border-right:10px solid #fff;
    left:5px;
}

.datepicker .calender .head .next {
    border-left:10px solid #fff;
    right:5px;
}

.datepicker .calender .weekdays {
    background:#428bca;
    color:#fff;
}

.datepicker .calender .weekdays span, .datepicker .calender .dates span {
    display:inline-block;
    width:24px;
    text-align:center;
}

.datepicker .calender .p, .datepicker .calender .n {
    background:#fff;
    color:#999;
}

.datepicker .calender .dates span:hover {
    cursor:pointer;
    background:#ccc;
}

.datepicker .field {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    /*border-radius: 4px;*/
    padding: 7px;
    display:inline-block;
    line-height:16px;
    vertical-align:middle;
}

.datepicker.error .field {
    border-color:#d9534f;
    background: #fdf7f7;
}

.datepicker .field .empty-button {
    background-image:url("/Images/Icons/close.png");
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: middle;
}

.datepicker .field .empty-button:hover {
    cursor:pointer;
    background-image:url("/Images/Icons/close_hover.png");
}

.datepicker input {
    border:1px solid transparent;
    width:17px;
    text-align:right;
    background:transparent;
}

.datepicker input.year {
    width:34px;
}

.datepicker .calender-button {
    width:16px;
    display:inline-block;
    height:16px;
    background:url("/Images/Icons/calendar.png") no-repeat center center;
    margin-left:3px;
    vertical-align:middle;
}

.datepicker .calender-button:hover {
    cursor:pointer;
}

.timepicker {
    position:relative;
    display:inline-block;
}

.timepicker .field {
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 7px;
    display:inline-block;
    line-height:16px;
    vertical-align:middle;
}

/*.timepicker .field > span {
    margin-top:5px;
}*/

.timepicker .field .empty-button {
    background-image:url("/Images/Icons/close.png");
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: middle;
}

.timepicker .field .empty-button:hover {
    cursor:pointer;
    background-image:url("/Images/Icons/close_hover.png");
}

.timepicker input {
    border:1px solid transparent;
    width:17px !important;
    margin:0px !important;
    display:inline-block !important;
    text-align:right;
    background-color:transparent;
}

.timepicker .extendblock {
    position:absolute;
    top:100%;
    left:0px;
    background-color:#eee;
    width:110px;
    font-size:40px;
    line-height:60px;
    -webkit-user-select: none;  
    -moz-user-select: none;    
    -ms-user-select: none;      
    user-select: none;
    text-align:center;
    z-index:2;
}

.timepicker .extendblock > span {
    display:inline-block;
    position:relative;
    padding: 10px 0px;
    width:44px;
    text-align:right;
}


.timepicker .extendblock .up {
    width:0px;
    height:0px;
    border-bottom:10px solid #000;
    border-left:20px solid transparent;
    border-right:20px solid transparent;
    position:absolute;
    right:2px;
    top:5px;
}

.timepicker .extendblock .down {
    width:0px;
    height:0px;
    border-top:10px solid #000;
    border-left:20px solid transparent;
    border-right:20px solid transparent;
    position:absolute;
    right:2px;
    bottom:5px;
}

.timepicker.error .field {
    border-color:#d9534f;
    background: #fdf7f7;
}

.sortcontrol {
    /*border-right:1px solid #ccc;*/
}

.sortcontrol > div {
    padding:6px 11px;
    margin-top:5px;
    /*background-color:#a8a8a8;*/
    color:#000;
    border:1px solid #a8a8a8;
}

.sortcontrol > div.selected {
    background-color:#727272;
    border-color:#727272;
}

.sortcontrol > div.selected.shifted {
    border-width:2px;
    border-color:#a8a8a8;
    border-style:dotted;
    padding:5px 10px;
}

.uploader {
    position:relative;
    width:300px;
    float:left;
    padding-bottom:5px;
}

.Uploader {
    position:relative;
    padding:5px;
    border:1px solid #ccc;
    border-radius: 4px;
    width:300px;
}

.Uploader.error {
    border-color: #d9534f;
    background:#fdf7f7;
    -webkit-box-shadow: inset 0 1px 1px rgba(217, 83, 79,.075);
    box-shadow: inset 0 1px 1px rgba(217, 83, 79,.075);
}

.Uploader.disabled {
    background-color: #e8e8e8;
}

.Uploader .no-file {
    opacity:0.3;
}

.Uploader > div {
    width:260px;
    display:inline-block;
}

.Uploader > div > .response {
    display:block;
}

.Uploader > div > .response .icon {
    display:inline-block;
    width:16px;
    height:16px;
    margin-right:3px;
}

.Uploader > div > .response.loading .icon {
    background-image:url("/Images/Icons/loading.png");
    -webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

.Uploader > div > .response.loaded .icon {
    background-image:url("/Images/Icons/loaded.png");
    animation:none !important;
}

.Uploader > div > .response.error .icon {
    background-image:url("/Images/Icons/uploaderror.png");
    animation:none !important;
}

/*.uploader .btn {
    position:absolute;
    right:0px;
    top:0px;
    bottom:5px;
    width:57px;
    padding:3px 6px;
    cursor:pointer;
    background:#154273;
}

.btn-file input[type=file] {
    opacity:0;
    position:absolute;
    right:0px;
    top:0px;
    left:0px;
    bottom:0px;
    width:0px;
    height:0px;
    padding-left:70px;
    padding-bottom:30px;
    cursor:pointer;
}*/

.imageCropper {
    position:relative;
    display:inline-block;
    overflow:hidden;
    -webkit-user-select: none;  
    -moz-user-select: none;    
    -ms-user-select: none;      
    user-select: none;
}

.imageCropper > img {
    float:left;
}

.imageCropper > .background {
    background-color:#000;
    opacity:0.5;
    position:absolute;
    left:0px;
    right:0px;
    top:0px;
    bottom:0px;
}

.imageCropper > .cropper {
    border:1px solid #428bca;
    position:absolute;
    left:0px;
    top:0px;
    cursor:all-scroll;
    user-select: none;
    max-width:100%;
    max-height:100%;
    /*overflow:hidden;*/
}

.imageCropper > .cropper > div {
    overflow:hidden;
    height:100%;
    position:relative;
}

.imageCropper > .cropper > div > img {
    position:absolute;
    left:0px;
    top:0px;
}

.imageCropper > .cropper > span{
    display:inline-block;
    width:5px;
    height:5px;
    background-color:#428bca;
    position:absolute;
}

.imageCropper > .cropper > .leftUpper{
    left:-3px;
    top:-3px;
    cursor:nwse-resize;
}

.imageCropper > .cropper > .rightUpper{
    right:-3px;
    top:-3px;
    cursor:nesw-resize;
}


.imageCropper > .cropper > .leftLower{
    left:-3px;
    bottom:-3px;
    cursor:nesw-resize;
}

.imageCropper > .cropper > .rightLower{
    right:-2px;
    bottom:-2px;
    cursor:nwse-resize;
}

/*****************
 *     Menu      * 
 *****************/
.menu {
    list-style-type:none;
    padding:0px;
    margin:0px;
}

.menu li {
    position:relative;
}

.menu img {
    vertical-align:middle;
}

.menu img.leftIcon {
    padding-right:5px;
}

.menu img.rightIcon {
    padding-left:5px;
}

.menu > li > span[onclick] {
    cursor:pointer;
}

.menu > li > span, .menu > li > a {
    display:inline-block;
}

.menu ul.submenu {
    position:absolute;
    top:100%;
    display:none;
}

.menu li:hover > ul.submenu {
    display:inline-block;
}

.datepicker.disabled .field, .timepicker.disabled .field {
    background-color:#e8e8e8;
}

/***************************
 NewUploadControl
 ***************************/
.newUploader {
    border: 1px solid #ccc;
    width: 300px;
    padding:4px 12px;
}

.newUploader > .title {
    font-weight:bold;
    display:inline-block;
    margin-bottom:3px;
}

.newUploader > .currentFile {
    margin-bottom:5px;
    /*border:1px solid #ccc;
    padding:3px;*/
    border-bottom:1px solid #ccc;
}

.newUploader > .currentFile > a > span {
    display:inline-block;
    vertical-align:middle;
}

.newUploader > .currentFile > a {
    text-decoration:none;
    color: #333;
    display:inline-block;
    width:250px;
}

.newUploader > .currentFile > a > .filename {
    line-height:36px;
    vertical-align:top;
}

.newUploader > .currentFile > a > .no-file {
    opacity:0.3;
    filter: alpha(opacity=30);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
}

.newUploader > .currentFile > .editbutton {
    background-color: #154273;
    width:28px;
    height:28px;
    float:right;
    display:inline-block;
    background-image:url("/Images/Icons/edit.png");
    background-position:center center;
    background-repeat:no-repeat;
    cursor:pointer;
    margin-top: 2px;
    position:relative;
}

.newUploader > .currentFile > .editbutton.disabled {
    background-color:#ccc;
    cursor:default;
}

.newUploader > .currentFile > .editbutton.hidden {
    display: none;
}

.newUploader > .uploadedFile {
    background-color: #e8e8e8;
    border: 1px solid #ccc;
    border-right:none;
    border-bottom-left-radius:4px;
    border-top-left-radius:4px;
    padding: 4px 12px;
    width:198px;
    display:inline-block;
    height:18px;
    vertical-align:top;
    float:left;
    position:relative;
    overflow:hidden;
    line-height:18px;
}

.newUploader > .uploadedFile.error {
    background-image:url("/Images/Icons/uploaderror.png");
    background-position: 5px center;
    background-repeat:no-repeat;
    width:184px;
    padding-left:26px;
}

.newUploader > .uploadedFile.error .message {
    color:#d9534f;
}

.newUploader > .uploadedFile > .progressbar {
    position:absolute;
    left:0px;
    top:0px;
    display:inline-block;
    height:26px;
    width:0%;
    background-color:#428bca;
    transition:width 0.2s;
}

.newUploader > .uploadedFile > .percentage {
    position:absolute;
    z-index:1;
    width:100%;
    text-align:center;
    display:inline-block;
}

.newUploader > .uploadButton {
    display:inline-block;
    position:relative;
    height:20px;
    padding: 4px 12px;
    overflow:hidden;
    color:#ffffff;
    background-color:#154273;
    cursor:pointer;
    width:53px;
}

.newUploader > .uploadButton.disabled {
      background-color: #ccc;
      cursor:default;
}

.newUploader > .uploadButton.disabled > input {
    display:none;
}

.newUploader > .uploadButton > input {
    position:absolute;
    right:0;
    top:0;
    opacity:0;
    filter: alpha(opacity=0);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    outline: none;
    background: white;
    cursor:pointer;
    display:block;
}

.newUploader > .uploadButton > span {
    cursor:pointer;
}

.popup > .control > .content > .newImageCropper {
    height:320px;
    display:block;
    position:relative;
    text-align:center;
    overflow:hidden;
}

.newImageCropper > .image {
    display:inline-block;
    max-height:320px;
    max-width:320px;
    position:relative;
    text-align:center;
    transition:transform 0.2s;
}

.newImageCropper > .imagespan {
    vertical-align: middle;
    height:320px;
    display:inline-block;
}

.newImageCropper > .image > img {
    vertical-align:middle;
    margin:auto;
}

.newImageCropper > .image > img:after {
     content: "";
     float: left;
     margin-top: 100%;
 }

.newImageCropper > .image > .overlay {
    background-color:#000;
    opacity:0.5;
    filter: alpha(opacity=50);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    height:100%;
    width:100%;
    position:absolute;
    left:0px;
    top:0px;
}

.newImageCropper > .image > .croppedPart {
    position:absolute;
    left:0px;
    top:0px;
    z-index:2;
    border:1px solid #428bca;
    cursor:all-scroll;
    /*transition:all 0.2s;*/
}

.newImageCropper > .image > .croppedPart > span {
    display: inline-block;
    width: 5px;
    height: 5px;
    background-color: #428bca;
    position: absolute;
}

.newImageCropper > .image > .croppedPart > .leftUpper {
    left: -3px;
    top: -3px;
    cursor: nwse-resize;
}

.newImageCropper > .image.rotate90 > .croppedPart > .leftUpper {
    left: -3px;
    bottom: -3px;
    right:auto;
    top:auto;
}

.newImageCropper > .image.rotate180 > .croppedPart > .leftUpper  {
    right: -3px;
    bottom: -3px;
    left:auto;
    top:auto;
}

.newImageCropper > .image.rotate270 > .croppedPart > .leftUpper {
    right: -3px;
    top: -3px;
    left:auto;
    bottom:auto;
}

.newImageCropper > .image > .croppedPart > .rightUpper {
    right: -3px;
    top: -3px;
    cursor: nesw-resize;
}

.newImageCropper > .image.rotate90 > .croppedPart > .rightUpper {
    left: -3px;
    top: -3px;
    right:auto;
    bottom:auto;
}

.newImageCropper > .image.rotate180 > .croppedPart > .rightUpper  {
    left: -3px;
    bottom: -3px;
    right:auto;
    top:auto;
}

.newImageCropper > .image.rotate270 > .croppedPart > .rightUpper {
    right: -3px;
    bottom: -3px;
    left:auto;
    top:auto;
}

.newImageCropper > .image > .croppedPart > .leftLower {
    left: -3px;
    bottom: -3px;
    cursor: nesw-resize;
}

.newImageCropper > .image.rotate90 > .croppedPart > .leftLower {
    right: -3px;
    bottom: -3px;
    left:auto;
    top:auto;
}

.newImageCropper > .image.rotate180 > .croppedPart > .leftLower  {
    top: -3px;
    right: -3px;
    left:auto;
    bottom:auto;
}

.newImageCropper > .image.rotate270 > .croppedPart > .leftLower {
    left: -3px;
    top: -3px;
    right:auto;
    bottom:auto;
}

.newImageCropper > .image > .croppedPart > .rightLower {
    right: -3px;
    bottom: -3px;
    cursor: nwse-resize;
}

.newImageCropper > .image.rotate90 > .croppedPart > .rightLower {
    right: -3px;
    top: -3px;
    left:auto;
    bottom:auto;
}

.newImageCropper > .image.rotate180 > .croppedPart > .rightLower  {
    left: -3px;
    top: -3px;
    right:auto;
    bottom:auto;
}

.newImageCropper > .image.rotate270 > .croppedPart > .rightLower {
    left: -3px;
    bottom: -3px;
    right:auto;
    top:auto;
}

.newImageCropper > .rotateleft, .newImageCropper > .rotateRight {
    background-position:center center;
    background-repeat:no-repeat;
    display:inline-block;
    width:28px;
    height:28px;
    position:absolute;
    top:50%;
    margin-top:-12px;
    background-color: #154273;
    cursor:pointer;
}

.newImageCropper > .rotateleft {
    background-image:url("/Images/Icons/rotateLeft.png");
    left: 80px;
}

.newImageCropper > .rotateRight {
    background-image:url("/Images/Icons/rotateRight.png");
    right: 80px;
}

.wizard > ul {
    margin:0px;
    padding:0px;
    list-style:none;
    margin-bottom:10px;
}

/*.popup .wizard ul {
    margin-top:-7px;
    margin-left:-7px;
}*/

.wizard > ul > li {
    display:inline-block;
    height:38px;
    line-height:38px;
    background-color:#a8a8a8;
    border-color:#a8a8a8;
    margin-left:0px;
    margin-right:5px;
    cursor:default;
    position:relative;
    vertical-align:middle;
    width:10px;
}

.wizard > ul > li.active {
    /*cursor:pointer;*/
    background-color:#428bca;
    color:#ffffff;
    border-color:#428bca;
    width:140px;
    text-align:center;
    padding-left:16px;
    padding-right:16px;
    font-weight:bold;
}

.popup .wizard .buttons {
    position:absolute;
    bottom:5px;
    right:5px;
}

.wizard .buttons > .next, .wizard .buttons > .previous {
    width:80px;
}

.wizard .buttons > .next {
    margin-left:5px;
}

.wizard .buttons > .end {
    width:165px;
}

.wizard > ul > li.stepindex {
    background-color:transparent;
    width:28px;
    height:28px;
    color:#000;
    position:relative;
    text-align:center;
    border:5px solid #428bca;
    line-height:28px;
    font-weight:bold;
    /*margin-right:3px;*/
}

.wizard > ul > li.stepindex::before {
    content: none;
}

.wizard > ul > li.stepindex::after {
    content: none;
}

/*****************
 *   Slidemenu    * 
 *****************/
.slideMenu > .item {
    margin-bottom:4px;
}

.slideMenu > .item > .header
{
	-webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: url("/Images/Icons/desc.png");
    background-position:95% center;
    background-repeat: no-repeat;
    padding-right:4px;
    margin:0px;
}

.slideMenu > .item.Closed > .header {
    background-image: url("/Images/Icons/asc.png");
}

.slideMenu > .item > .header:hover
{
	cursor:pointer;
}

.slideMenu > .item.Closed > .content
{
	display:none;
}

.slideMenu > .item.Open > .content
{
	display:block;
    border:1px solid #ccc;
    padding:4px;
    background-color:#e8e8e8;
}