
#youarehere, .pagebuttons, #lowerhr{
display:none;
}
.containercenterbottom{
background-size:100vw;
}
.eventdetaildate{
font-size:1.6em;
margin:0px 0px 0px 0px;

color:#212121;

}
.concepttable thead{
background-color:#212121;
color:#ffffff;
font-weight:bold;
}
@media only screen and ( max-width: 800px )
        {
        .containercenterbottom{
		background-size:auto;
		}	
        }
.buttonsurround{
overflow:hidden;
}
.blockbutton{
text-align:center;
padding:10px 10px 10px 10px;
border-bottom:5px solid #3FBCF5;
position:relative;
}
.buttonbg{
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.buttonsurround:hover .buttonbg{
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}

#slidethumbs{
max-width:1100px;
margin-left:auto;
margin-right:auto;
position:relative;
top:-50px;
margin-bottom:-50px;

}
#slidethumbs .homesliderlink{
background-color:#212121;
width: 33.33%
}
#slidethumbs div h3{
background-color:#212121;
color:#ffffff;
text-align:center;
padding:30px 10px 30px 10px;
}
#slidethumbs .homesliderlink.is-selected h3{
background-color:#293FD8;
}
#slidethumbs div a{
text-decoration:none;

}
#slidethumbs .homesliderpreview{
height:175px;
width:auto;
overflow:hidden;
border-bottom:5px solid #212121;
}
#slidethumbs .homesliderlink.is-selected div{
border-bottom:5px solid #293FD8;
}
#slidethumbs div img{
display:block;
opacity:0.7;
filter: alpha(opacity=70);
   -webkit-transition: opacity 0.4s ease-in-out;
   -moz-transition: opacity 0.4s ease-in-out;
   -o-transition: opacity 0.4s ease-in-out;
   -ms-transition: opacity 0.4s ease-in-out;
   transition: opacity 0.4s ease-in-out;
}
#slidethumbs .homesliderlink.is-selected img, #slidethumbs .homesliderlink:hover img{
opacity:1;
filter: alpha(opacity=100);
}

#slidercontrolbar{
max-width:1100px;
margin-left:auto;
margin-right:auto;
position:relative;
top:-110px;
margin-bottom:-45px;
text-align:right;
pointer-events:none;
}
#slidercontrols{
pointer-events:auto;
display:inline;
}

@media only screen and ( max-width: 900px ), ( max-height: 700px )
        {
        #slidethumbs{
        display:none;
        }
        .homeslide-content{
        margin-bottom:0px;

        }
        
        #slidercontrolbar{
top:-70px;
margin-bottom:-70px;

}

        
        }



#stylist{
background: rgba(255, 255, 255,0.9)!important;

}
#stylist img{max-width:250px; }
#stylist img.active{z-index:3}

#logoright{
flex-direction: column;
width:100%;
}
#searchbar{
float:right;
}
#socialbar{
background: rgba(0,0,0,0.9);
text-align:right;
color:#ffffff;
height:48px;
width:100%;
}
#socialbar a{
color:#ffffff;
}
#socialbar i{
font-size:1.5em;
padding:10px 8px 8px 8px;
}
#socialbar a:hover{
color:#3FBCF5;
}
#navbar{
width:100%;


}
#nav{


flex-shrink:0;
}
#navfil{
width:100%;
background: rgba(41,63,216,0.8);
max-height:76px;
}
#sharebox{
background-color:#F3F3F3;
padding:10px 10px 10px 20px;
margin:20px 0px 20px; 0px;
color:#212121;
font-size:1.2em;
}
.facebookcircle{
color:#4064AD;
}
.twittercircle{
color:#1A91DA;
}
.linkedincircle{
color:#1C86C8;
}

@media only screen and ( max-width: 999px )
        {
#stylist{ float:none;
display: block;
margin-left: auto;
margin-right: auto;
}

#stylist img{
margin-bottom:10px;
}
#logowhitecontainer{
min-height:220px;
}


}

@media only screen and ( max-width: 900px )
                {
    
    #logocontainer{
    display:block;
    }
    #socialbar{
    display:none;
    }
    #searchbar{
