/* 
    Document   : style.css
    Created on : 03-nov-2012, 18.23.31
    Author     : Giuseppe Romanazzi
    Description:
        CSS for MyCrm
*/

*{
    margin: 0; padding: 0; font-family: Arial; font-size: 14px; color: #555;
}

a{
    text-decoration: none;
}

img{
    border: none; vertical-align: middle;
}

/* Login Form */
#login-form{
    width: 400px; height: auto; margin: 100px auto 0 auto; padding: 30px;
    text-align: center;
    background-color: #fdfdfd;
    box-shadow: 0 0 5px 0 #ccc;
    
}

#login-form table{
    width: 100%;
    text-align: left;
}

#login-form table td{
    padding: 5px;
}

#login-form input[type="text"], #login-form input[type="password"]{
    width: 100%; height: 25px; padding: 2px 3px 2px 3px;
    text-align: left;
    border: solid 1px #ccc;
}

#login-form input[type="submit"] {
    padding: 10px 15px 10px 15px;
    cursor: pointer;
    color: #fff; background-color: orange;
    border: none;
}

#login-form input[type="submit"]:hover {
    background-color: #fb8b00;
}

#login-form p {
    padding: 5px;
    font-size: 12px; text-transform: uppercase;
    color: #fff; background-color: #d40000;
}

#header-bar{
    z-index: 1000;
    position: fixed; left: 0; top: 0; right: 0;
    height: 40px; line-height: 40px;
    color: #eee; background-color: #333;
}

#header-bar .logo{
    position: fixed; top: 0; left: 10px;
    color: #fff;
    font-size: 16px; font-weight: bold;
}

#header-bar .logout{
    position: fixed; top: 0; right: 10px;
    color: #eee;
    font-size: 12px;
}

#header-bar .logout a{
    color: #eee;
    background-color: #336699;
    border-radius: 20px;
    padding: 5px 15px 5px 15px;
}

#main-menu{
    z-index: 1000;
    position: fixed; left: 0; top: 40px; right: 0;
    width: auto; height: 40px; line-height: 40px; margin: 0;
    background-color: #ccc;
}

#main-menu a{
    margin: 0 10px 0 10px;
}

#main-menu a:hover{
    text-decoration: underline;
}

#content{
    margin: 90px 0 0 0;
    background-color: #fff;
    overflow: auto;
}

#content-menu{
    width: auto; height: 90px; margin: 0;
    background-color: #fff;
}

/* Customers Table */
.customers-table{
   border-collapse: collapse;
   margin: 10px;
}

.customers-table td{
    border: solid 1px #ccc;
    font-size: 11px;
    padding: 2px;
}

.label{
    font-weight: bold;
}

/* Search Bar - OLD
.search-bar{
    width: 430px; height: 30px; margin: 10px 0 0 10px; padding: 0 50px 0 10px;
    border-radius: 20px; border: solid 1px #ccc;
    box-shadow: inset 0 0 20px 0 #eee;
}

.search-bar-submit{
    padding: 7px 20px 7px 20px; margin-left: -40px;
    border: solid 1px #bbb; border-radius: 20px;
    cursor: pointer;
}
*/

/* Search Bar */
.search-box{
    padding: 2px;
}

.search-box thead td{
    font-size: 11px; font-weight: bold; text-transform: uppercase;
}

.search-box tbody td{
    padding: 2px;
}

.search-box tbody input[type="text"]{
    width: 250px;
}

.search-box input[type="submit"]{
    padding: 2px 5px 2px 5px; cursor: pointer;
}

.mini-search-bar{
    width: 210px; height: 20px; margin: 10px 0 0 10px; padding: 0 50px 0 10px;
    border: solid 1px #ccc;
    box-shadow: inset 0 0 20px 0 #eee;
}

.mini-search-bar-submit{
    padding: 3px 10px 3px 10px; margin-left: -40px;
    border: solid 1px #bbb;
    cursor: pointer;
}

/* Buttons */
.active-button{
    padding: 5px 10px 5px 10px;
    color: #333; background-color: orange;
    border: solid 1px #fb8b00; border-radius: 3px;
    box-shadow: 0 0 10px 0 #ccc;
    cursor: pointer;
}

