/** Add css rules here for your application. */

/** Example rules used by the template application (remove for your app) */
h1 {
    font-size: 2em;
    font-weight: bold;
    color: #777777;
    margin: 40px 0px 70px;
    text-align: center;
}

.backgroundPanel {
    background-color: #F0F0F0;
    /*background-color: #3c9601;*/
}

.rootDockLayoutPanel {
    background-color: #FFFFFF;
    margin: 10px 50px; /*top/bottom, left/right*/
}

.headerCompanyName {
    font-size: 26px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    color: #2A3A59;
    margin: 10px 0px 10px;
    padding-left: 10px;
    text-align: left;
}

.headerDepartmentName {
    font-size: 18px;
    color: #2C82C9;
    font-family: Verdana, sans-serif;
    margin: 10px 0px 10px;
    text-align: left;
    border-top-style: none;
}

.gwt-imagebutton-transparent {
    background-color: transparent;
    cursor: pointer;
}

.mybutton {
    font-size: 12px;
    padding-left: 10px;
    font-family: Arial, sans-serif;
    color: #000066;
    height: 30px;
    background-color: #FFFFFF;
    border-top-style: none;
    border-bottom-style: solid;
    border-bottom-color: #000066;
    border-left-style: none;
    border-right-style: none;
}

.menuButton:hover {
    border-style: solid;
    border-color: #1975D1;
    border-radius: 5px;
    opacity: 1.0;
}

.mainTextButtonGreen, .mainTextButtonBlue, .mainTextButtonDarkGreen {
    color: white;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    padding-top: 10px;
    font-size: 14pt;
    height: 28px;
    font-weight: bold;
    -moz-border-radius: 4px;
    -webkit-border-radius: 10px;
    border-radius: 4px;
}

.mainTextButtonGreen {
    background-color: #009933;
}

.mainTextButtonBlue {
    background-color: #0976ff
}

.mainTextButtonGreen:hover {
    background-color: #006600;
    cursor: default;
}

.mainTextButtonBlue:hover {
    background-color: #476e9e;
    cursor: default;
}
.mainTextButtonDarkGreen {
    background-color: #768d87;
}

.mainTextButtonDarkGreen:hover {
    background-color: #6c7c7c;
}

.mybutton:hover {
    color: #66CCFF;
}

.gwt-imagebutton {
    opacity: 1.0;
    height: 32px;
    width: 32px;
    color: #fff;
    font-size: 12px;
    font-family: arial, sans-serif;
    cursor: pointer;
}

/* background-color: #BAE8FF; hvit #FFFFFF*/

/*border: 1px solid #BAE8FF;*/
.gwt-imagebutton-up-hovering {
    opacity: 0.5
}

.gwt-imagebutton-down-hovering {
    opacity: 0.4
}

.simplePanelRounded {
    background-color: #F0F5FA;
    border-radius: 10px 10px 10px 10px;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 10px;
}

.simplePanelBox {
    background-color: #F1F0F0;
    border-radius: 5px 5px 5px 5px;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 10px;
}

.simplePanelBoxWhite {
    background-color: white;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 10px;
}

/* background-color: #C2D6D6; */
.sectionBorder {
    border: 4px silver solid;

    border-radius: 10px 10px 10px 10px;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 30px;
}

.tabPageTitle {
    font-size: 16pt;
    font-weight: bold;
    color: #777777;
    margin: 0px 0px 0px;
    text-align: left;
    padding-left: 10px;
    padding-top: 10px;
}

.labelError {
    font-weight: bold;
    color: red;
    text-decoration: blink;
}

.labelErrorHtml {
    color: red;
}

.labelGreen {
    color: green;
}

.pageHeaderMainTitle {
    font-size: 16pt;
    font-weight: bold;
    color: #777777;
    margin: 0px 0px 0px;
    text-align: left;
    padding-left: 10px;
    padding-top: 10px;
}

