/* 29.8.2013*/

/*These are used in css.tpl to change customer chosen button colors...*/
:root{
    --success-dim:#317a53;
    --success-dim-hover:#317a53;
    --success-gray:#57635b;
    --success-gray-hover:#57635b;
    --danger-dim:#872626;
    --danger-dim-hover:#872626;
    --danger-gray:#5e5353;
    --danger-gray-hover:#5e5353;

    --secondary_color:#FFFFFF;
    --tetriary_color:#1b5186;
    --header_color:#314a75;
}

* {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
	box-sizing: content-box;
}

body, td, textarea {
	font-size: 13px;
	color: #000;
    height: 100%;
}


/* these allow us to scroll within the body, but will not show anything overflowing the min-widht body */
html {
    overflow-x: auto;
}

body {
    overflow-x: hidden;
}

html:has(body.actionstep), body.actionstep {
    min-width: 300px;
    /*width: 300px;*/
}

html, body{
	font-family: 'Open Sans',verdana, arial, helvetica;
    margin:0;
    padding:0;
    text-align:left;
    height: 100%;
    min-width: 840px;
    background: #f2f2f2;
	background-image: url('../../images/logo_2020_power_background_gray.svg');
	background-position: bottom left;
    background-repeat: no-repeat;
    background-size: 140px 45px;
    background-attachment: fixed;
    background-position-x: 0px;
}

/* Yleinen palikka, jolla keskitetään sisältö tietylle leveydelle */
div.center{
/*	max-width: 1800px;  Tämä määrittää kaikkien leveyden */
	min-width: 840px;
	margin: 0 0px;
	padding: 0 0px;
}

div.header div.center{
	padding: 0;
}

div.menubar div.center{
	padding: 0 20px;
}

div.index_center {
    width:100%;
    text-align:center;

}

i.spy_image {
    float:right;
	cursor: pointer; 
    margin-right:10px;
    display:none;
    color: #999999;
    border: 1px solid #999999;
    border-radius:4px;
    padding:4px;
}
i.spy_image:hover {
    color: #000000;
    border: 1px solid #000000;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}

.writer-buttons{
    width:100%;
    padding: auto;
	margin-top: 20px;
	height: 50px;
}


.float-left{
	float: left;
}

.clear{
	clear: both;
}

div.half{
	float: left;
	width: 48%;
	margin-right: 2%;
	padding-bottom: 15px;
}

.half.right{
	margin-right: 0;
	margin-left: 1.5%;
}

.one-third{
	/*width: 33%;*/
	width: 330px;
	margin-bottom: 15px;
	float: left;
}

.two-thirds{
	/*margin-left: 36%;*/
	margin-left: 370px;
	margin-bottom: 15px;
}

.content .two-thirds div.topic{
	clear: none;
}


/* Yläpalkki ja päävalikko */
.header{
    position: relative;
	width: 100%;
	height: 80px;
	background: #314a75;
	color: #fff;

          -webkit-user-select: none;
            -webkit-app-region: drag;
}
.header a, 
.header a:hover{
	color: #fff;
}

.user-menu{
          -webkit-app-region: no-drag;
	float: right;
	text-align: right;
	margin: 28px 0 0 0;

}

.user-menu #faker {
    display: inline-block;
    padding: 0;
    border: 1px solid #ffffff;
    border-radius: 4px;
    font-size: 14px;
    margin-right: 15px;
    position: relative;
}

.user-menu #faker i {
    font-size: 18px;
    padding: 4px 8px;
}

.user-menu #faker label.free {
    width: auto;
}

.user-menu #faker .options {
    display: block;
    position: absolute;
    top:27px;
    background-color: #f9f9f9;
    width: 350px;
    /*   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
    z-index: 1000;
    margin: 0px;
    padding: 0 10px;
    /*left:-10px;*/
    border: 2px #aaaaaa solid;
    text-align:left;
    border-radius: 5px;
    color: #000;
    right: 0;
    text-align: center;
    max-height: 60vh;
    overflow-y: auto;
    overflow-x: hidden;
}

.user-menu .plugin{
	margin-right: 50px;
}
.user-menu div.dd_opt {
    position: relative;
    display: inline-block;
}

.user-menu div.dd_list {
    position: relative;
    display: inline-block;
}

.user-menu div.dd_list p{
    display: inline-block;
    padding:4px; 
    padding-left:8px; 
    padding-right:8px; 
    border: 1px solid #ffffff;
    border-radius: 4px;
}
.user-menu div.dd_list a{
    color: #000000;
    margin: 5px 0;
    width: 100%;
    display: inline-block;
}

.user-menu div.dd_content {
    display: none;
    position: absolute;
    top:31px;
    background-color: #f9f9f9;
    min-width: 250px;
 /*   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
    z-index: 1000;
    margin: 0px;
    padding: 0 10px;
    /*left:-10px;*/
    border: 2px #aaaaaa solid;
    text-align:left;
    border-radius: 5px;
    -webkit-app-region: none;
}

.user-menu div.dd_list:hover div.dd_content {
    display: block;
}
.user-menu div.dd_list:hover p{
}

.user-menu div.dd_list a:hover{
    color: #000000;
}



.user-menu-plugins {
    float:right;
    text-align:right; 
    margin: 30px 24px 0 0;
}

.user-menu .switchx{
        background-color: #AAAAAA;
        padding: 10px;
	margin-right: 50px;
}
.user-menu .switchx:hover {
        background-color: #666666;
}

.user-menu .username{
	margin-right: 50px;
    font-size:14px;

}

.user-menu .help{
	margin-right: 30px;
}

.user-menu .help a{
	padding: 0 0 0 0px;
        font-size:14px;
}

.user-menu img {
    height:16px;
}
.user-menu .mail{
	margin-right: 30px;
}
.user-menu .settings{
	margin-right: 30px;
}

.user-menu .settings a{
	padding: 0 0 0 0px;
        font-size:14px;
}

.user-menu .logout {
    padding-right: 20px;
}

.user-menu .logout a{
	padding: 0 0 0 0px;
        font-size:14px;
}

.el_exit {
    width:26px;
    height:26px;
    text-align:center;
    padding:8px;
    padding-left:10px;
    padding-right:10px;
    font-size:16px;
    display:none;
    transition: all 0.3s ease;
}

.el_exit:hover {
    background-color:#FF0000;
}
.el_exit:active {
    transition: all 0.0s ease;
    background: #D80000;
}
.el_min {
    width:26px;
    height:26px;
    text-align:center;
    padding:8px;
    padding-left:8px;
    padding-right:8px;
    font-size:16px;
    display:none;
    transition: all 0.3s ease;
}


.el_min:hover {
    background-color:#FFFFFF55;
}
.el_min:active {
    transition: all 0.0s ease;
    background-color:#FFFFFF40;
}

.el_max {
    width:26px;
    height:26px;
    text-align:center;
    padding:8px;
    padding-left:8px;
    padding-right:8px;
    font-size:16px;
    display:none;
    transition: all 0.3s ease;
}


.el_max:hover {
    background-color:#FFFFFF55;
}
.el_max:active {
    transition: all 0.0s ease;
    background-color:#FFFFFF40;
}



i.el_player_buttons-option {
    border: 1px solid #aaaaaa; 
    border-radius: 4px;
    width:12px;
    height:12px;
    text-align:center;
    vertical-align:middle;
    padding:4px;
    margin-left:5px;
    margin-right:5px;
    font-size:12px;
    transition: all 0.3s ease;
    background-color:#ffffff;
    color: #000000;
}
i.el_player_buttons-option:hover {
    background-color:#cccccc;
}

i.el_player_buttons-off {
    border: 1px solid #aaaaaa; 
    border-radius: 4px;
    width:26px;
    height:26px;
    text-align:center;
    vertical-align:middle;
    padding:4px;
    padding-left:8px;
    padding-right:8px;
    margin-left:5px;
    margin-right:5px;
    font-size:26px;
    transition: all 0.3s ease;
    background-color:#ffffff;
    color: #000000;
}




i.el_player_buttons-off:hover {
    background-color:#cccccc;
}

i.el_player_buttons-on {
    border: 1px solid #aaaaaa; 
    border-radius: 5px;
    width:26px;
    height:26px;
    text-align:center;
    vertical-align:middle;
    padding:4px;
    padding-left:8px;
    padding-right:8px;
    margin-left:5px;
    margin-right:5px;
    font-size:26px;
    transition: all 0.3s ease;
    color:#ffffff;
    background-color: #666666;
}


i.el_player_buttons-on:hover {
    background-color: #000000;
}

.electronplayer {
    width: 370px;
    border:1px solid #314a75;
    border-radius: 5px;
    background-color: #ffffff;
    padding:20px;
    padding-left:10px;
    padding-right:10px;
}

.loader_excuse {
    position: relative;
    margin-top:10px;

}

.loader_meter {
    height: 10px;  /* Can be anything */
    position: relative;
    margin-top:10px;
    background: #555;
    border-radius: 25px;
    padding: 2px;
    box-shadow: inset 0 -1px 1px rgba(255,255,255,0.3);
}

.loader_meter > span {
    display: block;
    height: 100%;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    background-color: rgb(101,150,241);
    background-image: linear-gradient(
        center bottom,
        rgb(43,103,194) 37%,
        rgb(84,149,240) 69%
        );
    box-shadow: 
    inset 0 2px 9px  rgba(255,255,255,0.3),
    inset 0 -2px 6px rgba(0,0,0,0.4);
    position: relative;
    overflow: hidden;
}


.loader_meter > span:after {
    content: "";
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
    background-image: linear-gradient(
        -45deg, 
        rgba(255, 255, 255, .2) 25%, 
        transparent 25%, 
        transparent 50%, 
        rgba(255, 255, 255, .2) 50%, 
        rgba(255, 255, 255, .2) 75%, 
        transparent 75%, 
        transparent
        );
    z-index: 1;
    background-size: 50px 50px;
    animation: move 2s linear infinite;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    overflow: hidden;
}


@keyframes move {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 50px 50px;
    }
}

.meter > span:after, .animate > span > span {
      animation: move 2s linear infinite;
}


.slidecontainer {
    width: 100%;
    margin-top:10px;

}

.slider {
    -webkit-appearance: none;  /* Override default CSS styles */
    appearance: none;
    width: 100%; /* Full-width */
    height: 15px; /* Specified height */
    border-radius: 5px;
    background: #d3d3d3; /* Grey background */
    outline: none; /* Remove outline */
    opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
    -webkit-transition: .2s; /* 0.2 seconds transition on hover */
    transition: opacity .2s;
}

/* Mouse-over effects */
.slider:hover {
    opacity: 1; /* Fully shown on mouse-over */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
.slider::-webkit-slider-thumb {
    -webkit-appearance: none; /* Override default look */
    appearance: none;
    width: 25px; /* Set a specific slider handle width */
    height: 25px; /* Slider handle height */
    border-radius: 50%;
    background: #4CAF50; /* Green background */
    cursor: pointer; /* Cursor on hover */
}

div.electron_numbers {
    width: 100%;
    text-align:middle;
}


div.electron_numbers div.electron_pos {
    display:inline-block;
}

div.electron_numbers div.electron_max {
    display:inline-block;
}


div.logo_container{
    display: inline-block;
    height:80px;
    margin-right:20px;
    line-height: 80px;
    vertical-align:middle;
    justify-content: center;
    align-items: center;
}

div.logo_container a{
    height:80px;
    line-height: 80px;
    display: block;
}

div.logo_container .main{
    border: 0;
    display:inline-block;
    margin-left:20px;
    object-fit: contain;
    max-height:70px;
}

div.logo_container .power{
    vertical-align:middle;
    border: 0;
    height:25px;
    margin-top:40px;
}

p.logo_instance {
    position:absolute;
    bottom:5px;
    left:270px;
}

p.broker_down {
    font-size:20px;
    color:red;
    padding-right: 20px;
    display: inline-block;
    position: relative;
    text-align: left;
}

p.broker_down:hover:after {
    content: attr(title);
    font-size: 15px;
    display: block;
    position: absolute;
    left: -125px;
    width: 250px;
    z-index: 1200;
    background: #314a75;
    color: white;
    border: 1px solid #ffffff;
    border-radius: 4px;
    font-family: 'Open Sans', verdana, arial, helvetica;
    margin: 15px auto 0 auto;
    padding: 5px;
    word-break: break-word;
}

p.broker_down.hidden {
    display: none;
}

.menubar{
	float: left;
	position: relative;
	width: 100%;
    background: #ffffff;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);
    z-index:4;

}

ul.main-menu{
	float: left;
	margin: 0;
	padding: 0;
	list-style: none;
    height:55px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    
    /*
	border-right: 1px solid #14385d;
	border-left: 1px solid #235c93;
    */
}

.main-menu li{
	display: inline;
	float: left;
    border-bottom:3px #ffffff solid;
}

 .main-menu li a{
 	float: left;
	color: #000000;
	font-size: 16px;
	text-transform: capitalize;
	letter-spacing: 0.5px;
	padding: 16px 12px 12px 12px;
	background-position: 12px center;
	background-repeat: no-repeat;
    height:24px;
    line-height:24px;
     text-decoration: none;


    /*
	text-shadow: 0 -1px 1px #14385d;
	border-right: 1px solid #235c93;
	border-left: 1px solid #14385d;
    */
}

 .main-menu li.selected{
 	/*abackground: #2a7ac8; /* Old browsers */

    font-weight: bold;
    border-bottom:3px #2a7ac8 solid;
    
 }
.main-menu li.not-selected{
    font-weight: normal;
    border-bottom:3px solid var(--secondary_color);
}

 .main-menu li:hover{
    border-bottom:3px #2a7ac8 solid;
    
 }

.main-menu a img {
    height:16px;
}

.main-menu-more {
    display: inline-block;
    position: absolute;
}
.main-menu-more a{
    display: block;
}
.main-menu-more ul {
    position: absolute;
    display: none;
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.5);
    padding-left:0px;
    margin-left:0px;
    top: 100%;
    right: 0;
    background: #FFFFFF;
    margin-right: 0;
}
.main-menu-more li {
    width: 100%;
}
/*
.main-menu .home a{background-image: url('../../images/icons/main-menu/home.png');}
.main-menu .reports a{background-image: url('../../images/icons/main-menu/reports.png');}
.main-menu .groups a{background-image: url('../../images/icons/main-menu/groups.png');}
.main-menu .users a{background-image: url('../../images/icons/main-menu/users.png');}
.main-menu .dictations a{background-image: url('../../images/icons/main-menu/dictations.png');}
.main-menu .bills a{background-image: url('../../images/icons/main-menu/bills.png');}
.main-menu .help a{background-image: url('../../images/icons/main-menu/help.png');}
.main-menu .link a{background-image: url('../../images/icons/main-menu/link.png');}
.main-menu .upload a{background-image: url('../../images/icons/main-menu/up.png');}
.main-menu .diktarec a{background-image: url('../../images/icons/main-menu/diktarec.png'); background-size: 22px 19px;}
.main-menu .mic a{background-image: url('../../images/icons/generic/mic_white.svg'); background-size: 22px 19px;}
.main-menu .automatic_send a{background-image: url('../../images/icons/main-menu/forward.png');}
.main-menu .oversee a{
	background-image: url('../../images/icons/main-menu/report_card.png');
	background-position: 12px 8px;
}
*/