/* Customer */
.customer-folder{
    width: auto; height: auto; margin: 10px; padding: 10px;
    border: solid 1px #ccc; border-radius: 10px;
}

.customer-folder table td{
    padding: 5px;
}

.customer-folder input[type="text"]{
    width: 550px; height: 25px; padding: 0 5px 0 5px;
    border-radius: 2px; border: solid 1px #ccc;
}

.customer-page{
    margin: 10px;
}

.customer-name{
    font-size: 22px; font-weight: bold;
    color: #fb8b00;
}

.customer-city{
    font-weight: bold;
    color: #333;
}

.customer-address-table td{
    padding: 0 20px 0 0;
}

.customer-address-table-label{
    font-size: 10px; font-weight: bold;
    text-transform: uppercase;
}
 
.customer-address-table-value{
    color: #111;
}

.customer-label{
    color: #336699;
}

/* Box */
.box{
    margin: 10px 0 0 0;
    border: solid 1px #444;
}

.box-title{
    padding: 3px;
    color: #fff; background-color: #444;
}

.box-content{
    padding: 3px;
}

.box-table td{
    padding: 2px 20px 2px 2px;
}

.box-table thead td{
    padding: 0 20px 0 2px;
    font-weight: bold;
}

/* Page */
.page-title{
    margin: 10px 0 0 10px;
    font-size: 24px;
}

/* Icons & Buttons */
.icon{
    padding: 2px;
    border: solid 1px transparent; border-radius: 2px;
}

.icon:hover{
    border: solid 1px #888; 
    box-shadow: 0 0 3px 0 #888;
}

/* Calendar */
#calendar{
    position: fixed; top: 90px; right: 10px; bottom: 10px; left: 200px;
}

#mini-calendar{
    position: fixed; top: 90px; width: 200px; left: 10px;
}

#week-calendar-container{
	position: absolute; top: 20px; right: 10px; bottom: 10px; left: 0;
	overflow-y: auto;
}

#week-calendar{
    width: 100%;
    border-collapse: collapse;
}

#week-calendar td{
    border: solid 1px #ccc;
    padding: 2px 2px 0 2px;
}

.week-current{
    width: 300px; height: 30px;
    text-align: center;
}

.calendar-overlay{
    position: fixed; top: 0; left: 0; padding: 5px;
    width: 400px; height: 220px;
    background-color: #fff;
    box-shadow: 0 0 5px 1px #111;
    visibility: hidden;
}

.calendar-overlay td{
    padding: 3px;
}

.public-app{
    padding: 2px; margin-bottom: 2px;
    color: #015a01; background-color: yellowgreen;
}

.private-app{
    padding: 2px; margin-bottom: 2px;
    color: #222; background-color: orange;
}

/* Appuntamenti */
#appuntamenti{
    margin: 10px;
}

.appuntamenti-data{
    margin: 20px 0 0 0;
    font-size: 16px; font-weight: bold;
    color: green;
    border-bottom: solid 1px #eee;
}

/* Generic float */
.left{
    float: left;
}

/* jTable */
.jtable td, .jtable td a{
    font-size: 11px;
    padding: 0 2px 0 2px !important;
}

.jtable td a{
    text-decoration: underline;
}

/* Mini Calendario */
.calendar-month-labels{
    float: left;
    width: 20px; height: 20px; margin: 0 -1px -1px 0; padding: 1px;
    text-align: center; line-height: 20px;
    border: solid 1px #ccc;
    font-weight: bold;
}

.calendar-month-day{
    float: left;
    width: 20px; height: 20px; margin: 0 -1px -1px 0; padding: 1px;
    text-align: right; line-height: 20px;
    border: solid 1px #ccc;
}

.calendar-today{
    position: relative; z-index: 10;
    border: solid 1px green;
    font-weight: bold;
}

/* Basic Table */
.basic-table{
    margin: 10px 20px 10px 20px;
    border-collapse: collapse;
}

.basic-table td{
    padding: 3px;
    border: solid 1px #ccc;
}

.basic-table td a, .basic-table td a:visited{
    color: #336699; font-weight: bold;
}