float:none;
margin-bottom:15px;
}
#searchbox{
padding-top:0px;
  float:none;
  max-width:70%;
  margin-left:auto;
  margin-right:auto;
 }
 #searchbox input{
 border:1px solid #d7dada;
 }
                    #stylist img{
                margin:10px 0px 10px 0px !important;
                }
    
    
    #logocontainer img{
display:block !important;
margin-left:auto !important;
margin-right:auto !important;

    }

				}

@media only screen and ( max-width: 1100px )
                {

        #stylist img{
        margin-left:10px;
        margin-right:10px;
         margin-bottom:-10px;
        }
                }

@media only screen and ( max-width: 990px )
                {
                
        #stylist img{
        margin-left:10px;
        margin-right:10px;
        }
                }
                



 


@media only screen and ( min-width: 999px )
        {

        
        
.menufixed #logocontainer{
padding:0px 0px 0px 0px;
}
.menufixed #basketmobile{
padding:1% !important;
}
.menufixed #socialbar, .menufixed #searchbar{
display:none;
}
.menufixed .logoside{
background: rgba(41,63,216,0.8);
max-height:45px;
}
.menufixed #navfil{
max-height:45px;
}
.menufixed #stylist{
padding:5px 5px 0px 5px;
flex-basis:42px;
}
.menufixed img{

max-width:42px !important;
-webkit-transition: all 400ms ease-in-out;
    -moz-transition: all 400ms ease-in-out;
    -o-transition: all 400ms ease-in-out;
    -ms-transition: all 400ms ease-in-out;
    transition: all 400ms ease-in-out;
    
}
}

    
        
@media only screen and ( min-width: 999px )
        {


.menufixed #nav > ul > li {
height:45px;

}
.menufixed #nav > ul > li >a{
font-size:1em !important;
padding:8px 0px 8px 0px;

}
}
.leftcontact{
float:right;
}
@media only screen and ( max-width: 700px )
        {
.leftcontact{
float:none;
}

}


h1 span:not(.itemprop){
text-align:right;
font-size:0.6em;
float:right;
padding-top:8px;
}
h1 span a:not(.itemprop){
color:#212121;
text-decoration:none;
}
h1 span a:hover:not(.itemprop){
color:#293FD8;
}

@media only screen and ( max-width: 999px )
        {
       
        
        h1 span{
        text-align:left;
        float:none;
        display:block;
        }
}

.charter{
background-color:#d7dada;
font-size:1.6em;
padding:20px;
}
.charter span{
color:#ffffff;
font-size:2em;
margin-right:20px;
}
.charter i{
font-size:2em;
margin-right:20px;
float:left;
margin-top:15px;
color:#293FD8;
}
.charter .charternumber{
color:#ffffff;
font-size:3em;
margin-top:30px;
width:15%;
display:inline;
float:left;
}
.charter .charterinfo{
display:inline-block;
width:80%;
}
#basketbar{
background-color:#212121;
}
@media only screen and ( max-width: 999px )
                {
                #basketbar{
                margin-left:-10px;
                margin-right:-10px;
                }}
@media only screen and ( min-width: 600px )
                {
                #basketmobile{
                
                
                max-width:1100px;
                margin-left:auto;
                margin-right:auto;
                }
                }
#basketmobile{

padding:20px;
color:#ffffff;
font-weight:bold;
}
#basketmobile .green{
background-color:#212121;
}
#basketmobile .green:hover{
background-color:#293FD8;
}
#basketmobile a{
float:right;
margin-top:-5px;
}
                
@media only screen and ( max-width: 600px )
                {
                .charter{
                font-size:1.2em;
                }
                .charter i{
                font-size:2em;
                }
                
              .charter .charternumber{
              font-size:2em;
              width:20%;
              }
              .charter .charterinfo{
              width:75%;
              }
              

}
.whitebox{
background-color:rgba(255, 255, 255, 0.8);
padding:20px; margin:20px 0px 20px 0px;
}

