@charset "utf-8";

/************************************************************ Calendar Context Menu ************************************************************/

div.x-menu-item-icon.deselected {
    background-image:url(../img/blank.png);
}

div.x-menu-item-icon.selected {
    background-image:url(../img/check.png);
}

/************************************************************ Calendar ************************************************************/

div#mainContent{
    position: relative ;
    float: left ;
    width:  -webkit-calc( 100% - 0px ) ;
    width:  calc( 100% - 0px ) ;
    width:  calc( 100% - 0px ) ;
    height: -webkit-calc(100% - 52px );   
    height: calc(100% - 52px );   
    height: calc(100% - 52px );   
    padding-left: 0px;
}

div#calendarPos{ 
    position:relative ;
}

div#calendarOutmostFrame{
	position:relative ;	
	left:   0px;
	top:    0px ;
    padding:    0px;
    margin:     0px;
    width:      -webkit-calc( 100% - 0px ) ;   
    width:      calc( 100% - 0px ) ;   
    width:      calc( 100% - 0px ) ;   
    height:     -webkit-calc( 100% - 286px ) ;   
    height:     calc( 100% - 286px ) ;   
    height:     calc( 100% - 286px ) ;   
    min-height: 563px;
	/* background-color: #e3efff ; */
    background: none;
    transition-property: height;
    transition-duration: 1s;
    transition-timing-function: ease-in-out ;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;    
}

div.calendarUndo{
    position: relative;
    float:      left;
    clear:      left;
    width:      59px;
    height:     40px ;
    padding:    0px;
    margin:     0px;
    overflow:   auto;

    background-color: #E4ECF6; /* #E3EFFF; */
    border-bottom: none; /* 1px solid #6593CF; */
    border-right: 1px solid #6593CF;
    border-left: none;
    border-top: 1px solid #E4ECF6;

    font-family: Verdana,Geneva,sans-serif;
    font-size: 11px;
    text-indent: 2px;
}

div.calendarHead{
    position:relative;
    float:      left;
    clear:      right;
    width:      -webkit-calc( 100% - 0px );
    width:      calc( 100% - 0px );
    width:      calc( 100% - 0px );
    height:     41px ;
    padding:    0px;
    margin:     0px;
    overflow:auto;
    background-color: #E3EFFF;
}

div.calendarContainer{
    position:relative;
    float: left;
    clear: both;
    top:   0px ;
    width:  -webkit-calc( 100% - 1px );
    width:  calc( 100% - 1px );
    width:  calc( 100% - 1px );
    height: -webkit-calc( 100% - 43px );
    height: calc( 100% - 43px );
    height: calc( 100% - 43px );
    background-color: #E3EFFF;
    overflow:auto;
}
div#calendarContFrmSizeV,
div#calendarContFrmSizeH{
    position:relative;
    float: left;
    clear: right;
    top:    40px ;
    height: 433px;
    width:  3px;
    border-top:    solid 1px #91a7b4;
    border-left:   solid 1px #91a7b4;
    border-right:  solid 1px #647279;
    border-bottom: solid 1px #647279;
    background: url(../img/slider.png);
    background-repeat: repeat;
    cursor: w-resize;
 }
div#calendarContFrmSizeH{
    top:    40px ;
    width:  818px;
    height: 3px;
    cursor: n-resize;
}
div#calendarContFrmSizeCorner{
    top:    40px ;
    width:  815px;
    height: 3px;
    cursor: n-resize;
}

.calendarBaseFrame {
	position: relative ;
	left:   0px;
	top:    0px ;
	width:  10px ;
	height: 10px ;
	background: #e3efff ;
}

/********************************************** Calendar Entry classes *********************************************/

div.calendarBaseFrame[loading=""] > div.calEntry,
div.calendarBaseFrame[loading=""] > div.calEntryMaster,
div.calendarBaseFrame[loading=""] > div.calEntrySlave
div.calendarBaseFrame[loading=""] > div.calEntrySelectedMaster,
div.calendarBaseFrame[loading=""] > div.calEntrySelectedSlave
{
    opacity: 0.5;
}


.calEntry,
.calEntrySelected,
.calEntryMaster,
.calEntrySelectedMaster,
.calEntrySlave,
.calEntrySelectedSlave{
	position: absolute;
    font: 8.5px Arial,Sans-serif;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
	overflow:hidden;
	border: solid 1px #5d8cc9 ;
}

.calEntry,
.calEntryMaster,
.calEntrySlave,
.calEntrySelected{
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
	background-color: #feffb9 ;
/*	z-index: 1 ;*/
	cursor:move ;
}