/* Main content */
div.content {
	position: relative;
	clear: left;
   	padding: 20px 0 10px 0;
    min-height: calc(100% - 30px);
   /* transition: all 0.1s ease;*/
}


.has-left-menu .right-column{
        margin-left:270px;

        background: #ffffff;

        box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.102);

        padding: 20px;

        border-radius: 4px;
        margin-right: 20px;
        padding-top: 20px;
        padding-bottom: 20px;
        overflow:auto;
        z-index: 3;
        position: relative;
}

a{
   	color: #1f76c8;
}

a:hover{
	color: #144676;
}

div.left-column-dictation{
	width: 390px;
	position: relative;
    margin: 27px 30px 0 20px;
    float:left;
}

div.remove-left-padding{
	left: 0px;
    padding-left:0px;

}
div.add-left-padding{
	left: 200px;
    padding-left:20px;

}

div.right-column-dictation{
    display: inline-block;
	float: left;
	list-style: none;
	margin: 0 0 0 20px;
	padding: 0;
}

/* Left column navigation */
.has-left-menu .left-column{
	width: 230px;
	position: absolute;
	left: 0;
    padding-left:20px;
    height: calc(100% - 30px);
}

.has-left-menu.mini .left-column {
    width: 40px;
    padding-right: 20px;
}

.has-left-menu.mini .left-column ~ .right-column {
    margin-left: 80px;
}

.has-left-menu.mini .left-column:hover ~ .right-column,
.has-left-menu.mini .left-column:focus-within ~ .right-column {
    margin-left: 270px;
}

.has-left-menu.mini .left-column:hover,
.has-left-menu.mini .left-column:focus-within {
    width: 230px;
}

.left-menu{
	float: left;
	list-style: none;
	margin: 0 0 10px 0;
	width: 100%;
    padding: 0px;
    overflow-x: hidden;
    z-index: 2;
    position: relative;

    /*
    -webkit-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    -moz-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);

*/
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.102);


    border-radius: 4px;
    background: #ffffff;


}

.left-menu >li{
    padding:2px 7px;
	float: left;
	display: block;
	width: 216px;
    transition: .3s all;
}

.left-menu li.selected{
    background-color: rgba(242,242,242,0.5);
    border-right: 3px solid #3C3C3C;
	width: calc(100% - 17px);
}

.left-menu li i.menu-level1 {
    margin-right:.75em;
    font-size:18px;
    width:1em;
    text-align: center;
}

.left-menu li:hover:not(.selected, .sub-title){
    background-color: rgba(242,242,242,0.4);
    font-weight: 600;
}

.left-menu ul.sublevel3 li:hover:not(.selected, .sub-title){
    width: 197px;
    left: -7px;
    padding-left: 30px;
    position: relative;
    padding-right: 3px;
}

.left-menu ul.sublevel4 li:hover:not(.selected, .sub-title){
    width: 172px;
    left: -31px;
    padding-left: 55px;
    position: relative;
    padding-right: 0px;
}

.left-column span.mini-toggle {
    background: #fff;
    display: block;
    width: 1em;
    height: 1em;
    line-height: 1em;
    text-align: center;
    padding: 1em;
    position: absolute;
    right: -30px;
    top: 3em;
    z-index: 1;
    cursor: pointer;
}

.has-left-menu.mini .left-column span.mini-toggle {
    right: -10px
}

.left-column span.mini-toggle i {
    transition: .3s all;
}

.has-left-menu.mini .left-column span.mini-toggle i {
    transform: rotate(180deg);
}

.left-menu span.details{
    font-size:10px;
    font-weight: normal;
    color: #3c3c3c;
}

.left-menu a, .left-menu span.parent{
	font-size: 14px;
	float: left;
	display: block;
	padding: 3px 4px 3px 4px;
	margin: 5px 0 5px 0;
	text-transform: capitalize;
	text-decoration: none;
	width: 216px;
    color: #3C3C3C;
}

.left-menu a img{
    height: 18px;
}

.left-menu span.group_list_header {
    font-size:14px;
    margin-left:4px;
    white-space: nowrap;
    display:inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    width:170px;
    position:absolute;
    z-index: 0;
}

.left-menu span.group_list_subitem {
    font-size:10px;
    font-weight: normal;
    margin-left:28px;
    color: #464646;
    margin-bottom:0;
    float: left;
    line-height: 2;
    width:calc(100% - 28px);
}
.left-menu span.group_list_subitem_date {
    font-size:10px;
    font-weight: bold;
    margin-left:60px;
    color: #464646;
    margin-bottom:4px;
    line-height: 2;
}

ul.tabs span.hilight{
    margin:6px;
    border-radius: 4px;
    font-size:12px;
    line-height:12px;
    padding:0px;
    padding-left:5px;
    padding-right:5px;
    font-weight:bold;
    background: #314a75;
    color:#ffffff;

}

ul.tabs span.hilight-zero{
    margin:6px;
    border-radius: 4px;
    font-size:12px;
    line-height:12px;
    padding:0px;
    padding-left:5px;
    padding-right:5px;
    font-weight:bold;
    background: #999999;
    color:#ffffff;

}

.left-menu span.hilight{
    margin:6px;
    margin-left:0px;
    border-radius: 4px;
    font-size:12px;
    padding:0px;
    padding-left:5px;
    padding-right:5px;
    font-weight:bold;
}

.left-menu span.hilight.red{
    background: #F05163;
    color:#ffffff;
}

.menubar ul.main-menu li span.hilight{
    margin:0;
    border-radius: 4px;
    font-size:12px;
    padding: 0 5px;
    font-weight:bold;
    color:#ffffff;
    background-color:#F05163;
    float: none;
}

.menubar ul.main-menu li span.hilight.warning, span.hilight.warning {
    background-color: orange;
    margin:0;
    border-radius: 4px;
    font-size:12px;
    padding: 0 5px;
    font-weight:bold;
    color:#ffffff;
    float: none;
}

.no-icons a{
	padding: 5px 4px 5px 12px;
	margin: 5px 0;
}

.no-caps a{
	text-transform: none;
}

.left-menu a:hover{
	text-decoration: none;
	color: #164270;
  /*  font-weight:bold;*/
}


ul.sublevel3 li.selected {
    background-color: rgba(242,242,242,0.5);
    border-right: 3px solid #3C3C3C;
    width: 197px;
    left: -7px;
    padding-left: 30px;
    position: relative;
}

ul.sublevel4 li.selected {
    background-color: rgba(242,242,242,0.5);
    border-right: 3px solid #3C3C3C;
    width: 172px;
    left: -31px;
    padding-left: 55px;
    position: relative;
}




.left-menu .selected a,
.left-menu li ul.sublevel3 li.selected a,
.left-menu li ul.sublevel3 li ul.sublevel4 li.selected a{
	font-weight: bold;
	color: #103051;
}

.left-menu li ul.sublevel3 li a,
.left-menu li ul.sublevel3 li ul.sublevel4 li a 
{
    width: 197px;
	font-weight: normal;
    overflow:hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    
}

.left-menu .summary a{background: transparent url('../../images/icons/left-menu/home.png') no-repeat left top 8px;}
.left-menu .dictations a{background: transparent url('../../images/icons/left-menu/dictation.png') no-repeat left top 8px;}
.left-menu .transcriptions a{background: transparent url('../../images/icons/left-menu/transcription.png') no-repeat left top 8px;}
.left-menu .workmonitoring a{background: transparent url('../../images/icons/left-menu/gauge.png') no-repeat left top 8px;}
.left-menu .liverollers a{background: transparent url('../../images/icons/left-menu/live.png') no-repeat left top 8px;}
.left-menu .search a{background: transparent url('../../images/icons/left-menu/search.png') no-repeat left top 8px;}
.left-menu .user a{background: transparent url('../../images/icons/left-menu/user.png') no-repeat left top 8px;}
.left-menu .group a{background: transparent url('../../images/icons/left-menu/group.png') no-repeat left top 8px;}
.left-menu .roof_group a{background: transparent url('../../images/icons/left-menu/roof_group.png') no-repeat left top 8px;}
.left-menu .home a{background: transparent url('../../images/icons/left-menu/home.png') no-repeat left top 8px;}
.left-menu .bills a{background: transparent url('../../images/icons/left-menu/briefcase.png') no-repeat left top 8px;}
.left-menu .storer a{background: transparent url('../../images/icons/left-menu/archive.png') no-repeat left top 8px;}
.left-menu .deactive a{background: transparent url('../../images/icons/left-menu/x.png') no-repeat left 8px;}
.left-menu .settings a{background: transparent url('../../images/icons/left-menu/settings.png') no-repeat left top 8px;}
.left-menu .phone a{background: transparent url('../../images/icons/left-menu/phone.png') no-repeat left top 8px;}
.left-menu .archive a{background: transparent url('../../images/icons/left-menu/archive.png') no-repeat left top 8px;}
.left-menu .status a{background: transparent url('../../images/icons/left-menu/eye.png') no-repeat left top 8px;}
.left-menu .line a{background: transparent url('../../images/icons/left-menu/line.png') no-repeat left top 8px;}
.left-menu .bubbles a{background: transparent url('../../images/icons/left-menu/bubbles.png') no-repeat left top 8px;}


.no-icons .selected a{background: transparent url('../../images/icons/left-menu/arrow.png') no-repeat left top 8px;}

.left-column h2,
.left-column h3{
	margin: 0;
    color:#144676;
	font-weight: 400;
	font-size: 19px;
	padding: 0 0 10px 0;
	text-transform: uppercase;
	border-bottom: 1px solid #ddd;
}

span.left-menu-count{
	color: #999;
	padding-left: 5px;
	font-size: 12px;
}


/* Left submenu */

.left-menu li ul{
	list-style: none;
	margin: 0 0 10px 0;
	padding: 0;
	clear: left;
}

.left-menu li ul li{
	margin: 0;
	padding: 0 0 0 24px;
	display: block;
}

.left-menu li ul a{
	font-size: 13px;
	padding: 3px 0;
	display: block;
	float: none;
	text-transform: none;
	background: transparent !important;
}

.left-menu .selected ul a{
	font-weight: normal;
	color: #103051;
}




/* This fills the rest of the space */
.right-column{
        padding-right:20px;
        padding-left:20px;
        min-height: 450px;
        height: 90%;

        background: #ffffff;
        
        /*
        -webkit-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
        -moz-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
        box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
        */
        box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.102);

        padding: 20px;

        border-radius: 4px;
        margin-right: 20px;
        margin-left: 20px;
        padding-top: 20px;
        padding-bottom: 20px;
        transition: all 0.1s ease;
        position: relative;
        overflow: auto;
}

.right-column#wide {
    overflow:inherit;
}


/* Pyöristykset */
/*
div.center{
	padding: 0 30px;
}

.right-column{
	background: #fff;
	border-radius: 8px;
	border: 1px solid #e0e0e0;
	margin-top: 10px;
	float: left;
	width: 100%;
}

.left-column{
	background: #fff;
	border-radius: 8px;
	border: 1px solid #e0e0e0;
	padding: 20px 20px 10px 20px;
	margin-top: 10px;
}

.has-left-menu{
	background: transparent;
	min-height: auto; 
}

*/


/* Priorities */

.priority-normal{
	color: #693;
}

.priority-urgent{
  color: #b94a48;
}

.priority-very-urgent{
 	color: #b94a48;
   font-weight: bold;
}

/* Tags */

div.tags{
	float: left;
	width: 100%;
	margin: 10px 0 0 0;
}

.tag{
	float: left;
	color: #fff;
	margin: 0 12px 10px 0;
	font-size: 14px
}

.tag .tag-content{
	float: left;
	white-space: nowrap;
	height: 18px;
	line-height: 18px;
	background: #369;
	padding: 4px 8px;
	padding-right: 5px;
	-webkit-border-top-left-radius: 6px;
	-webkit-border-bottom-left-radius: 6px;
	-moz-border-radius-topleft: 6px;
	-moz-border-radius-bottomleft: 6px;
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
}

.tag .tag-close{
	background: #369 url('../../images/icons/close.png') no-repeat center center;
	float: left;
	width: 12px;
	height: 18px;
	padding: 4px 4px 4px 8px;
	line-height: 16px;
	-webkit-border-top-right-radius: 6px;
	-webkit-border-bottom-right-radius: 6px;
	-moz-border-radius-topright: 6px;
	-moz-border-radius-bottomright: 6px;
	border-top-right-radius: 6px;
	border-bottom-right-radius: 6px;
	cursor: pointer;
}

.tag .tag-close:hover{
	background-color: #da4f49;
}

.tag-transcriber .tag-content, 
.tag-transcriber .tag-close{
	background-color: #333;
}

/* Alert/Notification messages */

