.Header 
{
    display: block;
    /*border-bottom: 1px solid black;*/
    width: 100%;
}

.HeaderLeft
{
    background: white url("/Images/clock_64.png") no-repeat !important;
    float: left;
    /*text-align: left;*/
    padding: 5px;
    display: block;
    height: 60px;
    width: 64px;
    /*text-transform:uppercase;*/
}

/* orgineel
.HeaderCenter
{
    float: left;
    font-size: 1.0em;
    display: block;
    text-align: left;
    padding: 0px 0px 50px 5px;
    border-left: 1px solid black
}
*/

.ClockLogoDivider
{
    float:left; 
    display:block; 
    width:15px;
    height:64px;
    border-left: 1px solid black;
}

.HeaderCenter
{
    background: white url("/Images/logo_irmato.png") no-repeat !important;
    width: 250px;
    height:64px;
    float: left;
    margin-top:3px;
}

.HeaderRight
{
    float: left;
    font-family: "Segoe UI",Arial,sans-serif;
    padding-left: 220px;
}

.HeaderRight a:link
{
    color: black;
    text-decoration: none;
    font-size: 1.2em;
}

.Weekno
{
    float: left;
}

.Clock
{
    float: right;
}

.loginName
{
    float: left;
    padding: 25px 0px 0px 0px; 
    font-family: "Segoe UI",Arial,sans-serif; 
    width: 270px;
}

.clear
{
    clear:both;
}

.HorizontalRule
{
    border-bottom: 2px solid black;
}

.Header2
{
    display: block;
}

.LeftMarginPage
{
    float: left;
    padding: 5px;
    min-width: 64px;
    height: 100%;
}

.LeftMarginPageSmall
{
    float: left;
    padding: 5px;
    min-width: 32px;
    height: 100%;
}

.CalendarAndWeektotals
{
    margin-top: 8px;
}

.Calendar
{
    float: left;
}

.Totalen
{
    float: left;
    width: auto;
    height: auto;
}

.Totalen .RadListBox
{
    width: 180px;
}

.DagnaamKolom
{
    width: 70px;
}

.UrenKolom
{
    width: 30px;
    padding-left: 10px !important;
    padding-top: 1px !important;
}

/* Truc voor css specifiek voor IE zonder dat het nodig is deze in aparte file onder te brengen.
 * Dit is een hack en in principe geen goede oplossing. IE accepteert het @media block, andere
 * browsers negeren dit block.
 */
@media screen and (min-width:0\0) { 
    .UrenKolom
    {
        padding-top: 3px !important;
        padding-bottom: 2px !important;
    } 
}

.WeektotalenHeader
{
    font-family: "Segoe UI",Arial,sans-serif;
    font-size: 14px;
    text-align: center;
    padding-left: 0px;
    width:auto;
}

.WeektotalenFooter
{
    font-family: "Segoe UI",Arial,sans-serif;
    font-size: 13px;
    font-weight: bold;
    padding-left: 0px;
    width:auto;
}

.UrenTotaal
{
    padding-left:41px;
}

/* Als totaal geboekt ongelijk aan totaal werkuren: totaal geboekt krijgt rode kleur. */
.UrenTotOngelijkWerkurenTot
{
    color: Red;
}

/* Als totaal geboekt gelijk aan totaal werkuren: totaal geboekt krijgt zwarte kleur. */
.UrenTotGelijkWerkurenTot
{
    color: Black;
}

.WerkurenTotaal
{
    padding-left:6px;
}

/* Geselecteerde items in radlistbox voor weektotalen krijgen geen afwijkende achtergrondkleur, 
 * geen border en geen afwijkende padding (active item heeft padding: 1px 4px 1px 4px).
 */
.Totalen .rlbActive
{
    background-color: White !important;
    border-style:none !important;
    padding: 2px 5px 2px 5px !important;
}

.Totalen .rlbItem, .Totalen .rlbText
{
    line-height: 14px !important;
}

/* Voorkomt dat items in radlistbox voor weektotalen bij hovering een afwijkende kleur krijgen. */
.Totalen .rlbHovered
{
    background-color: White !important;
}

.Menu
{
    float:left;
    width: auto;
    height: auto;
    margin-top: -8px;
}

.Menu .RadMenu .rmItem
{
    min-width: 20px;
    padding: 0px 1px 0px 0px
}

.Menu .RadMenu a.rmLink
{
    text-align: center;
    vertical-align:bottom;
    min-width: 20px;
}

.Menu .RadMenu a.rmLink .rmText
{
    text-align:center;
    vertical-align:middle;
    min-width: 20px;
    height: 65px;
}

.WrappingItem
{
    white-space: normal;
}

.rmItem
{
    text-align:center;
    vertical-align:middle;
}

.mainContent
{
    float: left; 
    padding: 30px 0px 40px 0px;
}

.SmallTextBox50 
{
    width: 50px !important;
}

.UrenBoekenHeader
{
    font-family: "Segoe UI",Arial,sans-serif;
    font-size: 16px;
}

.DummyDefault
{
    display:none;
}

.stepperBlock
{
    float: right; 
    font-family: "Segoe UI",Arial,Helvetica,sans-serif; 
    font-size: 14px
}

.StepButton
{
    font-weight:bold;
    font-size: 15px;
    margin-bottom: -3px;
}

/* Label met nummer van de week wordt via ajax geüpdatet; hierdoor zet Telerik een div om dit label 
 * met class 'RadAjaxPanel' en displayed het div element als block.
 */