/* Brukes bl.a. i initUsersWorkList() setter format på felt som viser arbeidsøktas varighet, type ol */
.pageHeaderSubTitle {
    font-size: 11pt;
    font-style: italic;
    color: #777777;
    margin: 0px 0px 10px;
    padding-left: 10px;
    text-align: left;
}

.guidingText {
    padding-right: 4px;
    font-size: 14px;
    font-family: Arial, sans-serif;
    padding-top: 5px;
    padding-bottom: 2px;
    font-weight: bold;
    opacity: 0.8;
}

.subTitle {
    font-size: 16pt;
    font-weight: bold;
    color: #777777;
    margin: 0px 0px 0px;
    text-align: left;
    padding-left: 10px;
    padding-top: 10px;
}

.sysCustomerLogo {
    background: #002149;
}

.mainTextButtonRed {
    color: white;
    cursor: pointer;
    height: 30px;
    background-color: #D74A38;
    font-weight: bold;
}

.mainTextButtonRed:hover {
    background-color: #bc3315;
}

.simplePanelBorder {
    background-color: #FFFFFC;
    border: 2px solid silver;
}

.imageBorder {
    background-color: #FFFFFC;
    border: 5px solid silver;
}

.headerTitleLarge {
    font-size: 30px;
    font-family: Arial, Helvetica, sans-serif;
    color: #2A3A59;
    margin: 10px 0px 10px;
    text-align: left;
}

.headerTitleMedium {
    font-size: 22px;
    font-family: Arial, sans-serif;
    color: #2A3A59;
    text-align: left;
    background-color: #FFFFFC;
}

.headerTitleMediumBackground {
    font-size: 18px;
    font-family: Roboto;
    background-color: white;
    text-align: left;
    padding: 10px;
    color: #628CD5;
    border-radius: 5px 5px 5px 5px;
}

.dlgTitle {
    font-size: 22px;
    font-family: Roboto;
    background-color: white;
    text-align: left;
    /*color: #628CD5;*/
    color: #2A3A59;
}

.dlgSubTitle {
    font-family: Roboto;
    font-size: 11pt;
    font-style: italic;
    color: #372977;
    text-align: left;
    padding-top: 10px;
    padding-bottom: 10px;
}

.headerTitleSmall {
    font-size: 16px;
    font-family: Arial, sans-serif;
    color: #2A3A59;
    text-align: left;
}
.dlgMargin {
    margin: 10px;
}

/* Brukes til lengre forklaringer i skjermbilder, undertekst til tittel  */
.pageHelpText {
    font-size: 10pt;
    font-style: italic;
    color: #777777;
    text-align: left;
}

/* background-color:#F1F1F1; lys grå  color: #2A3A59;*/
.labelMediumText {
    font-size: 15px;
    color: #0B2161;
}

.labelDateRange {
    font-size: 32px;
    color: #040d77;
    font-family: Verdana, sans-serif;
}

.labelDate{
    font-family: monospace;
    font-size: 20px;
    font-style: normal;
    font-variant: normal;
    font-weight: bold;
    line-height: 26.4px;
    color: #3c9601;
}
.labelUsersCommentText {
    color: #3c9601;
    font-family: monospace;
    font-size: 14px;
}

.popupToastMsg {
    background-color: rgb(251, 251, 251);
    /*border: #6c7c7c;*/
    border: 3px solid darkgray;
}
.labelToastMsg {
    font-size: 24px;
    /*color: #ef8616;*/
    color: #0B2161;
    font-family: Verdana, sans-serif;
    /*font-weight: bold;*/
    margin: 15px;
}

.fieldLabelTextSmall {
    color: #0B2161;
    font-size: 14px;
    font-weight: bold;
    font-family: Verdana, sans-serif;
}

.tableBorderBottom {
    /*background-color: #FFFFFC;*/
    border-bottom: 2px solid silver;
}

.tableBorderRight {
    background-color: #FFFFFC;
    border-right: 2px solid silver;
}

.tableBorderLeft {
    background-color: #FFFFFC;
    border-right: 2px solid silver;

}

.paddingTop {
    padding-top: 5px;
}
.paddingLeft {
    padding-left: 5px;
}

