/********************* XPERTWEB.CO.UK ***********
Homepage
A0. Defaults
A1. Buttons
A2. Login
A3. Menu Left
A4. Top Bar
A5. Dashboard

Primary Colours

GREEN:   #64d357    HOVER: #57b64e
GREY:   #f4f4f4
BLACK:  #1a1a1a 

************************************************/
/********************* XPERTWEB.CO.UK ***********
Defaults: A0
************************************************/
.datepicker {
    z-index: 9999 !important;
}
.clickedit {
    background-color: red !important;
    color: #fff !important;
}
.clickedit a {
    color: #fff !important;
}
.tinl {
    font-size:1px !important;
}

html, body {
    color: #191919;
    background-color: #f4f7f9;
    font-family: 'Lato', sans-serif;
    margin:0;
}
.green {
    background-color: #64d357
}

.grey {
    background-color: #f4f7f9
}

.black {
    background-color: #1a1a1a
}
.white {
    background-color: #ffffff
}

.tgreen {
    color: #64d357
}

.tgrey {
    color: #f4f4f4
}

.tblack {
    color: #1a1a1a
}

.twhite {
    color: #ffffff
}
a:hover {
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;
    -o-transition: all .3s;
    -ms-transition: all .3s;
    transition: all .3s;
}
input:hover {
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;
    -o-transition: all .3s;
    -ms-transition: all .3s;
    transition: all .3s;
}

@media screen and (max-width: 1500px) {
    #menulay .col-sm-2 {
        width:20%;
}
        .stick {
        width:20% !important;
}
    #menulay .col-sm-10 {
        width:80%;
}
}

@media screen and (max-width: 1250px) {
    #menulay .col-sm-2 {
        width:23%;
}
        .stick {
        width:23% !important;
}
    #menulay .col-sm-10 {
        width:77%;
}
}

@media screen and (max-width: 1100px) {
    #menulay .col-sm-2 {
        width:25%;
}
        .stick {
        width:25% !important;
}
    #menulay .col-sm-10 {
        width:75%;
}
}

@media screen and (max-width: 980px) {
    #menulay .col-sm-2 {
        width:28%;
}
    #menulay .col-sm-10 {
        width:72%;
}
}

@media screen and (max-width: 850px) {
    #menulay .col-sm-2 {
        width:28%;
        float: left;
}
    .stick {
        width:28% !important;
}
    #menulay .col-sm-10 {
        width:72%;
            float: left;
}
}

@media screen and (max-width: 767px) {
    #menulay .col-sm-2 {
        display: none;
}
    #menulay .col-sm-10 {
        width:100%;
            float: left;
}
}
/********************* XPERTWEB.CO.UK ***********
Buttons: A1
************************************************/
/* green Outline */
.button-green {
    color: #ffffff !important;
    display: block;
    font-size: 1em;
    font-weight: 300;
    text-align: center;
    text-transform: capitalize;
    border-radius: 0px;
    margin-right: 0;
    padding:10px !important;
    border:0px !important;
    letter-spacing: 1px;
    width: 100px;
    background-color: #64d357 !important;
}
.button-green:hover {
    background-color: #64d357 !important;
}
.button-green i {
    font-size: 1.1em;
    margin-left: 10px;
}


.button-green2 {
    color: #ffffff !important;
    display: inline-block;
    font-size: 1em;
    font-weight: 300;
    text-align: center;
    text-transform: lowercase;
    border-radius: 0px;
    margin-right: 20px;
    padding:10px !important;
    border:0px !important;
    letter-spacing: 1px;
   
    background-color: #64d357 !important;
}
.button-green2:first-letter {
    text-transform: uppercase;
}
.button-green2:hover {
    background-color: #64d357 !important;
}
.button-green2 i {
    font-size: 1.1em;
    margin-left: 10px;
}




.button-orange {
    color: #ffffff !important;
    display: inline-block;
    font-size: 1em;
    font-weight: 300;
    text-align: center;
    text-transform: lowercase;
    border-radius: 0px;
    margin-right: 0px;
    padding:10px !important;
    border:0px !important;
    letter-spacing: 1px;
   float: right;
    background-color: #d37d57  !important;
}
.button-orange:first-letter {
    text-transform: uppercase;
}
.button-orange:hover {
    background-color: #d37d57  !important;
}
.button-orange i {
    font-size: 1.1em;
    margin-left: 10px;
}


