﻿
/*
    --Rijswijk Color Scheme--

    Font:               #366092
    Background:			#eee
    Buttons/Headers:    #ffcc00 ffcc00
    HightLight:         #6687AD
*/


 

/*The default colors of the template*/
body {
    background-color: #FFFFFF;
    color: #000000;
    font-family: arial, sans-serif;
}

/*Colors for the different form types as input fields, textareas and dropdowns*/
input, textarea, select {
    border: 1px solid #d8d8d8;
    color: #000000;
}

/* Color for the content*/
.main-content, .slide-content.no-padding-bottom {
    background-color: #eee;
}

/*Image to the logo*/
.logo-img {
    background-image: url("logo.png");
    background-repeat:no-repeat;
    height:80px;
    margin-top: 0;
}

/* Landscape phones and down */
@media (max-width: 480px) { 
    .logo-img:after {
        font-size: .95em;
    }
}

.main-content-header{
    background-color: #FFFFFF;
}

/*Color for the menu button (left top button)*/
.btn-menu {
    background-color: #ffcc00;
    background-position: left;
    border: 0px solid #000;
}

/*Color when pressed on menu button*/
.btn-menu:active,.btn-menu:visited {
    color: #000000;
    background-color: #333;
}

/*Color when pressed on menu button*/
.btn-menu:hover {
    background-color: #555;
}

/*Colors for all buttons*/
.btn-sigmax {
    text-transform: uppercase;
    background-color: #ffcc00;
    color: #000000 !important;
    font-weight:bold;
}

    /*Color when hovering*/
    .btn-sigmax:hover {
        color: #000000;
        background-color: #777;
    }

    /*Color when pressed on*/
    .btn-sigmax:active {
        color: #000000;
        background-color: ffcc00;
    }

        /*Color when active */
    .btn-sigmax.active {
        color: white !important;
        background-color: #555;
    }
    
    
/*Color of the main menu on the left*/
.main-menu {
    background-color: #eee;
}

/*Color for the parts where permit and permitmedia info are in the main menu*/
.main-menu-top {
    border-bottom: 1px solid #DCE6F2;
    color: #000000;
}

/*Color for the menu items */
.main-menu-item {
    border-bottom: 1px solid #B9CDE5;
    color: #000000;
}

    /*Color for the menu items when active, hover or pressed on*/
    .main-menu-item:active, .main-menu-item:hover, .main-menu-item.active {
        background-color: #6687AD;
    }



/*Color for the addon after an input (e.g. Licenseplate Book)*/
.input-group-addon {
    background-color: #DCE6F2;
    border: 0px solid #d8d8d8;
    border-left:solid 1px #ffcc00;
}

/*Color for the horizontal lines on screen on some pages*/
.border-bottom {
    border-bottom: 1px solid #000;
}

/*Color for the content that slides in screen (e.g. favorite licenseplates)*/
.slide-content {
    background-color: #DCE6F2;
    border: 0px solid #d8d8d8;
}

/*Color for the headers of lists (e.g. "Reserveringen" or "Opwaarderingen" on history screen) and favorite licenseplates*/
.list-heading , .table > thead{
    background-color: #04579B;
    color: #ffffff;
    font-weight:bold;
}

/*Color for the row in a list (including favorite licenseplates*/
.list-item , .table > tbody > tr > td{
    background-color: #EEEEEE;
    border: 1px solid #ffcc00;
    /*Border top to zero, otherwise double lines */
    border-top: 0;
    color:#000000; 
}


/*Reservation block text color*/
.res-chart-scroll, .res-chart-noscroll{
    color: black;
    font-weight: bold;
    display:none;
}
/*background of calendar*/
.slide-content{
    background-color: #EEEEEE;
}



/*LICENSEPLATE LOOKING INPUT IN ADD-RESERVATION */

.licensePlateInput
{
    border:solid 1px black;
    border:0px;
}

.licensePlateInput.input-group-addon
{
    display:none;
}

.licensePlateInput .inner-addon input {
  font-size: 30px;
  padding: 4px 20px 2px 20px;
  border: solid 3px rgb(0,0,0);
  background: rgb(238, 212, 3);
  color: rgb(0,0,0);
  letter-spacing: 1px;
  border-radius: 8px;
  font-weight: bold;
  text-shadow: 0px -1px 0px rgba(255,255,255,.8),0px 1px 0px rgba(0,0,0,.3);
  box-shadow:inset 0px -1px 0px 0px white, inset 0px 1px 0px 0px rgba(0,0,0,.3);
  margin:0px;
  display: inline-block;
  width:220px;
  height:52px;
}

.licensePlateInput .inner-addon div {
            font-size: 130%;
            opacity: 1;
        }

.licensePlateInput input::-webkit-input-placeholder {
    color: #B8A302; 
    text-shadow: 0px 1px 0px rgba(255,255,255,.5),0px -1px 0px rgba(0,0,0,.2);
    text-transform: uppercase;
}

.licensePlateInput input:-moz-placeholder {
    color: #B8A302; 
    text-shadow: 0px 1px 0px rgba(255,255,255,.5),0px -1px 0px rgba(0,0,0,.2);
    text-transform: uppercase;
}

.licensePlateInput input::-moz-placeholder {
   color: #B8A302; 
    text-shadow: 0px 1px 0px rgba(255,255,255,.5),0px -1px 0px rgba(0,0,0,.2);
    text-transform: uppercase;
}

.licensePlateInput input:-ms-input-placeholder {
   color: #B8A302; 
    text-shadow: 0px 1px 0px rgba(255,255,255,.5),0px -1px 0px rgba(0,0,0,.2);
    text-transform: uppercase;
}

/* Landscape phones and down */
@media (max-width: 480px) { 
    
    .licensePlateInput .inner-addon input {
        zoom:.9;
        padding: 4px 10px 2px 10px;
    }

    .licensePlateInput .inner-addon {
        height:70px;
    }

        .licensePlateInput .inner-addon div {
            position: absolute;
            top: 35px;
            left: 5px;
            margin-left: 0px;
            padding-left: 0px;
            font-size: 120%;
            opacity: 1;
        }
        
        .licensePlateInput .input-group-addon {
              min-height: 0px !important;
              height: 47px !important;
              display: inline-block;
              position: absolute;
              right: 0px;
              top: 0px;
              padding: 11px;
        }
}