@-moz-keyframes selectedCalEntry {
      0%  { border-style: solid; }
      50% { border-color: dotted; }
     100% { border-color: solid; }
}
@-moz-keyframes selectedCalEntry2 {
     from { border-color: #f00; }
     50%  { border-color: #f00; }
     51%  { border-color: #500; }
     to   { border-color: #500; }
}

div.calEntry[selectstatus="selected"] {
    border-color: #f00; border-width: 1px ;
    z-index: 1; 
    cursor:move ;
    -webkit-box-shadow: 1px 1px 2px #600;
    box-shadow:         1px 1px 2px #600;
/*
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-duration: 1s;
    -moz-animation-direction: normal;
    -moz-transition:all 1.0s linear;
    -moz-animation-name: selectedCalEntry2;
*/
}

.calEntryMaster{	
    border-bottom: none;     
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
/*    -moz-box-shadow:    1px 1px 2px #333;
    -webkit-box-shadow: 1px 1px 2px #333;
    box-shadow:         1px 1px 2px #333;    */
}
.calEntrySlave{		
    border-top: none ; 
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
/*    -moz-box-shadow:    1px 1px 2px #333;
    -webkit-box-shadow: 1px 1px 2px #333;
    box-shadow:         1px 1px 2px #333;    */
    cursor:pointer; 
}

div.caleentryinfo{
    float: left ;
    clear: none ;
    vertical-align: top;
}

.calEntryAddon,
.calEntryAddonMaster,
.calEntryAddonSlave,
.calEntryMaintenance,
.calEntryMaintenanceMaster,
.calEntryMaintenanceSlave{
	position: absolute;
	font-family:Verdana, Geneva, sans-serif ;
	font-size:9px;
	overflow:hidden;
	border: solid 1px #5d8cc9 ;
/*	z-index: 1 ;*/
	cursor:move;
}

.calEntryAddon{ 		background-color: #f5c159 ; }
.calEntryAddonMaster{	background-color: #f5c159 ; border-bottom: solid 1px #f5c159 ; }
.calEntryAddonSlave{	background-color: #f5c159 ; border-top: solid 1px #f5c159 ; cursor:pointer; }

.calEntryMaintenance{ 		background-color: #b3e8c2 ; }
.calEntryMaintenanceMaster{	background-color: #b3e8c2 ; border-bottom: solid 1px #b3e8c2 ; }
.calEntryMaintenanceSlave{	background-color: #b3e8c2 ; border-top: solid 1px #b3e8c2 ; cursor:pointer; }

img.calentryicon
{
    float: left ;
    clear: none ;
    vertical-align: top;
    padding: 0px;
    margin:  0px;
    border:  none;
}

/********************************************** Tab list *********************************************/

div#tabGroupJobLists{
    height: -webkit-calc(100% - 17px) ;
    height: calc(100% - 17px) ;
    height: calc(100% - 17px) ;
    padding-top: 6px ;
}   
div.tabContentArea[caltabtop=""] {
    height: -webkit-calc(100% - 16px) ;
    height: calc(100% - 16px) ;
    height: calc(100% - 16px) ;
}


div#infosizeslider{
    width:  100%;
    height: 3px;
    border-top:    solid 1px #c2d4eb;
    border-left:   solid 1px #c2d4eb;
    border-right:  solid 1px #6593cf;
    border-bottom: solid 1px #6593cf;
    background-color: #a5bfe1;
    background-image: url(../img/sliderhor.png);
    background-repeat: repeat-x;
    cursor: n-resize;
}

/********************************************** Order lists for calendar *******************************************/

div#statusFrame{
    position:relative;
    width:    822px;
    height:   280px;
    width:    -webkit-calc(100% - 6px) ; ;
    width:    calc(100% - 6px) ; ;
    width:    calc(100% - 6px) ; ;
    overflow: hidden;
    padding-left: 6px;
    transition-property: height;
    transition-duration: 1s;
    transition-timing-function: ease-in-out ;
}


div#orderMenu{ 
	position: relative; 
/*	width:821px;           */
	height:21px; 
	background:url(../img/tab_bg.png) ; 
	font: 13px Verdana, Arial, Helvetica, sans-serif; 
	padding-left: 1px; 
	margin: 0px ; 
	color: #000;
} 

div#andre{
}
div#trykketidag{
}
div#trykkettidligere{
}

div.orderListItem{
	position:relative ;
	clear:both ;
	padding-left: 0px;
	padding-bottom: 2px;
	margin-bottom: 1px ;
	border-bottom: solid 1px #e3efff ;
	background-color:#fff ;
	height: 15px ;
	width: 100% ;
	font: 11px Verdana, Arial, Helvetica, sans-serif; 
}
table.orderList tr td {
	padding-left: 3px ;
	padding-right: 3px ;
	border: solid 1px #F30 ;
}
div.orderData{
	float: left ;
	padding-right: 5px ;
}

div.divdesel{ 
    clear: both ;
}


span.pubname, span.pubnamemedium, span.pubnameshort, span.publishingDate, span.orderstatus, span.issueNumber, span.pages, span.inserts, span.circulationNamed, span.circulationUnnamed, span.circulationExtra, 
span.lastfilmPlan, span.printstartPlan, span.printendPlan, span.circulationTotal, span.emailreport, span.prodstops, span.printreminder, span.packreminder, span.blankPrint, span.blankPacking,
span.unplacedorderstatus, span.unplacedordername, span.printreminder, span.packreminder, span.blankPrint, span.blankPacking, span.unplacedorderstatus, span.unplacedordername
{
    position: relative;
    display: block;
    float: left ;
    overflow: hidden;
    font: 10px Verdana, Arial, Helvetica, sans-serif ;
    background:  none;
    padding-top: 1px ;
    clear:none ;
    margin: 0px ;
    height: 15px ;
    cursor:pointer;
    overflow: hidden;
    -moz-user-select: none;    
} 
.pubname{ width: 285px; padding-left: 0px ;}
.pubnamereminder{ width: 275px; padding-left: 0px ;}
.pubnamemedium{ width: 200px; padding-left: 0px ;}
.pubnameshort{ width: 130px; padding-left: 0px ;}
.publishingDate{ width: 50px; }
.issueNumber{ width: 24px; text-align: right ;}
.orderstatus{ width: 80px; }
.pages{ width: 65px; text-align: right ;}
.inserts{ width: 32px; text-align: right ; }
.circulationNamed, .circulationUnnamed, .circulationExtra{ width: 50px; text-align: right ; }
.circulationTotal{ width: 80px; text-align: right ; }
.lastfilmPlan, .printstartPlan, .printendPlan { width: 70px; padding-left: 10px;}
.emailreport{ width: 75px; padding-left: 8px;}
.prodstops{ width: 20px; text-align: right ; }
.unplacedorderstatus{ width: 30px;  padding-left: 0px; }
.unplacedordername{   width: 180px; padding-left: 0px; }

span.printreminder{   margin: 4px 0px 0px 0px; padding: 0px; background-image: url(/img/statdot_blue_big_letter.png);     float: right ; width: 9px; height: 8px; }
span.packreminder{    margin: 4px 0px 0px 0px; padding: 0px; background-image: url(/img/statdot_red_big_letter.png);      float: right ; width: 9px; height: 8px; }
span.insertreminder{  margin: 4px 0px 0px 0px; padding: 0px; background-image: url(/img/statdot_purple_big_letter.png);   float: right ; width: 9px; height: 8px; }
span.generalreminder{ margin: 4px 0px 0px 0px; padding: 0px; background-image: url(/img/statdot_green_big_letter.png);    float: right ; width: 9px; height: 8px; }
span.overlapreminder{ margin: 4px 0px 0px 0px; padding: 0px; background-image: url(/img/statdot_darkblue_big_letter.png); float: right ; width: 9px; height: 8px; }

span.blankPrint{    font-size: 9px; width: 9px; height: 13px; margin: 0px 1px 1px 10px; color: #e3efff ; }
span.blankPacking{  font-size: 9px; width: 9px; height: 13px; margin: 0px 1px 1px 1px; color: #e3efff ; }

/*

    var strColOrderedAddon          = "rgb(245,193,089)" ;
    var strColOrderedMailroom       = "rgb(255,224,162)" ;
    var strColMaterialhandling      = "rgb(255,224,162)" ;
    var strColOrderedRandom         = "rgb(149,219,213)" ;
    var strColOrderedInsert         = "rgb(219,218,149)" ;
    var strColOrderedMaintenance    = "rgb(209,154,207)" ;

*/

div.datalist > div > div > div[ordertype="addon"] {             background-color: #f5c459 ; }
div.datalist > div > div > div[ordertype="maintenance"] {       background-color: #d19acf ; }
div.datalist > div > div > div[ordertype="insert"] {            background-color: #dbdc95 ; }
div.datalist > div > div > div[ordertype="random"] {            background-color: #95dbd5 ; }
div.datalist > div > div > div[ordertype="mailroom"] {          background-color: #ffe0a2 ; }
div.datalist > div > div > div[ordertype="materialhandling"] {  background-color: #ffe0a2 ; }

div.datalist > div > div > div[ordertype="suborder"] {}
div.datalist > div > div > div[ordertype="main"][orderstatus="autoscheduled"]:not([selectstatus="selected"]) {         background-color: #dddddd ; }
div.datalist > div > div > div[ordertype="main"][orderstatus="partiallyordered"]:not([selectstatus="selected"]) {      background-color: #fffec9 ; background-image: url(/img/stripesdark.png); }
div.datalist > div > div > div[ordertype="main"][orderstatus="ordered"]:not([selectstatus="selected"]) {               background-color: #fffec9 ; }
div.datalist > div > div > div[ordertype="main"][orderstatus="underproduction"]:not([selectstatus="selected"]) {       background-color: #7baff5 ; }
div.datalist > div > div > div[ordertype="main"][orderstatus="ambunderproduction"]:not([selectstatus="selected"]) {    background-color: #7baff5 ; background-image: url(/img/stripes.png); }
div.datalist > div > div > div[ordertype="main"][orderstatus="printed"]:not([selectstatus="selected"]) {               background-color: #c8e616 ; }
div.datalist > div > div > div[ordertype="main"][orderstatus="delivered"]:not([selectstatus="selected"]) {             background-color: #aac413 ; }
div.datalist > div > div > div[ordertype="main"][orderstatus="ambigousdelivered"]:not([selectstatus="selected"]) {     background-color: #aac413 ; background-image: url(/img/stripes.png); }
div.datalist > div > div > div[ordertype="main"][orderstatus="ambigousprinted"]:not([selectstatus="selected"]) {       background-color: #c8e616 ; background-image: url(/img/stripes.png); }
div.datalist > div > div > div[orderstatus="done"]:not([selectstatus="selected"]) {                                    background-color: #6eff6e ; }






table.infoTable{
    font: 11px Verdana, Arial, Helvetica, sans-serif ;
    color: #0000cc ;
}
table.infoTable div.header{
    font: 11px Verdana, Arial, Helvetica, sans-serif ;
    clear: left ;
    width: 90px ;    
    float: left ;    
}
table.infoTable div.headerBig,
table.infoTable div.headerBigTop{
    clear: both ;
    width: 200px ;    
    font: 11px Verdana, Arial, Helvetica, sans-serif ;
    font-weight: bold;
    padding-top: 5px;
}
table.infoTable div.headerBigTop{
    padding-top: 0px;
}
table.infoTable div.body,
table.infoTable div.widebody{
    width: 132px ;        
    float: left ;     
    color: #000;          
}
table.infoTable div.widebody{
    width: 210px ;        
    clear: both ;
}




form#manual_calendarentries div.popuptimes label.haltLabel,
form#manual_calendarentries div.popuptimes label.insertLabel{
    width: 140px ;
    font: 10px Verdana, Arial, Helvetica, sans-serif ;
    padding-top: 2px ;
}
form#manual_calendarentries div.popuptimes label.insertLabel{
    font: 12px Verdana, Arial, Helvetica, sans-serif ;
}
form#manual_calendarentries div.popuptimes input.errortext{
    width: 230px ;
    font: 10px Verdana, Arial, Helvetica, sans-serif ;
    margin-bottom: 3px ;
}

table.infoTable{
    width: auto;
    border: none ;
    border-collapse: collapse ; 
    padding: 0px ;
    margin: 0px ;
}
table.infoTable tr td{
    width: 240px ;
    vertical-align: top ;
}
div#popupcal{
    display: none ;
    position: absolute; 
    left: 970px; 
    top: 140px; 
    width: auto; 
    height: auto; 
    padding: 0px ;
    background-color: #fff; 
    z-index: 1000;
    border-top: 2px solid #c5ddff ;
    border-left: 2px solid #c5ddff ;
    border-right: 2px solid #5d8cc9 ;
    border-bottom: 2px solid #5d8cc9 ;
    box-shadow:   1px 1px 3px 3px #555;  
}

form#manual_calendarentries{
    font: 12px Verdana, Arial, Helvetica, sans-serif ;
}
form#manual_calendarentries label{
    width: 190px ;
    display: block;
    float: left;
}
form#manual_calendarentries input,
form#manual_calendarentries input.timeentry{
    width: 50px ;
    float: left;
    clear: none ;
}
form#manual_calendarentries input[type=button]{
    float: right;
    width: 60px ;
}
form#manual_calendarentries input.timeentry{
    border: 1px solid #7f9db9 ;
    padding: 1px ;
}
form#manual_calendarentries input.timeentryError{
    border: 2px solid #f00 ;
    padding: 0px ;
}
form#manual_calendarentries input.dateentry{
    width: 100px ;
    border: 1px solid #7f9db9 ;
    padding: 1px ;
}
form#manual_calendarentries input.dateentryError{
    width: 100px ;
    padding: 0px ;
    border: 2px solid #f00 ;
}
form#manual_calendarentries input.errortext{
    width: 200px ;
}
form#manual_calendarentries textarea{
    font: 11px Verdana, Arial, Helvetica, sans-serif ;
    width: 376px ;
    height: 170px ;
} 
form#manual_calendarentries textarea.tabs{
    font: 11px Verdana, Arial, Helvetica, sans-serif ;
    width: 373px ;
    height: 234px ;
} 


img.calpopupicon {
    float: left;
    margin-top: 3px; 
    margin-left: 6px; 
    margin-right: 6px; 
    cursor: pointer;
}

/*  */
div.calnav{
    width:50px; 
    height: 16px; 
    background-color: #c0dbff;
    float: left; 
    padding-top: 3px ;
    cursor: pointer; 
    text-align: center;
}
img.btnimgmall{
    float: left;
    text-align: center;
    margin: 4px 0px 0px 0px;
}
div.calnav:hover{
    background-color: #f7cf72 ;
}
div.calEntryStatArea{
    position: absolute; 
    right: 1px ; 
    top: 1px; 
    width: 26px; 
    height: 8px;    
    padding: 0px;
    margin: 0px;
}
div.calEntryStatPrint{   background-image: url(/img/statdot_blue_big_letter.png); float: right ; width: 8px; height: 8px; margin-left: 1px;}
div.calEntryStatAlert{   background-image: url(/img/statdot_green_big_letter.png); float: right ;  width: 8px; height: 8px; margin-left: 1px;}
div.calEntryStatPacking{ background-image: url(/img/statdot_red_big_letter.png); float: right ;  width: 8px; height: 8px; margin-left: 1px;}
div.calEntryStatInsert{  background-image: url(/img/statdot_purple_big_letter.png); float: right ;  width: 8px; height: 8px; margin-left: 1px;}
div.calEntryStatOverlap{ background-image: url(/img/statdot_darkblue_big_letter.png); float: right ;  width: 8px; height: 8px; margin-left: 1px;}


.selectBoxArrow{
    margin-top:1px;
    float:left;
    position:absolute;
    right:1px;
    

}    
.selectBoxInput{
    border:0px;
    padding-left:1px;
    height:16px;
    position:absolute;
    top:0px;
    left:0px;
}

.selectBox{
    border:1px solid #7f9db9;
    height:20px;    

}
.selectBoxOptionContainer{
    position:absolute;
    border:1px solid #7f9db9;
    height:100px;
    background-color:#FFF;
    left:-1px;
    top:20px;
    visibility:hidden;
    overflow:auto;
}
.selectBoxAnOption{
    font-family:arial;
    font-size:12px;
    cursor:default;
    margin:1px;
    overflow:hidden;
    white-space:nowrap;
}
.selectBoxIframe{
    position:absolute;
    background-color:#FFF;
    border:0px;
    z-index:999;
}    
    
div#calsizeconfig{
    position: relative;
    text-align: left;
    padding: 10px 0px 0px 3px;
}

div#tabGroup2 span div div.divact,
div#tabGroup2 span div div.divsel,
div#tabGroup2 span div div.divdesel,
div.divdesel, div.divact{ 
    clear: both ;
    height:16px;
    margin:0;
    padding: 0px;
}
div#tabGroup2 span div div.divact{ background-color:#5980b2; color: #fff;}
div#tabGroup2 span div div.divsel{ background-color:#5980b2; color: #fff;}
div#tabGroup2 span div div.divdesel{ background-color:#fff;}

div#tabGroup2 div#orderMenu{ 
    width:382px; 
}

div#tabGroup2 span.tabContentAreaPopup div.tabWindow{
    width: 377px ;
    height: 270px ;
    padding: 2px ;
    background-color: #fff;
}
div#tabGroup2 li.tabTab,
div#tabGroup2 li.tabDeselected,
div#tabGroup2 li.tabDeselected:hover{
    width: 110px;
}
div#tabGroup2 li.tabTab{ background-image: url(../img/subtab_sel_bg_w.png); }
div#tabGroup2 li.tabDeselected{ background-image: url(../img/subtab_desel_bg_w.png); }
div#tabGroup2 li.tabDeselected:hover{ background-image: url(../img/tab_desel_hilit_bg_w.png); }

form#manual_calendarentries input.shortinsertentry{
    width: 100px ;
    border: 1px solid #7f9db9 ;
    padding: 1px ;
    margin-bottom: 4px;
}

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

div#dagens,
div#alle,
div#ferdig,
div#huskeliste,
div#strayjobs,
div#strayjobsfooter,
div#unplacjobslist{
    position:relative;
    display:block ;
/*    width:808px ;*/
    height: -webkit-calc( 100% - 33px ) ;
    height: calc( 100% - 33px ) ;
    height: calc( 100% - 33px ) ;
    padding: 6px ;
    margin: 0px ;
    border: solid 1px #919b9c ;
    border-top: none ;
    color: #000 ;
    overflow:auto ;
}
div#strayjobsfooter{ height: 51px ; }
div#unplacjobslist{
    width: 228px ;
    height: 180px;