.alert {
  padding: 12px 35px 12px 20px;
  font-size: 15px;
  margin-bottom: 20px;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  background-color: #fcf8e3;
  border: 1px solid #fbeed5;
  color: #8e703d;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

.alert a{
	font-weight: 600;
}

.alert h2{
	margin: 10px 0;
}

.alert .close {
  position: relative;
  top: -2px;
  right: -21px;
  line-height: 20px;
}

.alert-success {
  color: #367637;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}

.content .alert-success a{
  color: #367637;
}

.alert-danger,
.alert-error {
  color: #b94a48;
  background-color: #f2dede;
  border-color: #eed3d7;
}

.alert-danger a,
.alert-error a{
  color: #b94a48 !important;
}

.alert-info, 
.alert-help{
  color: #327495;
  background-color: #d9edf7;
  border-color: #bcdef1;
}

.alert-help{
	background-image: url('../../images/alerts/question-mark-blue.png');
	background-position: 20px center;
	background-position: 98% 25px;
	background-repeat: no-repeat;

}
.alert ul{
	padding: 0 30px 0 10px;
	list-style: none;
}

.alert ul li{
	line-height: 1.2;
	margin: 0 0 0.5em 0;
	background: url('../../images/alerts/dot.gif') left 4px no-repeat;
	padding: 0 0 0 16px;
}


textarea{
	border:1px solid black;	
}

a.valinta {
	text-align: right;
	color: #000; 
	text-decoration: underline; 
	
}

a.valinta:hover {
	text-align: right;
	color: #555; 
	text-decoration: underline; 
	
}

div.editable{
    display:inline-block;
    padding:0px;
    margin:0px;
    margin-right:20px;
    margin-bottom:1px;
    overflow:hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
    height:18px;
    border: 0px solid #999;

}

div.editable:hover {
    border-bottom: 1px solid #999;
    margin: 0px;
    margin-right:20px;
    background: url('../../images/pencil.png') right 4px no-repeat;
}

span.column_order_span {
    padding:2px;
    min-width: 130px;
    display:inline-block;
    border: 1px solid #999;
    border-radius: 3px;
    background-color: #FFFFFF;
}
span.column_order_span:hover {
    cursor: pointer;
}


input[type=text].editable{
    margin:0px;
    display:inline-block;
    padding:0px;
    border-bottom: 1px solid #000;
    margin-right:-4000px;
    width: auto;
    height:18px;
    white-space: nowrap;
    text-overflow: ellipsis;
    outline: none;
}


table#list_target input[type=text].editable {
    width: 100%;
    margin-right: 20px;
}


div.drop_list_div{
    padding: 0px;
    margin:0px;
}
div.drop_list_div ul{
    margin-left: 0px;
    padding-left: 7px;
}

div.drop_list_div ul li{
    list-style-type: none;
    list-style-position: inside;
    list-style-image: url("../../img/bullet.png");
    padding:1px;

}

div.drop_list_div ul li:hover {
    border: solid 1px #999;
    padding:0px;
}

span.up{
	cursor: pointer; 
	cursor: hand;
	display: inline;
    overflow:hidden;
	width: 16px;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	margin-left:3px;
	color: #ffffff;
	background:url(../../images/icons/generic/black/chevrons-up.svg) no-repeat;
	background-position: center;
}

span.down{
	cursor: pointer; 
    overflow:hidden;
	cursor: hand;
	display: inline;
	width: 16px;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	margin-left:3px;
	color: #ffffff;
	background:url(../../images/icons/generic/black/chevrons-down.svg) no-repeat;
	background-position: center;
}

span.wait{
	cursor: pointer; 
	cursor: hand;
	display:inline-block;
    overflow:hidden;
	width: 16px;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	margin-left:3px;
	color: #ffffff;
	background:url(../../img/wait.gif) no-repeat;
}

div.close_delete{
	cursor: pointer; 
	cursor: hand;
	display:inline;
    overflow:hidden;
    line-height:20px;
	width: 16px;
	height: 20px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	margin-left:4px; 
	color: #ffffff;
    background-repeat:no-repeat;
	background-image: url(../../img/close2.gif);
    background-position: 0px -1px; 
}

div.close_delete:hover {
	background-image:url(../../img/close.gif);
}



div.org_none{
	clear:none;
	padding:0px;
	margin:0px;
	padding-right:20px;
	border:0px;
	
	min-height:16px;
	background:url(../../img/none5.gif) no-repeat;
	background-position: center right;
}
div.org_none:hover{
	text-decoration: underline;
}


div.org_desc{
	padding:0px;
	margin:0px;
	padding-right:20px;
	border:0px;
	text-decoration: underline;
	height:16px;
	background: url(../../img/desc5.gif) no-repeat;
	background-position: center right;
}

div.org_asc{
	clear:none;
	padding:0px;
	margin:0px;
	padding-right:20px;
	border:0px;
	height:16px;
	text-decoration: underline;	
	background:url(../../img/asc5.gif) no-repeat;
	background-position: center right;
}



tr.odd td input.down, tr.odd td input.up{
        text-align: left;
        color:#FFE9BD;
}

td.wrap {
    overflow: hidden;
    max-width: 180px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

div.droppable {
    background:url(../../img/asc5.gif) no-repeat right center;
    padding-right:20px;
}

select {
	border:1px outset black;
 	min-width: 100px;
    padding-right:20px;
        height: 28px;
}

select.chosen {
/*	width: 400px; */
}


fieldset {
	background: #fff;
	padding: 0px 15px 15px 15px;
	margin-bottom: 25px;
}

legend {
	font-size: 14pt;
	color: #ecb700;
	margin-bottom: 15px;     
}

label {
	display: block;
	float: left;
	width: 120px;
	padding-right: 2px;
}

label.free {
    float: inherit;
    width: auto;
}

input[type=text], input[type=password] {
	border: 1px #999 solid;
	padding: 2px;
	width: 200px;
    outline: none;
}

input#email,input#password {
	width: 200px;
}

input#start_date, input#stop_date {
	width: 80px;
	padding: 4px;
}

input[type=text]#search{
	font-size: 15px;
	border-radius: 3px;
	padding: 4px;
	float: left;
	margin-right: 5px;
}

textarea {
	width: 640px;
	height: 280px;
    outline: none;
}

input#email,input#password,
textarea{
	border: 1px #555 solid;
	padding: 2px;
	border-radius: 2px;
}

div.kirjoitus{
	visibility:hidden;
	position: absolute;
	top: 0px;
	left: 0px;
}

div.valikko {
	width: 120px;
	margin: 0px;
        height:100%;
	border-right: solid 1px #333;
        padding: 0px;
        background-color: #999;
}

div.valikko div.option{
	margin-left: 10px;
	margin-right: 10px;
	min-width: 30px;
	display: inline;
	color: #000; 
	text-decoration: none; 
	cursor: pointer; 
	cursor: hand;
	padding: 4px;
	border-top: 1px solid #000;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	margin: 2px;	
}

div.valikko div.option:hover {
	margin-left: 10px;
	margin-right: 10px;
	color: #555; 
	text-decoration: underline; 
	cursor: pointer; 
	cursor: hand;
	padding: 4px;
	border-top: 1px solid #000;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	margin: 2px;	
}


div.public_content {
        padding:0px;
        text-align:center;
 	width: 1000px;
 	height: 400px;
        overflow:auto;
}

td.form_left_column{
    text-align:right;
    width:200px;
    padding-right:20px;
    border-right: 1px solid #ddd;    
}

td.form_right_column{
    text-align:left;
    width:400px;
    padding-left:20px;
    margin-left:20px;
}

.list{
	float: left;
	width: 100%;
}


div.content div.list {
   text-align: none;
   text-align: left;
   margin-bottom: 5px;
   padding-top: 0px; 
}

div.content div.text {
   text-align: left;
   width: 100%;
   padding-top: 0px; 
   margin-bottom:0px;
}

div.public_content div.list {
   text-align: middle;
   /*width: 600px;*/
   margin: 0px auto;
   padding-top: 5px; 
}

div.public_content div.text {
   text-align: left;
   width: 700px;
   padding-top: 40px; 
   margin:0 auto;
}
div.public_content div.text_narrow {
   width: 400px;
   padding-top: 40px; 
   margin:0 auto;
}

div.topic {
	clear: left;
	text-align: left;
 	height:38px;
	color:#666;
    position:relative;
	border-bottom: 1px solid #ddd;
    margin-bottom: 20px;
    overflow:hidden;
}

div.topic b{
	display: inline;
	float: left;
    color:#144676;
    margin-left:0px;
    margin-right: 20px;
    font-size: 24px;
    font-weight: 400;
    text-transform: uppercase;
}

.topic b a{
    text-decoration: none;
}

.topic b a:hover{
	text-decoration: underline;
}

.topic a.admin{
    text-decoration: none;
    font-size: 24px;
    margin-right:10px;
}

.topic a.admin:hover{
	text-decoration: underline;
}

div.content div.sub-topic{
	clear: left;
	padding-top: 20px;
}

div.content div.sub-topic .action_div{
	padding: 0;
}

div.content div.sub-topic .action_div input{
	height: 24px;
	border-radius: 3px;
	font-size: 12px;
}

div.content div.sub-topic .action_div input.button{
	padding: 0 6px;
}

div.content div.sub-topic b{
	font-size: 20px;
}

div.content div.topic .path{
    display: inline;
    margin:0px;
    margin-left:10px;
    color:#000;
    font-weight:bold;
    font-size: 12pt;
}

div.content div.topic .path a{
    color:#EE8B2D;
    font-weight:normal;
    text-decoration:none;
        padding-bottom: 4px;
}

div.content div.topic .path a:hover {
    color:#888;
    border-bottom: 3px solid #ee8b2d;
}

div.content div.topic a.not_selected:hover {
	color:#666; 
	border-bottom: 3px solid #ee8b2d;

}

div.content div.topic a.not_selected{
	color: #999;
	padding-left: 5px;
	padding-right: 5px;
	font-size: 10pt;
	text-decoration: none;
        padding-bottom: 2px;
        position:relative;
        top: 8px;
}

div.content div.topic a.selected{
	
	border-bottom: 3px solid #ee8b2d;
	padding-left: 5px;
	padding-right: 5px;
	text-decoration: none;
	font-size: 10pt;
	padding-bottom:2px;
	color: #000;
    position:relative;
    top: 8px;
}


h2.subheading{
	font-size: 18px;
	font-weight: 700;
	margin: 10px 0;
	text-transform: uppercase;
	color: #144676;
}

h2.float-left{
	margin: 0;
}

table.reg {
	width: 600px;
}

a.forgot
{
	font-size: 12px;
	color: #999; 
	text-decoration: underline; 
}
a.forgot:visited
{
	color: #999; 
	text-decoration: underline; 
}
a.forgot:hover
{
	color: #333; 
	text-decoration: underline; 
}

a.reg_link
{
	font-size: 14px;
	color: #000; 
	text-decoration: underline; 
}

a.reg_link:hover
{
	color: #333; 
	text-decoration: underline; 

}


div.loc_link {
    text-align: center;
    clear:both;
    width:100%;
    background: #fff;
    border: solid 0px #aaa; 
    color: #333;
    bottom: 50px;
    margin-bottom: 0px;
    position: absolute;
}

div.loc_link img
{
  border-style: none;
	margin-left: 20px;
	margin-right:20px;

}


div.loc_link img:hover
{
}


div.foot_link
{
    background-color: #343434;
    height: 30px;
    color: gray;
    width: 100%;
}

div.foot_link div {
    margin: 0 auto 0 auto;
    text-align: center;
    width: 790px;
}


div.foot_float
{
    float:left;
    clear:both;
}
div.foot_abso
{
	bottom:0px;
	position:absolute;
    /* z-index:99;*/
}

div.foot_fixed{
	bottom:0px;
	position:fixed;
}

div.foot_link a:link
{
	margin-left: 20px;
	margin-right:20px;
	color: #000; 
	text-decoration: underline; 
}

div.foot_link a:visited
{
	margin-left: 20px;
	margin-right:20px;
	color: #000; 
	text-decoration: underline; 
}

div.foot_link a:hover
{
	margin-left: 20px;
	margin-right:20px;
	color: #555; 
	text-decoration: underline; 
}


div.login_box {
  margin-left: auto ;
  margin-right: auto ;
  width: 359px;
}

div.login_body {
  padding-top: 20px;
  background:#ccc;
  height: 125px;
}
div.login_image {
  margin-bottom: 4px;
}


table.login_table{
margin-left:10px;
margin-right:10px;
  background:#ccc;
  width:335px;
}


table.login_table td{
  font-weight:bold;
      background:#ccc;
}
.login_header {
  height: 30px;
 }

div.box_set {
    width: 400px;
	margin-bottom: 5px;
}

div.box_actions {
	width: 200px;
}


table.characters{
	width: 100%;
}

.characters td.when{
	width: 50%;
}

.characters td.count{
	font-size: 20px;
}


#target_div{
	padding: 0px 0 0 0; /* Firefox fix */
}

table#list_target{
	clear: left;
}

table.queue {
	width: 100%;
    margin-top:20px;
    clear:both;
 /*   box-shadow: 3px 3px 10px 0px rgba(0,0,0,0.1);
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1); */
}

table.dataTable{
	margin-bottom: 60px; /* clearly show end of page */
}

#table_wrap_div {
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    /* min-height:200px;*/
    overflow-x: auto;
}

table.form{
	width: 700px;
	margin: 15px 0 0 0;
    box-shadow: 3px 3px 10px 0px rgba(0,0,0,0.1);
}

table.form tr.odd td,
table.form tr.even td{
	border-left: 0;
	border-right: 0;
}

/* Small form without borders, used for forms with less than 4 fields */
table.mini-form{
	margin: 0 0 7px 0;
	width: 100%;
}
table.mini-form td{
	padding: 7px 0;
	border-bottom: 1px solid #dcdcdc;
	font-size: 13px;
}

table.mini-form.wide input{
	width: 100%;
	padding: 3px;
	border: 1px solid #ccc;
	border-radius: 2px;
	font-size: 13px;
}

table.mini-form td:first-child{
	font-weight: bold;
	padding-right: 15px;
}

table.search_form{
	margin: 0 0 20px 0;
}

table.search_form td{
	padding: 8px;
	border-bottom: 1px solid #e9e9e9;
	vertical-align: top;
}

table.search_form td:first-child{
	font-weight: bold;
	font-size: 14px;
}

table.search_form .action_div{
	padding: 0;
}

ul.checkbox_list{
	list-style: none;
	margin: 0; padding: 0;
}

p.shortcuts a{
	font-size: 12px;
	margin-right: 5px;
}


/* Place export links */
.table_header{
	position: relative;
}

.convert_link {
    padding-right:10px;
}

#list_target_wrapper{
	float: left;
	width: 100%;
	padding: 2px 0;
}


/* Small form for adding grous etc*/ 

.one_line_form{
	float: left;
	margin: 10px 0 10px 0;
	clear: both;
	border-radius: 3px;
	background: #fff;
	/* border: 1px solid #eee;*/
    width: calc(100% - 8px);

	padding: 4px;
/*	line-height: 28px;*/
}

.one_line_form.no-borders{
	border: 0;
	padding: 0;
	background: transparent;
}
.one_line_form b{
	font-size: 16px;
	float: left;
	margin: 4px 10px 0 0;
}
.one_line_form input,
.one_line_form select {
	padding: 2px;
	border-radius: 2px;
	font-size: 12px;
	margin-right: 6px;
    min-width: 120px;
	border: 1px solid #aaa;
	-webkit-appearance: none; /* Remove native styles for Safari/Chrome */
}

.one_line_form select{
	width: auto;
}

.one_line_form input.button[type="submit"]{
	margin-right: 0;
}

.one_line_form select{
    background: url('../../images/icons/left-menu/arrow_down.png') no-repeat right center;
}

.one_line_form input::-webkit-input-placeholder { /* WebKit browsers */
	font-style: italic;
    color: #777;
}
.one_line_form input::-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    font-style: italic;
    color: #777;
}
.one_line_form input::-moz-placeholder { /* Mozilla Firefox 19+ */
   	font-style: italic;
    color: #777;
}
.one_line_form input::-ms-input-placeholder { /* Internet Explorer 10+ */
    font-style: italic;
    color: #777;
}


/* Authors */

.jnlp_button{
        padding: 10px auto;
        width:100%;
}



span.sub_menu_item a {
    display:block;
	font-size: 8pt;
	text-decoration: none;
	color: #333;
    padding-bottom:5px;
    padding-top:5px;
    padding-left:25px;
}