.button-purple {
    color: #ffffff !important;
    display: inline-block;
    font-size: 1em;
    font-weight: 300;
    text-align: center;
    text-transform: lowercase;
    border-radius: 0px;
    margin-right: 10px;
    padding:10px !important;
    border:0px !important;
    letter-spacing: 1px;
   float: right;
    background-color: #625185  !important;
}
.button-purple:first-letter {
    text-transform: uppercase;
}
.button-purple:hover {
    background-color: #625185  !important;
}
.button-purple i {
    font-size: 1.1em;
    margin-left: 10px;
}
/********************* XPERTWEB.CO.UK ***********
Login: A2
************************************************/

.logologin {
    margin: 0 auto;
    display: block;
    margin-top: 50px;
}
.login-dash {
    border-top:2px solid #64d357 !important;
    border: 1px solid #edeef0;
    max-width: 300px;
    margin: 50px auto 0 auto;
    font-weight: normal !important;
}
.login-dash form label {
    font-weight: 600 !important;
}
.login-dash input[type="text"] {
    border-left:3px solid #64d357 !important;
    border: 1px solid #edeef0;
    width:100%;
    padding: 4px;
}
.login-dash input[type="password"] {
    border-left:3px solid #64d357 !important;
    border: 1px solid #edeef0;
    width:100%;
    padding: 4px;
}
.login-dash input[type="submit"] {
    background-color: #64d357;
    color: #fff;
    width:100px;
    padding: 5px;
    border: 0px;
    margin-top: 15px;
}
.login-dash input[type="submit"]:hover {
    background-color: #57b64e;
}

.login-dash .login-remember {
    display: none;
}





.login-dash2 {
    border-top:0px solid #64d357 !important;
    background-color: #5bbf4f;
    border: 0px solid #edeef0;
    max-width: 100%;
    margin: 0px auto 0 auto;
    font-weight: normal !important;
    color: #fff !important;
}
.login-dash2 form label {
    font-weight: 600 !important;
}
.login-dash2 input[type="text"] {
    border-left:3px solid #64d357 !important;
    border: 1px solid #edeef0;
    width:100%;
    padding: 6px;
    color: #444 !important;
}
.login-dash2 input[type="password"] {
    border-left:3px solid #64d357 !important;
    border: 1px solid #edeef0;
    width:100%;
    padding: 6px;
    color: #444 !important;
}
.login-dash2 input[type="submit"] {
    background-color: #64d357;
    color: #fff;
    width:100px;
    padding: 7px;
    border: 0px;
    margin-top: 15px;
}
.login-dash2 input[type="submit"]:hover {
    background-color: #57b64e;
}

.login-dash2 .login-remember {
    display: none;
}

/********************* XPERTWEB.CO.UK ***********
Menu Left: A3
************************************************/

.stick {
    position: fixed;
    top:0;
    width: 16.66666667%;
}
#menucon {
    background-color: #1a1a1a;
    padding-left: 0px !important;
    padding-right: 0px !important;
    min-height: 100%!important;
}
#menucon ul {
    margin-left: 0 !important;
    display: block;
    list-style-type: disc;
    -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 0px;
    margin-top: 0px;
    padding-left: 0px;
    padding-left: 0px;
}

.responsive-menu .sub-menu li {display:block;}

.sub-menu li {display:none;}

.adminmenu li:hover .sub-menu li {
    display:block;
    background-color: #282828 ;
    color: #1a1a1a;
}

.adminmenu li:hover > a {
    background-color: #5cc350 ;

}



.adminmenu li a i,.deamenu li a i,.clientmenu li a i {
    margin-right: 10px;
}
.adminmenu li a,.deamenu li a,.clientmenu li a {
    color: #fff;
    display: block;
    padding: 15px 20px 15px 20px;
    text-transform: uppercase;
}
.adminmenu li a:hover,.deamenu li a:hover,.clientmenu li a:hover {
    color: #ffffff;
    background-color: #64d357;
}