/*    background-color: gray;*/
}
img.btnimgsmall {
    float:left;
    margin: 3px 0 0;
    text-align:center;
}

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

/*
div.tabWindow{
    width: 466px ;
    height: auto;
    min-height: 200px ; 
    
}
*/

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

div.tabWindowUnplaced{
    background-color:#FFFFFF;
    border-color:-moz-use-text-color #919B9C #919B9C;
    border-right:1px solid #919B9C;
    border-style:none solid solid;
    border-width:medium 1px 1px;
    color:#000000;
    display:block;
    width:230px;
    height:200px;
    margin:0;  
    overflow:auto;
    padding:5px;
    position:relative;
} 

div#unplacjobsgui{
    position: relative;
    width: 100%;
    height: 430px;
}
div.unpllsthourframe{
    position: relative;
    border: none;
    border-top: solid 1px #A5BFE1;
    margin-bottom: 1px ;
}
div.upllstcolframe{
    position: absolute;
    border: none;
    border-right: solid 1px #A5BFE1;
}
div.unpllsthourbox{
    position: relative;
    border: none;
    border-right: solid 1px #A5BFE1;
    font-family:Verdana,Geneva,sans-serif;
    font-size:11px;
    font-weight: normal;
}

div.soentry{
    position: absolute;
    background-color: #ddd;
    border: solid 1px #919B9C ;
    z-index: 10;
    font-family:Verdana,Geneva,sans-serif;
    font-size:9px;
}

/*****************************************************************************************************************************************/
div#infoareaCal{
    position:absolute; 
    right: 0px ;
    top: 104px; 
    width: 250px; 
    height: 725px; 
    background-color:#f0f4fa;
    border: 1px solid #9ac6ff;    
    padding: 4px; 
    overflow:auto;
    font: bold 12px Verdana, Geneva, sans-serif ;              
}

div#printmenu{
    padding-top: 21px ;
    width: 500px;
}

div.timeDiff {
    float: left; 
    padding: 4px 0px 0px 10px; 
    font: 11px Verdana,Arial,Helvetica,sans-serif ; 
    color: #000;
    text-align: right;
    width: 30px;
}

/************************************************************************ PRINT CALENDAR *****************************************************************/

div.printCalMonthRow{
    position:relative;
    float: left ;
    height: 16px;
    width:  141px;
    text-align: center;
    font-weight:bold;
    padding-top:2px ;
    background-color: #bfdbff ;
    margin-top: 16px ;
    margin-bottom: 2px ;
    cursor:default;
}

div.printCalWeekNumRow{
    position:relative;
    float: left ;
    width: 11px ;
    padding-right: 2px ;
    margin-top: 14px ;
    padding-top: 1px ;
    padding-bottom: 1px ;
    line-height:16px;
    border-right: solid 1px #9ac6ff ;
    color:#000;
    font-style:italic;
    font-size:10px ;
    text-align:right;
}