span.sub_menu_item a:hover {
	color: #ddd;
        background: #7d7e7d; /* Old browsers */
        background: -moz-linear-gradient(top,  #7d7e7d 0%, #0e0e0e 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d), color-stop(100%,#0e0e0e)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* IE10+ */
        background: linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
}
span.sub_menu_item_selected a {
        display:block;
	font-weight: bold;
	font-size: 8pt;
	text-decoration: none;
	color: #ddd;
        padding-bottom:5px;
        padding-top:5px;
        padding-left:25px;
        background: #7d7e7d; /* Old browsers */
        background: -moz-linear-gradient(top,  #7d7e7d 0%, #515151 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d), color-stop(100%,#515151)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top,  #7d7e7d 0%,#515151 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,  #7d7e7d 0%,#515151 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top,  #7d7e7d 0%,#515151 100%); /* IE10+ */
        background: linear-gradient(top,  #7d7e7d 0%,#515151 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#515151',GradientType=0 ); /* IE6-9 */
}

span.sub_menu_item_selected a:hover {
	color: #ddd;
        background: #7d7e7d; /* Old browsers */
        background: -moz-linear-gradient(top,  #7d7e7d 0%, #0e0e0e 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d), color-stop(100%,#0e0e0e)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* IE10+ */
        background: linear-gradient(top,  #7d7e7d 0%,#0e0e0e 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
}

.element_hidden{
	display:none;
}

.row_visible{
	display:table-row;
}

.element_visible{
	display:inline-block;
}

form{
	margin: 0;
	padding: 0;
}

.half form, 
.one-third form{
	display: block; 
}

span.search_count_text {
	font-size: 8pt;
        padding:0px;
        height:18px;
        padding-top:3px;
        padding-right:2px;
        color: #999;
        display:inline-block;
        position: relative;
        left:0px;
        width:26px;
        overflow:hidden;

}

div.take_all_link{
    float:right;
    text-decoration: underline;
    padding-right:4px;
    padding-left:4px;
		cursor: pointer;

        color: #999;
    
}

div.take_all_link:hover {
        color: #555;

}

div.content a.small_link {
	font-size: 6pt;
    color: #ddd;
}

div.content a.small_link:hover {
	font-size: 6pt;
    color: #555;
}
.small_text {
	font-size: 6pt;

        color: #ddd;
}

.small_text:hover {
	font-size: 6pt;
        color: #555;
}
.low_focus {
        color: #ddd;
}

.low_focus:hover {
    color: #555;
}

tr.assosiation_row:hover {
    background: #fcf8e3;
}

tr.assosiation_header td{
    color:#333;
    background-color:#ddd;
    border: 1px solid #bbb;
    font-weight: bold;
    padding: 5px;
}
tr.assosiation_row td{
    border: 1px solid #bbb;
    padding: 5px;
}

tr.assosiation_row td.assosiation_focus{
    background: #fcf8e3;
}
.rule{
	width: 100%;
}

.rule .inactive{
	color: #aaa;
}

a.show_link, 
a.hide_link{
	display: block;
	font-size: 16px;
	border-top: 1px solid #ccc;
	width: 100%;
	padding: 15px 0 0 0;
}

div.right_div{
    float:right;
    margin-right:20px;

}

div.action_div{
    padding: 6px;
   	font-size: 11px;
}
div.action_div a{
    margin-left:8px;    
}

div.action_div input.autocomplete_field {
    border: 1px solid #cccccc;    
    border-bottom: 1px solid #999;    
    height:22px;
    width:150px;
}

ul.ui-autocomplete {
    z-index:1000000;
}


div.action_div input.autocomplete_field:hover {
    border: 1px solid #333;    
}

div.low_focus_area{
    color: #999;
    width: 100%;
    text-align:center;    
}
div.table_header {
    /*width:960px;*/
    display:block;
    clear: left;
}

div.path_info{
    font-size:16px;
    font-style:normal;
    font-weight:bold;
    line-height:34px;
    color:#BBBBBB;
    display:inline-block;
    margin-right:10px;
}

div.path_info_leaf{
    color:#3c3c3c;
    font-size:24px;
    font-style:normal;
    font-weight:bold;
    line-height:34px;
    display:inline-block;
}
div.path_separator{
    display:block;
    margin-bottom:20px;
}

div#search_box_div{
    text-align: right;
    margin-bottom: 10px;
    display: inline-block;
        width: 100%;
}

.dataTables_info{
	float: left;
	padding: 0px 0;
}

div#search_box_div label {
	/* needed to override styles set for label */
	float: none;
	width: auto;
	padding: 0;
	text-align: none;
}

div#search_box_div label input{
	font-size: 12px;
    width: 150px;
    background: #fff url('../../images/icons/search-small.png') 4px center no-repeat;
	padding: 5px 5px 5px 20px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	border: 1px solid #ddd;
}


input.search_button_hidden{
	border:1px solid #FFFFFF;	
        width:18px;
        height:18px;
        margin:1px;
        float:left;
        text-align: center;
        color: #FFFFFF;
        background-color: #fff;

} 

input.search_button{
	border:1px solid #ddd;	
        width:18px;
        height:18px;
        margin:1px;
        float:left;
        text-align: center;
        background: url(../../img/close.jpg) ;
        background-repeat:no-repeat;
        background-position:right top;
} 

input.search_button:hover {
	border:1px solid #333;
        background-color: #EFEFEF;
        background: url(../../img/close2.jpg) ;
        background-repeat:no-repeat;
        background-position:right top;
} 
html>body #footer_box {
padding-top: 4px;
}

span.search_help {
  margin-left: 3px;
  color: black;
}


span.frontbox {
    background: #343434;
    width: 360px;
    margin-top: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    display:block;
    text-decoration: none;
    color: white;
    font-weight: bold;
    padding-left: 7px;
    cursor:pointer;
}

a.frontlink
{
text-decoration: none;
}

.leightbox {
	color: #333;
	display: none;
	position: absolute;
	top: 100px;
	left: 31%;
	width: 435px;
	height: auto;
	padding: 20px 20px 20px 20px;
	border: 6px solid #ffffff;
	background-color: #ffb94a;
	text-align: left;
	z-index:1001;
	overflow: auto;	
	line-height: 1.3em;
	font-size: 0.8em;
}

div.yhteystiedot {
padding-left: 3px;
}

div.pagenavigation {
display: block;
clear: both;
width:1000px;
margin-top: 15px;
margin-bottom: 15px;
padding-bottom: 15px;
}

span.pagelink {
margin-left: 15px;
margin-top: 5px;
margin-right: 15px;
float:left;
width:20px;
text-align:center;
}

span.pagelink p{
    margin: 0px;

}

span.otherpage:hover {
text-decoration:underline;
cursor:pointer;
font-weight: bold;
}

span.selectedpage p{
color: #222222;
background-color: #EEEEEE;
font-weight: bold;
}


div.writer_java_player_div {
    /*position: absolute;*/
    position: fixed;
    left:0px;
    bottom: 0px;
    width: 140px;
    height:135px;
    background-color: #FEFEFE;
    border: solid 0px #333;
    z-index: 80;
    padding:0px;
    padding-top:0px;
    overflow:hidden;
}







div.billing_modifier_section {
position: absolute;
right: 3px;
top:143px;
width: 100px;
background-color: #FEFEFE;
border: solid 1px #333;
z-index: 99;
padding:10px;
padding-top:0px;
}

div.billing_modifier_section div.billing_modifier_hider {
    background-color:#666666;
    height:14px;
    color: #eeeeee;
    text-align:center;
    display:block;
    font-size: 8pt;
}

div.billing_modifier_section div.billing_modifier_box {
height: 30px;
width: 30px;
display:block; 
}

div.billing_modifier_section div.billing_modifier_body {
overflow:auto;
height: 300px;
display:none; 

}

div.comment_section {
position: absolute;
right: 3px;
top:43px;
width: 100px;
background-color: #FEFEFE;
border: solid 1px #333;
z-index: 99;
padding:10px;
padding-top:0px;
}

div.comment_section div.comment_hider {
    background-color:#666666;
    height:14px;
    color: #eeeeee;
    text-align:center;
    display:block;
    font-size: 8pt;
    
}

div.comment_box {
overflow:auto;
max-height: 400px;
border: solid 1px rgba(0,0,0,0.1);

}

div.comment_section div.comment_box {
overflow:auto;
max-height: 500px;
display:none; 

}


.fake_link {
    text-decoration:underline;
    color: #000;
}

.fake_link:hover {
	cursor: pointer; 
	cursor: hand;
        color: #666666;
}



.hidden {
	display:none;
}

/* Login, 2013 */
.loginbox{
	width: 800px;
	margin: 0 auto 40px auto;
	background: #fff;
	border-radius: 4px;
	margin-top: 20px;
	padding: 30px;

    -webkit-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    -moz-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);

}

.loginbox .logintopic{
    border: 0px solid #ffffff;
    margin: 20px auto;
    /*padding-left:50px;*/
	text-align: center;
    width: 100%;
    font-size: 24px;
    font-weight: 400;
}

.loginbox .logintopic b{
    float:none;
    font-weight: bold;
}

.loginbox p{
	color: #000000;
}

#loginform{
    margin: 20px auto;
    width:480px;
	background: #fff;
    padding: 0px 20px;

}

#loginform p{
    margin: 0px auto;
}

#loginform p.buttons{
	text-align: left;
    outline: none; /* Remove outline */

    margin: auto;
	margin-top: 26px;
    padding-left:200px;
	padding-top: 3px;
}

#loginform input{
	padding: 3px;
	border: 0px solid #ddd;
	border-bottom: 1px solid #16426D;
	font-size: 16px;
    width: 300px;
    transition: all 0.3s ease;
}

#loginform input:focus{
    border-bottom: 1px solid #5fa8d3;
}

.ui-focus {
     -moz-box-shadow: none !important;
      -webkit-box-shadow: none !important;
       box-shadow: none !important;
}



#loginform label{
	font-size: 16px;
    padding: 3px;
    display: block;
    float: left;
    width: 160px;
    font-weight:600;
}

ul.actions{
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: left;
}
ul.actions li{
	padding: 3px 0;
}
ul.actions li a{
    color: #0a0a0a;
}
ul.actions li a:hover {
    color: #0a0a0a;
}


/* Buttons  */
div.action{
	padding: 0 0 20px 0;
}

button[disabled] {
    cursor: not-allowed;
}

.button{text-decoration: none !important;
    outline: none; /* Remove outline */
}
/*
.button-warning, 
.button-success{
	color: #ffffff !important;
}*/ 

.button_flat,
input[type="submit"].button_flat,
input[type="button"].button_flat {
  display: inline-block;
  padding: 4px 10px 4px 10px;
  margin: 0px;
  margin-right: 8px;
  margin-bottom: 1px;
  margin-top: 1px;
  font-size: 13px;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-color: #fff;
  border: 1px solid #b1b1b1;
  border-radius: 4px;
  color: #4a5574;
  font-weight:bold;
  zoom: 1;
}