@media screen and (max-width: 767px) {
.adminmenu li:hover .sub-menu li {
    display:block !important;
}
}
/********************* XPERTWEB.CO.UK ***********
Top Bar: A4
************************************************/
#maincon {
    padding-left: 0px !important;
    padding-right: 0px !important;
    
}
.topbar {
    background-color: #fff;
    margin-left: 0;
    margin-right: 0;
    border-bottom: 2px solid #edeef0;
    text-align: left;
    padding: 20px;
    display: block;
}
.topbar span {
    display: inline-block;
    float:right;
    margin-top: 6px;
}

@media screen and (max-width: 400px) {
.topbar {
    text-align: center;
}
.topbar span {
    display: block;
    float:none;
    text-align: center;
    margin-top: 20px;

}
.topbar span a {
    margin: 0 auto;

}
}

/********************* XPERTWEB.CO.UK ***********
Bottom Bar: A4
************************************************/
.botbar {
    background-color: #fff;
    margin-left: 0;
    margin-right: 0;
    border-bottom: 2px solid #edeef0;
    text-align: left;
    padding: 20px;
    display: block;
    margin-top: 30px;
    
}
.botbar p {

    margin-top: 6px;
    margin-bottom: 6px;
}
.botbar span {
    display: inline-block;
    float:right;

}
.botbar a {
    color: #191919;
}
.botbar a:hover {
    color: #64d357;
}
@media screen and (max-width: 400px) {
.botbar p {
text-align: center;
}
.botbar span {
    display: block;
    float:none;
    margin-top: 10px;

}
}
/********************* XPERTWEB.CO.UK ***********
Dashboard: A5
************************************************/
.welcometext {
    background-color: #fff;
    border: 1px solid #edeef0;
    margin-top: 20px;
}
.headergreen {
    border-bottom: 2px solid #64d357;
    
}
.hello {
    font-size: 1.5em;
    padding: 15px;
    margin: 0;
}
.welcomenotice p {
    font-size: 1em;
    padding: 15px;
    margin: 0;
}

#counting {
    margin-top: 20px;
}
#counting p {
    margin: 0px;
    font-size: 1.2em;
}
#counting .col-sm-3 {
    padding: 0px !important;
}
#counting .col-sm-3 div {
    background-color: #fff;
    text-align: center;
    color: #fff;
    margin-right: 2px;
    margin-left: 2px;
    border: 1px solid #edeef0;
}
#counting .col-sm-3 .headergreenbk {
    background-color: #64d357;
    padding: 8px 15px 8px 15px;
}
.numbercount {
    font-size: 2em !important;
    color: #000;
    padding-top: 10px;
    padding-bottom: 10px;
}

@media screen and (max-width: 850px) {
#counting .col-sm-3 .headergreenbk {
    padding: 8px 10px 8px 10px;
}
}
/********************* XPERTWEB.CO.UK ***********
Form CSS
************************************************/

select[multiple] {
    height: 200px !important;
}

select:not([multiple]) {
    -webkit-appearance: none;
    -moz-appearance: none;
    background-position: right 50%;
    background-repeat: no-repeat;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA1UlEQVRYR+2U2w0CIRBFz5pYkc1otAu1CeOjCo2VWJVRcxNIiBEc4IOf4WuzC3MPZ1gmBo9pcD4O4AbcgBuwGtC8d+WlZVpjAZgDN+ABXIwQe2ABbIBnaY0FQOGrUGQLnP9AKPwQ5mjtuhdgCVyBWSi0A06Zomn4K4TfewG03gJRHa7ClhbEDXxDKPAYPjaF1wL8MqFgbSL23KQ9bUmNgZyJ+L46vMVADqIpvAcgbYee9asVT3vuT2hpQVpLB1OjKbzXgPFSLE/rNdAN4QBuwA24geEGPsWaJiFGght8AAAAAElFTkSuQmCC);
    padding: .5em;
    padding-right: 1.5em;
    border-radius: 0
}

