﻿/*@font-face
{
    font-family: UbuntuCustom;
    src: url("Ubuntu-R.eot");
}
@font-face
{
    font-family: UbuntuCustom;
    src: url("Ubuntu-R.ttf") ;
}
*/

html
{
    height: 100%;
}

body
{
    background-color: #f9f9f9;
    margin: 0px;
    padding: 0px;
    color: rgb(52, 52, 52);
    font-family: Calibri, Arial, sans-serif;
    font-size: 12px;
    height: 100%;
}

a, a:active, a:link, a:visited
{
    color: #0077cc;
}

#content
{
    padding-left:16px;
    padding-right:16px;
}

#breadcrumb
{
    padding-left:16px;
    padding-right:16px;
}

#pageContainer
{
    position: relative;
    margin: 0;
    padding: 0;
}

.centered_content
{
    width: 960px; /* left:50%;     margin-left:-480px;*/
    margin: 0px auto;
}

#innerContainer
{
    margin-top: 20px; /*border:1px solid gray;*/
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
    background-color: white;
    padding-bottom: 16px;
    overflow: hidden;
    min-height: 520px;
    border:1px solid silver;
}

#header
{
    height: 90px;
    position:relative;
}

#mainLogo
{
    background-image: url(../images/logo3.png);
    width: 300px;
    height: 70px;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-top:16px;
}

#customerLogo
{
    position:absolute;
    top:10px;
    right:32px;
}

#loginBox
{
    position: absolute;
    top: 10px;
    right: 10px;
    display: none;
}

.largeLabel
{
    color: #0c6389;
    height: 40px;
    background-color: whitesmoke;
    line-height: 40px;
    padding-left: 16px;
}

#filter
{
    width: 928px;
    background-color: #f9f9f9;
    border-top: 1px solid #e1e1e1;
    border-bottom: 1px solid #e1e1e1;
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 20px;
    padding-bottom: 20px;
}

#dashboard
{
    width: 100%;
    background-color: White;
}

.meter
{
    float: left;
    margin-left: 14px;
    margin-right: 14px;
    margin-bottom: 14px;
    margin-top: 14px;
    cursor: pointer;
    position: relative;
}

.faded
{
    opacity: 0.4;
    -moz-opacity: 0.4;
    -webkit-opacity: 0.4;
    filter: alpha(opacity=40);
}

/*#locatie li.select2-result.select2-result-selectable
{
    margin-left:-30px !important;
    font-size:0.8em;
}
*/


.drilldowntitle
{
    cursor: pointer;
}

#drilldown
{
    /*display:none;*/
}


.KT_Vraag
{
    font-weight: bold;
}

#period
{
    width: 100%;
}

.periode_keuze
{
    font-size: 1.2em;
    color: #0077cc !important;
    cursor: pointer;
}

.periode_keuze.selected
{
    color: Black !important;
}

.meter_info
{
    position: absolute;
    top: 0px;
    right: 0px;
    background-image: url(../../../images/info_14.png);
    width: 14px;
    height: 14px;
}

#menubar
{
    width: 100%;
    height: 40px;
    border-bottom: 5px solid #4ec3c9;
    background-color: #118CC1;
    position:relative;
}

.meter_title
{
    text-align: center;
    height: 24px;
    line-height: 24px;
}

.filterLabel
{
    font-size: 14px;
    color: #118cc1;
}

.filterBlock
{
    float: left;
    width: 220px;
    margin-left: 5px;
    margin-right: 5px;
    position: relative;
}

.blockHeader
{
    color: #0c6389;
    height: 40px;
    background-color: whitesmoke;
    line-height: 40px;
    margin-left: 16px;
    margin-right: 16px;
}

#breadcrumb
{
    color: #0c6389;
    height: 40px;
    line-height: 40px;
    padding-left: 16px;
    padding-right: 16px;
    background-color: whitesmoke;
    position:relative;
}

#highlevel_meters
{
    background-color: White;
}

#footer
{
    margin-top: 16px;
    border-top: 5px solid #e6e6e6;
    width: 100%;
    background-color: #118CC1;
    color: White;
}

#footer a, #footer a:visited, #footer a:hover
{
    color: White;
}

#footer-outline
{
    width: 100%;
    border-top: 5px solid #1398D2;
}

#footer-centered
{
    width: 960px;
    margin: 0 auto;
    padding-top: 20px;
    min-height: 224px;
}

#footer-logo
{
    width: 200px;
    height: 37px;
    background-image: url(../images/HG_logo_RGB_wit.png);
}

#footer-left
{
    float: left;
    margin-left: 16px;
    width: 240px;
}