div.printCalMonthCalendarBackground{
    position:relative;
    left:   0px;
    top:    0px ;
    height: 149px;
    width:  141px;
    font-family:Verdana, Geneva, sans-serif ;
    font-size:11px ;
    float: left;
    clear: none;
    margin-left: 8px;
}
span.printDayDefault,
span.printDayPrinted,
span.printDayDone,
span.printDayOrdered,
span.printDayProduction{
    cursor:pointer;
    margin: 1px ;
    line-height:12px;
    padding-top: 1px;
    border: solid 1px #feb448 ;
    display:block ;
    background-color: #ffd099 ;
}
span.printDayOrdered{
    background-color: #FEFFC9 ;
    border: solid 1px #d0d1a4 ;
}
span.printDayProduction{
    cursor:default;
    background-color: #7baff5 ;
    border: solid 1px #709edd ;
}
span.printDayPrinted{
    cursor:default;
    background-color: #C8E616 ;
    border: solid 1px #9db510 ;
}
span.printDayDone{
    cursor:default;
    background-color: #aac413 ;
    border: solid 1px #899e0f ;
}
span.thisMonthsDates{
    border: solid 1px #fff ; 
    background-color: #fff ;
}
span.printDayDefault{ 
    border: solid 1px #bbb ; 
    background-color: #ddd ;
}
div#calendarMenuBar span.printDayOrdered:not([selectable]):hover,
div#calendarMenuBar span.printDayDefault:not([selectable]):hover{ 
    border: solid 1px #ddd ; 
    background-color: #fff ;
}
div#calendarMenuBar span.thisMonthsDates:not([selectable]):hover{ 
    border: solid 1px #bbb ; 
    background-color: #ddd ;
}

/************************************************************************ SEARCH RESULT *****************************************************************/

div.srchresult span{
    position: relative;
    display: block;
    float: left ;
    overflow: hidden;
    font: 10px Verdana, Arial, Helvetica, sans-serif ;
    background:  none;
    padding-top: 1px ;
    clear:none ;
    margin: 0px ;
    height: 15px ;
    cursor:pointer;
    overflow: hidden;
    -moz-user-select: none;    
} 
.name{      width: 200px; }
.shortname{ width: 130px; }
.type{      width: 50px; }
.pubdate{   width: 50px; padding-right: 10px ; text-align: right ; }


/********************************************** STATUS DOT ANIMATIONS **********************************************************/

div.statcontnr,
div.liststatcontnr{
    position: absolute; 
    right: 1px ; 
    top: 1px; 
    width: 8px;
    height: 8px;    
    padding: none;
    margin: none;
    overflow: hidden;
}

div.statcontnr > canvas,
div.liststatcontnr > canvas{
    position: absolute;
    top: 0px;
    left: 0px;
    height: 8px;
    padding: 0px;
    margin: 0px;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 3s;
    -webkit-animation-direction: normal;
    -webkit-transition:all 1.0s linear;

    -o-transition: all 1.0s linear;
    -ms-transition: all 1.0s linear;    
    
    transition:all 1.0s linear;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-duration: 3s;
    animation-direction: normal;
    transition: all 1.0s linear;

    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-duration: 3s;
    -moz-animation-direction: normal;
    -moz-transition: all 1.0s linear;
}
div.liststatcontnr{
    position: relative;
    float: left;
    clear: none; 
    top: 0px;
    left: 0px;
}


@keyframes statDotFade1{
      0% { left:   0px ; } 
     49% { left:   0px ; } 
     50% { left:  -8px ; } 
    100% { left:  -8px ; } 
}
@keyframes statDotFade2{
      0% { left:   0px ; }
     49% { left:   0px ; } 
     50% { left:  -8px ; } 
    100% { left:  -8px ; } 
}

@keyframes statDotFade3 {
     0% { left:   0px ; }
    32% { left:   0px ; }
    33% { left:  -8px ; }
    66% { left:  -8px ; }
    67% { left: -16px ; } 
   100% { left: -16px ; } 
}
@keyframes statDotFade4 {
     0% { left:   0px ; }
    24% { left:   0px ; }
    25% { left:  -8px ; }
    49% { left:  -8px ; }
    50% { left: -16px ; }
    74% { left: -16px ; }
    75% { left: -24px ; } 
   100% { left: -24px ; } 
}
@keyframes statDotFade5 {
     0% { left:   0px ; }
    19% { left:   0px ; }
    20% { left:  -8px ; }
    39% { left:  -8px ; }
    40% { left: -16px ; }
    59% { left: -16px ; }
    60% { left: -24px ; }
    79% { left: -24px ; }
    80% { left: -32px ; } 
   100% { left: -32px ; }
}

@-webkit-keyframes statDotFade1webkit{
      0% { left:   0px ; } 
     49% { left:   0px ; } 
     50% { left:  -8px ; } 
    100% { left:  -8px ; } 
}
@-webkit-keyframes statDotFade2webkit{
      0% { left:   0px ; }
     49% { left:   0px ; } 
     50% { left:  -8px ; } 
    100% { left:  -8px ; } 
}

@-webkit-keyframes statDotFade3webkit{
     0% { left:   0px ; }
    32% { left:   0px ; }
    33% { left:  -8px ; }
    66% { left:  -8px ; }
    67% { left: -16px ; } 
   100% { left: -16px ; } 
}
@-webkit-keyframes statDotFade4webkit{
     0% { left:   0px ; }
    24% { left:   0px ; }
    25% { left:  -8px ; }
    49% { left:  -8px ; }
    50% { left: -16px ; }
    74% { left: -16px ; }
    75% { left: -24px ; } 
   100% { left: -24px ; } 
}
@-webkit-keyframes statDotFade5webkit{
     0% { left:   0px ; }
    19% { left:   0px ; }
    20% { left:  -8px ; }
    39% { left:  -8px ; }
    40% { left: -16px ; }
    59% { left: -16px ; }
    60% { left: -24px ; }
    79% { left: -24px ; }
    80% { left: -32px ; } 
   100% { left: -32px ; }
}

@-moz-keyframes statDotFade1moz{
      0% { left:   0px ; } 
     49% { left:   0px ; } 
     50% { left:  -8px ; } 
    100% { left:  -8px ; } 
}
@-moz-keyframes statDotFade2moz{
      0% { left:   0px ; }
     49% { left:   0px ; } 
     50% { left:  -8px ; } 
    100% { left:  -8px ; } 
}

@-moz-keyframes statDotFade3moz{
     0% { left:   0px ; }
    32% { left:   0px ; }
    33% { left:  -8px ; }
    66% { left:  -8px ; }
    67% { left: -16px ; } 
   100% { left: -16px ; } 
}
@-moz-keyframes statDotFade4moz{
     0% { left:   0px ; }
    24% { left:   0px ; }
    25% { left:  -8px ; }
    49% { left:  -8px ; }
    50% { left: -16px ; }
    74% { left: -16px ; }
    75% { left: -24px ; } 
   100% { left: -24px ; } 
}
@-moz-keyframes statDotFade5moz{
     0% { left:   0px ; }
    19% { left:   0px ; }
    20% { left:  -8px ; }
    39% { left:  -8px ; }
    40% { left: -16px ; }
    59% { left: -16px ; }
    60% { left: -24px ; }
    79% { left: -24px ; }
    80% { left: -32px ; } 
   100% { left: -32px ; }
}

div.statcontnr[icons="1"] canvas{ 
    width:  8px ; 
    animation-duration: 1; 
    -moz-animation-duration: 1; 
    -webkit-animation-duration: 1; 
    animation-name: statDotFade1; 
    -moz-animation-name: statDotFade1moz; 
    -webkit-animation-name: statDotFade1webkit; 
}
div.statcontnr[icons="2"] canvas{ 
    width: 16px ; 
    animation-duration: 2; 
    -moz-animation-duration: 2; 
    -webkit-animation-duration: 2; 
    animation-name: statDotFade2; 
    -moz-animation-name: statDotFade2moz; 
    -webkit-animation-name: statDotFade2webkit; 
}
div.statcontnr[icons="3"] canvas{ 
    width: 24px ; 
    animation-duration: 3; 
    -moz-animation-duration: 3; 
    -webkit-animation-duration: 3; 
    animation-name: statDotFade3; 
    -moz-animation-name: statDotFade3moz; 
    -webkit-animation-name: statDotFade3webkit; 
}
div.statcontnr[icons="4"] canvas{ 
    width: 32px ; 
    animation-duration: 4; 
    -moz-animation-duration: 4.00s; 
    -webkit-animation-duration: 4.00s; 
    animation-name: statDotFade4; 
    -moz-animation-name: statDotFade4moz; 
    -webkit-animation-name: statDotFade4webkit; 
}
div.statcontnr[icons="5"] canvas{ 
    width: 40px ; 
    animation-duration: 5; 
    -moz-animation-duration: 5.00s; 
    -webkit-animation-duration: 5.00s; 
    animation-name: statDotFade5; 
    -moz-animation-name: statDotFade5moz; 
    -webkit-animation-name: statDotFade5webkit; 
}



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