.calendarimg {
    -webkit-appearance: none;
    -moz-appearance: none;
    background-position: 95% 50%;
    background-repeat: no-repeat;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAA30lEQVRIS8WVOwoCMRCGv0XwUYjHsbWyEryDV9BKUKy0Em/gHey0sxWPoygIPphl0gV2YzK7acK/C/+XeSSTYbwyY38coA8MgUYi4Ac4ARcBiPkB2AOvRIAmMAHGAlgAHWCeyNzZrIGnAFb6xe2pOLlfZYABcE51dPXJPV0E5gCB1lKDO/AFuhp2iC5V5Bsgl6angBBdChBTdy9gpinZqnOM9gIk3+5+yB6jvYCp5nynoBhdTw1C2rCoAbwRhLRhacASaBs81xvgYTVwWjpwRlYj8w0cgWtlQ7+oYH///wG2lV1/3WACWAAAAABJRU5ErkJggg==);
    cursor: pointer;
}

.poundimg {
    content: "\2605";
}


#formcss label {
    width: 180px;
}
#formcss input {
    width: 250px;
    margin-right: 30px;
    vertical-align: top;
}
#formcss select {
    width: 250px;
    margin-right: 30px;
    vertical-align: top;
}
#formcss textarea {
    width: 250px;
    margin-right: 30px;
    vertical-align: top;
}
#formcss label{
    font-weight: normal !important;
    vertical-align: top;
    padding-top: 20px;
}
#formcss input{
    border-left: 3px solid #64d357 !important;
    border: 1px solid #edeef0;
    padding: 8px;
    height: 40px;
    margin-top: 10px;
    margin-bottom: 10px;
}
#formcss select{
    border-left: 3px solid #64d357 !important;
    border: 1px solid #edeef0;
    padding: 8px;
    height: 40px;
    min-width: 150px;
    margin-top: 10px;
    margin-bottom: 10px;
    -webkit-appearance: none;
    border-radius: 0;
}
#formcss textarea{
border-left: 3px solid #64d357 !important;
    border: 1px solid #edeef0;
    padding: 8px;
    margin-top: 10px;
    margin-bottom: 10px;

}
#formcss [type="submit"]{
background-color: #64d357 !important;
    border: 0px solid #edeef0;
    padding: 8px;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #fff;
    margin-top: 20px;

}
#formcss p{
    font-weight: bold !important;
}

.leftd {
    width: 45%;
    display: inline-block;
    vertical-align:top;

}
.rightd {
    width: 45%;
    display: inline-block;
    vertical-align:top;

}
.full {
    width: 100%;
    display: inline-block;
    vertical-align:top;

}
#formcss .full input {
    width: 650px;
    margin-right: 30px;
    vertical-align: top;
}
#formcss .full select {
    width: 650px;
    margin-right: 30px;
    vertical-align: top;
}
#formcss .full textarea {
    width: 650px;
    margin-right: 30px;
    vertical-align: top;
}
.noticetop {
    background-color: #64d357;
    padding: 10px;

    color: #fff;
    margin-bottom: 30px;
}
.noticetop2 {
    background-color: #AA0000;
    padding: 10px;

    color: #fff;
    margin-bottom: 5px;
}
.dups {
    background-color: #d37d57;
    padding: 10px;
    color: #fff;
    margin-bottom: 5px;
    text-transform: uppercase;
}
.showclear1280 {
    display: none;
}

@media screen and (max-width:1400px) {
    
.threesplit label {
    width: 100% !important;
}
    
 .leftd {
    width: 49%;
}
.rightd {
    width: 49%;
}   
}
@media screen and (max-width:1280px) {
 .leftd {
    width: 100%;
}
.rightd {
    width: 100%;
}   
 .full input,.rightd input, .leftd input {
    width: 50% !important;
}
 .full select,.rightd select, .leftd select {
    width: 50% !important;
}
 .full textarea,.rightd textarea, .leftd textarea {
    width: 50% !important;
}
    
    
#formcss .row-alts .col-xs-3 {
    width: 50%;
    margin-bottom: 20px;
}
    
.showclear1280 {
    display: block;
    clear: both !important; 
}
    
}


@media screen and (max-width:1200px) {
.threesplit input,.threesplit select {
    width: 220px !important;
}
}

@media screen and (max-width:1100px) {
.threesplit input,.threesplit select {
    width: 200px !important;
}
}