.paddingBottom {
    padding-bottom: 5px;
}

.flowComposedTxtWidgetMid {
    padding-top: 5px;
    padding-left: 5px;
    padding-right: 5px;
    font-weight: bold;
}

.labelGreenTxt {
    color: Green;
    background-color: #FFFFFC;
    border: 1px solid silver;

}

.labelWithBorder {
    background-color: #FFFFFC;
    border: 1px solid silver;
    /*background-color: WhiteSmoke*/
}



.cellTableImg {
    opacity: 0.5;
}

.cellTableImg:hover {
    opacity: 1.0;
}

.statusO {
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    font-family: arial;
    font-size: 24px;
    padding-top: 5px;
    text-decoration: none;
    background-color: #77b55a;
    Text-indent: 10px;
    border: 1px white;
}

.sectionBorderI, .sectionBorderB, .sectionBorderO {
    opacity: 0.9;
    border-radius: 6px 6px 6px 6px;
    padding: 10px;
}

.sectionBorderI {
    border: 3px solid #d0451b;
}

.sectionBorderB {
    border: 3px solid #ffc477;
}

.sectionBorderO {
    border: 3px solid #77b55a;
}

.statusButtonI, .statusButtonB, .statusButtonO, .statusButtonU, .statusButtonAll {
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    font-family: arial;
    font-size: 22px;
    text-decoration: none;
    text-align: center;
    width: 45px;
    height: 35px;
}

.statusButtonI {
    background-color: #d0451b;
}

.statusButtonI:hover {
    background-color: #bc3315;
}

.statusButtonB {
    /*background-color:#7892c2;*/
    background-color: #ffc477;
}

.statusButtonB:hover {
    /*background-color:#476e9e;*/
    background-color: #ffaa22;
}

.statusButtonO {
    background-color: #77b55a;
}

.statusButtonO:hover {
    background-color: #68a54b;
}

.statusButtonU {
    background-color: #768d87;
}

.statusButtonU:hover {
    background-color: #6c7c7c;
}

.statusButtonAll {
    background-color: #ededed;
    width: 80px;
    color: black;
}

.statusButtonAll:hover {
    background-color: #bab1ba;
}

.statusButtonI:active, .statusButtonB:active, .statusButtonO:active, .statusButtonU:active, .statusButtonAll:active {
    position: relative;
    top: 1px;
}

.labelAndButton {
    border: 1px silver dotted;
    border-radius: 5px 5px 5px 5px;
    height: 34px;
    padding-left: 5px;
}

.paddingLeft {
    padding-left: 10px;
}

.tableCell {
    padding-top: 20px;
}

.imageButton24 {
    color: #000066;
    cursor: pointer;
    height: 30px;
    width: 30px;
    padding-left: 5px;
    padding-top: 5px;
    background-color: #FFFFFF;
    border-top-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-right-style: none;
}

.imageButton24:hover {
    opacity: 0.2;
}

.imageButton24Blury {
    color: #000066;
    cursor: pointer;
    height: 26px;
    width: 26px;
    padding-left: 5px;
    padding-top: 2px;
    background-color: #FFFFFF;
    border-top-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-right-style: none;
    opacity: 0.2;
}

.imageButton24Blury:hover {
    opacity: 1.0;
}

.imageButton24Blury[disabled] {
    opacity: 0.5;
}

.imageButton24Blury[disabled]:hover {
    opacity: 0.5;
}

.imageButton16Blury {
    opacity: 0.2;
}

.imageButton16Blury:hover {
    opacity: 1.0;
}

.imageButton16Blury[disabled] {
    opacity: 0.5;
}

.imageButton16Blury[disabled]:hover {
    opacity: 0.5;
}

.imageButton {
    opacity: 0.8;
    background-color: #0ba510;
}

.imageButton:hover {
    opacity: 1.0;
}

.imageButton[disabled] {
    opacity: 0.2;
}

.imageButton[disabled]:hover {
    opacity: 0.2;
}