.button_flat:focus {
    outline: 0px;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
}
.button_flat:active {
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.button_flat:hover,
input[type="submit"].button_flat:hover, 
input[type="button"].button_flat:hover {
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    text-decoration:none;
}

.paletint,
input[type="submit"].paletint,
input[type="button"].paletint {
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #4a5574;
    background-color: #fff;
}
.paletint_hover,
input[type="submit"].paletint:hover,
input[type="button"].paletint:hover {
    border: 1px solid #b1b1b1;
    color: #4a5574;
    background-color: #fff;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    text-decoration:none;
}


.bluetint,
input[type="submit"].bluetint,
input[type="button"].bluetint {
    background-color: #f3f2f3;
}

.redtint,
input[type="submit"].redtint,
input[type="button"].redtint {
    color: #ffffff;
    background-color: #e62c2c;
}
.redtint:hover,
input[type="submit"].redtint:hover,
input[type="button"].redtint:hover,
.redtint:focus,
input[type="submit"].redtint:focus,
input[type="button"].redtint:focus {
    color: #ffffff;
    background-color: #e62c2c;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    text-decoration:none;
}

.greentint,
input[type="submit"].greentint,
input[type="button"].greentint {
    color: #ffffff;
    background-color:    #00A99D;
}
.greentint:hover,
input[type="submit"].greentint:hover,
input[type="button"].greentint:hover,
.greentint:focus,
input[type="submit"].greentint:focus,
input[type="button"].greentint:focus {
    color: #ffffff;
    background-color:    #00A99D;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    text-decoration:none;
}

.disabled,
input[type="submit"].disabled,
input[type="button"].disabled {
    background-color: #f3f2f3;
    color: #aaaaaa;
}

.button,
input[type="submit"], 
input[type="button"] {
  display: inline-block;
  padding: 4px 10px 4px 10px;
  margin-right: 5px;
  margin-bottom: 1px;
  margin-top: 1px;
  font-size: 13px;
  color: #333333;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-color: #fff;
  background-repeat: repeat-x;
  border: 1px solid #b1b1b1;
  border-radius: 4px;
  color: #4a5574;
  line-height: 20px;
  font-weight:bold;
  zoom: 1;
}

.button:hover,
.button:focus,
.button:active,
.button.active,
.button.disabled,
.button[disabled],
input[type="submit"]:hover, 
input[type="button"]:hover,
input[type="submit"]:focus, 
input[type="button"]:focus,
input[type="submit"]:active, 
input[type="button"]:active {
  color: #333333;
  background-color: #fcfcfc;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}

.button:active,
.button.active {
  background-color: #cccccc ;
}

.button:first-child {
  *margin-left: 0;
}

.button:hover,
.button:focus {
  color: #333333;
  text-decoration: none;
  background-position: 0 -15px;
  -webkit-transition: background-position 0.1s linear;
     -moz-transition: background-position 0.1s linear;
       -o-transition: background-position 0.1s linear;
          transition: background-position 0.1s linear;
}

.button.active,
.button:active {
  background-image: none;
  outline: 0;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.button.disabled,
.button[disabled] {
  cursor: default;
  background-image: none;
  opacity: 0.65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
}


.button-primary.active,
.button-warning.active,
.button-danger.active,
.button-success.active,
.button-info.active,
.button-inverse.active {
    background-color: #ffbcbc;
}


.button-warning,
input[type="submit"].button-warning, 
input[type="button"].button-warning 
{
    background-color: #ffbcbc;
}

.button-warning:hover,
input[type="submit"].button-warning:hover, 
input[type="button"].button-warning:hover, 
.button-warning:focus,
.button-warning:active,
.button-warning.active,
.button-warning.disabled,
.button-warning[disabled] {
    background-color: #ebeeff;
}

.button-warning:active,
.button-warning.active {
  background-color: #c67605 ;
}

.button-danger, 
input[type="submit"].button-danger, 
input[type="button"].button-danger{
  display: inline-block;
  padding: 4px 10px 4px 10px;
  margin: 5px;
  margin-bottom: 1px;
  margin-top: 1px;
  font-size: 13px;
  line-height: 20px;
  color: #333333;
  text-align: center;
  /*text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);*/
  vertical-align: middle;
  cursor: pointer;
  background-repeat: repeat-x;
  border: 1px solid #b1b1b1;
  border-radius: 4px;
  font-weight:bold;
  zoom: 1;
  color: #ffffff;
  background-color: #e62c2c;
}
.button-danger:hover,
input[type="submit"].button-danger:hover, 
input[type="button"].button-danger:hover, 
.button-danger:focus,
.button-danger:active,
.button-danger.active,
.button-danger.disabled,
.button-danger[disabled] {
    color: #ffffff;
    background-color: #e62c2c;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    text-decoration:none;
}

.button-danger-dim, 
input[type="submit"].button-danger-dim, 
input[type="button"].button-danger-dim{
  display: inline-block;
  padding: 4px 10px 4px 10px;
  margin: 5px;
  margin-bottom: 1px;
  margin-top: 1px;
  font-size: 13px;
  line-height: 20px;
  color: #333333;
  text-align: center;
  /*text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);*/
  vertical-align: middle;
  cursor: pointer;
  background-repeat: repeat-x;
  border: 1px solid #b1b1b1;
  border-radius: 4px;
  font-weight:bold;
  zoom: 1;
  color: #ffffff;
  background-color: #872626;
}
.button-danger-dim:hover,
input[type="submit"].button-danger-dim:hover, 
input[type="button"].button-danger-dim:hover, 
.button-danger-dim:focus,
.button-danger-dim:active,
.button-danger-dim.active,
.button-danger-dim.disabled,
.button-danger-dim[disabled] {
    color: #ffffff;
    background-color: #872626;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    text-decoration:none;
}

.button-danger-gray, 
input[type="submit"].button-danger-gray, 
input[type="button"].button-danger-gray{
  display: inline-block;
  padding: 4px 10px 4px 10px;
  margin: 5px;
  margin-bottom: 1px;
  margin-top: 1px;
  font-size: 13px;
  line-height: 20px;
  color: #333333;
  text-align: center;
  /*text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);*/
  vertical-align: middle;
  cursor: pointer;
  background-repeat: repeat-x;
  border: 1px solid #b1b1b1;
  border-radius: 4px;
  font-weight:bold;
  zoom: 1;
  color: #ffffff;
  background-color: #5e5353;
}
.button-danger-gray:hover,
input[type="submit"].button-danger-gray:hover, 
input[type="button"].button-danger-gray:hover, 
.button-danger-gray:focus,
.button-danger-gray:active,
.button-danger-gray.active,
.button-danger-gray.disabled,
.button-danger-gray[disabled] {
    color: #ffffff;
    background-color: #5e5353;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    text-decoration:none;
}

.button-success,
input[type="submit"].button-success, 
input[type="button"].button-success
{
  line-height: 20px;
  display: inline-block;
  padding: 4px 10px 4px 10px;
  margin: 5px;
  margin-bottom: 1px;
  margin-top: 1px;
  font-size: 13px;
  color: #333333;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: 1px solid #b1b1b1;
  border-radius: 4px;
  font-weight:bold;
  zoom: 1;
  color: #ffffff;
  background-color:    #00A99D;
}

.button-success:hover,
input[type="submit"].button-success:hover, 
input[type="button"].button-success:hover,
.button-success:focus,
.button-success:active,
.button-success.active,
.button-success.disabled,
.button-success[disabled] {
    background-color:    #00A99D;
    color:#ffffff;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}

.button-success:active,
.button-success.active {
  background-color: #408140 ;
}

.button-success-dim,
input[type="submit"].button-success-dim, 
input[type="button"].button-success-dim
{
  line-height: 20px;
  display: inline-block;
  padding: 4px 10px 4px 10px;
  margin: 5px;
  margin-bottom: 1px;
  margin-top: 1px;
  font-size: 13px;
  color: #333333;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: 1px solid #b1b1b1;
  border-radius: 4px;
  font-weight:bold;
  zoom: 1;
  color: #ffffff;
  background-color:    #317a53;
}

.button-success-dim:hover,
input[type="submit"].button-success-dim:hover, 
input[type="button"].button-success-dim:hover,
.button-success-dim:focus,
.button-success-dim:active,
.button-success-dim.active,
.button-success-dim.disabled,
.button-success-dim[disabled] {
    background-color:    #317a53;
    color:#ffffff;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}

.button-success-dim:active,
.button-success-dim.active {
  background-color: #255c3e ;
}


.button-success-gray,
input[type="submit"].button-success-gray, 
input[type="button"].button-success-gray
{
  line-height: 20px;
  display: inline-block;
  padding: 4px 10px 4px 10px;
  margin: 5px;
  margin-bottom: 1px;
  margin-top: 1px;
  font-size: 13px;
  color: #333333;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: 1px solid #b1b1b1;
  border-radius: 4px;
  font-weight:bold;
  zoom: 1;
  color: #ffffff;
  background-color:    #828282;
  background-color:    #57635b;
}

.button-success-gray:hover,
input[type="submit"].button-success-gray:hover, 
input[type="button"].button-success-gray:hover,
.button-success-gray:focus,
.button-success-gray:active,
.button-success-gray.active,
.button-success-gray.disabled,
.button-success-gray[disabled] {
    background-color:    #828282;
  background-color:    #57635b;
    color:#ffffff;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}

.button-success-gray:active,
.button-success-gray.active {
  background-color: #666666 ;
}

.button-info,
input[type="submit"].button-info,
input[type="button"].button-info {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #49afcd;
  *background-color: #2f96b4;
  background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bc0de), to(#2f96b4));
  background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);
  background-image: linear-gradient(to bottom, #5bc0de, #2f96b4);
  background-repeat: repeat-x;
  border-color: #2f96b4 #2f96b4 #1f6377;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2f96b4', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.button-info:hover,
input[type="submit"].button-info:hover, 
input[type="button"].button-info:hover,
.button-info:focus,
.button-info:active,
.button-info.active,
.button-info.disabled,
.button-info[disabled] {
  color: #ffffff;
  background-color: #2f96b4;
}

.button-info:active,
.button-info.active {
  background-color: #24748c ;
}

.button-inverse {
  color: #ffffff;
  /*text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);*/
  background-color: #363636;
  *background-color: #222222;
  background-image: -moz-linear-gradient(top, #444444, #222222);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#444444), to(#222222));
  background-image: -webkit-linear-gradient(top, #444444, #222222);
  background-image: -o-linear-gradient(top, #444444, #222222);
  background-image: linear-gradient(to bottom, #444444, #222222);
  background-repeat: repeat-x;
  border-color: #222222 #222222 #000000;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff444444', endColorstr='#ff222222', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.button-inverse:hover,
.button-inverse:focus,
.button-inverse:active,
.button-inverse.active,
.button-inverse.disabled,
.button-inverse[disabled] {
  color: #ffffff;
  background-color: #222222;
  *background-color: #151515;
}

.button-inverse:active,
.button-inverse.active {
  background-color: #080808 ;
}


button.button::-moz-focus-inner,
input[type="submit"].button::-moz-focus-inner {
  padding: 0;
  border: 0;
}


button.button.button-mini,
input[type="submit"].button.button-mini {
  *padding-top: 1px;
  *padding-bottom: 1px;
}

.button-link,
.button-link:active,
.button-link[disabled] {
  background-color: transparent;
  background-image: none;
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
}

.button-link {
  color: #0088cc;
  cursor: pointer;
  border-color: transparent;
  -webkit-border-radius: 0;
     -moz-border-radius: 0;
          border-radius: 0;
}

.button-link:hover,
.button-link:focus {
  color: #005580;
  text-decoration: underline;
  background-color: transparent;
}

.button-link[disabled]:hover,
.button-link[disabled]:focus {
  color: #333333;
  text-decoration: none;
}

input.dynamic_add_buttons_for_select2 {
    padding-top: 0px;
    padding-bottom: 0px;
    margin-left: 10px;
}



.write_silk_tabs_container{
    user-select:none;
    margin-top:12px;
    margin-left:-20px;
    padding-right:20px;
    padding-left:20px;
    line-height:normal;
    
}

.write_silk_tab{
    margin:0px;
    margin-left:10px;
    margin-top:25px;
    border: 1px solid #ccc;
    background: #ffffff;
    padding:5px;
    padding-left:20px;
    padding-right:20px;
    display:inline;
    cursor: pointer;

     -webkit-border-radius: 4px 4px 0 0;
     -moz-border-radius: 4px 4px 0 0;
     border-radius: 4px 4px 0 0;

    -webkit-box-shadow: 10px 0px 20px -16px rgba(0,0,0,0.5);
    -moz-box-shadow: 10px 0px 20px -16px rgba(0,0,0,0.5);
    box-shadow: 10px 0px 20px -16px rgba(0,0,0,0.5);
    transition: all 0.1s ease;

}

.write_silk_tab_content{
    border-top: 1px solid #ccc;
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    margin-top:5px;
    margin-left:-20px;
    margin-right:-20px;
    display:none;
    transition: all 0.1s ease;
}



/* TABS */
.tabs{
  list-style: none;
  margin-bottom: 20px;
  margin-left: -20px;
  padding-right: 20px;
  float: left;
  width: 100%;
  border-bottom: 1px solid #ddd;
  padding-left:20px;
  margin-top:10px;
    user-select:none;
}

.tabs li{
  float: left;
}

.tabs li a{
	float: left;
    margin-right: 10px;
    /* background: #efefef80; /* Old browsers */

    border: 1px solid #ddd;
    padding: 6px 14px;
     -webkit-border-radius: 4px 4px 0 0;
     -moz-border-radius: 4px 4px 0 0;
     border-radius: 4px 4px 0 0;

     font-style: normal;
     font-weight: 600;
     font-size: 14px;
     line-height: 20px;
     /* identical to box height, or 143% */


     /* DM-Navy-Blue */
     color: #314A75;
     
}

.tabs li a:hover{
    text-decoration:none;
}

.tabs li {
  margin-bottom: -1px;
}

.tabs .selected a,
.tabs .selected a:hover,
.tabs .selected a:focus {
  color: #3c3c3c;
  cursor: default;
  text-decoration: none;
  font-weight: bold;
  border: 1px solid #ccc;
  border-bottom-color: transparent;
  background: #ffffff; /*same as background, hides bottom border */
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  line-height: 20px;
}

.tabs li h2{
	float: left;
	margin: 0 20px 0 0;
	padding: 0 0 10px 0;
	font-size: 24px;
    font-weight: 400;
    text-transform: uppercase;
}

div.content div.no-border{
	border: 0;
	padding: 0;
	margin: 0;
}
form#xml_form_table {
    width:100%;
}

form#xml_form_table table {
    width:100%;
}

#read_page div.left-column {
    width:350px;
    box-sizing:content-box;
}

#read_page div.right-column {
    margin-left: 390px;
}

/* Content of info tab */
table.rec_info {
    width: 100%;
}

#read_page #tabs .rec_info td.rec_info_label 
{
	padding-right: 0;
        width:100px;
}

textarea#comment_message_field{
	height: 60px;
        width: 100%;
	padding: 3px;
	margin: 0px;
        margin-bottom:10px;
}

.comment_help{
	font-size: 11px;
	float: right;
}

.comment{
    padding: 5px;
    padding-left: 10px;
    padding-right: 10px;
    margin: 4px;
    margin-top:10px;
    margin-bottom:10px;
    background: #ffffff; /* For browsers that do not support gradients */
  /*  border: 1px solid #eeeeee;*/
}

.comment_meta{
	display: block;
	margin: 0 0 5px 0;
	font-size: 12px;
	color: #ababab;
}

.comment_time{
	color: #ababab;
}

.comment_by{
	font-weight: bold;
}

.comment_text{
	font-size: 12px;
	line-height: 1.4;
}

div.error_notification {
    display: none;

    width:350px;
    float:right;
    clear:both;

    margin:10px;

    -webkit-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    -moz-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);

    padding: 16px;

    border-left: 8px solid #e31c3d;

    background-image: url("../../images/icons/generic/black/x.svg"); 
    background-repeat: no-repeat;
    background-position:top right;
    background-size: 16px 16px;

    background-color: #ff0000;
    background-color: #f9dede;
}


div.success_notification {

    display: none;

    width:350px;
    float:right;
    clear:both;

    margin:10px;

    -webkit-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    -moz-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);

    padding: 16px;
    border-left: 8px solid #47a462;

    background-image: url("../../images/icons/generic/black/x.svg"); 
    background-repeat: no-repeat;
    background-position:top right;
    background-size: 16px 16px;
    background-color: #e7f4e4;

}


div#notification_bar {
    text-align:right;
    position:fixed;
    right: 0;
    text-align:center;
    z-index:99999;

}

p.fake_link {
    display:inline;
    margin:0px;
    padding:0px;
    color: #666666;
    text-decoration: undeline;
}

p.fake_link:hover {
    color: #333333;
}

div.size-control {
    text-align: right;

        
}

div.size-control a {
    text-decoration:none;
    font-weight:bold;
    font-size:20px;
    margin-left:5px;
}

span.external_queue_tool {
    font-size: 12px;
    margin-left:30px;
    margin-bottom:15px;
}

span.external_queue_tool input {
    height:23px;
    width:100px;
    margin-right:20px;
}


/* Autocorrect/dictionary */

.ac_results {
		border: 1px solid gray;
		background-color: white;
		padding: 0;
		margin: 10px;
		list-style: none;
		position: fixed;
		z-index: 50;	
	        right:40px;
		top:200px;
		display: none;
                overflow: hidden;
                width:400px;
	}
	
.ac_results ul {
    padding:10px;

}
.ac_results li {
		padding: 3px 10px;
		white-space: nowrap;
		color: #101010;
		text-align: left;
		list-style-type:none;
	}
	
.ac_results li span{
        display:none;
}
.ac_over {
		cursor: pointer;
		background-color: #F0F0FF;
	}
	
.ac_over span.explain {
        display:block;
	white-space: normal;
	font-size: 8pt;
        padding: 3px 10px;
        max-width: 400px;
        max-height:50px;
	color: #555555;
    }

.ac_match {
		text-decoration: underline;
		color: black;
	}


.dataTables_paginate {
    margin:0px;
    padding-left:20px;
}

.dataTables_paginate a{
    margin-left:10px;
}

.dataTables_paginate a.current{
	font-weight: bold;
        color: #000000;
}

.dataTables_paginate a:hover {
    text-decoration: underline;
                    cursor: pointer;
}

audio {
    width: 300px;
    height: 32px;
}

span.tag_plus {
    font-size:26px; 
    font-weight: bold; 
    cursor:pointer;
   -webkit-user-select: none; /* webkit (safari, chrome) browsers */
   -moz-user-select: none; /* mozilla browsers */
   -khtml-user-select: none; /* webkit (konqueror) browsers */
   -ms-user-select: none; /* IE10+ */
}

span.tag_minus {
    font-size:36px; 
    font-weight: bold; 
    cursor:pointer;
   -webkit-user-select: none; /* webkit (safari, chrome) browsers */
   -moz-user-select: none; /* mozilla browsers */
   -khtml-user-select: none; /* webkit (konqueror) browsers */
   -ms-user-select: none; /* IE10+ */
}

input.tag_counter {
        font-size: 18px; 
        appearance: none;
        box-shadow: none;
        border-radius: none; 
        border: 0px; 
        width:20px;
        text-align:center;

}
span.list_attachment {
	cursor: pointer; 
    overflow:hidden;
	cursor: hand;
	display: inline-block;
	width: 30px;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	color: #000000;
    padding-left:25px;
	background:url(../../images/icons/generic/black/paperclip.svg) no-repeat;
	background-position: bottom left;
}


span.list_comment_none {
	cursor: pointer; 
        overflow:hidden;
	cursor: hand;
	display: inline-block;
	width: 30px;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	color: #000000;
        padding-left:25px;
	background:url(../../images/icons/left-menu/bubbles_light.png) no-repeat;
	background-position: bottom left;
}

span.list_comment_yes {
	cursor: pointer; 
        overflow:hidden;
	cursor: hand;
	display: inline-block;
	width: 30px;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	color: #000000;
        padding-left:25px;
	background:url(../../images/icons/left-menu/bubbles.png) no-repeat;
	background-position: bottom left;
}

span.list_action_gear {
	cursor: pointer; 
    overflow:hidden;
	cursor: hand;
	display: inline-block;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	color: #000000;
    padding-left:16px;
    margin-left:5px;
	background:url(../../images/icons/generic/black/settings.svg) no-repeat;
	background-position: bottom left;
    background-size: 16px 16px;
}

span.list_action_inbox {
	cursor: pointer; 
    overflow:hidden;
	cursor: hand;
	display: inline-block;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	color: #000000;
    padding-left:16px;
    margin-left:5px;
	background:url(../../images/icons/generic/black/inbox.svg) no-repeat;
	background-position: bottom left;
    background-size: 16px 16px;
}
span.list_action_close {
	cursor: pointer; 
    overflow:hidden;
	cursor: hand;
	display: inline-block;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	color: #000000;
    padding-left:16px;
    margin-left:5px;
	background:url(../../images/icons/generic/black/x.svg) no-repeat;
	background-position: bottom left;
    background-size: 16px 16px;
}

span.list_action_dropdown {
	cursor: pointer; 
    overflow:hidden;
	cursor: hand;
	display: inline-block;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
	color: #000000;
    padding-right:20px;
    min-width: 90px;
}
span.disabled_row {
    color:#aaaaaa;
}
span.hidden_row {
    display:none;
}

span.user_set_target {
	display: inline-block;
	height: 16px;
	border: 0px;
	padding: 0px;
	margin: 0px;
    font-weight: bold;
}


span.list_action_dropdown:hover {
	text-decoration: underline;
    border-bottom: 1px solid #999;
    margin: 0px;
    background: url('../../images/pencil.png') right 0px no-repeat;

}

input.tag_list_style {
      /* Double-sized Checkboxes */
    -ms-transform: scale(1.4); /* IE */
    -moz-transform: scale(1.4); /* FF */
    -webkit-transform: scale(1.4); /* Safari and Chrome */
    -o-transform: scale(1.4); /* Opera */
    transform: scale(1.4); /* default  */
    paddIng: 10px;
}

div.tag_list {
    margin-bottom:10px;
    font-size:large;
    display:inline-block;
}

div.tag_list form{
    display:inline;
}

/* Tooltip text */
.tooltiptext {
        width: 500px;
        background: #ffffff;
        color: #000000;
        /* padding: 5px; */
        padding-bottom:10px; 
        margin-left:-420px;
        display:none;
         /* Position the tooltip text - see examples below! */
        position: fixed;
        z-index: 99999;

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;

     border: 0px solid rgba(0,0,0,0.1);
    -webkit-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    -moz-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);

}

.tooltip_topic {
	-webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-top-left-radius: 4px;
	-moz-border-top-right-radius: 4px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;

    background-color:#16426D; 
    margin:0px; 
    padding:8px;
    padding-left:20px;
    font-style:bold;
    color:#ffffff;
}

div.overlay_white{
    background: rgba(255, 255, 255, 1); 
    z-index: 9999; 
    position:fixed; 
    top:0px; 
    left:0px; 
    height:100%; 
    width:100%; 
    content: " "; 
}
div.overlay_white .overlay-content{
    text-align: center;
    margin-top: 200px;
}

body.actionstep div.overlay_white .overlay-content {
    margin-top: 100px;
}

div.overlay{
    background: rgba(0, 0, 0, 0.3); 
    z-index: 9999; 
    position:fixed; 
    top:0px; 
    left:0px; 
    height:100%; 
    width:100%; 
    content: " "; 
    display:none;
}

div.overlay-padding{
    display:none;
    position:fixed; 
    top:170px;
    content: " "; 
    max-height:70%; 
    z-index: 10001;
}

div.overlay-padding-fullscreen{
    display:none;
    position:fixed; 
    top:30px;
    left:0px;
    content: " "; 
    z-index: 99990;

    -webkit-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    -moz-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);

}
div.overlay-padding-fullscreen div.overlay-topic{
	-webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-top-left-radius: 4px;
	-moz-border-top-right-radius: 4px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;

    background-color:#16426D; 
    margin:0px; 
    padding:8px;
    padding-left:20px;
    font-style:bold;
    color:#ffffff;
}

div.overlay-padding-fullscreen div.overlay-content{

    background: rgba(255, 255, 255, 1); 
    margin:0px 0px;
    overflow: auto;
    padding:20px;
    overflow:auto;

	-webkit-border-bottom-left-radius: 4px;
	-moz-border-bottom-left-radius: 4px;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
	-moz-border-bottom-right-radius: 4px;
	border-bottom-right-radius: 4px;

}

div.overlay-padding div.overlay-content{

    background: rgba(255, 255, 255, 0.95); 
    width:700px; 
    margin:0px 0px;
    overflow: auto;

    max-height:70%; 

	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;

    -webkit-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    -moz-box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
    box-shadow: 10px 10px 20px -16px rgba(0,0,0,0.5);
}

div.overlay-padding-fullscreen div.tab_list_item {
        padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
        margin-top:10px;
        margin-bottom:10px;
        margin-left:20px;
        margin-right:20px;
	/*border-left: 2px solid #000000;*/
        background: #ffffff;
	width: 500px;
    text-align: left;
}

div.overlay-padding-fullscreen div.tab_list_tab {
	margin:10px;
/*	text-decoration: underline;*/
}

.tab_editor {
    margin: 4px 80px 0px;
    text-align: left;
}
div.overlay-padding-fullscreen div.tab_list_tab:hover {
        background: #ffffff;

	cursor: pointer; 
	cursor: hand;
}

table.assosiation {
	border-collapse: collapse;
	border-spacing: 0; 
    box-shadow:none;
}
table.assosiation td{
    vertical-align:top;
    padding:10px;
}
div.js_notifications {
    display:none;    
}

img.comment_delete {
    height:20px;
    float:right;
	cursor: pointer; 
	cursor: hand;
}

table.report {
	border-collapse: collapse;
	border-spacing: 0; 
	width: 100%;
    margin-top:20px;
    clear:both;
	border: 1px solid #dcdcdc;
    padding:20px;
    background-color: #ffffff;
}

table.report tr {
	border: 1px solid #dcdcdc;
	padding: 5px 6px;
	font-size: 14px;
}

table.report tr.topic_row {
    padding:2px;
	font-weight: bold;
	font-size: 16px;
}

table.report tr.info_row {
	font-weight: bold;

}
table.report tr.grand_total_row {
	font-weight: bold;
}

div.dashboard_element {
    background-color: #ffffff;
    width: 583px;
    margin: 6px;
    margin-top: 0px;
    border: 1px solid #dcdcdc;
    padding: 10px;
    padding-bottom: 0px;
    height:320px;
    overflow: hidden;
}

div.dashboard_toolbar {
    margin: 0px;
    margin-top: 10px;
    width:100%;
    text-align: right;
}

ul.dashboard{
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.dashboard > li{
	display: inline-block;
}

ul.dashboard#admin_dashboard {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch;
    row-gap: 15px;
    column-gap: 15px;
}

ul.dashboard#admin_dashboard > li.admin_dashboard_block {
    min-width: 300px;
    min-height: 320px;
    width: 0;
    height: 600px;
    display: inline-flex;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: calc(50% - 15px);
}

li.admin_dashboard_block div.dashboard_element {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    padding: 0;
}

ul#column_sortter li{
    list-style:none;
    list-style-type: none;
    margin:4px;

}