@media screen and (max-width:1050px) {
.threesplit input,.threesplit select {
    width: 170px !important;
}
}

@media screen and (max-width:1000px) {
 .full input,.rightd input, .leftd input {
    width: 65% !important;
}
 .full select,.rightd select, .leftd select {
    width: 65% !important;
}
 .full textarea,.rightd textarea, .leftd textarea {
    width: 65% !important;
}
}

@media screen and (max-width:950px) {
 .full input,.rightd input, .leftd input {
    width: 60% !important;
}
 .full select,.rightd select, .leftd select {
    width: 60% !important;
}
 .full textarea,.rightd textarea, .leftd textarea {
    width: 60% !important;
}
.threesplit input,.threesplit select {
    width: 100% !important;
}
    
    .loginarea .col-xs-4 {
        width: 50%;
    }
    .loginarea .col-xs-4 img {
        width: 80px;
    }
    .loginarea .logmein {
        width: 100% !important;
    }
    .login-username {
        width: 49%;
        float:left;
    }
    .login-password {
        width: 49%;
        float:right;
    }
}

@media screen and (max-width:850px) {
 .full input,.rightd input, .leftd input {
    width: 50% !important;
}
 .full select,.rightd select, .leftd select {
    width: 50% !important;
}
 .full textarea,.rightd textarea, .leftd textarea {
    width: 50% !important;
}
}
@media screen and (max-width:800px) {
#formcss input {
    width: 100% !important;
}
#formcss select {
    width: 100% !important;
}
#formcss textarea {
    width: 100% !important;
}
}

@media screen and (max-width:600px) {

#formcss .row-alts .col-xs-3 {
    width: 100%;
}
    
.button-orange {
   float: none;
   margin-top: 15px;

}
    
.button-purple {
   float: none;
   margin-top: 15px;
    margin-left: 20px;
    margin-right: 0px;

}

.button-green2 {
   margin-top: 15px;

}
    body {
        font-size:1.2em;
    }
    .headlogo .col-xs-6 {
        width: 100% !important;
        display: block;
        text-align: center !important;
    }
    
        .login-username {
        width: 100%;
        float:none;
    }
    .login-password {
        width: 100%;
        float:none;
    }
    
}
img {
    max-width: 100%;
}


/********************* XPERTWEB.CO.UK ***********
List Jobs
************************************************/

.row-alts {
    width: 100%;
    padding: 20px;
}
.row-alts .col-xs-3,.row-alts .col-xs-12 {
    padding-left: 0px;
    padding-right: 0px;
}
.row-alts div {
    vertical-align: top;
}
.row-alts:nth-of-type(odd) {
    background: #f4f7f9;
    background-color: #f4f7f9;
}
.greenoutline {
    border: 2px solid #64d357;
    font-weight: 600;
    display: block;
    width: 240px;
    padding: 3px;
    text-align: center;
  /*  margin-top: 15px;
    margin-bottom: 15px; */
}
.notes {
    background-color: #ecf0f2;
    padding: 10px !important;
    height: 75px;
    overflow-y: scroll;
}
.clear {
    clear: both;
}

.notes::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}
.notes::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: #64d357;
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}

.movebuttons {
   /* margin-top: -50px !important; */
}


/********************* XPERTWEB.CO.UK ***********
List Users
************************************************/

.list-users {
    margin-left: 0px;
    margin-right: 0px;
    width: 100%;
    
}
.list-users div {
    vertical-align: top;
    width: 100%;
    float: left;
    padding: 10px;
}
.list-users span {
    width: 33%;
    float: left;
}
.list-users div:nth-of-type(odd)  {
    background: #f4f7f9;
    background-color: #f4f7f9;
}



.list-users4 {
    margin-left: 0px;
    margin-right: 0px;
    width: 100%;
    
}
.list-users4 div {
    vertical-align: top;
    width: 100%;
    float: left;
    padding: 10px;
}
.list-users4 span {
    float: left;
    width: 26% !important;
}
.list-users4 .rightf {
    float: right;
    width: 10% !important;
}
.list-users4 .firstl {
    width: 10% !important;
}
.list-users4 div:nth-of-type(odd)  {
    background: #f4f7f9;
    background-color: #f4f7f9;
}