@-moz-keyframes hilitetextA {  
    from {  color: #f00 ; }  
    80% {   color: #f00 ; }
    to {    color: #000 ; }
}

@-moz-keyframes hilitetextB {  
    from {  color: #ff0 ; }  
    80% {   color: #ff0 ; }
    to {    color: #fff ; }
}



/* Specifics */

div#todayscntnr,
div#markedcntnr,
div#donecntnr,
div#inverrlistcntnr,
div#straylistcntnr{
    position: relative; 
    border: solid 1px #919B9C; 
    border-top: none; 
    padding: 0px; 
    height: -webkit-calc(100% - 1px);
    height: calc(100% - 1px);
    height: calc(100% - 1px);
}
div.movingstrayjob{                      
    position: absolute ;
    overflow: hidden;
    padding: 0px; 
    background-color: #5980B2;
    color: #555 ;
    border: 1px dotted #91ca92; 
    margin:   0px ;
    padding:  0px ;    
    height:  15px ;
    width:  450px ;
    z-index: 1000;
    -moz-box-shadow:    2px 2px 3px #333;
    -webkit-box-shadow: 2px 2px 3px #333;
    box-shadow:         2px 2px 3px #333;    
}
div.movingstrayjob div{
    font: 10px Verdana,Geneva,sans-serif;
    font-weight: normal;
}


div#strayjobslistcntnr{
    width: 500px; 
    height: -webkit-calc(100% - 0px); 
    height: calc(100% - 0px); 
    height: calc(100% - 0px); 
    background-color: #eee;
}

div#strayjobslistcntnr div div div div:nth-child(1) { width: 28px; }
div#strayjobslistcntnr div div div div:nth-child(2) { width: 27%; min-width: 130px; }
div#strayjobslistcntnr div div div div:nth-child(3) { width: 15%; min-width:  80px; text-align: right; padding-right: 7px;}
div#strayjobslistcntnr div div div div:nth-child(4) { width: 14%; min-width:  60px; }
div#strayjobslistcntnr div div div div:nth-child(5) { width: 17%; min-width:  85px; }
div#strayjobslistcntnr div div div div:nth-child(6) { width: 16%; min-width:  77px; }
                              
/* Icons */
div#strayjobslistcntnr div div div div.iconlist { padding-top: 0px; min-width:75px ;}
div#strayjobslistcntnr div div div div.iconlist > div{ width: 12px; min-width: 12px; font-weight: normal; color: #ddd; text-align: center; padding-right: 0px;}
div#strayjobslistcntnr div[circulation=""] div div[icontype="circulation"], 
div#strayjobslistcntnr div[inserts=""]     div div[icontype="inserts"],
div#strayjobslistcntnr div[prepress=""]    div div[icontype="prepress"],
div#strayjobslistcntnr div[press=""]       div div[icontype="press"],
div#strayjobslistcntnr div[mailroom=""]    div div[icontype="mailroom"] { color: #000; font-weight: bold; }

div#strayjobsdetailscntnr{
    width: -webkit-calc(100% - 525px); 
    width: calc(100% - 525px); 
    width: calc(100% - 525px); 
    height: -webkit-calc(100% - 0px);  
    height: calc(100% - 0px);  
    height: calc(100% - 0px);  
}
div#strayjobsdetailscntnr div div div div:nth-child(1)  { width:  4%; min-width:  28px; } 
div#strayjobsdetailscntnr div div div div:nth-child(2)  { width:  6%; min-width:  40px; }
div#strayjobsdetailscntnr div div div div:nth-child(3)  { width:  8%; min-width:  80px; }
div#strayjobsdetailscntnr div div div div:nth-child(4)  { width:  8%; min-width:  80px; }
div#strayjobsdetailscntnr div div div div:nth-child(5)  { width:  8%; min-width:  80px; }
div#strayjobsdetailscntnr div div div div:nth-child(6)  { width:  8%; min-width:  80px; }
div#strayjobsdetailscntnr div div div div:nth-child(7)  { width:  8%; min-width:  80px; }
div#strayjobsdetailscntnr div div div div:nth-child(8)  { width:  5%; min-width:  40px; margin-right: 5px; text-align: right; }
div#strayjobsdetailscntnr div div div div:nth-child(9)  { width: 10%; min-width: 120px; }
div#strayjobsdetailscntnr div div div div:nth-child(10) { width:  8%; min-width:  70px; margin-right: 5px; text-align: right; }
div#strayjobsdetailscntnr div div div div:nth-child(11) { width:  8%; min-width:  70px; margin-right: 5px; text-align: right; }
div#strayjobsdetailscntnr div div div div:nth-child(12) { width:  7%; min-width:  50px; margin-right: 5px; text-align: right; }
div#strayjobsdetailscntnr div div div div:nth-child(13) { width:  3%; min-width:  35px; max-width: 35; text-align: right;}
div#strayjobsdetailscntnr div div div div:nth-child(14) { width:  3%; min-width:  35px; max-width: 35; text-align: right;}

/* Link status icons */
div.linkStatusIcon{ width: 22px; height: 100%; background-repeat: no-repeat; background-position: center; }
div.linkStatusIcon[linkstatus="unknown"]     { background-image: url(../img/unlinked.png); }
div.linkStatusIcon[linkstatus="unlinked"]    { background-image: url(../img/unlinked.png); }
div.linkStatusIcon[linkstatus="linked"]      { background-image: url(../img/linked.png); }
div.linkStatusIcon[linkstatus="multilinked"] { background-image: url(../img/mlinked.png); }

/* Todays tasks specifics */

div#todayslistcntnr,
div#markedlistcntnr,
div#inverrcntnr,
div#donelistcntnr {
    position: relative; 
    border:   none; */
    padding:  0px; 
    height:   -webkit-calc(100% - 1px);
    height:   calc(100% - 1px);
    height:   calc(100% - 1px);
    width:    -webkit-calc(100% - 0px);
    width:    calc(100% - 0px);
    width:    calc(100% - 0px);
}

div#todayslistcntnr > div > div > div > div:nth-child(1)  { width: 14%; min-width: 148px; }
div#todayslistcntnr > div > div > div > div:nth-child(2)  { width:  5%; min-width:  53px; }
div#todayslistcntnr > div > div > div > div:nth-child(3)  { width: 11%; min-width: 116px; }
div#todayslistcntnr > div > div > div > div:nth-child(4)  { width:  7%; min-width:  74px; }
div#todayslistcntnr > div > div > div > div:nth-child(5)  { width:  4%; min-width:  42px; text-align: right; padding-right: 10px; }
div#todayslistcntnr > div > div > div > div:nth-child(6)  { width:  7%; min-width:  74px; text-align: right; padding-right: 10px; }
div#todayslistcntnr > div > div > div > div:nth-child(7)  { width:  8%; min-width:  84px; }
div#todayslistcntnr > div > div > div > div:nth-child(8)  { width:  8%; min-width:  84px; }
div#todayslistcntnr > div > div > div > div:nth-child(9)  { width:  4%; min-width:  53px; }
div#todayslistcntnr > div > div > div > div:nth-child(10) { width: 10%; min-width:  70px; }
                      
div#markedcntnr > div > div > div > div > div:nth-child(1)  { width: 14%; min-width: 148px; }
div#markedcntnr > div > div > div > div > div:nth-child(2)  { width:  5%; min-width:  53px; }
div#markedcntnr > div > div > div > div > div:nth-child(3)  { width: 11%; min-width: 116px; }
div#markedcntnr > div > div > div > div > div:nth-child(4)  { width:  7%; min-width:  74px; }
div#markedcntnr > div > div > div > div > div:nth-child(5)  { width:  4%; min-width:  42px; text-align: right; padding-right: 10px; }
div#markedcntnr > div > div > div > div > div:nth-child(6)  { width:  7%; min-width:  73px; text-align: right; padding-right: 10px; }
div#markedcntnr > div > div > div > div > div:nth-child(7)  { width:  8%; min-width:  84px; }
div#markedcntnr > div > div > div > div > div:nth-child(8)  { width:  8%; min-width:  84px; }
div#markedcntnr > div > div > div > div > div:nth-child(9)  { width:  4%; min-width:  53px; }
div#markedcntnr > div > div > div > div > div:nth-child(10) { width: 10%; min-width:  70px; }
                              
div#donelistcntnr > div > div > div > div:nth-child(1)  { width: 14%; min-width: 148px; }
div#donelistcntnr > div > div > div > div:nth-child(2)  { width:  5%; min-width:  53px; }
div#donelistcntnr > div > div > div > div:nth-child(3)  { width: 11%; min-width: 116px; }
div#donelistcntnr > div > div > div > div:nth-child(4)  { width:  7%; min-width:  74px; }
div#donelistcntnr > div > div > div > div:nth-child(5)  { width:  4%; min-width:  42px; text-align: right; padding-right: 10px; }
div#donelistcntnr > div > div > div > div:nth-child(6)  { width:  7%; min-width:  73px; text-align: right; padding-right: 10px; }
div#donelistcntnr > div > div > div > div:nth-child(7)  { width:  8%; min-width:  84px; }
div#donelistcntnr > div > div > div > div:nth-child(8)  { width:  8%; min-width:  84px; }
div#donelistcntnr > div > div > div > div:nth-child(9)  { width:  4%; min-width:  53px; }
div#donelistcntnr > div > div > div > div:nth-child(10) { width: 10%; min-width:  50px; }

div#inverrcntnr > div > div > div > div > div:nth-child(1)  { width: 14%; min-width: 148px; }
div#inverrcntnr > div > div > div > div > div:nth-child(2)  { width:  5%; min-width:  90px; }
div#inverrcntnr > div > div > div > div > div:nth-child(3)  { width: 11%; min-width:  50px; text-align: right; padding-right: 20px;}
div#inverrcntnr > div > div > div > div > div:nth-child(4)  { width: 60%; min-width: 357px; }

/* Hierarchy sub order / delivery list 
div#subrdr+list{
     height: -webkit-calc(100% - 8px);
     margin-top: 8px; 
     float: left; 
     clear: none;
     border-right: solid 1px #919B9C;
}
*/

/* Specifics */
div.hierarchylist > div.hrlistitem { color: #7596c1; }
div.hierarchylist > div.hrlistitem > div div { padding: 0px 2px 0px 2px; }
div.hierarchylist > div.hrlistitem div.hrlistitem { color: #79a87a; }

div.hierarchylist > div.hrlistitem                > div[selectstatus="selected"]:nth-of-type(1) > div { background-color: #7596c1; color: #fff; }
div.hierarchylist > div.hrlistitem div.hrlistitem > div[selectstatus="selected"]:nth-of-type(1) > div { background-color: #79a87a; color: #fff;}


/* Moving versions of suborders and deliveries */

div.movingdelivery,
div.movingsuborder{
    position: absolute ;
    overflow: hidden;
    margin:   0px ;
    padding:  0px 4px ;    
    z-index: 1000;
    height:  20px ;
    background: none;
}

div.movingdelivery > div:nth-child(3), div.movingdelivery > div > label, div.movingdelivery > input,
div.movingsuborder > div:nth-child(3), div.movingsuborder > div > label, div.movingsuborder > input { display: none; }

div.movingdelivery > div, 
div.movingsuborder > div { height:  auto ; width:  auto ; background: none; }

div.movingdelivery > div > div,
div.movingsuborder > div > div {
    clear: none;
    float: left;
    font: 10px Verdana,Geneva,sans-serif;
    width: auto;
    height:  16px ;
    padding: 0 2px;
    color: #fff;
    border: 1px dotted #91ca92; 

    -moz-box-shadow:    2px 2px 3px #333;
    -webkit-box-shadow: 2px 2px 3px #333;
    box-shadow:         2px 2px 3px #333;    

    filter:alpha(opacity=50);
    -moz-opacity:0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
}
div.movingdelivery > div > div { background-color: #79A87A; }
div.movingsuborder > div > div { background-color: #7596C1; }


/* Calendar canvas */
canvas.calendar,
canvas.calendartop{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

/* Calendar press status*/
div#pressStatus{
    position: absolute; 
    top: 1px; 
    right: 1px; 
    font-family:Verdana,Geneva,sans-serif;
    font-size:10px;
    font-weight: normal;
    white-space: nowrap;
    overflow: none;    
    height: 45px;
    width: auto;
}

div#pressStatus > div,
div#pressStatus > div > div {
    position: relative;
    float: left;
    height: 100%;
}
div#pressStatus > div{ 
    margin-left:  1px; 
    margin-right: 1px; 
    border: inset 1px #55f;
}

div#pressStatus > div > div[eqstat="idle"]:nth-of-type(1) {          color: #A5BFE1; }
div#pressStatus > div > div[eqstat="printingwaste"]:nth-of-type(1) { color: #ffff00; }
div#pressStatus > div > div[eqstat="printinggood"]:nth-of-type(1) {  color: #15AF8E; }
div#pressStatus > div > div[eqstat="halted"]:nth-of-type(1) {        color: #ff0000; }
div#pressStatus > div > div:nth-of-type(1) { color: #A5BFE1; width:  50px; font: bold 42px verdana,sans-serif; text-align: center; margin-top: -4px; }
div#pressStatus > div > div:nth-of-type(2) { width: 230px; }

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

div#subrdr-list{
    width: -webkit-calc(100% - 275px); 
    width: calc(100% - 275px); 
    width: calc(100% - 275px); 
    height: -webkit-calc(100% - 0px); 
    height: calc(100% - 0px); 
    height: calc(100% - 0px); 
    margin-top: 8px; 
    border: none; 
    background: none;
    float: left; 
    clear: right;
    overflow: auto;
    font-family:Verdana,Geneva,sans-serif;
    font-size:10px;
}

div.suborder > div:not(.subdialog),
div.delivery > div:not(.subdialog){
    float: left;
    clear: none;
    position: relative;
    top:  0px;
    left: 0px;
}

div#subrdr-list div.suborder > div.deliveries { 
    clear: both;
    float: left;
    padding-top: 6px;
    position: relative;
    width: 100%;
}

div#subrdr-list input,
div#subrdr-list textarea{
    font-family:Verdana,Geneva,sans-serif;
    font-size:10px;
}                        


div#subrdr-list div[cool=""] > input[type="checkbox"] + label {         display: none;  border: none; background: none; color: #b6fdb7; box-shadow: none; text-align: left; visibility: hidden;}
div#subrdr-list div[cool=""] > input[type="checkbox"]:checked + label { display: block; border: none; background: none; color: #000; visibility: visible; }


div#subrdr-list > div.suborder,
div#subrdr-list div.deliveries > div.delivery{
    width:  -webkit-calc( 100% - 10px) ;
    width:  calc( 100% - 10px) ;
    width:  calc( 100% - 10px) ;
    height: auto ;
    float: left;
    clear: both;
    margin: 0px 4px 4px 4px ;
    background-color: #E3EFFF;
    border: 1px solid #6593CF;
} 

div#subrdr-list > div.suborder[hidden="true"] * { display: none ;}
div#subrdr-list div.deliveries > div.delivery[minimized="true"] > * { display: none ;}

div#subrdr-list div.deliveries > div.delivery{ background-color: #b6fdb7; padding-bottom: 6px; }

div#subrdr-list div.suborder div.header{
    width: -webkit-calc( 100% - 0px) ;
    width: calc( 100% - 0px) ;
    width: calc( 100% - 0px) ;
    height: auto;
    min-height: 21px;
    float: left;
    clear: both;
}
div#subrdr-list div.suborder div.header:last-child { padding-bottom: 6px; }
div#subrdr-list div.suborder div.delivery div.header{ width: -webkit-calc(100% - 0px); width: calc(100% - 0px); width: calc(100% - 0px); }

div#subrdr-list div.header > div,
div#subrdr-list div.header > div > div,
div#subrdr-list div.header input{
    float: left;
    clear: none;
}
div#subrdr-list div.header > div:not([subtype*=""]),
div#subrdr-list div.header input{
    padding: 1px 2px 0px 2px;
}