ul#column_sortter li:hover{
    cursor: grab;
    text-decoration:underline;
}


html .ui-tabs .ui-state-default { 
    border: 1px solid #c5c5c5;
    border-bottom:1px solid #f6f6f6;
    font-weight: normal;
    color: #000;
    background: #ffffff; 
    margin-left:4px;

}

html .ui-tabs .ui-tabs-panel {
    padding: 0px;
}

html .ui-tabs .ui-state-default a{
    color: #454545;

}

#tabs {
    border: 0px;
}

.ui-tabs .ui-tabs-nav {
    background-color: #ffffff;
    border: 0px;
    border-bottom: 1px solid #c5c5c5;
    border-radius: 0px;
}

html .ui-tabs .ui-state-default:hover { 
    border: 1px solid #c5c5c5;
    background: #ffffff;
    font-weight: normal;
    color: #454545;
    border-bottom:1px solid #f6f6f6;
}

html .ui-tabs .ui-state-default a:hover{
    color: #454545;
}

html .ui-tabs .ui-state-active {
    border: 1px solid #c5c5c5;
    background: #ffffff;
    font-weight: normal;
    color: #454545;
    border-bottom:1px solid #ffffff;
}

html .ui-tabs .ui-state-active a{
    color: #000000;
    font-weight: bold;
}                                                      


/*
* Table styles
*/
table.dataTable {
width: 100%;
margin: 0 auto;
clear: both;
border-collapse: separate;
border-spacing: 0;
/*
* Header and footer styles
*/
/*
* Body styles
*/ }
table.dataTable thead th,
table.dataTable tfoot th {
    font-weight: bold; }
    
table.dataTable thead th,
table.dataTable thead td {
    padding: 8px 4px;
    border-bottom: 1px solid rgba(1,1,1,0.1); 
    }
table.dataTable thead th:active,
table.dataTable thead td:active {
    outline: none; }
table.dataTable tfoot th,
table.dataTable tfoot td {
    padding: 10px 18px 6px 18px;
  /*  border-top: 1px solid rgba(1,1,1,0.1);*/ }
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    cursor: pointer;
    *cursor: hand;
    background-repeat: no-repeat;
    background-position: center right; }

table.dataTable thead .sorting {
    background-image: url("../../images/icons/generic/black/chevron-both.svg"); }
table.dataTable thead .sorting_asc {
    background-image: url("../../images/icons/generic/black/chevron-up.svg");}
table.dataTable thead .sorting_desc {
   background-image: url("../../images/icons/generic/black/chevron-down.svg");}
table.dataTable thead .sorting_asc_disabled {
background-image: url("../images/sort_asc_disabled.png"); }
table.dataTable thead .sorting_desc_disabled {
background-image: url("../images/sort_desc_disabled.png"); }