@media screen and (max-width:1270px) {
.list-users4 span {
    width: 35% !important;
}
.list-users4 .rightf {
    width: 15% !important;
}
.list-users4 .firstl {
    width: 15% !important;
}
}


@media screen and (max-width:1030px) {
.movebuttons {
    margin-top: 0px !important;
}
}

@media screen and (max-width:970px) {
.list-users4 span {
    float: left;
    width: 40% !important;
}
.list-users4 .rightf {
    float: none !important;
    width: 100% !important;
    display: block !important;
    margin-top: 10px !important;
}
.list-users4 .firstl {
    width: 20% !important;
}
}



@media screen and (max-width:768px) {
.list-users4 span {
    float: left;
    width: 40% !important;
}
.list-users4 .rightf {
    float: none !important;
    width: 100% !important;
    display: block !important;
    margin-top: 10px !important;
    clear: both !important;
}
.list-users4 .firstl {
    width: 20% !important;
}
}

@media screen and (max-width:600px) {
.list-users4 span {
    float: none;
    display: block !important;
    width: 100% !important;
}
.list-users4 .rightf {
    float: none !important;
    width: 100% !important;
    display: block !important;
    margin-top: 10px !important;
    clear: both !important;
}
.list-users4 .firstl {
    width: 20% !important;
}
}




/********************* XPERTWEB.CO.UK ***********
Reports
************************************************/

#formcss input[type="radio"] {
    height: 20px !important;
    width: 20px !important;
    margin-top: 0px;
}

.single {
        display: inline-block;
}

@media only screen and (min-width:1551px) {
    
 #formcss .lab1 .single {
    width: 33% !important;

}   
}

@media only screen and (min-width:980px) and (max-width:1550px) {
    
 #formcss .lab1 .single {
    width: 49% !important;

}   
}

@media screen and (min-width:980px) {
#formcss .lab1 label {
    width: 120px !important;
}
}


/********************* XPERTWEB.CO.UK ***********
Results
************************************************/

.wid {
    width: 100%;
}
#resultstable .column {
    min-width: 100px !important;

    padding: 5px 15px 5px 5px;
}

#resultstable thead th	{ background-color:#64d357; }
#resultstable tr:nth-child(odd)		{ background-color:#f4f7f9; }
#resultstable tr:nth-child(even)		{ background-color:#fff; }

/********************* XPERTWEB.CO.UK ***********
Edit & Add Users / Layout
************************************************/
.ml15 {
    margin-left: 15px;
}
#adduser p {
    width: 32%;
    display: inline-block;
    padding-top: 0px;
    padding-bottom: 0px;
}
#adduser p input {
    width: 100%;
}
.form-submit {
    width: 100% !important;
    display: block !important;
}
.form-submit input {
    width: 250px !important;
}
@media screen and (max-width:1100px) {
#adduser p {
    width: 49%;
    display: inline-block;
    padding-top: 0px;
    padding-bottom: 0px;
}
}

@media screen and (max-width:600px) {
    #adduser p {
    width: 100%;
}
}

.hideepctext p {
    display: none;
}

/********************* XPERTWEB.CO.UK ***********
Admin New Job / Layout
************************************************/

.deadistance {
    width: 18%;
    border: 1px solid #64d357;
    background-color: #f4f7f9;
    box-sizing: border-box;
    display: inline-block;
    text-align: center;
    padding: 10px;
    margin: 1%;
}

@media screen and (max-width:1700px) {
    .deadistance {
    width: 23%;
}
}

@media screen and (max-width:1500px) {
    .deadistance {
    width: 31.3%;
}
}

@media screen and (max-width:1150px) {
    .deadistance {
    width: 48%;
}
}

@media screen and (max-width:580px) {
    .deadistance {
    width: 100%;
        margin: 0 0 10px 0;
}
}


/********************* XPERTWEB.CO.UK ***********
Status Update Buttons
************************************************/