.fieldLabelCenter {
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    padding-top: 7px;
}

.statusLabelI, .statusLabelB, .statusLabelO, .statusLabelU {
    display: inline-block;
    color: #ffffff;
    font-family: arial;
    font-size: 19px;
    text-decoration: none;
    text-align: center;
    width: 50px;
    height: 35px;
}

.statusLabelI {
    background-color: #d0451b;
}

.statusLabelB {
    background-color: #ffc477;
}

.statusLabelO {
    background-color: #77b55a;
}

.statusLabelU {
    background-color: #768d87;
}

.flextableCell {
    border: thin solid silver;
}

.topBorderThinSilver {
    border-top: thin solid silver;
}

.helpText {
    font-size: 11pt;
    font-style: italic;
    color: #777777;
    margin: 0px 0px 10px;
    padding-left: 10px;
    text-align: left;
}

.simplePanelInfoBox {
    background-color: #FFFFCC;
    border-radius: 5px 5px 5px 5px;
    padding: 10px;
}

/* Beskrivende tekst etter textBox (DlgAddWorklist)*/
.descTextAfterLabel {
    font-size: 10pt;
    font-style: italic;
    color: #777777;
    margin: 0px 0px 10px;
    padding-left: 10px;
    padding-top: 5px;
    text-align: left;
}

.compositelabelAndButton {
    border-bottom: 1px silver dotted;
}

.compositeLabelLarge {
    font-size: 22px;
    font-family:Arial, Helvetica, sans-serif;
    color: #2A3A59;
    text-align: left;
}

.myLabel {
    font-size: 14px;
    font-family: Arial, Helvetica, sans-serif;
    color: #2A3A59;
    text-align: left;
    background-color: white;
}

/* brukes til forklarende tekst på en side */
.labelInfoText {
    font-size: 11pt;
    font-style: italic;
    color: #777777;
    text-align: left;
}

.myToggleButtonLabel {
    font-size: 16px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 4px;
    font-family: Arial, Helvetica, sans-serif;
    color: #2A3A59;
    text-align: left;
}

.myToggleButtonPanel {
    cursor: pointer;
    opacity: 1.0;
    background-color: white;
    border: 1px solid #D1D3D4;
    border-radius: 3px 0 0 3px;
}

.myToggleButtonImg {
    padding-left: 10px;
    padding-top: 3px;
}

.myToggleButtonCbOn, .myToggleButtonCbOff {
    font-family: sans-serif;
    font-weight: normal;
    border-radius: 3px 0 0 3px;
    height: 25px;
    width: 30px;
    padding-top: 7px;
    text-indent: 10px;
    cursor: pointer;
}

.myToggleButtonCbOn {
    background-color: #4DCB6D;
    color: #9CE2AE;
}

.myToggleButtonCbOff {
    background-color: #D1D3D4;
    color: #D1D3D4;
}

.myToggleButtonCbOff:before:hover {
    color: #888;;
}

.myToggleButtonCbOn:before {
    content: "\2714";
}

.myButton {
    cursor: pointer;
    font-family: arial;
    font-size: 16px;
    text-decoration: none;
    text-align: center;
    border-radius: 4px;
    border-style: solid;
    background-color: #D1D3D4;
    color: black;
}

.myButton:hover {
    background-color: #888;
    color: #ffffff;
}

.myButtonLabel {
    font-size: 16px;
}

.textAreaFormat {
    color: #006BB7;
    padding-right: 5px;
    font-size: 14px;
    font-family: Arial, sans-serif;
}

.textarea {
    resize: none;
}
.carryOutCommentTextArea {
    resize: none;
    color: green;
}

.simplePanelRoundedYellow {
    background-color: #FFFFEB;
    border-radius: 10px 10px 10px 10px;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
}

.headerSubTitle {
    font-size: 12pt;
    font-style: italic;
    color: #372977;
    margin: 0px 0px 10px;
    padding-left: 10px;
    text-align: left;
}