#whitefooter{
max-width:1100px;
margin:auto;
clear:both;
font-size:0.8em;
padding-top:32px;
padding-bottom:32px;
line-height:1.2em;
}
#legal{
float:right;
}
#legal a, #whitefooter a{
color:#333333;
text-decoration:none;
}
#legal a:hover, #whitefooter a:hover{
text-decoration:underline;
}
#spectulise #address{
padding-left:42px;
}
@media only screen and ( max-width: 990px )
                {

#whitefooter{
text-align:center;
}
#legal{
float:none;
}

                }

.address{
padding-left:42px !important;
margin:20px 0px 30px 0px !important;
}

#spectulise #address li, .address li{
list-style-type:none;
list-style-image:none;
line-height:1.2em !important;
padding-bottom:10px !important;
}
#spectulise>div>#address>li:before, .address>li:before{
font-family: "Font Awesome 5 Pro";
content: '\f0da';
margin:2px 5px 0 -15px;
color: #3FBCF5;
float:left;
font-size:1.2em;
}
.address>li:before{
margin:2px 0px 0 0px;
}
#spectulise>div>#address>li.map:before, .address>li.map:before{
content:'\f3c5';
margin:2px 10px 0 -25px;
}

#spectulise>div>#address>li.phone:before, .address>li.phone:before{
content:'\f095';
margin:2px 0px 0 -25px;

}
.address>li.map:before, .address>li.phone:before{
font-size:1em;
}

#spectulise #stafflogin{
margin-top:22px;
display: flex;
  align-items: stretch;
}
#spectulise #logincredentials{
flex-grow:2;
} 
#spectulise #logincredentials input{
width:100%;
font-family:'Roboto', Arial, sans-serif;
font-size:0.9em;
padding:8px 8px 8px 8px;
border:0px;
}
#spectulise #logincredentials #username1{
margin-bottom:15px;
}
#spectulise #loginbutton{
width:100px;
padding-left:30px;
flex-grow:1;
}
#spectulise #loginbutton input{
height:100%;
border-radius:0;
width:70px;
font-family: "Font Awesome 5 Pro";
font-size:1.8em;
background-color:#212121;
color:#ffffff;
border:0px;
cursor:pointer;
}
#spectulise #loginbutton input:hover{
background-color:#3FBCF5;
}

.social{
 opacity: 0.8;
 -o-transition-duration: .5s;
-moz-transition-duration: .5s;
-webkit-transition: -webkit-transform .5s;
max-width:32px;
}
.social:hover{
opacity: 1;
-o-transition-duration: .5s;
-moz-transition-duration: .5s;
-webkit-transition: -webkit-transform .5s;
}

.socialicon{
position:relative;
z-index:1;
font-size:0.9em;
margin-left:-5px;
}
.socialicon i{
color:#ffffff;
}
.socialicon #twittercolor{
color:#1A91DA;
}
.socialicon #instacolor{
color:#F41862;
}

.socialicon #facebookcolor{
color:#4064AD;
}
.socialicon #linkedincolor{
color:#1C86C8;
}
.socialicon a:hover .fa-circle{
color:#293FD8 !important;
}
#twitterwide:after{
content: "\f099"; 
  font-family: "Font Awesome 5 Brands";
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
  position: absolute;
  font-size: 240px;
  color: rgba(255,255,255,0.2);
  margin: -100px 0px 0 175px;

  -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}
@media only screen and ( max-width: 1100px )
        {
        #twitterwide:after{
        margin: -100px 0px 0 0px;
        }
        }

/* Vacancy */

