﻿/* DEFAULTS
----------------------------------------------------------*/

/*
    Strekke side 100% vertikalt:    http://www.tutwow.com/htmlcss/quick-tip-css-100-height/
*/
/* Print innstillinger*/
@page {  
 size: A4;  
 margin: 0;  
} 

@media print {
    .page {
        margin: 0;
        border: initial;
        border-radius: initial;
        width: initial;
        min-height: initial;
        box-shadow: initial;
        background: initial;
        page-break-after: always;
    }
}

/* ✅ Global styling for disabled inputs in print view - lighter background, darker text for better readability */
input[type="text"]:disabled,
input[type="number"]:disabled,
input[type="email"]:disabled,
input[type="date"]:disabled,
textarea:disabled,
select:disabled {
    background-color: #fafafa !important;
    color: #333333 !important;
    cursor: not-allowed !important;
}

/*  ddytrh: lagt til for å strekke height 100% */
html {
	/*height: 100%;*/
	background-color: White; /* #797766; */
}

body   
{
    /*background: #b6b7bc;*/
    font-size: .85em;
    font-family: Roboto,'Helvetica', "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
    font-weight:400;
    margin: 0px;
    padding: 0px;
    color: Black; /* font farge */
    /*height: 100%;*/
}

html, table, th, tr, td, a {
    font-family: Roboto, 'Helvetica','Helvetica Neue';
}

th {
    vertical-align: top !important;
}


a:link, a:visited
{
    color: #034af3;
}

a:hover
{
    color: #1d60ff;
    text-decoration: none;
}

a:active
{
    color: #034af3;
}

b
{
    font-weight: 500;
}

p
{
    margin-bottom: 10px;
    line-height: 1.6em;
}

.anchorGrayColor { color : gray;}

.plantDropdown {
    font-size: 18px;
    /*font-weight:bold;*/
    font-family: 'Roboto';
    font-weight: 500;
    background-color: #009DE0; /*#009DE0;*/
    border-width: 1px;
    border-radius:2px;
    border-color: White;
    border-style: solid;
    color: White;
    margin-right:38px;
    margin-top:0px;
    padding:2px;
}

select.plantDropdown option {
    background: #00a9f1;
}