div#subrdr-list div.header > div{ text-indent: 2px;}
div#subrdr-list div.header[headline=""] > div{ font-weight: bold; margin-top: 5px; }

div#subrdr-list div.header > textarea,
div#subrdr-list div.header > div:not([typeahead=""]) > input[type="text"],
div#subrdr-list div.header > input
{ 
    border: none; 
    padding: 1px 2px 0px 2px; 
    margin-right: 0px; 
}
div#subrdr-list div.header > textarea:not([error]),
div#subrdr-list div.header > div:not([typeahead=""]) > input[type="text"]:not([error]),
div#subrdr-list div.header > input:not([error])
{ 
    background: none; 
}

div#subrdr-list div.header > textarea{ width: -webkit-calc( 100% - 10px ); width: calc( 100% - 10px ); width: calc( 100% - 10px ) ; height: 80px; }

div#subrdr-list > div.header { margin-right: 6px; }
div#subrdr-list div.suborder > div > div.header > *:nth-child(1)  { width: 170px; clear: left;}
div#subrdr-list div.suborder > div > div.header > *:nth-child(2)  { width: 150px; }
div#subrdr-list div.suborder > div > div.header > *:nth-child(3)  { width:  40px; }
div#subrdr-list div.suborder > div > div.header > *:nth-child(4)  { width:  40px; }
div#subrdr-list div.suborder > div > div.header > *:nth-child(5)  { width:  40px; }
div#subrdr-list div.suborder > div > div.header > *:nth-child(6)  { width:  80px; }
div#subrdr-list div.suborder > div > div.header > *:nth-child(7)  { width:  70px; }
div#subrdr-list div.suborder > div > div.header > *:nth-child(8)  { width:  70px; }
div#subrdr-list div.suborder > div > div.header > *:nth-child(9)  { width: 118px; }
div#subrdr-list div.suborder > div > div.header > *:nth-child(10) { width:  60px; }
div#subrdr-list div.suborder > div > div.header > *:nth-child(11) { width:  60px; }

/*
div#subrdr-list div.delivery > div:nth-of-type(1) > div.header > *:nth-child(1)  { width: 170px; clear: left;}
div#subrdr-list div.delivery > div:nth-of-type(1) > div.header > *:nth-child(2)  { width: 150px; }
div#subrdr-list div.delivery > div:nth-of-type(1) > div.header > *:nth-child(3)  { width:  80px; }
div#subrdr-list div.delivery > div:nth-of-type(1) > div.header > *:nth-child(4)  { width:  60px; margin-right: 10px;  text-align: right; }
*/