table.dataTable tbody tr {
background-color: white; 
/*
border-left: 1px solid rgba(1,1,1,0.1); 
border-right: 1px solid rgba(1,1,1,0.1); 
*/
border-bottom:1px solid rgba(1,1,1,0.1);
box-shadow: 0px 1px 0px rgba(49, 74, 117, 0.12);
}
table.dataTable tbody tr.selected {
background-color: #b0bed9; }
table.dataTable tbody th,
table.dataTable tbody td {
padding: 2px 4px; }
table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {
/* border-top: 1px solid #dddddd;*/ 
}
table.dataTable.row-border tbody tr:first-child th,
table.dataTable.row-border tbody tr:first-child td, table.dataTable.display tbody tr:first-child th,
table.dataTable.display tbody tr:first-child td {
border-top: none; }
table.dataTable.cell-border tbody th, table.dataTable.cell-border tbody td {
    /*
border-top: 1px solid #dddddd;
border-right: 1px solid #dddddd; 
*/
box-shadow: 0px 1px 0px rgba(49, 74, 117, 0.12);
}
table.dataTable.cell-border tbody tr th:first-child,
table.dataTable.cell-border tbody tr td:first-child {
/*border-left: 1px solid #dddddd; */}
table.dataTable.cell-border tbody tr:first-child th,
table.dataTable.cell-border tbody tr:first-child td {
border-top: none; }
table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
background-color: #f9f9f9; 
}
table.dataTable.stripe tbody tr.odd.selected, table.dataTable.display tbody tr.odd.selected {
background-color: #abb9d3; }
table.dataTable.hover tbody tr:hover, table.dataTable.display tbody tr:hover {
background-color: whitesmoke; }
table.dataTable.hover tbody tr:hover.selected, table.dataTable.display tbody tr:hover.selected {
background-color: #a9b7d1; }
table.dataTable.order-column tbody tr > .sorting_1,
table.dataTable.order-column tbody tr > .sorting_2,
table.dataTable.order-column tbody tr > .sorting_3, table.dataTable.display tbody tr > .sorting_1,
table.dataTable.display tbody tr > .sorting_2,
table.dataTable.display tbody tr > .sorting_3 {
background-color: #f9f9f9; }
table.dataTable.order-column tbody tr.selected > .sorting_1,
table.dataTable.order-column tbody tr.selected > .sorting_2,
table.dataTable.order-column tbody tr.selected > .sorting_3, table.dataTable.display tbody tr.selected > .sorting_1,
table.dataTable.display tbody tr.selected > .sorting_2,
table.dataTable.display tbody tr.selected > .sorting_3 {
background-color: #acbad4; }
table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
background-color: #f1f1f1; }
table.dataTable.display tbody tr.odd > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd > .sorting_2 {
background-color: #f3f3f3; }
table.dataTable.display tbody tr.odd > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd > .sorting_3 {
background-color: whitesmoke; }
table.dataTable.display tbody tr.odd.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_1 {
background-color: #a6b3cd; }
table.dataTable.display tbody tr.odd.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_2 {
background-color: #a7b5ce; }
table.dataTable.display tbody tr.odd.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_3 {
background-color: #a9b6d0; }
table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
background-color: #f9f9f9; }
table.dataTable.display tbody tr.even > .sorting_2, table.dataTable.order-column.stripe tbody tr.even > .sorting_2 {
background-color: #fbfbfb; }
table.dataTable.display tbody tr.even > .sorting_3, table.dataTable.order-column.stripe tbody tr.even > .sorting_3 {
background-color: #fdfdfd; }
table.dataTable.display tbody tr.even.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_1 {
background-color: #acbad4; }
table.dataTable.display tbody tr.even.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_2 {
background-color: #adbbd6; }
table.dataTable.display tbody tr.even.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_3 {
background-color: #afbdd8; }
table.dataTable.display tbody tr:hover > .sorting_1, table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {
background-color: #eaeaea; }
table.dataTable.display tbody tr:hover > .sorting_2, table.dataTable.order-column.hover tbody tr:hover > .sorting_2 {
background-color: #ebebeb; }
table.dataTable.display tbody tr:hover > .sorting_3, table.dataTable.order-column.hover tbody tr:hover > .sorting_3 {
background-color: #eeeeee; }
table.dataTable.display tbody tr:hover.selected > .sorting_1, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 {
background-color: #a1aec7; }
table.dataTable.display tbody tr:hover.selected > .sorting_2, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 {
background-color: #a2afc8; }
table.dataTable.display tbody tr:hover.selected > .sorting_3, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 {
background-color: #a4b2cb; }
table.dataTable.no-footer {
 /*   border-bottom: 1px solid rgba(1,1,1,0.1);*/ }
table.dataTable.nowrap th, table.dataTable.nowrap td {
white-space: nowrap; }
table.dataTable.compact thead th,
table.dataTable.compact thead td {
padding: 4px 26px 4px 4px;
min-width:60px;
/*
border-left:1px solid #D6DBE3;
border-bottom:1px solid #D6DBE3;*/
font-size: 14px;
line-height: 20px;
/* identical to box height, or 143% */


/* DM-Navy-Blue */

color: #314A75;
}
table.dataTable.password td{
    font-size: 12px;
}
table.dataTable.compact tfoot th,
table.dataTable.compact tfoot td {
padding: 4px; }
table.dataTable.compact tbody th,
table.dataTable.compact tbody td {
    word-break:break-word;
padding: 4px; }
table.dataTable th.dt-left,
table.dataTable td.dt-left {
text-align: left; }
table.dataTable th.dt-center,
table.dataTable td.dt-center,
table.dataTable td.dataTables_empty {
text-align: center; }
table.dataTable th.dt-right,
table.dataTable td.dt-right {
text-align: right; }
table.dataTable th.dt-justify,
table.dataTable td.dt-justify {
text-align: justify; }
table.dataTable th.dt-nowrap,
table.dataTable td.dt-nowrap {
white-space: nowrap; }
table.dataTable thead th.dt-head-left,
table.dataTable thead td.dt-head-left,
table.dataTable tfoot th.dt-head-left,
table.dataTable tfoot td.dt-head-left {
text-align: left; }
table.dataTable thead th.dt-head-center,
table.dataTable thead td.dt-head-center,
table.dataTable tfoot th.dt-head-center,
table.dataTable tfoot td.dt-head-center {
text-align: center; }
table.dataTable thead th.dt-head-right,
table.dataTable thead td.dt-head-right,
table.dataTable tfoot th.dt-head-right,
table.dataTable tfoot td.dt-head-right {
text-align: right; }
table.dataTable thead th.dt-head-justify,
table.dataTable thead td.dt-head-justify,
table.dataTable tfoot th.dt-head-justify,
table.dataTable tfoot td.dt-head-justify {
text-align: justify; }
table.dataTable thead th.dt-head-nowrap,
table.dataTable thead td.dt-head-nowrap,
table.dataTable tfoot th.dt-head-nowrap,
table.dataTable tfoot td.dt-head-nowrap {
white-space: nowrap; }
table.dataTable tbody th.dt-body-left,
table.dataTable tbody td.dt-body-left {
text-align: left; }
table.dataTable tbody th.dt-body-center,
table.dataTable tbody td.dt-body-center {
text-align: center; }
table.dataTable tbody th.dt-body-right,
table.dataTable tbody td.dt-body-right {
text-align: right; }
table.dataTable tbody th.dt-body-justify,
table.dataTable tbody td.dt-body-justify {
text-align: justify; }
table.dataTable tbody th.dt-body-nowrap,
table.dataTable tbody td.dt-body-nowrap {
white-space: nowrap; }

table.dataTable,
table.dataTable th,
table.dataTable td {
box-sizing: content-box; }

/*
* Control feature layout
*/
.dataTables_wrapper {
position: relative;
clear: both;
*zoom: 1;
zoom: 1; }
.dataTables_wrapper .dataTables_length {
float: left; }
.dataTables_wrapper .dataTables_filter {
float: right;
text-align: right; }
.dataTables_wrapper .dataTables_filter input {
margin-left: 0.5em; }
.dataTables_wrapper .dataTables_info {
clear: both;
float: left;
padding-top: 0.755em; }
.dataTables_wrapper .dataTables_paginate {
float: right;
text-align: right;
padding-top: 0.755em; }
.dataTables_wrapper .dataTables_paginate .paginate_button {
box-sizing: border-box;
display: inline-block;
min-width: 1.5em;
padding: 4px 10px;
margin-left: 2px;
text-align: center;
text-decoration: none !important;
cursor: pointer;
*cursor: hand;
color: #333333 !important;
border: 1px solid transparent;
border-radius: 2px; }
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
color: #333333 !important;
border: 1px solid #979797;
background-color: white;
border: 1px solid #b1b1b1;
border-radius: 4px;
color: #4a5574;

/* W3C */ }
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
cursor: default;
color: #666 !important;
border: 1px solid transparent;
background: transparent;
box-shadow: none;

padding: 4px 10px 4px 10px;
border: 1px solid #b1b1b1;
border-radius: 4px;
color: #4a5574;

}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
color: white !important;
border: 1px solid #a3a3a3;
background-color: #eaeaea;
padding: 4px 10px 4px 10px;
border: 1px solid #b1b1b1;
border-radius: 4px;
color: #4a5574;
box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);

/* W3C */ }
.dataTables_wrapper .dataTables_paginate .paginate_button:active {
outline: none;

padding: 4px 10px 4px 10px;
border: 1px solid #b1b1b1;
border-radius: 4px;
color: #4a5574;

box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}
.dataTables_wrapper .dataTables_paginate .ellipsis {
padding: 0 1em; }
.dataTables_wrapper .dataTables_processing {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 40px;
margin-left: -50%;
margin-top: -25px;
padding-top: 20px;
text-align: center;
font-size: 1.2em;
background-color: white;
background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(25%, rgba(255, 255, 255, 0.9)), color-stop(75%, rgba(255, 255, 255, 0.9)), color-stop(100%, rgba(255, 255, 255, 0)));
background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); }
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate {
color: #828282; 
}
.dataTables_wrapper .dataTables_scroll {
clear: both; }
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
*margin-top: -1px;
-webkit-overflow-scrolling: touch; }
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td {
vertical-align: middle; }
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th > div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td > div.dataTables_sizing, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th > div.dataTables_sizing,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td > div.dataTables_sizing {
height: 0;
overflow: hidden;
margin: 0 !important;
padding: 0 !important; }
.dataTables_wrapper.no-footer .dataTables_scrollBody {
border-bottom: 1px solid #111111; }
.dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,
.dataTables_wrapper.no-footer div.dataTables_scrollBody > table {
border-bottom: none; }
.dataTables_wrapper:after {
visibility: hidden;
display: block;
content: "";
clear: both;
height: 0; }

@media screen and (max-width: 767px) {
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
float: none;
text-align: center; }
.dataTables_wrapper .dataTables_paginate {
margin-top: 0.5em; } }
@media screen and (max-width: 640px) {
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
float: none;
text-align: center; }
.dataTables_wrapper .dataTables_filter {
margin-top: 0.5em; } }


.button_slide {
  cursor: pointer;
  -webkit-transition: ease-out 0.4s;
  -moz-transition: ease-out 0.4s;
  transition: ease-out 0.4s;
}


.slide_down:hover {
  background: rgba(255,255,255,0.1);
}

.slide_right:hover {

  background: rgba(0,0,0,0.05);
}

div.add_comment {
    margin-bottom:20px; 
    box-shadow: 3px 3px 10px 0px rgba(0,0,0,0.1);
    padding: 10px;
}
div.old_comment {
    margin-bottom:20px; 
    /*
    box-shadow: 3px 3px 10px 0px rgba(0,0,0,0.1);
    padding: 10px;
    */

}

table.details_list {
    margin-bottom:20px; 
    box-shadow: 3px 3px 10px 0px rgba(0,0,0,0.1);
    padding: 10px;

}
table.details_list tr td {
    padding:7px;
}
table.file_list{
    margin-bottom:20px; 
    box-shadow: 3px 3px 10px 0px rgba(0,0,0,0.1);
    padding: 10px;

}
table.file_list tr td{
    padding:10px;
}

div.count_change{
    margin-bottom:20px; 
    box-shadow: 3px 3px 10px 0px rgba(0,0,0,0.1);
    padding: 10px;

}

div.list_show_button{
    position: absolute; 
    left:0px; 
    top:30px;
    z-index:10; 
    display:none;

    background: #ffffff;
    box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.2);

    transition:0.3s;
    border-radius: 4px;
    padding:1px;
    text-align:center;
}
div.list_show_button:hover{
    background: #eee;
}

div.list_show_button i{
    width:20px;
    margin-top:2px;
    font-size:16px;
    color:#000000;
}

div.list_close_button{
    transition:0.3s;
    position: absolute; 
    left:240px; 
    z-index:10; 
    display:none;
    background: #ffffff;

    border: 1px solid #eee;
    top:-8px;
    box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.2);
    padding:1px;
    border-radius: 4px;
    text-align:center;
}
div.list_close_button i{
    width:20px;
    margin-top:2px;
    font-size:16px;
    color:#000000;
}

div.list_close_button:hover{
    background: #eee;
}

div.option_header{
    background-color: rgba(242,242,242,0.5);
    padding:20px;
    width:100%;
    margin-left:-20px;
    margin-right:-20px;
    margin-top:20px;
    margin-bottom:20px;

    font-style:normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 32px;
}

div.option_list_narrow{
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    width:900px;
    margin-bottom:20px;
}
div.option_list_wide{
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    margin-bottom:20px;
}


div.option_item_odd{
    padding:20px;
    padding-left:40px;
    background: #ffffff;
}
div.option_item_even{
    padding:20px;
    padding-left:40px;
    background: #FBFBFC;
    border-top:1px solid rgba(0, 0, 0, 0.08);
    border-bottom:1px solid rgba(0, 0, 0, 0.08);
}

div.option_spacer{
    clear:both;
}

div.option_item_topic{
    font-style: normal;
    font-weight: 600;
    width:380px;
    font-size: 16px;
    line-height: 28px;
    vertical-align:top;
    /* identical to box height, or 200% */

    display:inline-block;

    /* DK-Grey-1 */

    color: #3C3C3C;

}
div.option_item_option{
    display:inline-block;
    line-height: 28px;
    width:370px;
}

/* css for option inside options:*/
div.option_item_sub_option{
    display:inline-block;
    line-height: 28px;
    width:100%;
}

div.option_item_sub_option #search_box_div{
    text-align: right;
    margin-bottom: 10px;
    width: 100%;
    margin-top: -50px;
    float:left;
}
div.option_item_sub_option table tr td:first-child {
    width:350px;
}
div.option_item_desc{
    display:block;
    clear:both;

    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 32px;
    /* identical to box height, or 200% */


    /* DK-Grey-2 */

    color: #828282;
}

.fab{
    font-style: normal;
    font-weight: 400;
    font-size: 32px;
    line-height: 32px;
    /* identical to box height, or 100% */
    text-align: center;
    /* DK-Black */
    color: #000000;
}

dialog.generic-overlay-padding {
    /*display: table;*/ /* this makes it nice and overflow-y... */
    min-width: 250px;
    padding: 0;
    border: hidden;
    top: 0;
    z-index: -1;
    background: transparent;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    max-height: 90%;
    overflow: visible;
}


.generic-overlay-padding div.generic-overlay-topic{
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 24px;
    background: var(--header_color);
    color: #fff;
    margin:auto auto;
    padding: 12px 0px 10px 20px;

    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.generic-overlay-padding div.generic-overlay-topic div.generic-overlay-title{
    -webkit-user-select: none;
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 24px;
    display:inline-block;
}
.generic-overlay-padding div.generic-overlay-topic div.generic-overlay-close{
    display:inline-block;
    height:24px;
    width:50px;
    float:right;
}
.generic-overlay-padding div.generic-overlay-topic div.generic-overlay-close:hover{
    color:#aaaaaa;
}


.generic-overlay-padding div.generic-overlay-topic div.generic-overlay-close i{
    float:right;
    width:24px;
    height:24px;
    text-align:center;
    padding:0px;
    padding-left:8px;
    padding-right:12px;
    font-size:24px;
    transition: all 0.3s ease;
    display:inline-block;
}

.generic-overlay-padding div.generic-overlay-content{
    -webkit-user-select: none;
    background: rgba(255, 255, 255, 1); 
    overflow: auto;
    text-align:center;
    margin:auto auto;
    max-height: calc(90vh - 46px - 10px - 10px);
    padding: 10px 20px;

    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    user-select: text;
}

.generic-overlay-padding div.generic-overlay-content pre{
    padding-left:150px;
    
    font-size:11px;
    text-align:left;
}

.generic-overlay-padding div.generic-overlay-content div.generic-content_left{
    padding-left:50px;
    
    font-size:18px;
    text-align:left;
}
.generic-overlay-padding div.generic-overlay-content div.button_row{
    /*margin-top:30px;*/
    clear:both;
}

.generic-overlay-padding div.generic-overlay-content div.button_row button{
    background: #F2F2F2;
    /* DK-Grey-4 */

    border: 1px solid #DEDEDE;
    box-sizing: border-box;
    border-radius: 4px;
    color: #000000;
    margin-left:10px;
    margin-right:10px;
}
.generic-overlay-padding div.generic-overlay-content div.button_row button:hover{
    
    background: #E2E2E2;
}

.generic-overlay-padding div.generic-overlay-content div.button_row button:active{
    background: #F2F2F2;
}

div.overlay_form {
    margin-top:10px;
    text-align: left; 
    width:100%; 
    font-size:16px; 
    position:relative;
}

div.overlay_form .row{
    margin-bottom:10px;
    display: block;
}

div.overlay_form .row .form-label{
    display: inline;
    margin-left:20px;
    width:200px;
    padding-right: 20px;
}
    
div.overlay_form .row .form-field{
    display: inline;
    float:right;
}

#tooltip {
    background-color:#ffffff;
    padding:7px;
    border:1px solid #fdfdfd;
    border-radius: 4px;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
    width:340px;
}

.tooltip_hover .tooltip_text {
    visibility: hidden;
    width: 100px;
    color: #327495;
    background-color: #d9edf7;
    border-color: #bcdef1;
    white-space: pre-wrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    padding:10px;
    border-radius: 4px;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
    cursor: default;
}

.tooltip_text {
    z-index: 15;
    bottom: 50px;
}

.tooltip_hover {
    position: absolute;
    display: inline;
    color: #327495;
    z-index: 1;
    left: -5px;
    cursor: default;
}

.tooltip_hover:hover .tooltip_text {
    visibility: visible;
}

.task-tag {
    -webkit-appearance: none;  /* Override default CSS styles */
    appearance: none;
    position: relative;
    width: 100%;
    height: 20px;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 10px;
    background: #d3d3d3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    outline: none;
    opacity: 0.7;
    float:left;
    -webkit-transition: .2s; /* 0.2 seconds transition on hover */
    transition: opacity .2s;
    border:none;
}
a .task-tag{
    color: #000;
    display:block;
    text-decoration: none;
}

tr.task-tag > td {
    vertical-align: middle;
}
tr.task-tag {
    margin-top:5px;
    line-height: 15px;
}

.task-tag .editable{
    display:inline-block;
    padding:0px;
    margin: 0px 0px 0px 0px;
    overflow:hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
    height:15px;
    border: 0px solid #999;
}

#tag_list div{
    margin-bottom:5px;
}

.task-select {
    background: #516ca6;
}

.task-header {
    -webkit-appearance: none;  /* Override default CSS styles */
    appearance: none;
    position: relative;
    width: 100%;
    height: 20px;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 10px;
    background: #9faace;
    outline: none;
    opacity: 1;
    cursor:default;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
}

.task-textarea {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.task_item_select {
    float:left;
    width:100%;
    height:150px;
    max-height: 150px;
    overflow-y: auto;
    padding: 10px;
    box-sizing: border-box;
}
tr.header {
    background: #a6b3cd;
    text-align: left;
    height: 24px;
}

.table-column{
    float: left;
    width: 50%;
    padding: 10px;
    box-sizing: border-box;
    border-spacing: 0;
    border: 1px solid #b1b1b1;
    border-radius: 14px;
    box-shadow: 0px 3px 2px  rgba(0,0,0,0.6);
    -moz-box-shadow: 0px 3px 2px  rgba(0,0,0,0.6);
    -webkit-box-shadow: 0px 3px 2px  rgba(0,0,0,0.6);
    -o-box-shadow: 0px 3px 2px  rgba(0,0,0,0.6);
    min-width:320px;
}
.table-column > table {
    width: 100%;
}
.table-column table td {
}

.table-column-no-border{
    float: left;
    width: 50%;
    box-sizing: border-box;
    border-spacing: 0;
    min-width:320px;
}
.table-column-border{
    padding: 10px;
    margin: 10px;
    box-sizing: border-box;
    border-spacing: 0;
    border: 1px solid #b1b1b1;
    border-radius: 14px;
    min-width:320px;
    min-height: 150px;
}
.table_padding{
    text-align: left;
    width:100%;
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.table_padding > thead th {
    position: sticky; top: 0; z-index: 1;
    border-bottom: 1px #6d9ab0 solid;
    text-align: left;
    box-sizing: border-box;
    outline: none;
    opacity: 1;
    cursor:default;
    padding: 3px 0px 3px 0px;
}
.table_padding tr, .table_padding td {
    box-sizing: border-box;
    border:none;
    box-shadow: none;
    padding: 3px 0px 3px 0px;
    text-align: left;
}

.table_padding > thead, .table_padding > tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.table_padding > tbody {
    display: block;
    overflow-y: auto;
    table-layout: fixed;
}
.table-column-no-border td,.table-column-border th {
    vertical-align: top;
}
.task-tag:hover {
    opacity: 1;
}

.remove-task {
    float:right;
    cursor:pointer;
    width: 16px;
    height: 16px;
    border-radius: 5px;
    display: block;
    margin-left: 5px;
    text-align: center;
    opacity: 0.7;
}
.remove-task:hover{
    opacity: 1;
}

.task.action {
    cursor: pointer;
}

.task.action:hover {
    text-decoration: underline;
}

.task_group_column_drag {
    border: 2px #314a757d outset !important;
    border-radius: 5px;
    border-collapse: separate;
    padding-left: 5px !important;
    margin: 5px;
    width: calc(100% - 10px) !important;
}

.task-type-icon {
    height: 20px;
    width: 20px;
    line-height: 20px;
    padding:0;
    text-align: center;
    font-size: 15px;
    border-radius: 5px;
    margin: 5px;
}

.task-type-icon:before {
    mix-blend-mode: difference;
    color: white;
}

tr.settings-table > td {
    vertical-align: middle;
}

span.task-project {
    color: white;
    border-radius: 5px;
    padding: 0 5px;
}

div#task-project-search {
    display: block;
    border: 1px #000 solid;
    box-shadow: 2px 2px 2px 0px #333;
}

.calender_task_item{
    border: 1px #bcdef1 solid;
    border-spacing: 0;
    box-sizing: border-box;
    border-radius: 2px;
    padding-left: 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    outline: none;
}


.tooltip_hover .tooltip_text {
    visibility: hidden;
    width: 100px;
    color: #327495;
    background-color: #d9edf7;
    border-color: #bcdef1;
    white-space: pre-wrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    padding:10px;
    border-radius: 4px;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
    cursor: default;
}

.tooltip_text {
    z-index: 15;
    bottom: 50px;
}

.tooltip_hover {
    position: absolute;
    display: inline;
    color: #327495;
    z-index: 1;
    left: -5px;
    cursor: default;
}

.tooltip_hover_error {
    position: relative;
    display: inline;
    color: #f32924;
    z-index: 1;
    cursor: default;
}
.tooltip_hover:hover .tooltip_text {
    visibility: visible;
}

/*Element to show small information text inside:*/
div.border-blue {
    display: inline-block;
    padding: 4px 10px 4px 10px;
    margin-bottom: 1px;
    margin-top: 1px;
    font-size: 13px;
    line-height: 20px;
    color: #333333;
    text-align: center;
    vertical-align: middle;
    background-repeat: repeat-x;
    border: 1px solid #327495;
    border-radius: 4px;
    font-weight:bold;
    zoom: 1;
}

/*
    MARKDOWN SUB CLASSES
 */

span.markdown {
    white-space: pre-wrap;
}

span.markdown pre {
    counter-reset: line;
}

span.markdown pre code {
    counter-increment: line;
}

span.markdown pre code::before {
    content: counter(line);
    display: inline-block;
    min-width: 3.5em;
    border-right: solid 1px;
    padding: 0 .5em;
    margin-right: .5em;
}

span.markdown blockquote {
    padding: 0 10px 10px;
    margin: 0 0 10px;

}

/*

    FANCY EDITOR

 */

dialog div#fancy-editor {
    display: flex;
    min-width: 600px;
    min-height: 450px;
    max-height: 75vh;
    background: #fff;
    margin: 25px auto;
    border-radius: 1em;
    flex-direction: column;
}

dialog div#fancy-editor div#info {
    width: 100%;
    display: block;
    border-bottom: solid 1px #3333331f;
    text-align: center;
}

dialog div#fancy-editor div#info div#info-left,
dialog div#fancy-editor div#info div#info-right {
    width: calc(50% - 5px);
    display: inline-block;
    padding-bottom: 25px;
    vertical-align: top;
}
dialog div#fancy-editor div#edit-container {
    display: flex;
    flex-direction: row;
    flex: 1;
    height: 100%;
    min-height: 0;
}

dialog div#fancy-editor div#editor,
dialog div#fancy-editor div#right {
    padding: 50px 0 0;
}

dialog div#fancy-editor div#editor {
    width: 50%;
    display: inline-block;
    border-right: solid 1px #3333331f;
    text-align: center;
}

dialog div#fancy-editor div#right {
    width: calc(50% - 1px);
    display: inline-block;
}

dialog div#fancy-editor div#info div#editor_text,
dialog div#fancy-editor div#info div#preview-text {
    padding: 0 10%;
}

