﻿/* Base */
body { background: #fff url(/images/base/bg.png) repeat-x; margin:0 auto; overflow-x: hidden; }
form { font-family: Nunito; font-size: 0.8em; color: #444; margin:0 auto; margin-top:0px; margin-bottom:0px; width:960px; line-height:1.6em; padding:0px; }
h1 { font-family: Nunito; font-size: 1.9em; color: #1468B2; font-weight: normal; margin-top:0px; margin-bottom:20px; text-transform: uppercase; line-height:1.3em; padding-bottom:0px; border-bottom: solid 1px #eee; text-align:left; }
h2 { font-family: Nunito; font-size: 1.9em; color: #1468B2; font-weight: normal; margin-top:0px; margin-bottom:20px; text-transform: uppercase; line-height:1.3em; padding-bottom:0px; border-bottom: solid 1px #eee; text-align:left; }
h3 { font-family: Nunito; font-size: 1.4em; color: #1468B2; font-weight: normal; margin-top:4px; margin-bottom:10px; line-height:1.4em; font-weight:bold; }
a:link, a:active, a:visited { text-decoration:none; color: #398FDB; transition:0.25s; }
a:link:hover, a:active:hover, a:visited:hover { color: #44A8FF; text-decoration:none; }
img { border:0; }
img:hover { border:0; }

/* Header */
#header { width: 960px; height:115px; padding-bottom:0px; margin:0; position: relative; }
#header .logo { float: left;  }
#header .strapline { position:absolute; color: #444; text-transform:uppercase; font-family: Nunito; font-size:1.25em; letter-spacing:0.18em; right:5px; }
#header .subtitle { position:absolute; right:5px; bottom:10px; text-align:left; margin-top:0px; color: #444; font-family: Nunito; font-size:1.1em; letter-spacing:0.01em; text-transform:none; line-height:1.3em; }
#header .subtitle a:link, #header .subtitle a:active, #header .subtitle a:visited { color: #1865B0; }
#header .subtitle a:link:hover, #header .subtitle a:active:hover, #header .subtitle a:visited:hover { color: #4CA4F7; }

/* Search */
.search { float:right; margin-top:-80px; }
.searchtitle { float:left; padding-top:8px; margin-right:10px; }
.searchtext { float:left; margin-right:10px; }
.searchtext .input { padding: 5px 10px; border: solid 1px #ddd; border-radius:5px; color: #888; }
.searchbutton { float:left; }
.searchbutton .input2 { padding: 3px 15px 4px 15px; border-radius:4px; }
.search .clear { border-bottom:none; }

/* Menu */
#menu { width:1020px; height:35px; position:relative; z-index:100; font-size:1.1em;  background: #1468B2; margin-bottom:0px; font-family: Nunito; z-index:200; text-transform:uppercase; }
#menu ul {margin:0; padding:0; list-style-type: none; }
#menu li { float: left; display: inline; }
#menu li:hover { display: inline;}
#menu li a { padding: 8px 20px 7px 20px; display:block; color: #fff; text-decoration:none; transition:0.25s; }
#menu li a:hover { color: #fff; background: #104F87; text-decoration:none; }
#menu ul ul { display: none; position: absolute; top: auto; left: auto; width: 134px; background:none; }
#menu li:hover ul { display: block; }
#menu li li a { width: 120px; padding: 7px 20px 7px 20px; text-align:left; background: #1468B2; font-weight:normal; color: #fff; border-right:0;  }
#menu li li a:hover { background: #104F87; color: #fff; }

#main { margin-top:20px; }
.separator { width: 200px; border-top: solid 1px #d9c9a3; margin-top:5px; margin-bottom:3px;padding: 0px 10px; }

/* Statuses */
.statusscheduled { background: #ffa500; color: #fff; font-size:1.2em;  }
.statuscompleted { background: #72C4FF; color: #fff; font-size:1.2em; }
.statusinprogress { background: #DF6DFF; color: #222; font-size:1.2em;  }
.statusapproved { background: #359953; color: #fff; font-size:1.2em;  }

/* Hidden products */
.producthide { background: #ff0000; }
.productshow { background: #28CC1C; }

/* Print Options */
.printoptions { padding: 9px 19px 24px 19px; border: solid 1px #ccc; background: #f4f4f4; width:calc(100% - 40px); margin-bottom:30px; }
.printoptions input[type="checkbox"] { width:1.4em; height:1.4em; vertical-align:middle; }
.printoptions label { padding-left:10px; vertical-align:middle; color: #444; }
.printoptions .item { float:left; margin-right:30px; }
.printoptions .item2 { float:left; }
.printoptions a:link, .printoptions a:active, .printoptions a:visited { color: #fff; transition:0.25s; }
.printoptions a:link:disabled, .printoptions a:active:disabled, .printoptions a:visited:disabled { background: #eee; }

/* Popup */
.popupbg { background: #000; position: fixed; left:0px; top:0px; width:100%; height:100%; z-index:10000;}
.popup { position: absolute; left:50%; top:50%; margin-left:-220px; margin-top:-120px; height:200px; width:400px; padding:20px; background: #fff; border: solid 0px #fff; border-radius:10px; }
.popup2 { position: absolute; left:50%; top:50%; margin-left:-320px; margin-top:-320px; height:600px; width:600px; padding:20px; background: #fff; border: solid 0px #fff; border-radius:10px; }
.history { margin-top:10px; height: 450px; margin-bottom:20px; overflow-y:auto; border-top: solid 1px #efefef; }
.history .historyitem { padding-top:8px; padding-bottom:8px; border-bottom: solid 1px #efefef; transition:0.25s; }
.history .historyitem:hover { background: #f8f8f8; cursor: pointer; }
.history .historyitem .date { float:left; width:100px; }
.history .historyitem .details { float:left; width:calc(100% - 100px); }
.history .historyitem .notes { color: #aaa; }
.popupbg .popup2 .close { position: absolute; bottom:20px; right:20px; }
.popupbg .close { position: absolute; top:20px; right:20px; }
.popupbg .pic { position: relative; text-align:center; vertical-align:middle; top:50px; }
.popupbg .pic img { max-width:600px; max-height:600px; background: #fff; padding:10px; }

/* Checks */
.checknotstarted { background: #ddd; }
.checkstarted { background: #ffa500; }
.checkcompleted { background: #359953; }
.checkproblem { background: #dd0000; }

/* Jobs */
.item { float:left; width:130px; margin-right:20px; color: #aaa; }
.value { float:left; width:calc(100% - 150px); }
.item2 { float:left; width:calc(100% - 170px); margin-right:20px; color: #444; max-width:300px; padding-top:5px; }
.value2 { float:left; width:150px; }
.clear { padding-bottom:5px; border-bottom: solid 1px #eee; margin-bottom:5px; clear:both; }
.clear2 { padding-bottom:5px; border-bottom: solid 0px #eee; margin-bottom:5px; clear:both; }

/* Calendar */
.calendarmonth { width:100%; text-align:center; top:-50px; font-size:2.0em; position: relative; z-index:0; }
.calendar { margin-top:-20px; margin-bottom:40px; }
.calendar .titleheading { background: #ddd; color: #222; font-size:1.4em; }
.calendar .titleheading td { vertical-align:middle; }
.calendar a:link, .calendar a:active, .calendar a:visited { text-decoration:none; }
.calendar table { width:100%; border: solid 1px #ddd; border-collapse: collapse; }
.calendar td { border: solid 1px #ddd; border-collapse:collapse; vertical-align:top;  }
.calendar .date { font-size:1.2em; color: #aaa; text-align:right; padding:4px; }
.calendar .currentdate { font-size:1.2em; color: #444; text-align:right; padding:4px; }
.calendar .jobscheduled { font-size:1.1em; line-height:1.6em; background: #ffa500; color: #222; border: solid 1px #ffa500; border-radius:3px; padding:5px; margin: 3px; position: relative; }
.calendar .jobinprogress { font-size:1.1em; line-height:1.6em; background: #DF6DFF; color: #222; border: solid 1px #DF6DFF; border-radius:3px; padding:5px; margin: 3px; position: relative; }
.calendar .jobcompleted { font-size:1.1em; line-height:1.6em; background: #72C4FF; color: #222; border: solid 1px #72C4FF; border-radius:3px; padding:5px; margin: 3px; position: relative; }
.calendar .jobapproved { font-size:1.1em; line-height:1.6em; background: #359953; color: #222; border: solid 1px #359953; border-radius:3px; padding:5px; margin: 3px; position: relative; }
.calendar .jobscheduled a:link, .calendar .jobscheduled a:active, .calendar .jobscheduled a:visited { color: #fff; text-decoration:none; }
.calendar .jobscheduled a:link:hover, .calendar .jobscheduled a:active:hover, .calendar .jobscheduled a:visited:hover { color: #ffff00; text-decoration:none; }
.calendar .jobinprogress a:link, .calendar .jobinprogress a:active, .calendar .jobinprogress a:visited { color: #fff; text-decoration:none; }
.calendar .jobinprogress a:link:hover, .calendar .jobinprogress a:active:hover, .calendar .jobinprogress a:visited:hover { color: #ffff00; text-decoration:none; }
.calendar .jobcompleted a:link, .calendar .jobcompleted a:active, .calendar .jobcompleted a:visited { color: #fff; text-decoration:none; }
.calendar .jobcompleted a:link:hover, .calendar .jobcompleted a:active:hover, .calendar .jobcompleted a:visited:hover { color: #ffff00; text-decoration:none; }
.calendar .jobapproved a:link, .calendar .jobapproved a:active, .calendar .jobapproved a:visited { color: #fff; text-decoration:none; }
.calendar .jobapproved a:link:hover, .calendar .jobapproved a:active:hover, .calendar .jobapproved a:visited:hover { color: #ffff00; text-decoration:none; }
.calendar .warranty { position: absolute; top:3px; right:20px; }
.calendar .locked { position: absolute; top:3px; right:1px; }
.calendar .remove { position: absolute; bottom:3px; right:3px; }
.calendar .remove:focus { outline:none; }
.calendar input:focus { outline:none; }

.calendar .today { height:100px; background: #FFF499; }
.calendar .dayinmonth { height:100px; }
.calendar .daynotinmonth { height: 100px; background: #efefef; }

#footer { text-align: center; width: 950px; font-size: 1.0em; background-color:#758a2f; margin-top:0px; padding-bottom:8px; padding-top: 3px; border-top: solid 1px #566424; color: #fff;  }
#footer a { text-decoration:underline; border:none; color: #ddd; }
#footer a:hover { color:#fff; text-decoration:underline; }

.blank { background-image: none; }

.text { font-family: Nunito; font-size: 1.0em; color: #222; padding:0; text-align:justify; margin-top:0;}
.text a { text-decoration:underline; border:none; color: #444;}
.text a:hover { color: #5CA55E; text-decoration:underline; border:none }
.input { font-family: Nunito; font-size:1.0em; color: #1e401e; margin-bottom:3px; margin-top:3px; margin-right:3px; border: solid 1px #aaa; border-radius:3px; padding:2px; }
.input:disabled { color: #888;  }
.input:focus { outline:none; }
.dateinput { font-family: Nunito; font-size:1.0em; color: #1e401e; margin-bottom:3px; margin-top:3px; margin-right:3px; border: solid 1px #aaa; border-radius:3px; padding:3px; }
.dateinput:disabled { color: #888;  }
.dateinput:focus { outline:none; }
.input2 { background: #1468B2; border: solid 1px #1468B2; border-radius:5px; color: #fff; font-family: Nunito, Arial; font-size:1.2em; padding: 6px 20px; margin:3px 0px; position: relative; z-index:100; transition:0.25s; }
.input2:hover { cursor: pointer; background: #104F87; border: solid 1px #104F87; }
.input3 { background: #1468B2; border: solid 1px #1468B2; border-radius:5px; color: #fff; font-family: Nunito, Arial; font-size:1.0em; padding: 4px 16px; margin:3px 0px; position: relative; z-index:100; transition:0.25s;  }
.input3:hover { cursor: pointer; background: #104F87; border: solid 1px #104F87; }
.input3:disabled { background: #ddd; border-color: #ddd; color: #fff; }
.input3:disabled:hover { background: #ddd; border-color: #ddd; color: #fff; }
.input2:focus { outline:none; }
.input2:disabled { background: #ddd; border-color: #ddd; color: #fff; transition:0.25s; }
.input4 { background: #444; border: solid 1px #444; border-radius:3px; color: #fff; font-family: Nunito, Arial; font-size:1.0em; padding: 5px 10px; margin:3px 2px; transition:0.25s;  }
.input4:hover { cursor: pointer; background: #222; border: solid 1px #222; }
.input4:disabled { background: #ddd; border-color: #ddd; color: #fff; }
.input4:focus { outline:none; }
.inputsimpro { background: #FFDD00; border: solid 0px #fff; border-radius:5px; color: #222; font-family: Nunito, Arial; font-size:1.2em; padding: 7px 21px; margin:8px 16px 8px 0px; position: relative; z-index:100; transition:0.25s; }
.inputsimpro:hover { cursor: pointer; background: #E2C400;  }
.logintitle { background: #1468B2; font-family:Nunito,Nunito; border: none; color:#fff; border-bottom: solid 10px #fff; font-size:1.4em; font-weight:normal; padding-top:14px; text-transform:uppercase; }

/* Map */
.appointments { float:left; width: calc(100% - 540px); margin-right:40px; }
.appointment { margin-bottom:20px; padding-bottom:20px; border-bottom: solid 1px #e4e4e4; position:relative;z-index:10; }
.appointment h3 { margin-bottom:6px; }
.appointment .number { width:30px; float:left; }
.appointment .clear { clear:both; height:0px; }
.appointment .title { float:left; width:calc(100% - 30px); }
.appointment .desc { margin-left:30px; margin-bottom:4px; }
.appointment .date { margin-left:30px; margin-bottom:10px; font-weight:bold; }
.mapfilter { position: relative; overflow:visible; z-index:100; margin-bottom:20px; }
.mapholder { position: relative; float:left; width:500px; z-index:0; }
.map { width:500px; height:400px; max-width:100%; background: #f4f4f4;}

/* PDF's */
.pdf { margin-top:10px; }
.pdf a:link, .pdf a:active, .pdf a:visited { color: #fff; text-decoration:none; }
.pdf .input2 { padding: 7px 20px; }

.availability { width:85%; border: none; padding:2px; }

.angelfish { font-family:Nunito; font-size:0.8em; margin-left:30px; color: #000000; }
.angelfish a { text-decoration: underline; color: #000000; }
.angelfish a:hover { text-decoration: underline; color: #007311; }

#updateprogress1 { color: #007311; }

/* Images */
.image { border:none; }
.noDecoration {border:none; }
.noDecoration a, .noDecoration a:active, .noDecoration a:visited { text-decoration:none; }
.noDecoration a:hover, .noDecoration a:active:hover, .noDecoration a:visited:hover { text-decoration:none; }

/* Standard Tables */
.titleheading {height:36px; color:#fff; font-weight:bold; background: #1468B2; }
.titleheading td { padding:4px 5px; }
.titleheading a {color:White; text-decoration: none; background:none;}
.titleheading a:hover {color:Silver; text-decoration: none; background:none;}
.blank { background: #fff; }
.rowdark {  background: #f8f8f8; transition:0.25s; }
.rowlight { background: #fff; transition:0.25s; }
.rowdark td { padding: 6px 4px; border-bottom: solid 1px #ddd;  }
.rowlight td { padding: 6px 4px; border-bottom: solid 1px #ddd; }
.rowdark:hover { background: #e8e8e8;  }
.rowlight:hover { background: #efefef;  }
.rowdarkhighlight {background: #a4a4a4; padding: 6px 4px; color: #fff; transition:0.25s;}
.rowlighthighlight {background: #b4b4b4; padding: 6px 4px; color: #fff;transition:0.25s; }
.rowdarkhighlight td { padding:6px 5px; border-bottom: dashed 1px #fff;}
.rowlighthighlight td { padding:6px 5px; border-bottom: dashed 1px #fff;}
.rowdarkhighlight:hover { background: #a1a1a1;  }
.rowlighthighlight:hover { background: #a5a5a5;  }
.rowdarkhighlight a:link, .rowdarkhighlight a:active, .rowdarkhighlight a:visited { color: #fff; }
.rowlighthighlight a:link, .rowlighthighlight a:active, .rowlighthighlight a:visited { color: #fff; }
.message { margin-bottom:14px; font-weight:bold; background: #46895a; color: #fff; padding: 5px; }
.roomdog { float: right; margin-top:-4px; padding-right:4px; }

/* AJAX Calendar */
.calendar .ajax__calendar_container { background: #d9d9d9; z-index:255; position:relative; z-index:10; }
.calendar table { background: #fff; padding: 0; font-size: 0.9em; }
.calendar td { padding: 1px; border:0; }
.calendar .ajax__calendar_active { background: #018287; color: #fff; }
.calendar .ajax__calendar_other { background: #e9e9e9; color: #333; }
.calendar .ajax__calendar_day { margin: 1px; padding: 0; }
.calendar .ajax__calendar_day:hover { border: 1px solid #018287; margin: 0; }