.eventdetails {
position: relative;
list-style:none;
}
.eventdetails li{
display:inline;padding-right:10px !important;
}
ul.eventdetails li::before{
content:"" !important;
margin-left:0px !important;
}
.eventdetails{
margin-top:0px;
margin-bottom:5px;
padding:0px;
}
.eventdetails a{
text-decoration:none;
color:#333333;
}
.eventdetails a:hover{
text-decoration:underline;
}
.eventdetails i, .widgetevent i{
font-size:1.4em;
color:#212121;
}
.eventdetails i:not(:first-child){
margin:0px 2px 0px 15px;
}
.widgetvacancy h4{
background-color:#212121;
padding:10px;
font-family:'Quicksand', Verdana, Arial;
color:#ffffff;
font-size:1.2em;
margin-bottom:10px;
}
.widgetvacancy{
list-style-image:none !important;
padding-left:0px ;
margin-left:0px;}
.widgetvacancy li{

list-style-type:none;
border-bottom:5px solid #293FD8;
padding-bottom:10px;
margin-bottom:18px;
}
.widgetvacancy .advertthumb{
width:140px;
height:95px;
border:1px solid #d7dada;
overflow:hidden;float:left;
margin:15px 20px 0px 20px;

-webkit-transition: border .3s linear;
-moz-transition: border .3s linear;
-o-transition: border .3s linear;
-ms-transition: border .3s linear;
transition: border .3s linear;
}
.widgetvacancy a:hover .advertthumb{
border: 1px solid #293FD8;
}
.widgetvacancy .buttonlink{
background-color:#212121;
padding:5px 10px 5px 10px;
text-decoration:none;
font-size:1em;
font-weight:400;
display:inline-block;
float:right;
margin:0px 0px 10px 10px;
}
.widgetvacancy a.buttonlink:hover{
background-color:#293FD8;

}
.vaclocation{
margin-left:180px;

}
.vaclocation i{
color:#212121;
margin-right:5px;
font-size:1.2em;
}
.vacancylocation i{
color:#212121;
}
.vacancylocation{
margin-top:5px;
}

#accesstools{
position:fixed;
bottom:100px;
right:20px;
background-color:#293FD8;
border-radius:10px;
z-index:999;
padding:15px;
color:#ffffff;
text-align:center;
filter: drop-shadow(1px 1px 5px #3B404C);
}
#accesstools a{
color:#ffffff;
height:30px;
width:30px;
display:inline-block;
text-align:center;
text-decoration:none;
vertical-align:middle;
}
#accesstools a.selected, #accesstools a:hover, #accesstools a:focus{
background-color:#212121;
border-radius:4px;
}
.fontsmall{
font-size:0.7em;
}
.fontlarge{
font-size: 1.3em;
}
.contrasthigh i{
rotate: 180deg;
}
.genbutton.login:hover, .genbutton.login:focus{
background-color:#3FBCF5;
}

@media only screen and ( max-width: 800px )
        {
        .widgetvacancy .advertthumb{
display:none;
        }
        .vaclocation{
        margin-left:0px;
        }
        .widgetvacancy .buttonlink{
        display:block;
        float:none;
        margin:10px 0px 0px 0px;
        }
        .widgetvacancy li{
        margin-bottom:0px;
        padding-bottom:0px;
        }
        }
        
        
 /* External Vacancy code */  
 summary{
 background-color:#293FD8 !important;
 }     
 .moredetails{
 border: 2px solid #293FD8 !important;
 }
        
        .job-card {
    background-color: white;
    border: 2px solid #293FD8;
    border-radius: 6px 6px 0px 0px;
    overflow: hidden;
    margin: 10px 0px;
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 100px;
}

.job-details {
    padding: 20px;
    flex: 1;
    text-align: left;
}

.job-card img {
    height: 150px;
    object-fit: cover;
width:auto !important;
}

.job-details h2 {
    margin: 0 0 10px 0;
    color: #293FD8;
}

.job-details p {
    margin: 0 0 20px 0;
    color: #333333;
}

.job-details .location-icon {
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: middle;
}

.job-details button {
    background-color: #293FD8;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.job-details button:hover {
    background-color: #3FBCF5;
}

.v3-tableview-head {
display: none;
}

caption {
display: none;
}

.td-embedded table.fs-grid>tbody>tr>td, .td-embedded table.fs-grid>tbody>tr>th {
background-color: #fff;
}

.v3-numrecords {
display: none;
}

@media (max-width: 600px) {
    
    .job-card img {
        height: 120px;
width: 100px;
    }

.job-card {
height: 120px;
}

.job-details p {
    line-height: 25px;
font-size: 14px;
padding-bottom: 5px;
}

.job-details {
padding: 10px;
}

.job-details button {
padding: 5px 10px;
}

details {
font-size: 14px !important;
}