dialog div#fancy-editor div#editor textarea#translation,
dialog div#fancy-editor div#preview,
dialog div#fancy-editor div#guide {
    min-width: 80%;
    width: 80%;
    max-width: 80%;
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
    margin: 0 auto;
}

dialog div#fancy-editor div#editor textarea#translation {
    position: relative;
}

dialog div#fancy-editor div#preview,
dialog div#fancy-editor div#guide {
    border: solid 1px #3333331f;
    display: block;
}

.tooltip-parent .tooltip-text {
    position: absolute;
    background: #6c6c6c;
    color: #fff;
    padding: .5em;
    border-radius: 3px;
    margin-top: 5px;
    font-size: 1em;
    text-align: center;
    line-height: 1.5em;
    opacity: 0;
    transition: opacity, visibility;
    transition-delay: .5s;
    display: block;
    visibility: hidden;
    font-family: 'Open Sans',verdana, arial, helvetica;
}

.tooltip-parent:hover .tooltip-text {
    opacity: 1;
    visibility: visible;
    transition-delay: .1s;
}

.tooltip-parent .tooltip-text.long{
    transition-delay: 1s;
}


.main-menu li.selected{
    /*abackground: #2a7ac8; /* Old browsers */

    font-weight: bold;
    border-bottom: 3px solid var(--tetriary_color);

}

.main-menu li:hover{
    border-bottom:3px #2a7ac8 solid;

}

.main-menu a img {
    height:16px;
}

.main-menu-more {
    display: inline-block;
    position: absolute;
}
.main-menu-more a{
    display: none;
}
.main-menu-more ul {
    position: absolute;
    display: none;
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.5);
    padding-left:0px;
    margin-left:0px;
    top: calc(100% + 3px);
    right: 0;
    background-color: var(--secondary_color);
    margin-right: 0;
}
.main-menu-more li {
    width: 100%;
    background-color: var(--secondary_color);
    border-bottom:3px solid var(--tetriary_color);
}

translation {
    cursor: pointer;
}

translation:hover {
    text-decoration: underline red wavy;
}

*:focus > translation {
    text-decoration: underline darkred wavy;
}
.button[disabled]:hover{
    cursor: not-allowed;
}
.button-success[disabled]:hover{
    cursor: not-allowed;
}
.button-success[disabled] {
    cursor: default;
    background-image: none;
    opacity: 0.65;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.no-shadow {
    width:100%;
    margin-top:5px;
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.week_select {
    padding: 0px;
}
.week_select > li {
    display: inline-block;
    width:25px;
    padding-left:8px;
    padding-right: 8px;
    margin: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    vertical-align: middle;
    text-align:center;
    cursor: pointer;
}
.week_select > li:hover {
    background: #e5e5e5;
}

tr.queue_header th {
    position: sticky;
    top: 0;
    background: white;
}

tr.log_highlight {
    filter: drop-shadow(2px 4px 6px rgba(33, 33, 33, 0.5));
}

a.share_link {
    text-decoration: none;
}

a.share_link i.share_icon {
    opacity: 0;
}

a.share_link:hover i.share_icon {
    opacity: 1;
}

mark.no_mark{
    background: transparent;
    padding:0px;
    margin:0px;
    font-weight: normal;
    border-bottom: 0px;
}

mark.bold{
    font-weight: bold;
    border-bottom:1px #2a7ac8 solid;
    background: transparent;
    padding:0px;
    margin:0px;
}

.json_edit {
    border: 1px solid #DEDEDE;
    box-sizing: border-box;
    border-radius: 4px;
    color: black;
    outline: none;
    text-align: left;
    display: inline-block;
    white-space: pre-wrap;
    resize: both;
    overflow-wrap: break-word;
    overflow-y: auto;
    overflow-x: hidden;
    font-size: 12px;
    tab-size:1;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}

/* DROPBOX START */


ul#dropbox_files {
    width: max-content;
}
li.file-remove i {
    margin-left: 10px;
    opacity: 0;
}
li.file-remove:hover i {
    opacity: 1;
}
li.file-remove:hover {
    color: red;
    cursor: pointer;
}

div#dropbox {
    width: calc(100% - 10px);
    height: 100px;
    border: 2px var(--header_color) solid;
    border-radius: 10px;
    cursor: pointer;
}
div#dropbox span#dropbox_guide {
    font-size: 2em;
    font-weight: bold;
    width: 100%;
    height: 100%;
    text-align: center;
    color:var(--header_color);
    line-height: 2em;
    display: block;
}

div#dropbox_placeholder {
    width: calc(100% - 6px);
    height: 104px;
    display: none;
}

div#dropbox_placeholder.dropping {
    display: block;
    opacity: 0;
}

div#dropbox:hover {
    border-color: var(--tetriary_color);
}
div#dropbox:hover span#dropbox_guide {
    color: var(--tetriary_color);
}

div#dropbox.dropping {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    border: none;
    border-radius: 0;

    box-shadow: inset 0 0 20px 15px var(--tetriary_color);
    z-index: 1000;
}

div#dropbox.dropping span#dropbox_guide {
    color: var(--tetriary_color);
    font-size: 3em;
    line-height: 100vh;
}

div#dropbox span#dropbox_guide span#not_dropping {
    display:inline;
}

div#dropbox span#dropbox_guide span#is_dropping {
    display:none;
}

div#dropbox.dropping span#dropbox_guide span#not_dropping {
    display:none;
}

div#dropbox.dropping span#dropbox_guide span#is_dropping {
    display:inline;
}


    /* the menubar would be showing over the dropshadow */
body:has(div#dropbox.dropping) .menubar {
    z-index: 0;
}

/* DROPBOX END */

/* ACTIONSTEP MAIN PAGE */

body.actionstep {
    max-height: 100vh;
    overflow-y: clip;
}

body.actionstep div#general_actions {
    display: inline-block;
    position: absolute;
    right: 5px;
    height: 35px;
}

body.actionstep.in-message div#general_actions {
    display: none;
}

body.actionstep div#actionstep_header {
    background: #314a75;
    width: 100%;
    z-index: 999;
    height: 35px;
    line-height: 35px;
    padding-bottom: 4px;
}

body.actionstep div#actionstep_header div.logo_container {
    height: 35px;
    line-height: 35px;
    max-width: calc(100% - 90px);
    margin: 0;
    display: inline-block;
}

body.actionstep div#actionstep_header div.logo_container img.main {
    height: 35px;
    max-width: calc(100vw - 45px);
}

body.actionstep div#actionstep_header div.logo_container:has(img.power) {
    display: none;
}

body.actionstep i.button.button-selected {
    color: #fff;
    background-color: #314A75;
}

body.actionstep div#redirect-home {
    font-size: 2em;
    width: calc(100vw - 3em);
    margin-top: calc(40vh - 2em);
    margin-left: 1.5em;
    margin-right: 1.5em;
    padding: 0;
    line-height: 1.7em;
    position: relative;
}

body.actionstep div#redirect-home i.far {
    padding: 10px;
}

body.actionstep div#message_list {
    width: 95%;
    margin-left: 2.5%;
    position: relative;
    margin-top: 5px;
    margin-bottom: 10px;
    max-height: calc(100vh - 50px);
    overflow-y: auto;
}

body.actionstep.in-message a#record {
    display: none;
}

body.actionstep a#record {
    position: fixed;
    right: 5vw;
    bottom: 5vh;
    height: 2em;
    width: 2em;
    font-size: 2em;
    line-height: 2em;
    border-radius: 1em;
    padding: 0;
    margin: 0;
    transition: opacity .1s;
}

body.actionstep:has(#message_list tr:hover) a#record {
    opacity: .7;
}

body.actionstep div#message_list th i#refresh {
    padding-left: 15px;
}

body.actionstep div#message_list div.lds-roller {
    margin: 20vh 20vw;
}

body.actionstep div#message_list table {
    width: 100%;
}

body.actionstep div#message_list #top_bar {
    height: 30px;
    width: 100%;
    margin: 0 0 5px 0;
}

body.actionstep div#message_list #top_bar i:nth-child(1):not(span#message_actions i) {
    margin-right: 20px;
}

body.actionstep div#message_list #top_bar span#message_actions {
    float: right;
}

body.actionstep div#message_list audio {
    margin: 5px 0;
    width: 90%;
}
body.actionstep div#message_list textarea {
    width: 95%;
    height: min-content;
}

body.actionstep div#message_list pre {
    white-space: pre-wrap;
    word-break: break-word;
}

body.actionstep div#message_list > div {
    width: 100%;
    margin-top: 10px;
}

body.actionstep div#message_list span.comment_by.admin {
    color:#aa0000;
}

body.actionstep div#message_list span.comment_by.management {
    color:#ff5555;
}

body.actionstep div#message_list span.comment_by.customer {
    color:#00aaaa;
}
body.actionstep div#message_list span.comment_by.writer {
    color:#00aa00;
}

body.actionstep div#message_list span.comment_text pre {
    width: calc(100% - 50px);
    padding:0;
    margin:0;
    border:0;
    background:#ffffff;
}

/* ACTIONSTEP END */