.stepperBlock .RadAjaxPanel
{
    display:inline-block !important;
}

/* Class om RadTextBox voor totaal uren in Footer er ongeveer uit te laten zien als een Label. */
.UrenTotaalTextBox
{
    width: 50px !important;
    background-color: #EEEEEE !important;
    /*border-style: none !important;*/
    border: none !important;
    /*border-box: none !important;*/
    text-align:left;
    padding: 0px !important;
    cursor: auto;
}

/* UrenTextBox genereert o.a. span met width van 160px. 
   Onderstaande constructie brengt dit terug naar 50px.
*/
.UrenTextBox span
{
    width: 40px !important;
}

.TtCTextBox span
{
    width: 55px !important;
}

.ErrorNotification
{
    color:Red;
}

.GirdFooterText
{
    color: Black;
    text-align: right;
    font-weight: bold;
}

.loading
{
    background-color: #fff;
    height: 100%;
    width: 100%;
}

.noUrenRecordsNotification
{
    font-size: 1.2em;
    color: Red;
    padding: 5px 5px 10px 5px;
}

/* Styling voor CommandItemTemplate RadGrid */
.commandItemLeft
{
    float: left;
    padding: 5px 5px;
}

.copyButton
{
    padding: 5px 5px 5px 25px;
}

.copyImage
{
    border: none;
    padding-right: 4px;
}

.commandItemRight
{
    float: right;
    font-family: "Segoe UI",Arial,sans-serif;
    font-weight: bold;
    padding: 5px 5px;
}

/* Styling textboxen voor overzicht van totalen van uren voor de week (onder urengrid) */
.urenTotaalBlok
{
    float: left;
    margin: 10px 50px 0px 0px;
}

.UrenTotaalBlokLabel
{
    font-family: "Segoe UI",Arial,Helvetica,sans-serif;
    font-size: 12px;
    line-height: 16px;
}

.UrenTotaalBlokTextBox
{
    cursor: default;
    height: 18px;
}

.UrenOnverantwoord
{
    color:Red;
}

/* RadTextBox genereert o.a. span met width van 160px. Onderstaande maakt width 50px. */
.textBoxSpanWidth span
{
    width: 50px !important;
}

/* Geef Multiline TextBox/TextAera in grid styling die overeenkomt met andere kolommen. */
.TextAreaGrid
{
    font-family: "Segoe UI",Arial,Helvetica,sans-serif !important;
    font-size: 12px !important;
}
 
/* Multiline TextBox die met rows en columns worden gedimensioneerd worden door veschillende browsers
 * verschillend weergegeven. Firefox met name geeft de TextBox te groot weer. Leg de hoogte igv Readonly TextBox vast.
 */
.ReadOnlyTextAreaGrid
{
    height: 16px;
    color: #333333;
    cursor:default;
}

.customErrorNotification
{
    width: 700px;
    height: 500px;
}

/* Geef RadWindow zelfde 'loading image' als gebruikt door de RadLoadingPanels. */
.rwLoading 
{ 
    background-image: url("../Images/loading2.gif") !important;   
}  

/* classes t.b.v. CopyUrenView */
.Segoe12
{
    font-family: "Segoe UI",Arial,Helvetica,sans-serif;
    font-size: 12px !important;
}

.errorMessagesContainer
{
    height: 30px; 
    padding-bottom: 10px;
}

.dateSelectionContainer
{
    padding: 0px 0px 15px 20px; 
    width: 800px;
}

.copyGridContainer
{
    padding: 10px 30px 10px 20px; 
    width: 925px;
}

/* 'Grove' manier om horizontale scroll bars in radgrid te onderdrukken.
 * Scrolling wordt momenteel alleen gebruikt bij de functionaliteit van week-kopieën.
 */
.rgDataDiv
{
    overflow-x: hidden !important;
}

.buttonsContainer
{
    float: right;
    padding: 10px 20px 35px 0px;
}

.divider-r5
{
    padding-right: 5px;
}
/* classes t.b.v. CopyUrenView */

.SpecialDay  a
{
    background-color: Orange;
    color: Black !important;
}

.SpecialDayVerlof
{
    background-color: Orange;
    color: Black !important;
    /*cursor:pointer !important;*/
}

/* classes t.b.v. Footer */
.footer
{
    position: fixed; 
    clear: both; 
    width: 100%; 
    border: 0; 
    bottom: 0;
    z-index: 2001; 
    padding: 3px 0px 0px 0px; 
    height: 25px; 
    background-color: #CACACA;
    margin-left: -8px;
}

.innerFooter
{
    margin: auto; 
    padding: 4px 0px 0px 0px;
}

.innerFooterLeft
{
    float: left; 
    width: 20%;
}

.innerFooterRight
{
    float: right; 
    width: 80%; 
    text-align: right; 
    padding-top: 6px;
}

.footerCopyright
{
    font-family: "Segoe UI",Arial,Helvetica,sans-serif;
    font-size: x-small; 
    position: relative;
}

.FooterImage
{
    float: right; 
    margin-top: -10px; 
    padding: 0px 15px 0px 20px;
}
/* classes t.b.v. Footer */

.weekYearSelectContainer .RadAjaxPanel
{
    display:inline-block !important;
}

.weekYearSelectBlock
{
    padding: 0px 0px 15px 20px; 
    width: 500px;
}