div#subrdr-list div.delivery > div > div.header div.dialogatom{ clear: both; }
div#subrdr-list div.delivery > div:nth-of-type(1) > div.header > div { width: 170px; clear: left; }
div#subrdr-list div.delivery > div:nth-of-type(2) > div.header > div { width: 150px; }
div#subrdr-list div.delivery > div:nth-of-type(3) > div.header > div { width:  80px; }
div#subrdr-list div.delivery > div:nth-of-type(4) > div.header > div { width:  60px; margin-right: 10px;  text-align: right; }


div#subrdr-list div.delivery div.dialogatom[cool=""] input[type="checkbox"] + label{ 
    display: block;
    font-size: 9px; 
    height: 12px;
    margin: 0;
    padding-top: 1px;    
}

div#subrdr-list div.delivery > div > div.header > *:nth-child(5)  { width:  156px; }

div#subrdr-list div.header > div[typeahead=""],
div#subrdr-list div.header > div[timedate=""] {
    padding: 0px;    
}

div#subrdr-list div.header > div:not([typeahead=""]) { 
    padding: 0px;
}
div#subrdr-list div.header > div:not([typeahead=""]):not([timedate=""]) > input[type="text"] { 
    width: -webkit-calc( 100% - 18px ) ; 
    width: calc( 100% - 18px ) ; 
    width: calc( 100% - 18px ) ; 
    margin: 2px 0px 0px 0px ;
}

div[typeahead=""] > input[type="text"]{ 
    width: -webkit-calc( 100% - 18px ) ; 
    width: calc( 100% - 18px ) ; 
    width: calc( 100% - 18px ) ; 
    border: none; 
    padding: 2px; 
    float: left; 
}
div[typeahead=""] > input[type="text"]:not([error])
{ 
    background: none; 
}



div[typeahead=""] > img.comboboxtiny{
    opacity: 0.35;
    margin-right: 0px;
    border: medium none;
    float: left;
    height: 6px;
    padding-top: 9px;
    width: 9px;
}

/*****
* Hover and selected
*/

div#subrdr-list *:hover > div > div > textarea,
div#subrdr-list *:hover > div > div.header input,
div#subrdr-list *:hover > div > div.header > div[timedate=""] > input,
div#subrdr-list *:hover > div > div.header > div:not([typeahead=""]) > input[type="text"] 
{
    border: solid 1px #999; 
    padding: 0px 1px 0px 1px; 
    opacity: 0.5; 
}

div#subrdr-list *:hover > div > div > textarea:not([error]),
div#subrdr-list *:hover > div > div.header input:not([error]),
div#subrdr-list *:hover > div > div.header > div[timedate=""] > input:not([error]),
div#subrdr-list *:hover > div > div.header > div:not([typeahead=""]) > input[type="text"]:not([error]) 
{
    background-color: #fff; 
}

div.subdialog:hover div[typeahead=""] > img.comboboxtiny,
div#subrdr-list *:hover > div > div.header > div[typeahead=""] > img.comboboxtiny{
    opacity: 0.5;
    background: #bed0fc;
    border: solid 1px #999; 
    border-left: none; 
    margin-top: 2px;
    padding-bottom: 5px;
    padding-top: 6px;
}

div#subrdr-list *:hover > div > div > div[cool=""] > input[type="checkbox"] + label,
div#subrdr-list > div.suborder input[type="radio"]:checked ~ div > div.header > div[cool=""] > input[type="checkbox"] + label {
    display: block;
    background-image: -webkit-linear-gradient(top, #AFBACA, #97ADCA 49%, #8AA6CA 50%, #97ACCA 100%);
    background-image: linear-gradient(center bottom , #AFBACA 0%, #97ADCA 49%, #8AA6CA 50%, #97ACCA 100%);
    background-image: -moz-linear-gradient(center bottom , #AFBACA 0%, #97ADCA 49%, #8AA6CA 50%, #97ACCA 100%);
    border-color: #BEC9D9 #8B939E #8B939E #BEC9D9;
    border-style: solid;
    border-width: 1px;
    color: #000099;
    visibility: visible; 
}

div#subrdr-list * > div > div > div[cool=""] > input[type="checkbox"] + label {         display: block; }
div#subrdr-list * > div > div > div[cool=""] > input[type="checkbox"]:checked + label { color: #000099; }

div#subrdr-list *:hover > div > div > div[cool=""] > input[type="checkbox"]:checked + label,
div#subrdr-list > div.suborder input[type="radio"]:checked ~ div > div.header > div[cool=""] > input[type="checkbox"]:checked + label {
    display: block;
    background-image: -webkit-linear-gradient(top, #BFDAFF, #ACD0FF 49%, #BDDAFF 50%, #DFECFF 100%);
    background-image: linear-gradient(center bottom , #BFDAFF 0%, #ACD0FF 49%, #BDDAFF 50%, #DFECFF 100%);
    background-image: -moz-linear-gradient(center bottom , #BFDAFF 0%, #ACD0FF 49%, #BDDAFF 50%, #DFECFF 100%);
    box-shadow: 1px 1px 1px #555555 inset;
}

input                     + div.deliverystatus{ width: 29px; height: 35px; display: block; margin-top: 20px;  }
input[value="notstarted"] + div.deliverystatus{ background-image: url(../img/delivstatwait.png); }
input[value="partlydone"] + div.deliverystatus{ background-image: url(../img/delivstatpartly.png); }
input[value="done"]       + div.deliverystatus{ background-image: url(../img/delivstatdone.png); }

div#subrdr-list > div.suborder input[type="radio"]:checked ~ div > div.header textarea,
div#subrdr-list > div.suborder input[type="radio"]:checked ~ div > div.header input 
{ 
    border: solid 1px #999; 
    padding: 0px 1px 0px 1px; opacity: 1.0; 
}
div#subrdr-list > div.suborder input[type="radio"]:checked ~ div > div.header textarea:not([error]),
div#subrdr-list > div.suborder input[type="radio"]:checked ~ div > div.header input:not([error])
{ 
    background-color: #fff; 
}

div#subrdr-list > div.suborder input[type="radio"]:checked div[typeahead=""] > img.comboboxtiny,
div#subrdr-list > div.suborder input[type="radio"]:checked ~ div > div.header > div[typeahead=""] > img.comboboxtiny{
    opacity: 1.0;
    background: #bed0fc;
    border: solid 1px #999; 
    border-left: none; 
    margin-top: 2px;
    padding-bottom: 5px;
    padding-top: 6px;
}

/*******/


/*****
* The order of elements inside a timedate div must be
* <input - date> <img - date icon> <input - time>
* 
*/
div[timedate=""] > input[type="text"]:first-of-type{ 
    width: 92px ; 
    border: none; 
    background: none; 
    padding: 2px; 
    float: left; 
    text-align: right;
}
div[timedate=""] > input[type="text"]:nth-of-type(2){ 
    width: 36px ; 
    border: none; 
    border-left: none;
    background: none; 
    padding: 2px; 
    float: left; 
}                                                                                          



div.subdialog{
    position: absolute; 
    top: 0px; 
    left: 0px;
    z-index: 1;
    float:none; 
    clear: none; 
    background-color: #fff;
    border: 1px solid #6593CF;
    box-shadow: 1px 1px 2px 2px #999;
    padding: 0px;
}

div.subdialog > div > div{
    float: left;
    clear: both;
}

div.subdialog[subtype="spinepaper"] > div > div > *:nth-child(1) { width: 100px ;}
div.subdialog[subtype="spinepaper"] > div > div > *:nth-child(2) { width: 120px ;}
div.subdialog[subtype="spinepaper"] > div > div > *:nth-child(3) { width: 120px ;}

div.subdialog[subtype="recipient"] {
    width: 390px;
    padding: 3px 8px 6px;
}

div.subdialog > div > div > div,
div.subdialog > div > div > input,
div.subdialog > div > div > label{
    display: block;
    float: left;
    clear: none;
}

/* Hide PO selector for given states */
div#materialrecpconnect > input[value="pseudo"]:checked ~ div{ display: none; }


div#insertlistheader{
    clear: both;
}
div#insertlistheader div{
    float: left;
    clear: none;
    margin-right: 8px ;
}

div#insertlistheader div:nth-child(1) { width: 232px; }
div#insertlistheader div:nth-child(2) { width: 130px; }
div#insertlistheader div:nth-child(3) { width:  60px; }
div#insertlistheader div:nth-child(4) { width:  60px; }
div#insertlistheader div:nth-child(5) { width:  60px; }

div#insertlist{
    clear: both ;
}
div#insertlist > div { 
    clear: both; 
    overflow: auto;
}
div#insertlist > div *{
    float: left;
    clear: none;
    margin-right: 8px;;
}
div#insertlist > div > input:nth-of-type(1) { width: 232px; }
div#insertlist > div > input:nth-of-type(2) { width: 200px; margin-right: 0px; }
div#insertlist > div > input:nth-of-type(3) { width:  60px; text-align: right; }
div#insertlist > div > input:nth-of-type(4) { width:  60px; text-align: right; }
div#insertlist > div > input:nth-of-type(5) { width:  60px; }
div#insertlist > div > ul{ float: right; }