.updatebuttons {
    float:left;
}
#formcss .updatebuttons [type="submit"] {
    width: 100px !important;
    height: 20px !important;
    line-height: 10px !important;
    font-size:0.8em !important;
    padding: 5px !important;
    margin: 10px 3px 10px 3px !important;
    border-left: 0px solid #64d357 !important;
    border-right: 0px solid #64d357 !important;
}
#formcss .updatebuttons [type="submit"]:hover {
    background-color: #d37d57 !important;
    border: 0 !important;
    
}



.updatebuttons2 {
    float:left;
}
#formcss .updatebuttons2 [type="submit"] {
    width: 100px !important;
    height: 20px !important;
    line-height: 10px !important;
    font-size:0.8em !important;
    padding: 5px !important;
    margin: 10px 3px 10px 3px !important;
    border-left: 0px solid #64d357 !important;
    border-right: 0px solid #64d357 !important;
    background-color: red !important;
}
#formcss .updatebuttons2 [type="submit"]:hover {
    background-color: #d37d57 !important;
    border: 0 !important;
    
}

/********************* XPERTWEB.CO.UK ***********
Filter Search
************************************************/
.overwidth select {
    width: 100px !important;
    margin-right: 10px !important;
}

#formcss .overwidth  [type="submit"] {
    margin-top: 10px !important;
    width: 120px;
}


/********************* XPERTWEB.CO.UK ***********
Add Notes
************************************************/
.addnotes input {
    width: 80% !important;
    display: inline-block;
    margin-left: 0px;
    margin-right: 0px !important;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #bbbbbb;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #bbbbbb;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #bbbbbb;
}
:-moz-placeholder { /* Firefox 18- */
  color: #bbbbbb;
}
.addnotes [type="submit"] {
    margin-top: 10px !important;
    width: 20% !important;
    display: inline-block;
}
hr {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
    border: 0 !important;
    border-top: 1px solid #eee !important;
}


/********************* XPERTWEB.CO.UK ***********
Wesbite Build
************************************************/
.hr {
    height: 1px !important;
    width: 100% !important;
    background-color: #e6e6e6;
    margin-bottom: 40px;
}
.greyt {
    color: #808080;
}
.buttongreeny {
        background-color: #64d357;
    color: #fff;
    width:110px;
    padding: 10px 20px 10px 20px;
    border: 0px;
    margin-top: 35px;
    display: block;
}
.whiteback {
    background-color: #fff !important;
}
#contentarea h4 {
    font-size:1.4em !important;
}
#floorarea h4 {
    font-size:2em !important;
}
#epcarea h4 {
    font-size:2em !important;
}
#contentarea h1 {
    font-size:1.4em !important;
    color: #64d357;
    margin-top: 10px;
}
#contentarea h3 {
    font-size:2em !important;
}


#contentarea h6 {
    font-size:1.4em !important;
    color: #808080;
    margin-top: 10px;
}
#contentarea h5 {
    font-size:2em !important;
}


.twhite h2 {
    font-size:1.5em !important;
}
.padside {
    padding-left: 25px !important;
    padding-right: 25px !important;
}
.br {
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
}
.prim {
background-color: #64d357;    
}
.pt5 {
    padding-top: 5px !important;
}
.mw {
    max-width: 1170px !important;
    margin: 0 auto;
    padding-left: 10px;
    padding-right: 10px;
}
.headbar {
    background-color: #64d357;
    color: #fff;
    text-align: right;
    font-size: 2em;
    padding-top: 5px;
    padding-bottom: 5px;
}
.headbar a {
    color: #fff;
}
a:hover, a:focus {
    color: #393c39;

}
a {
    cursor: pointer;
}
.col-xs-6 img {
    max-width: 90%;
}
.headbar2 {
    background-color: #64d357;
    color: #fff;
}
.headbar2 a {
    color: #fff;
}
.headbar2 a:hover {
    color: #;
}

.margright10 {
    margin-right: 10px;
}
.headlogo a {
    color: #000000;
}
.headlogo p {
    margin-top: 5px;
    margin-bottom: 5px;
}
.headlogo i {
    color: #64d357;
    padding-right: 10px;
}

.headimg img {
    width: 100%;
    height: auto;
}