.flextableHeader {
    background-color: #8aa4b8;
    color: white;
    font-style: italic;
    border: thin solid #444444;
    border-right-color: #111111;
    border-bottom-color: #111111;
    font-size: 20px;
    margin-bottom: 12px;
}

.flexTableLeftBorder {
    /*border: 2px silver solid;*/
    border-left: thin solid #444444;
}
.flexTableRightBorder {
     /*border: 2px silver solid;*/
     border-right: thin solid #444444;
 }
.flexTableBorderTop {
    /*border: 2px silver solid;*/
    border-top: 2px solid #444444;
}
.flexTableBorderCellRightAndBottom {
    /*border: 2px silver solid;*/
    border-right: thin solid #444444;
    border-bottom: 2px solid #444444;
}

.flexTable td {
    /*border: 1px solid #BBBBBB;*/
    border-collapse: collapse;
    /*padding: 3px;*/
    /*border-top: thin solid #444444;*/
    /*border-left: thin solid #444444;*/
    /*border-right: thin solid #111111;*/
    /*border-bottom: thin solid #111111;*/
    /*background-color:  #F0F0F0;*/

}

.calenderDayColumn {
     background-color: rgba(0,60,136,.7);
     color: #ffffff;
     text-align: center;
     padding-top: 4px;
     height: 20px;
 }

.calenderDayColumnCurrent {
    background-color: rgba(136, 50, 48, 0.7);
    color: #ffffff;
    font-weight: bold;
    text-align: center;
    padding-top: 4px;
    height: 20px;
}