#footer-content
{
    float: left;
    width: 520px;
}

#footer-right
{
    float: left;
}

.button
{
    width: 100%;
    background: #118cc1;
    border: 1px solid #0c6389;
    color: white;
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    line-height: 32px;
    height: 32px;
    margin: 0;
    outline: none;
    text-align: center;
    text-decoration: none;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-transition: background 0.15s ease-in-out;
    -moz-transition: background 0.15s ease-in-out;
    -ms-transition: background 0.15s ease-in-out;
    -o-transition: background 0.15s ease-in-out;
    transition: background 0.15s ease-in-out;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
    -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
    -webkit-appearance: none;
}

.button:hover
{
    color: white;
    background-color: #0c6389;
}

.button:active
{
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset;
    -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset;
}

.button:focus
{
    -webkit-box-shadow: 0 0 4px #2ba6cb inset;
    -moz-box-shadow: 0 0 4px #2ba6cb inset;
    box-shadow: 0 0 4px #2ba6cb inset;
}

.button.large
{
    font-size: 17px;
    padding: 15px 30px 16px;
}

.button.medium
{
    font-size: 14px;
}

.button.small
{
    font-size: 11px;
    padding: 7px 14px 8px;
}

.button.tiny
{
    font-size: 10px;
    padding: 5px 10px 6px;
}

.button.centered
{
    width: 100%;
    display: block;
    text-align: center;
}

.breadcrumb_separator
{
    background-image: url(../images/breadcrumb_separator.png);
    width: 24px;
    height: 40px;
    background-repeat: no-repeat;
    background-position: center center;
    float: left;
}

.breadcrumb_item
{
    float: left;
}

.breadcrumb_item.link
{
    cursor: pointer;
}

.liteAccordion.basic .slide > h2 span
{
    background-color: white !important; /* #0c6389 */
}

.liteAccordion.basic .slide > h2
{
    background-color: #F2F2F2 !important;
    color:#0C6389 !important;
    line-height:224%;
    font-size:12px;
}

.liteAccordion .slide > h2 span 
{
    display:block;
    padding-right:8%;
    text-align:right;
    height:90%;
    margin-top:5px;
}