div#frame_insert > div > ul{ float: right; padding-right: 8px; }

/* Individual settings for order dialog */

/* Hide spine info input on main page when in sub order mode */
/* input#subordermode[type="hidden"][value="true"] ~ div div#spinepaperlist{ display: none; } */


/* Post production processing input */
div#postprodb > div.dialogatom > label:first-of-type{ margin-right: 10px;}

/* Unchecked radio button belonging to disabled checkbox */
div#postprodb > div.dialogatom > input[type="checkbox"]:not(:checked) ~ input[type="radio"]:not(:checked) + label { 
    background-image:-webkit-linear-gradient(top, rgb(192,192,192), rgb(183,183,183) 49%, rgb(192,192,192) 50%, rgb(207,207,207) 100% ) ; 
    background-image:linear-gradient( center bottom, rgb(192,192,192) 0%, rgb(183,183,183) 49%, rgb(192,192,192) 50%, rgb(207,207,207) 100% ) ; 
    background-image:-moz-linear-gradient( center bottom, rgb(192,192,192) 0%, rgb(183,183,183) 49%, rgb(192,192,192) 50%, rgb(207,207,207) 100% ) ; 
    border: solid 1px #aaa ; 
    box-shadow: none ; 
    color: #888; 
    cursor: default; 
}

/* Checked radio button belonging to disabled checkbox */
div#postprodb > div.dialogatom > input[type="checkbox"]:not(:checked) ~ input[type="radio"]:checked + label { 
    background-image:-webkit-linear-gradient(top, rgb(222,222,222), rgb(213,213,213) 49%, rgb(222,222,222) 50%, rgb(237,237,237) 100% ) ; 
    background-image:linear-gradient( center bottom, rgb(222,222,222) 0%, rgb(213,213,213) 49%, rgb(222,222,222) 50%, rgb(237,237,237) 100% ) ; 
    background-image:-moz-linear-gradient( center bottom, rgb(222,222,222) 0%, rgb(213,213,213) 49%, rgb(222,222,222) 50%, rgb(237,237,237) 100% ) ; 
    border: solid 1px #cbcbcb ; 
    box-shadow: inset 1px 1px 0px #888 ; 
    color: #888; 
    cursor: default; 
}
div#postprodb > div.dialogatom > input[type="checkbox"]:not(:checked) ~ input[type="text"] { 
    border-color: #dce9fc; 
    color: #6d6d6d; 
}


div#prodstoplistheader{
    clear: both;
}
div#prodstoplist {
    width:  -webkit-calc(100% - 20px) ;
    width:  calc(100% - 20px) ;
    width:  calc(100% - 20px) ;
    height: -webkit-calc(100% - 50px) ;
    height: calc(100% - 50px) ;
    height: calc(100% - 50px) ;
    overflow: auto;
}

div#prodstoplistheader div,
div#prodstoplist > div{
    float: left;
    clear: none;
    width: 100% ;
}

div#prodstoplistheader > div:nth-of-type(1) { width:  80px ; }
div#prodstoplistheader > div:nth-of-type(2) { width: 240px ; }
div#prodstoplistheader > div:nth-of-type(3) { width: 840px ; }

div#prodstoplist > div > div{ 
    float: left;
    clear: none;
}
div#prodstoplist > div > div:nth-of-type(1) { width:  80px ; }
div#prodstoplist > div > div:nth-of-type(2) { width: 240px ; }
div#prodstoplist > div > div:nth-of-type(3) { width: 810px ; }
div#prodstoplist > div > div:nth-of-type(3) >input { width: 780px ; }


div.proddatatimediff{
    float: left;
    clear: right;
    padding: 4px 0px 0px 0px;
    width: 50px;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 11px;
    font-style: normal;
    text-align: right;
}

div.subdialog[subtype="wastecause"] {
    padding: 4px 9px 2px 9px;
}
div.subdialog[subtype="wastecause"] textarea { 
    width:  220px;
    height:  80px;
}

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

div#srccpycntnr{
    border-color: -moz-use-text-color #919B9C #919B9C;
    border-right: 1px solid #919B9C;
    border-style: none solid solid;
    border-width: medium 1px 1px;
    height: -webkit-calc(100% - 1px);
    height: calc(100% - 1px);
    height: calc(100% - 1px);
    padding: 0;
    position: relative;
}

div#srccpycntnr > div{
    height: -webkit-calc(100% - 0px) ;
    height: calc(100% - 0px) ;
    height: calc(100% - 0px) ;
    clear: none;
    float: left;
    border-right: 1px solid #ccc;
}

div#srccpycntnr > div:nth-child(1) > div:first-child,
div#srccpycntnr > div:nth-child(3) > div:first-child {
    background-color: #eee;
    font-weight: bold;
    height: 18px;
    overflow: hidden;
    padding: 4px 0px 0px 4px;
}

div#srccpycntnr > div > div:nth-child(2) > div:first-child {
    height: -webkit-calc(100% - 18px) ;
    height: calc(100% - 18px) ;
    height: calc(100% - 18px) ;
    border-top: 1px solid #919B9C ;
    overflow: auto;
    padding: 0px ; 
    background-color: none;
    clear: none;
    float: left;
    font-weight: normal;
}

div#srchcpyinput{
    width: 285px ;    
}
div#srchcpyinput > div:first-child > div:first-child {
    width: -webkit-calc(100% - 4px);
    width: calc(100% - 4px);
    width: calc(100% - 4px);
}

div#srchcpyinput > div:nth-child(2) > div:first-child {
    width: -webkit-calc(100% - 0px) ;    
    width: calc(100% - 0px) ;    
    width: calc(100% - 0px) ;    
}

div#srccpycntnr > div#srchcpyinput label{ width: 90px; }

div#srchresultlistcntnr > div{ width: 544px; }

div#srccpycntnr > div#srchdestin{ 
    width: -webkit-calc( 100% - 831px); 
    width: calc( 100% - 831px); 
    width: calc( 100% - 831px); 
    border-right: none;
}

div#srchdestin > div#srchcpybody{
    position: relative;
    overflow: auto;
    width: 100% ;
    height: -webkit-calc(100% - 18px);
    height: calc(100% - 18px);
    height: calc(100% - 18px);
    border-top: 1px solid #919B9C ;
}

div#srchdestin > div > div#srchcpydests{
    position: relative;
    overflow: auto;
    width: 100% ;
    height: 160px ;
    border-top: none;
    border-bottom: 1px solid #ccc ;
}
div#srchdestin > div > div#srchcpydests > div{ margin-left: 6px; }

div#srchresultcntnr {
    position: relative; 
    border:   none; */
    padding:  0px; 
    height:   -webkit-calc(100% - 1px);
    height:   calc(100% - 1px);
    height:   calc(100% - 1px);
    width:    544px ;
}

div#srchresultcntnr > div > div > div > div > div:nth-child(1) { width: 148px; }
div#srchresultcntnr > div > div > div > div > div:nth-child(2) { width:  53px; }
div#srchresultcntnr > div > div > div > div > div:nth-child(3) { width: 116px; }
div#srchresultcntnr > div > div > div > div > div:nth-child(4) { width:  80px; }
div#srchresultcntnr > div > div > div > div > div:nth-child(5) { width:  80px; }
div#srchresultcntnr > div > div > div > div > div:nth-child(6) { width:  44px; }

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

div#sotemplates > div > label {  
    height: 18px;
    font: 10px Arial,Sans-serif;
    float: left;
    clear: none;
}

div#sotemplates > div > label.big{ width: 230px;  }
div#sotemplates > div > label.small{ width: 80px;  }

div#sotemplates > div > input.combobox[type="text"] {
    width:  170px;
    height: 14px;
    font: 10px Arial,Sans-serif;
    border: solid 1px #919B9C;
    border-right: none;
}

div#sotemplates > div > img.combobox {
    height: 18px;
    width: 15px;
}

div#sotemplates > div.dialogatom[cool] > input[type="checkbox" ] {
    height: 16px;
    width:  40px;
    font: 10px Arial,Sans-serif;
}
div#sotemplates > div.dialogatom[cool] > input[type="checkbox"] + label { 
    height: 13px; 
}

/*********************** 3.0 ***********************/

div.calcontainer > canvas:nth-child(1).calhedr {
    vertical-align: top;
    height: 62px;
    width: 100%;
}

div.calcontainer > div.calprnt {
    position: relative;
    overflow: auto;
    width: 100%;
}

div.calcontainer > div.calprnt > div.calscrl {
    position: relative;
    width: 100%;
    height: 10%;
}

div.calcontainer > div.calprnt > div.calscrl > canvas {
    position: absolute;
    top:  0px;
    left: 0px;
    background-repeat: no-repeat;
    vertical-align: top;
    width: 100%;
    height: 10%;
}