/* Menu colors DDY. Using the TOL palette for colorblindness:
    https://davidmathlogic.com/colorblind/#%23332288-%23117733-%2344AA99-%2388CCEE-%23DDCC77-%23CC6677-%23AA4499-%23882255

*/
.colorScheduleMenuItem { background-color:#DDBB66; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } /*#B67721*/
.colorActivitiesMenuItem { background-color:#88CCEE; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } /* #21B6A8*/
.colorDevianceMenuItem { background-color:#CD5C5C; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } /* #B6212D*/
.colorDocumentsMenuItem { background-color:#AA4499; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } /*#ACACAC*/
.colorDocumentsLighterMenuItem { background-color:#ca79bc; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } /*#ACACAC*/
.colorPlantMenuItem { background-color:#44AA99; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } /* #177F75*/
.colorCommunicationMenuItem { background-color:#7F5417; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
.colorHelpMenuItem { background-color:#882255; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } /*#7F171F*/
.colorImprovementMenuItem { background-color:#117733; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } /*#458B00*/

.menuItemText {color:white;font-family:'Roboto';font-weight: 500;font-size:14px;}

/* HEADINGS   
----------------------------------------------------------*/

h1, h2, h3, h4, h5, h6
{
    font-family:Roboto;
    font-size: 1.5em;
    color: Black;
    font-variant: small-caps;
    text-transform: none;
    font-weight: 200;
    margin-bottom: 0px;
}

h1
{
    font-size: 1.6em;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

h2
{
    font-size: 1.5em;
    font-weight: 600;
}

h3
{
    font-size: 1.2em;
}

h4
{
    font-size: 1.1em;
}

h5, h6
{
    font-size: 1em;
}

/* this rule styles <h1> and <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
    margin-top: 0px;
}


/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

/* samme som for .body? */

a.mainmenulink {
    margin-left: 28px;
    font-size: 25px;
    text-decoration-color: lightblue;
    font-family: 'Roboto','Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans';
    font-weight: 500;
    color: white;
}

a.mainmenulink:visited
{
    color:white;
}

a.mainmenulink:hover
{
    color:lightblue;
}

.header
{
    position: fixed;
    height: 45px;
    left: 0;
    margin-top:0px;
    top: 0;
    background-color: #009DE0;
    width: 100%;
    margin:auto;
    z-index:100000;
    border-bottom-style:solid;
    border-bottom-width:2px;
    border-bottom-color: #797766;
}

.header h1
{
    font-family: 'Roboto';
    font-weight: 700;
    margin: 0px;
    padding: 0px 0px 0px 20px;
    color: #f9f9f9;
    border: none;
    line-height: 2em;
    font-size: 2em;
}

.main
{
    /*overflow:auto;*/
    /*position:relative;*/
    margin-top: 49px;
    margin-left: 117px;
    /*margin: 62px 0px 0px 57px; /* definerer marginer rundt hovedramme -> tabs */
    /*min-height todo: settes? */
    background-color:White;
}


/* FORM ELEMENTS   
----------------------------------------------------------*/

.dhtmlxLabel {
    font-weight:bold;
}

fieldset
{
    position:relative; /* NOTE: Added because of info icon top right corner, which requires absolute positioning */
    margin: 1em 0px;
    padding: 1em;
    border: 1px solid #ccc;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

fieldset.formsection_mandatory
{
    background-color: aliceblue;
    border-width:2px;
}

fieldset.formsection_green
{
    background-color: #F3FFE1  ;
    border-width:2px;
}

fieldset p 
{
    margin: 2px 12px 10px 10px;
}

fieldset.login label, fieldset.register label, fieldset.changePassword label
{
    display: block;
}

fieldset label.inline 
{
    display: inline;
}

legend 
{
    color: Gray;
    font-family: 'Roboto';
    /*font-weight: 600;*/
    padding: 2px 4px 4px 4px;
}

input, select, button {
    font-family: 'Roboto';
}

input.textEntry 
{
    width: 320px;
    border: 1px solid #ccc;
}

input.textEntry40
{
    width: 55px;
    border: 1px solid #ccc;
}

input.textEntry80
{
    width: 80px;
    border: 1px solid #ccc;
}

input.textEntry100Percent
{
    width: 100%;
    border: 1px solid #ccc;
}


input.passwordEntry 
{
    width: 320px;
    border: 1px solid #ccc;
}

div.accountInfo
{
    width: 42%;
}

/* MISC  
----------------------------------------------------------*/

.clear
{
    clear: both;
}

.loginDisplay
{
    font-size: 1.1em;
    display: block;
    text-align: right;
    padding: 5px;
    color: White;
}


.loginDisplay a:link
{
    color: white;
}

.loginDisplay a:visited
{
    color: white;
}

.loginDisplay a:hover
{
    color: white;
}

.failureNotification
{
    font-size: 1.2em;
    color: orange;
}

.bold
{
    font-weight: bold;
}

.submitButton
{
    text-align: right;
    padding-right: 10px;
}

/*
--------------------------------------------------------------------------------
 DDYTRH 
--------------------------------------------------------------------------------
*/

#linkmenu 
{
    display: table-cell;
    position: fixed;
    height: 100%;
    left: 1px;
    top: 47px;
    width: 115px; /* testet - print*/
    /*background-color:#F5F5F5;*/
}

#linkmenu td {
   /*border: solid 3px white;*/
   text-align: center;
   height:95px;
   /*padding: 2px;*/
}

#linkmenu img {
    display: block;
    margin: 0 auto;
    border: 0;
}

#linkmenu a 
{
    display: inline-block;
    text-decoration: none;
    color: white;
    width: 108px;
}

#linkmenu a:hover {
    background-color:rgba(162,162,162,0.5);
    height:80px;
    /*color:green;*/
}

/* For skjemaer som ikke trenger meny*/
.nomenu
{
    position:absolute; 
    width: 99%;
    margin-left: -115px;
}

.nomenu_revision
{
    max-width: 1200px;
    width: 110%;
    margin-left:-110px;
}

.revision_override_myscript {
    width: auto;
    padding: 0 25px 0 5px !important;
    /*color: #131F26;*/
    height: 1.4rem !important;
    font: 300 16px Roboto, "Source Sans Pro",sans-serif;
    /*border: 1px solid #CED5D9;*/
    border-radius: 2px !important;
    -webkit-tap-highlight-color: transparent;
    /*background:none !important;*/
}

.revision_override_myscriptDiff {
    width: auto;
    padding: 0 25px 0 5px !important;
    /*color: #131F26;*/
    height: 1.4rem !important;
    font: 300 16px Roboto, "Source Sans Pro",sans-serif;
    /*border: 1px solid #CED5D9;*/
    border-radius: 2px !important;
    -webkit-tap-highlight-color: transparent;
    pointer-events: none;
    /*background:none !important;*/
}

#nosubmenu
{
    display: table-cell;
    position: fixed;
    height: 100%;
    left: 117px;
    top: 47px;
    /*width: 2px;*/ 
    background-color:white;
}

#link_submenu 
{
    display: table-cell;
    position: fixed;
    height: 100%;
    left: 1px; /* 110*/
    top: 47px;
    width: 115px;
    /*background-color:#FAFAFA;*/
}

#link_submenu td {
   /*border: solid 3px white;*/
   text-align: center;
   height:95px;
   /*padding: 2px;*/
}

#link_submenu img {
    display: block;
    margin: 0 auto;
    border: 0;
}

#link_submenu a 
{
    display: inline-block;
    text-decoration: none;
    color: white;
    width: 108px;
}

#link_submenu a:hover {
    /*background-color: Black;*/
    background-color:rgba(162,162,162,0.5);
    height:80px;
    /*color:green;*/
}


table.schema_centeralign
{
    width: 100%; 
    border-spacing: 0px;
    border-collapse:collapse;
}

table.schema_centeralign td 
{
    vertical-align:top;
    text-align:center;
    padding:2px;
    font-weight:400 !important;
    /*padding:0px;*/
}

table.schema_centeralign th
{
    /*border-style: solid;*/ 
    background-color: rgb(242,252,255);
    border-bottom:solid;
    border-color: rgb(210, 242, 255);
    border-width: 1px;
    vertical-align:top;
    padding:2px;
    font-weight:500 !important;
}

table.general_table
{
    width: 100%; 
    border-spacing: 0px;
    border-collapse:collapse;
}

table.general_table td 
{
    vertical-align:top;
    text-align:left;
    padding:2px;
    /*padding:0px;*/
}

table.general_table th
{
    /*border-style: solid;*/ 
    text-align:left;
    border-bottom:solid;
    border-color: Gray;
    border-width: 1px;
    vertical-align:top;
    padding:2px;
    font-weight:500;
}

.changelog
{
    width: 100%; 
    border-spacing: 0px;
    border-collapse:collapse;
}

.changelog td 
{
    vertical-align:top;
    text-align:left;
    padding:2px;
    /*padding:0px;*/
}

.changelog th
{
    /*border-style: solid;*/ 
    border-bottom:solid;
    border-color: Gray;
    border-width: 1px;
    vertical-align:top;
    padding:2px;
    text-align: left;
}

div.message {
    background: transparent url('../images/error-icon.png') no-repeat scroll left center;
    background-size: 16px 16px;
    padding-left: 2px;
}

div.sample_infobox 
{
    color: #aaaaaa; 
    background-color: #fafafa;
    border-color: #cfcfcf;
    border-style: solid;
    border-width: 1px;
    padding: 4px;
    margin-top: 5px;
    text-align:left;
}

div.sample_infobox_blue
{
    color: #009DE0; 
    background-color: #e9f7ff;
    border-color: #009DE0;
    border-style: solid;
    border-width: 1px;
    padding: 4px;
    margin-top: 5px;
    text-align:left;
}

div.sample_infobox_blue a
{
    color: #009DE0; 
}

span.infoIcon
{
    position:absolute; 
    display:inline-block;
    top:15px;
    right:5px;
    width:16px;
    height:16px;
    background: url('../Images/questionmark_green.png') no-repeat center center;
    background-size: 16px;
}

.sample_statusheader 
{
    color: blue; 
    background-color: rgb(242,252,255);
    border-color: rgb(210, 242, 255);
    border-style: solid;    
    border-width: 1px;
    padding: 4px;
    margin-top: 5px;

}

div.error {
    /*background-color:#F3E6E6;
    border-color: #924949;
    border-style: solid solid solid none;
    border-width: 1px;
*/    padding: 10px;
}

/* Expand collapse div (or other element)*/
.slider{
	display:none;
}
.collapseSlider{
	display:none;
}
.sliderExpanded .collapseSlider{
	display:block;
	
}
.sliderExpanded .expandSlider{
	display:none;
}
/* ---------------*/

.usermessage {
    margin-top:80px;
    width: 500px;
    border-radius: 6px; 
    padding: 10px;
    border: 2px solid #0099CC;
    /*background-color: #F3FFE1;*/
}

.usermessage-button{
    color: #0099CC; 
    background: rgba(115, 221, 255, 0.50) ; 
    border: 2px solid #0099CC;
    border-radius: 6px; 
    padding: 16px 32px;
    text-align: center;
    display: inline-block;
    font-size: 16px;
    margin-top: 10px;
    margin-left: 361px;
    margin-bottom:50px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
    text-decoration: none;
}  
/* #008CBA; */
.usermessage-button:hover {
      background-color:  #0099CC;
      color: white;
 }

span.white {
    color:azure;
}

/* Processoverview start */

.processOverviewHeadline {
    font-family:'Roboto';
    font-weight: 500;
    font-size:20px;
    color:black;
    padding-top: 15px;
    margin-left:10px;

}

.processOverviewHeadline_special {
    font-family:'Roboto';
    font-weight: 500;
    font-size:20px;
    color:black;
    padding-top: 15px;
    margin-left:10px;
    margin-top:10px;
    float:left;
}
 

.processOverviewHeadline_Box {
    font-family:'Roboto';
    font-weight: 500;
    font-size:20px;
    color:black;
    padding-top:10px;
}

.processOverviewText {
    font-size:16px;
    color:black;
    padding-top:14px;
    /*margin-left:10px;*/
    font-weight: 400;
}

.comment_bubble:hover
{
    filter: brightness(85%);
}

.comment_bubble_box:hover
{
    filter: brightness(85%);
}

.comment_bubble_box {
    width: 158px;
    height: 75px;
    background: currentColor;
    position: relative;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    cursor: pointer;
    text-align:center;
    margin-top: 10px;
    vertical-align:middle;
}


.comment_bubble_slim_special_for_resources {
    width: 1060px;
    height: 97px;
    background: currentColor;
    position: relative;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: width 0.8s; /* Safari */
    transition: width 0.8s;
    padding-bottom: 0px;
    margin-bottom: 10px;
}

.comment_bubble_slim_special_for_resources:before {
    content: "";
    width: 0;
    height: 0;
    left: 100%;
    top: 18px;
    position: absolute;
    border-top: 20px solid transparent;
    border-left: 15px solid currentColor;
    border-bottom: 20px solid transparent;
}

.comment_bubble {
    width: 160px;
    height: 300px;
    background: currentColor;
    position: relative;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    cursor: pointer;
}

.comment_bubble:before {
    content: "";
    width: 0;
    height: 0;
    left: 100%;
    top: 38px;
    position: absolute;
    border-top: 23px solid transparent;
    border-left: 15px solid currentColor;
    border-bottom: 23px solid transparent;
}

/* Important: must precede the other classes */
.comment_bubble_slim:hover
{
    filter: brightness(85%);
}

.comment_bubble_slim {
    width: 1060px;
    /*width:90%;*/
    height: 97px;
    background: currentColor;
    position: relative;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    cursor: pointer;
    -webkit-transition: width 0.8s; /* Safari */
    transition: width 0.8s;
    margin-bottom: 10px;
}

.comment_bubble_revision {
    /*width: 1060px;*/
    height: 45px;
    min-width:1060px;
    max-width:1800px;
    margin-left: -110px;
    margin-right:10px;
    background: currentColor;
    position: relative;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    cursor: pointer;
    -webkit-transition: width 0.8s; /* Safari */
    transition: width 0.8s;
    margin-bottom: 10px;
}

.comment_bubble_revision:hover
{
    filter: brightness(85%);
}


/* gridbox styling */
.grid_process {
    width:1060px !important;
    overflow:hidden;
}

.processImage {
    width: 1060px !important;
}


.comment_bubble_slim:before {
    content: "";
    width: 0;
    height: 0;
    left: 100%;
    top: 18px;
    position: absolute;
    border-top: 20px solid transparent;
    border-left: 15px solid currentColor;
    border-bottom: 20px solid transparent;
}
/* remember that border-radius can be set on each corner - i.e.: for a right, small arrow, it could be ok to remove the corner radius*/
.comment_bubble_small {
    cursor: pointer;
    width: 1060px;
    height: 100px;
    position: relative;
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
    border-radius:12px;
    margin-bottom: 10px;
}

/* Processoverview end */

/*#comment_bubble_small:before {
    content: "";
    width: 0;
    height: 0;
    left: 100%;
    top: 8px;
    position: absolute;
    border-top: 19px solid transparent;
    border-left: 16px solid #088cb7;
    border-bottom: 19px solid transparent;
}*/

/* Hentet fra Microsoft sine sider.. http://msdn.microsoft.com/en-us/library/aa480476.aspx  */
.infobar {width:250px; border-style:solid;border-width:1px;border-color:#bbb;background-color:#fcfec5;margin-bottom:10px;margin-left:0px;padding: 5px;} 
.infobar table{border-width:0;}
.infobar th{background-color:#fcfec5;border-width:0;border-collapse:collapse;border-spacing:0;border-style:hidden;padding-top:10px;padding-left:11px;padding-right:11px;padding-bottom:1px;font-weight:bold;}
.infobar td{background-color:#fcfec5;border-width:0;padding-top:1px;padding-bottom:10px;padding-left:11px;padding-right:11px;}
.infobar p{padding-top:13px;}
.infobar img{padding-right:5px;}
.infobar p {margin:0;}


.animateButtonWarning
{
  /*float: right!important;
  width: 130px!important;
  height: 30px!important;*/
  /*font: 'Barlow Semi Condensed', sans-serif!important;*/
  /*text-transform: uppercase!important;*/
  /*letter-spacing: 1px!important;*/
  color:red !important;
  background-color:yellow;
  text-align: center!important;
  font-weight: 500;
  border-style:solid;
  /*background: rgba(30, 144, 255, 0.6)!important; */
  border-radius: 3px !important;
  /*animation: blinkingText 1s infinite!important;*/
}
.hangingBlinkWarning
{
    position: fixed ; top: 10em;
    width: 30em;
   height: 2em;
    left: 1em;
    display:inline-block;
    color:red;
    text-align: left;
    padding-right:30px;
    padding-left:5px;
    padding-top:5px;
    background-color: #FFF77D;
    animation:blinkingText 2.0s infinite;
}

@keyframes blinkingText{
    0%{     color: red;    }
    25%{     color: red;    }
    50%{    color: transparent; }
    75%{     color: red;    }
    100%{   color: red;    }
}

.RemoveBorder {
    -webkit-appearance: none;
    -moz-appearance: none;
    /*appearance: none;*/
    border: 0px;
}

.uploadfilename {
    background-color: #4caf50;
    color: white;
    border: 0px;
    width: auto;
}

.table_revision {
    max-width: 1800px;
    width: 110%;
    margin-left: -110px;
    border-collapse: collapse;
    /*    border-spacing: 20px 20px 20px 20px !important;
    border-collapse: separate !important;
*/
}

.revision_button_deviance {
    font-size: 1.0em;
    border-color: red;
    border-radius: 3px;
}
.revision_button_improvement {
    font-size: 1.0em;
    border-color: cornflowerblue;
    border-radius: 3px;
}
.revision_button_save {
    font-size: 1.0em;
    border-color: darkseagreen;
    border-radius: 3px;
}

.table_revision tbody tr:nth-child(even) {
    background-color: #ececec !important;
}

.table_revision th {
    background-color: white;
}

.table_revision tr {
    border-bottom: solid transparent 12px !important;
}

/*.table_revision tr:last-child { 
    Could not get this to work..
    background-color: white;
}
*/
/*.table_revision tr:nth-child(even) {
    background: #CCC
}

.table_revision tr:nth-child(odd) {
    background: #FFF
}*/

.table_revision th{
    text-align:left;
    font-family:Roboto;
    font-weight:500;
    font-size:16px;
}

.table_revision td {

    text-align: left;
    /*float:left;*/
    vertical-align: top;
    width: auto;
    white-space: normal;
    font-size: 16px;
    /*display:inline-block;*/
}

table.revisionparticipant {
    width: 100%;
    background-color: lightgrey;
    border-collapse: collapse !important;
    border-spacing: 0px !important;
}

table.revisionparticipant input {
    width: 85px;
}

table.revisionparticipant th {
    /*width:  85px;*/
}

table.revisionparticipant td {
    width:85px;
    padding: 2px !important;
    border-width: 1px !important;
    margin: 1px !important;
}

table.revisionparticipant textarea {
    min-width: 500px !important;
}


.table_revisionTdLabel {
    text-align: left;
    /*float:left;*/
    width:275px !important;
    vertical-align:top;
    width:auto;
    white-space:normal;
    /*display:inline-block;*/
}


.revisionSubject {
    font-family:'Roboto';
    font-weight: 500;
    font-size:20px;
    color:black;
    width:100%;
    margin-left:10px;
    padding-top:10px;
    white-space:nowrap;
}

.revisionTextEntry{
    width: 100%;
    min-width:200px;
    overflow-y:scroll;
/*    resize:none;*/
}

.revisionTextEntryDiff {
    max-width: 450px;
    min-width: 350px;
    overflow-y: scroll;
    pointer-events: none;
    /*    resize:none;*/
}

.revisionExpandIcon{
    margin-right:20px;
    margin-top:-5px; 
    float:right;
    height:35px;
    width:35px;
    content:url('../Images/dropdown_arrow-512.png')
}

.fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  overflow: auto;
  background: lime; /* Just to visualize the extent */
  
}

.yesNoWidth
{
    width:100px !important;

}

.isoRevisionLabel
{
    text-align:right !important;
    color:black;
    font-size:12px !important;
}

/*.revisionparticipantnarrow {
    width: 75px !important;
}
*/
/*.mediaIPad_maxwidth {
   width: 880px !important;
}*/
:root {
  --mediaIPad_maxwidth: 1024px !important;
}

@media only screen and (max-width: 1200px) {
    .comment_bubble_slim  {
        width: 880px !important;
    }
    /*.comment_bubble_revision  {
        width: 880px !important;
    }*/
    .grid_process 
    {
        width: 880px !important;
    }
    .processImage 
    {
        width: 880px !important;
    }
    .comment_bubble_slim_special_for_resources
    {
        width: 880px !important;
        height: 230px !important;
    }
    .processOverviewHeadline_special
    {
        width: 900px;
    }
    .comment_bubble {
        width: 280px;
        height: 200px;
    }
    /*.table_revision {
        width: 880px !important;
    }*/
}

@media only screen and (max-width: 1024px) {
    .comment_bubble_slim  {
        width: 700px !important;
        height: 160px !important;
    }
    /*.comment_bubble_revision  {
        width: 1024px !important;
    }*/
    .grid_process  {
        width: 700px !important;
    }
    .processImage {
           width: 700px !important;
    }
    .comment_bubble_slim_special_for_resources {
        width: 700px !important;
        height: 230px !important;
    }
    .comment_bubble {
        width: 340px;
        height: 180px;
    }
    /*.table_revision {
        width: 700px !important;
    }*/
}

@media only screen and (max-width: 856px) {
    .comment_bubble_slim  {
        width: 520px !important;
        height: 160px !important;
    }
    /*.comment_bubble_revision  {
        width: 520px !important;
    }*/
    .grid_process  {
        width: 520px !important;
    }
    .processImage {
        width: 520px !important;
    }
    .comment_bubble_slim_special_for_resources {
        width: 520px !important;
        height: 315px !important;
    }
    .comment_bubble {
        width: 520px;
        height: 180px;
    }
    /*.table_revision {
        width: 520px !important;
    }*/

}

@media only screen and (max-width: 676px) {
    .comment_bubble_slim  {
        width: 340px !important;
        height: 160px !important;
    }
    /*.comment_bubble_revision  {
        width: 340px !important;
    }*/
    .grid_process  {
        width: 340px !important;
    }
    .processImage {
       width: 340px !important;
    }
    .comment_bubble_slim_special_for_resources {
        width: 340px !important;
        height: 485px !important;
    }
    .comment_bubble {
        width: 340px;
        height: 200px;
    }
    /*.table_revision {
        width: 340px !important;
    }*/
}


#RiskAnalysis td, #RiskAnalysis th {
    border: 0px solid #009DE0;
    padding: 8px;
}

#RiskAnalysis tr:nth-child(even) {
    background-color: #f2f2f2;
}

#RiskAnalysis tr:hover {
    background-color: #ddd;
}

#RiskAnalysis th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #009DE0;
    color: white;
}