.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: rgb(249,249,249);
}

.loader img { position: relative;
left: 50%;
top: 50%;
margin-left: -67px;
margin-top: -67px;
}


body { font-family: roboto; font-weight: 400; background: #eeeeee; }

#main { margin-left: 3em; margin-right: 3em; }

.logo { margin-bottom: 15px; }
.boxtitle {background: #231F20; padding: 10px; color: #fff; font-size: 150%;}
.dashboard a { border: 1px solid #000; padding:25px 00px 25px 00px; display: block; text-align: center; text-transform: capitalize; }
.dashboard a:hover { background-color: #0b82fa;}
.emailboxtitle {background: #ccc; padding: 10px; color: #fff; font-size: 100%;}
.emailboxcontent { padding: 10px; border: 1px solid #ccc; }

.boxtitlesuccess {background: #1E8A1C; padding: 10px; color: #fff; font-size: 150%;}
.boxtitleerror {background: #ff0000; padding: 10px; color: #fff; font-size: 150%;}
.boxtitle {background: #333; padding: 10px; color: #fff; font-size: 150%;}
.boxtitle a { font-size: 80%; float: right;}


.boxtitle .fa { color: #fff; }
.boxcontent { padding: 10px; }
.boxtitle a { color: #fff; }

.planningonly { width: 100%; padding: 20px; border: 1px solid #000; }
.col { background: #fff; }

table { width: 100%; }
table, th, td {padding: 10px; text-align: left; border-collapse: collapse;  }
th { color: #231F20;  }
td { border-top: 1px solid #231F20; border-bottom: 1px solid #231F20; }

tr.started { background: #1E8A1C; color: #fff; }
tr.midway { background: #0b82fa; color: #fff; }
tr.complete { background: #ff0000; color: #fff; }
tr.unread { background: #acacac; font-weight: bold;}
tbody tr:hover { background: #0b82fa; }
tbody tr.wrdetail { border-left: 2px solid #000000; border-bottom: 2px solid #000000; border-right: 2px solid #000000; background: #fff; }
tbody tr.wrdetail:hover { background: #fff; }

table.workrequest th { width: auto; border: none; }
table.workrequest td { border: none; width: auto;}
table.workrequest tr { border-bottom: 1px dotted #000; }

table.workrequest tr:nth-child(even) {background: #eeeeee}

.fa { color: #231F20; margin: 5px;}

#menu .fa { color: #231F20; margin: 5px;}


.selected { color: #1E8A1C; background-color: #ffffff; }

.pure-menu-item .fa { color: #fff; }

h1, h2 { color: #0b82fa; text-align: right; }
p.error { color: #ff0000; }

input[type="submit"], .button { background: #0b82fa; border: none; padding: 3px 10px 3px 10px; color: #fff; margin-left: 0px; margin-top: 5px;  }
select { padding: 10px; width: 100%; }
input[type="text"], input[type="email"], input[type="mobile"], input[type="password"], textarea { width: calc(100% - 10px); padding: 5px; }
textarea { min-height: 100px; }


form.appointment select { padding: 10px; width: auto; }
form.appointment p { float: left; max-width: 300px; width: auto; }
form.appointment { clear: both; }
.clear { clear: both; }
.appointment:after {  content: "";
  display: table;
  clear: both;}

	a { color: #000000;  text-decoration: none; }
	
	.memo { background: #eeeeee; padding: 20px; margin-bottom: 20px; }
	.contact { background: #eeeeee; padding: 20px; border-bottom: 5px solid #acacac; }
	.contact:nth-child(even) {background: #CCC}
	
	.developers { color: #231F20; font-size: 80%; text-align: left; padding: 0.3em 0.5em 0.3em 1em; 	}
	
	
	
	
	@media screen and (max-width: 700px) {

    table {
      border: 0;
    }

    table thead {
      display: none;
    }

    table tr {
      margin-bottom: 10px;
      display: block;
      border-bottom: 2px solid #ddd;
    }

    table td {
      display: block;
      text-align: right;
      font-size: 13px;
      border-bottom: 1px dotted #ccc;
    }

    table td:last-child {
      border-bottom: 0;
    }

    table td:before {
      content: attr(data-label);
      float: left;
      text-transform: uppercase;
      font-weight: bold;
    }
  }
  
  
.r-tabs .r-tabs-nav {
    margin: 0;
    padding: 0;
}

.r-tabs .r-tabs-tab {
    display: inline-block;
    margin: 0;
    list-style: none;
}

.r-tabs .r-tabs-panel {
    padding: 15px;
    display: none;
}

.r-tabs .r-tabs-accordion-title {
    display: none;
}

.r-tabs .r-tabs-panel.r-tabs-state-active {
    display: block;
}

/* Accordion responsive breakpoint */
@media only screen and (max-width: 1024px) {
    .r-tabs .r-tabs-nav {
        display: none;
    }

    .r-tabs .r-tabs-accordion-title {
        display: block;
    }
}

.r-tabs {
position: relative;

}

.r-tabs .r-tabs-nav .r-tabs-tab {
position: relative;

}
.r-tabs .r-tabs-nav .r-tabs-anchor {
margin-bottom: 0px;
padding: 10px 12px;
display: inline-block;
text-decoration: none;
color: #231F20;
font-weight: bold;
text-transform: uppercase;  
}

.r-tabs .r-tabs-nav .r-tabs-state-active {
background: #ccc;
margin-bottom: -1px;
   
}
.r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
color: #231F20;
border-left: 3px solid #aaaaaa;
border-right: 3px solid #aaaaaa;
border-top: 3px solid #aaaaaa;
background: #ffffff;

}
.r-tabs .r-tabs-panel {
margin-bottom: 3px;
}
.r-tabs .r-tabs-accordion-title .r-tabs-anchor {
display: block;
padding: 10px;
background-color: #231F20;
color: #fff;
font-weight: bold;
text-decoration: none;
margin-bottom: 3px;
border-bottom: 3px solid #231F20;
}
.r-tabs .r-tabs-accordion-title.r-tabs-state-active .r-tabs-anchor {
background-color: #d8d8d8;
color: #ffffff;
border-bottom: 3px solid #ffffff;
margin-bottom: 0;
}

.tabcontent{
	background: #fff;
color: #231F20;
}

.tabcontent a{
color: #000;
}