.btn
{
    position: relative;
    display: inline-block;
    overflow: visible;
    padding: 5px 10px;
    font-size: 10px;
    margin-left:4px;
    margin-right:4px;
    line-height: 18px;
    color: #0c6389;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    background-color: #ccc;
    background-repeat: no-repeat;
    border: 1px solid #ccc;
    cursor: pointer;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    background-color: #ddd;
    background-repeat: repeat-x;
    background-image: -khtml-gradient(linear, lefttop, leftbottom, from(white), to(#dddddd));
    background-image: -moz-linear-gradient(white, #dddddd);
    background-image: -ms-linear-gradient(white, #dddddd);
    background-image: -webkit-gradient(linear, lefttop, leftbottom, color-stop(0%, white), color-stop(100%, #dddddd));
    background-image: -webkit-linear-gradient(white, #dddddd);
    background-image: -o-linear-gradient(white, #dddddd);
    background-image: linear-gradient(white, #dddddd);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#dddddd');
}

.btn:hover
{
    text-decoration: none;
    background-color: #d8d8d8;
    background-image: -khtml-gradient(linear, lefttop, leftbottom, from(#f8f8f8), to(#d8d8d8));
    background-image: -moz-linear-gradient(#f8f8f8, #d8d8d8);
    background-image: -ms-linear-gradient(#f8f8f8, #d8d8d8);
    background-image: -webkit-gradient(linear, lefttop, leftbottom, color-stop(0%, #f8f8f8), color-stop(100%, #d8d8d8));
    background-image: -webkit-linear-gradient(#f8f8f8, #d8d8d8);
    background-image: -o-linear-gradient(#f8f8f8, #d8d8d8);
    background-image: linear-gradient(#f8f8f8, #d8d8d8);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    border-color: #bbb;
}

.btn.centered
{
    width: 100%;
    display: block;
    margin: 10px auto;
    text-align: center;
}


.menu_item
{
    padding-right: 24px;
    float: left;
    color: White;
    cursor: pointer;
    line-height: 40px;
    height: 40px;
}

#menu_content
{
    position:relative;
}

.slidecontainer
{
    background-color: #f9f9f9;
    border-bottom: solid 5px #e6e6e6;
}

#references
{
    background-color: #f2f2f2;
    padding-top: 30px;
    padding-bottom: 30px;
}

.client
{
    float: left;
    padding-left: 10px;
    padding-right: 10px;
}

.col3
{
    width: 33.33%;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
    display: inline-block;
    box-sizing: border-box;
}

.largeTitle
{
    color: #0c6389;
    font-size: 24px;
    padding-top: 24px;
    padding-left: 16px;
    padding-bottom: 32px;
}

.col3 h4
{
    color: #118cc1;
    font-size: 13px;
    font-weight: normal;
}

.col3 p img
{
    float: left;
    padding-right: 10px;
    padding-bottom: 10px;
}

.mod_login
{
    position: relative;
    float: right;
    display: block;
}
.mod_login p
{
    padding: 0 0 5px 5px;
    font-weight: bold;
    color: #118cc1;
}

.mod_login_side
{
    width: 100%;
    position: relative;
    float: right;
    padding: 12px;
    margin-top: 30px;
    background: #f2f2f2;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.mod_login_side p
{
    padding: 0 0 5px 5px;
    font-weight: bold;
    font-size:13px;
    color: #118cc1;
}
.mod_login_side a
{
    color: #118cc1;
    text-decoration: underline;
    font-size: 0.7em;
}

input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
select,
textarea {
  border: 1px solid #cccccc;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-transition: background 0.15s ease-in-out;
  -moz-transition: background 0.15s ease-in-out;
  -ms-transition: background 0.15s ease-in-out;
  -o-transition: background 0.15s ease-in-out;
  transition: background 0.15s ease-in-out;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
  color: rgba(0, 0, 0, 0.75);
  display: inline-block;
  font-size: 12px;
  margin: 0 0 12px 0;
  padding: 6px;
}

#buttons
{
    padding-top:16px;
    padding-bottom:16px;
    text-align:center;
    border-top:1px solid #e1e1e1;
}   

#highlevel_meters table.grid-table
{
    border:0px !important;
}

#highlevel_meters table.grid-table tbody tr td
{
    /*background-color:White !important;*/
}

#met_grid
{
    border-collapse:collapse;
}

#met_grid thead tr
{
    background-color:#1398d2;
    color:White;
}

#met_grid tr.row_odd
{
    background-color:#f9f9f9 !important;
}

#met_grid tr.row_odd td
{
    background-color:#f9f9f9 !important;
}

#met_grid tr.row_even
{
    background-color:white !important;
}

#met_grid tr.row_even td
{
    background-color:white !important;
}

#filterbuttons
{
    margin-top:24px;
    width:100%;
    text-align:center;
    margin-bottom:24px;
}

th.headerSort
{
    background-image:url(../../../WBFramework/js/jquery/plugins/tablesorter/themes/white/bg.gif) !important;
    background-position-x:left !important;
}

th.headerSortDown
{
    background-image:url(../../../WBFramework/js/jquery/plugins/tablesorter/themes/white/desc.gif) !important;
    background-position-x:left !important;
}

th.headerSortUp
{
    background-image:url(../../../WBFramework/js/jquery/plugins/tablesorter/themes/white/asc.gif) !important;
    background-position-x:left !important;
}

.grid-table thead tr th
{
    padding-left:20px !important;
}

.paging_area
{
    width:auto;
    margin:0 auto;
}

.paging_area a
{
    background-color:#0E6388;
    background-image:none !important;
    color:White;
}

.paging_area a:hover
{
    background-color:#DFF5FE;
    background-image:none !important;
    color:#0E6388;
}
.paging_area a:hover span
{
    background-image:none !important;
}

.paging_area a.paging_currentpage
{
    background-color:#1398D1 !important;
    color:White;
    border:0px;
}

.paging_currentpage span
{
    background-image:none !important;
}

input.paging_button_first, input.paging_button_last,input.paging_button_next,input.paging_button_previous
{
    display:none;
}

#paging .button
{
    width:20px;
    height:20xp;
    color:White;
    background-color:#0E6388;
    float:left;
}

.ui-widget-header
{
    background-image:none !important;
    background-color:White !important;
    border:0px !important;
}

#s2id_periode_van
{
    float:left;
}

#s2id_periode_tot
{
    float:left;
}

#periodspecific
{
    margin-top:4px;
}

.img_paging
{
    margin:0 auto;
}

.img_paging_button
{
    background-color:#0E6388;
    color:White;
    width:24px;
    height:24px;
    line-height:24px;
    margin-left:1px;
    margin-right:1px;
    float:left;
    text-align:center;
    cursor:pointer;
}

.img_paging_button_active
{
    background-color:#1398D1;
}

.img_paging_button:hover
{
    background-color:#DFF5FE;
    color:#0E6388;
}

.legend
{
    position:absolute;
    right:32px;
    top:12px;
}

.legend_norm
{
    background-color:#8BC53D;
    width:10px;
    height:10px;
    float:left;
}

.legend_score
{
    background-color:#1D87BC;
    width:10px;
    height:10px;
    float:left;
}


.legend_text
{
    float:left;
    font-size:9px;
    line-height:normal;
    padding-left:4px;
    padding-right:10px;
}

.blue_title
{
    font-size: 14px;
    color: #118cc1;   
}

#subcontent
{
    padding-left:15px;
    padding-top:15px;
}

.minmax
{
    width:210px;
    height:16px;
}

.minmax_min
{
    float:left;
    color: #118cc1;  
    width:28px;
    height:16px;
    text-align:center;
}

.minmax_max
{
    float:right;
    color: #118cc1;  
    width:28px;
    height:16px;
    text-align:center;
}

.meter_legend
{
    width:125px;
    margin:0 auto;
    padding-bottom:12px;
}

.meter_legend_norm
{
    float:left;
    margin-right:24px;
    height:16px;
    width:16px;
    background-color:#8BC53D;
    margin:2px 0px 0px 2px;
}

.meter_legend_score
{
    float:left;
    height:16px;
    width:16px;
    background-color:#1D87BC;
    margin:2px 0px 0px 2px;
}

.meter_legend_text
{
    color:Black;
    font-size:12px;
    float:right;
    padding-right:15px;
}

.meter_legend_row
{
    height:20px;
    width:120px;
    background-color:#f5f5f5;
    border:1px solid #e6e6e6;
    line-height:auto;
    margin-bottom:2px;
    margin-top:2px;
}


.meter.disabled img, .meter.disabled .meter_legend,.meter.disabled .minmax
{
    filter:  alpha(opacity=25); 
    zoom: 1;
    -moz-opacity:0.25;
    -webkit-opacity:0.25;
    opacity:0.25;
}

.drilldown_bar
{
    width:728px;
    height:360px;
    overflow:hidden;
}

.language_link
{
    width:16px;
    height:11px;
    float:left;
    margin-left:8px;
    margin-top:10px;
}

.language_link.nl-NL
{
    background-image:url(../images/nl-NL.png);
}

.language_link.en-US
{
    background-image:url(../images/en-US.png);
}

.language_link.de-DE
{
    background-image:url(../images/de-DE.png);
}

.language_link.fr-FR
{
    background-image:url(../images/fr-FR.png);
}
.textboxMLT
{
    padding-left:24px !important;
}

.flagMLT-nl-NL
{
	background-image:url(../../../images/flags/nl-NL.png);
	background-repeat:no-repeat;
	background-position:2px 8px;
	padding-left:24px !important;
}

.flagMLT-en-US
{
	background-image:url(../../../images/flags/en-US.png);
	background-repeat:no-repeat;
	background-position:2px 8px;
	padding-left:24px !important;
}

.flagMLT-de-DE
{
	background-image:url(../../../images/flags/de-DE.png);
	background-repeat:no-repeat;
	background-position:2px 8px;
	padding-left:24px !important;
}

.flagMLT-fr-FR
{
	background-image:url(../../../images/flags/fr-FR.png);
	background-repeat:no-repeat;
	background-position:2px 8px;
	padding-left:24px !important;
}

.form_table td
{
    /*border-top:1px dotted silver;*/
}

td.list_check
{
    cursor:pointer;
}

.smallselect {width:120px;}
.smallselect:focus {width:400px;}

.formrow_content td
{
    border-top:0px;
    line-height:normal;
}

.mainmenu
{
    margin-left:100px;
    width:240px;
    background-color:#f0f0f0;
    height:84px;
    padding-left:100px;
    margin-top:16px;
    margin-bottom:16px;
}

.mainmenu_beheer
{
    background-image:url(../images/beheer.png);
    background-position:0px 0px;
    background-repeat:no-repeat;
}

.mainmenu_rapportage
{
    background-image:url(../images/rapportage.png);
    background-position:0px 0px;
    background-repeat:no-repeat;
}

.mainmenu_systeembeheer
{
    background-image:url(../images/systeembeheer.png);
    background-position:0px 0px;
    background-repeat:no-repeat;
}

.mainmenu_item
{
    color:#BABCBB;
    cursor:pointer;
    line-height:18px;
}

.mainmenu_title
{
    padding-top:12px;
    padding-bottom:8px;
    font-size:14px;
    color:#108CC0;
    
}

input.hasDatepicker
{
    padding:0 !important;
    border:0px !important;
}