#floorarea img {
    max-width: 90% !important;
}
#epcarea img {
    max-width: 90% !important;
}
.btb {
    border-top:2px solid #e1e1e1;
    border-bottom:2px solid #e1e1e1;
}

#footy {
    background-color: #393c39;
}
.whitey {
    color: #fff;
}
.whitey span {
    color: #64d357 !important;
}
.whitey a {
    color: #64d357 !important;
}
.greeny {
    color: #64d357 !important;
    font-size:2em;
}
.f90 {
    width: 90%;
    display: block;
    color: #fff;
    font-weight: bold;
    padding-right:5%; 
}
.f9 {
    width: 45%;
    display: inline-block;
    color: #fff;
    font-weight: bold;
    padding-right:5%; 
}
.f9 input {
    width: 100%;
    border:2px solid #64d357;
    background-color: #393c39;
    color: #fff;
    margin-top: 8px;
    padding: 5px;
    
}
#footy textarea {
    width: 100%;
    border:2px solid #64d357;
    background-color: #393c39;
    color: #fff;
    margin-top: 8px;
    padding: 5px;
    height: 120px;
}
#footy .wpcf7-submit {
    background-color: #64d357;
    color: #fff;
    width:110px;
    padding: 10px 20px 10px 20px;
    border: 0px;
    margin-top: 15px;
    display: block;
}
@media screen and (max-width:765px) {
    #contentarea .col-xs-6 {
        width: 100% !important;
        padding-top: 0 !important;
    }
    .removemob {
        display: none;
    }
    #footy .col-xs-9, #footy .col-xs-3 {
        width: 100%;
    }
    
    .f9 {
    width: 49%;
    display: inline-block;
    color: #fff;
    font-weight: bold;
    padding-right: 1%;
}
    .f90 {
    width: 98%;
    display: inline-block;
    color: #fff;
    font-weight: bold;
    padding-right: 1%;
}
    
    #floorarea .col-xs-7 {
        width: 100%;
        text-align: center !important;
    }
    #floorarea .col-xs-5 {
        width: 100%;text-align: center !important;
    }
    #floorarea .col-xs-7 img {
        max-width: 60% !important;
    }
    #epcarea .col-xs-7 {
        width: 100%;
        text-align: center !important;
    }
    #epcarea .col-xs-5 {
        width: 100%;text-align: center !important;
        
    }
    #epcarea .col-xs-7 img {
        max-width: 60% !important;
    }
    
    #epcarea .buttongreeny,#floorarea .buttongreeny {
    margin: 0 auto;
        text-align: center;
    display: block;
}
    #contentarea h4,#contentarea p {
        text-align: center !important;
    }
    #contentarea a {
        margin: 0 auto !important;
    }
    #footy p {
        text-align: center !important;
    }
    #footy h4 {
        text-align: center !important;
    }
    .wpcf7-submit {
        margin: 0 auto !important;
    }
}
@media screen and (max-width:650px) {
    #contentarea img {
        max-width: 250px;
    }
}
@media screen and (max-width:500px) {
    #footy2 .col-xs-6 {
        text-align: center !important;
        width: 100% !important;
    }
    .f9 {
    width: 100%;
    display: inline-block;
    color: #fff;
    font-weight: bold;
    padding-right: 0%;
}
    .f90 {
    width: 100%;
    display: inline-block;
    color: #fff;
    font-weight: bold;
    padding-right: 0%;
}
}

@media screen and (max-width:450px) {
#contentarea h3 {
    font-size: 1.7em !important;
}
    #contentarea h5 {
    font-size: 1.7em !important;
}
    #floorarea h4 {
    font-size: 1.7em !important;
}
    #epcarea h4 {
    font-size: 1.7em !important;
}
}
@media screen and (max-width:420px) {
    .loginarea .col-xs-4 {
        width: 100%;
    }
}



.opt1 {
    color: red;
    font-weight: bold;
    font-style: normal;
}
.opt2 {
    color: #de1e8f;
    font-weight: bold;
     font-style: normal
}
.opt3 {
    color: blue;
    font-weight: bold;
     font-style: normal
}
.opt4 {
    color:darkorange;
    font-weight: bold;
     font-style: normal
}
.headbar2 a {text-decoration: underline !important;}