.calendarWeekNumberRow {
    background-color: rgba(0,60,136,.7);
    color: white;
    font-style: italic;
    border: thin solid #444444;
    border-right-color: #111111;
    border-bottom-color: #111111;
    font-size: 20px;
    margin-bottom: 12px;
    height: 28px;
}
.periodicLabelO, .periodicLabelU, .periodicLabelN, .periodicLabelDefault, .calenderTitleColumns, .periodicLabelPartial,
.periodicLabelOselected, .periodicLabelNselected, .periodicLabelUselected, .calendarPlannedTimeColumn, .calendarAccruedTimeColumn{
    color: #ffffff;
    width: 100%;
    height: 20px;
    text-align: center;
    padding-top:4px;
}
.periodicLabelO{
    background-color: #77b55a;
    cursor: default;
}
.periodicLabelO:hover{
    background-color: #68a54b;
}
.periodicLabelOselected {
    background-color: #0ba510;
    font-weight: bold;
}
.periodicLabelU{
    background-color: #768d87;
    cursor: default;
}
.periodicLabelU:hover {
    background-color: #51615d;
}
.periodicLabelUselected {
    background-color: #51615d;
    font-weight: bold;
}
.periodicLabelPartial {
    background-color: #610B0B;
    cursor: default;
}
.periodicLabelN{
    background-color: #ffc477;
    cursor: default;
}
.periodicLabelN:hover {
    background-color: #ffaa22;
}
.periodicLabelNselected {
    background-color: #ff970c;
    font-weight: bold;
}
.periodicLabelDefault {
    background-color: #E8ECEC;
    color: #E8ECEC;
}
.calenderTitleColumns {
    /*font-family: Arial, sans-serif;*/
    font-family: "Helvetica Neue", sans-serif;
    /*background-color: rgba(18, 36, 30, 0.02);*/
    background-color: #E8ECEC;
    color: #020f2a;
    text-align: left;
    padding-top: 4px;
    padding-left: 4px;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.calendarPlannedTimeColumn {
    font-family: "Helvetica Neue", sans-serif;
    font-weight: bold;
    background-color: rgba(18, 36, 30, 0.12);
    color: black;
    align-content: flex-end;
    height: 20px;
}

.flexLabelLeftColsClick {
    font-family: "Helvetica Neue", sans-serif;
    font-weight: bold;
    background-color: rgba(18, 36, 30, 0.12);
    color: black;
    height: 20px;
    padding-top: 4px;
    padding-left: 4px;
}
.flexLabelLeftColsClick:hover {
    background-color: rgba(18, 36, 30, 0.25);
}

.flexLabelLeftColsClickSelected {
    font-family: "Helvetica Neue", sans-serif;
    font-weight: bold;
    background-color: rgba(18, 36, 30, 0.31);
    color: black;
    height: 20px;
    padding-top: 4px;
    padding-left: 4px;
}


.calendarAccruedTimeColumn {
    /*background-color: rgba(118, 141, 135, 0.26);*/
    font-family: "Helvetica Neue", sans-serif;
    /*background-color: #768d87;*/
    /*background: rgba(0,60,136,.5);*/
    font-family: Arial, sans-serif;
    background-color: rgba(18, 36, 30, 0.12);
    align-content: flex-end;
    /*vertical-align: baseline;*/
    font-weight: bold;
    height: 20px;

    /*color: #05032a;*/
    color: black;
}
.calenderBackground {
    background: #05032a;
}

.tableBorder {
    border: 2px silver solid;
}


.feedback {
    border: 2px solid;
    border-radius: 3px;
    color: white;
    padding: 2px 3px;
}

.feedback-progress {
    border-color: #696f05;
    background-color: #b3b300;
}

.feedback-success {
    border-color: darkgreen;
    background-color: #3c9601;
}

.feedback-error {
    border-color: darkred;
    background-color: #d70000;
}

.tableWithRowsDelimiter td {
    border-bottom: 1px solid #c9c9c9;
}

.panelAlignRight {
    align-content: flex-end;
}


.docUrlPresent, .docUrlMissing {
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    font-family: arial;
    font-size: 22px;
    text-decoration: none;
    text-align: center;
    width: 20px;
    height: 20px;
}

.docUrlPresent {
    background-color: #1482d0;
}

.docUrlPresent:hover {
    background-color: #0a58d0;
}

.docUrlMissing {
    background-color: #d3cec4;
}

.docUrlMissing:hover {
    background-color: #6f6f6f;
}


/*Fra ol3 demo*/

html, body {
    height: 100%;
    font-family: 'Arial', sans-serif;
}

body {
    margin: 0px;
}

.map {
    height: 100%;
    width: 100%;
}

.overlay-font {
    color: #FFF;
    font-family: 'Helvetica Neue', sans-serif;
    font-size: 46px;
    font-weight: 100;
    line-height: 50px;
    letter-spacing: 1px;
    text-shadow: 0px 0px 10px #F00;
}

.paddingTop {
    margin-top: 10px;
}

.imagebutton {
    opacity: 1.0;
}

.imagebutton-up-hovering {
    opacity: 0.5;
}

.imagebutton-down-hovering {
    /*background-color: #1975D1;*/
    opacity: 0.5;
}

.myButtonGreen {
    background-color: #2B6E66;
    color: white;
    height: 30px;
    border-radius: 4px;
    border-style: solid;
    border-color: #777777;
    font-size: 12pt;
    font-weight: bold;
}

.myButtonGreen[disabled] {
    background-color: #2B6E66;
    opacity: 0.5;
}

.myButtonGreen[disabled]:hover {
    background-color: #2B6E66;
}

.myButtonGreen:hover {
    background-color: #1a3f37;
}

.borderBottom {
    border-bottom: thin solid silver;
}

.buttonBWicon {
    opacity: 1.0;
    background: transparent;
    border-radius: 25%;
    /*text-align: center;*/
    /*display: block;*/
    border: 2px;
    /*width: 30px;*/
    /*height: 28px;*/
    margin: auto;

    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    text-decoration: none;
    overflow: hidden;
    cursor: pointer;
}

.buttonBWicon:hover {
    background-color: rgb(241, 239, 239);
}

.buttonBWicon[disabled] {
    opacity: 0.2;
}

.buttonBWicon:active {
    background: #999999;
}

.buttonBWicon[disabled]:hover {
    opacity: 0.3;
}
/*.gwt-TabLayoutPanel .gwt-TabLayoutPanelContent {
	box-sizing: border-box;
}*/