body {background: #f1f1f1 !important;overflow-x: hidden !important;}

/*body.menuOpen header {
    position: fixed;
    width: 100%;}*/


/****** HEADER ******/
header {
    background: #5c5c61;
    color: white;
    margin-bottom: 20px;
    z-index: 10;
    padding-bottom: 0;
}

/*LOGO */
header .logo {
    float: inherit; 
    margin-bottom: 1em;
    width: 20%;
    display: inline-block;
}

header .logo img {
    /* filter: brightness(0) invert(1); */
    min-width: 80px;
    max-width:  150px;
    width:  100%;
}


@media (max-width: 800px) {
header {height: 150px;}
header #header-content {padding: 1rem;}
header .logo img { height: auto;}
header h1 { display: none;}
header #header-content {margin-left: 0em;}
header menu div.top-level {
    top: 150px;
    height: calc(100% - 150px);}
}

@media (max-width: 600px) {
header #ctl00_ctl18_imgLogo { width: 100px;}
header {height: 120px;}
header menu div.top-level {
    top: 120px;
    height: calc(100% - 120px);}
}

@media (max-width: 500px) {
header #header-content {padding: .5rem 1rem;}
header #ctl00_ctl18_imgLogo { width: 70px;}
header {height: 95px;}
header menu div.top-level {
    top: 95px;
    height: calc(100% - 95px);}
}

/* SEARCH */
#user-tools-button {background: transparent;}
header #header-content-right {
    float: inherit;
    position: absolute;
    right: 15px;
    max-width: 50%;
}

header #search input.textbox,
header #search input.button {
    font-size: 12px;}
    
header #search input.button {
    background: url(/stylesheet/WarwickSU2019/magnifying-glass.png) no-repeat center;
    color: #fff;
    border: none;
    padding: 6px 15px;
    position: absolute;
    top: 0px;
    right: 0px;
    text-indent: -5000px;
    margin: 0;
    z-index: 99999;
    background-size: 15px 15px;}

header #search input::placeholder {
    color: white;}

header #search input.textbox {
    border-color: #fff;
    background: #5c5c61;
    padding: 10px 40px 10px 10px;
    color: white;}
    
#searchIcon {display: none;}

header #search input.button:before {
    display: block;
    background: url(/stylesheet/WarwickSU2019/magnifying-glass.png);
    background-size: 10px 10px;
    width: 10px;
    height: 10px;
    margin: 0;
    float: right;
    cursor: pointer;
    content: "";}


@media (max-width: 800px) {
header #header-content-right {
    width: 60%;
    position: absolute;
    top: 50%;
    right: 70px;
    transform: translateY(-50%);
    text-align: center;
    margin: auto;}
    
#user-tools {
    display: block; }

header #search {
    display: none;
    float: none;
    position: absolute;
    top: 84px;
    right: -75px;
    background: #5c5c61;
    width: 99vw;
    padding: 0 20px 20px 20px;
    z-index: 10;}

header #search .mslwidget {
    float: right;
    width: 100%;
    max-width: 250px;}

header #search input.textbox { width: 80%; float: right;}
header #search input.button {right: 18px;}
header #search input.button { margin-top: -1px;}
    
    
#searchIcon {
    display: block;
    background: url(/stylesheet/WarwickSU2019/magnifying-glass.png);
    background-size: 30px 30px;
    width: 30px;
    height: 30px;
    margin: 0 15px 0 7px;
    float: right;
    cursor: pointer;}
    
}

@media (max-width: 600px) {
header #search {top: 71px;position: absolute;}
}

@media (max-width: 499px) {
header #search {top: 61px;position: absolute;}
}


/* MENU */

.subnavTitle.navClick {z-index: 20;}
.menuOpen .subnavTitle.navClick {z-index: -1;}

#menu-content .maxWidth { position: inherit; height: 44px;}
 
@media (min-width: 801px) {

#menu-content .maxWidth { height: auto;}

header menu {
    width: 100%;}

header menu div.top-level {
    border-top: 0px #ddd solid;
    border-bottom: 0px #ddd solid;}
    
header menu #main-menu > ul.msl_navbar > li {
    display: inline-block;}
    
header menu #main-menu > li > a:active {
    content: "";
    border-bottom: 3px solid #fbb812;
    display: block;
    width: 40px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);}
 
 
#menu-content {
    background: #4c4d4f;}

   
#main-menu > ul > li {
    width: fit-content;
    padding: 16px 16px;
    margin: 0;}

/*.loggedin #main-menu > ul.msl_navbar > li:first-child {display: none;}*/

header menu #main-menu > li { position: inherit;}

header menu #main-menu > ul > li:hover {
    background-color: #2b2b2b;}    

    
header .secl {
    position: absolute;
    left: 0;
    display: none;
    width: 100vw;
    background: #2d2d2d;
    top: auto;
    margin: 14px auto;}  

header menu .level_1 {
    position: static;
    width: 100vw;;
    padding: 30px 0;
    max-width: 1100px;
    margin: auto;
    list-style: none;}  

#main-menu > ul > li .secl,
header menu .level_1 {
    display: none;
    z-index: 1;
}
    
#main-menu > ul > li .secl .level_1 {
    display: block;}
    
#main-menu > ul > li:hover .secl {
    display: block;}

header menu .level_1 a {
    font-size: 13px;
    padding: 10px 20px;}

header menu .level_1 > li {
    margin: 15px 0;
    width: 49%;
    width: calc(50% - 2px);
    display: inline-block;
    vertical-align: top;
    max-width: 360px;}

header menu .level_1 a:hover {
    background: transparent;
    color: #fcb912 !important;}

header menu .level_1 li .level_2 {
    display: none;
    list-style: none;
}

header menu #main-menu .level_2 li {width: 100%;}
    
header menu #main-menu .level_2 li a{
    text-transform: capitalize;   }




}
    
/* New icon */    

#nav-icon3 {
  width: 40px;
  height: 25px;
  position: relative;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#nav-icon3 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #fff;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon3 span:nth-child(1) { top: 0px;}
#nav-icon3 span:nth-child(2) { top: 12px;}
#nav-icon3 span:nth-child(3) { top: 24px;}


    
@media (max-width: 800px) {   
    label[for="nav-open"] {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    left: auto;
    border-right: 0em #EEEEEE solid;
    font-size: 2.5em;}
    
}

@media (min-width: 1015px) {   
header menu li.top-level > a {
    font-size: 15px;}
}


/* FOOTER */
footer #footer-details {
    clear: both;
    padding: 20px 0 10px;
    border-top: 0px solid #ffffff;
    margin: 0;}
    
footer #footer-links-stuff a,
footer #footer-links-tech a,
footer #footer-links-social a{
    color: #ECE6ED;
    text-decoration: none;
}

footer #footer-links-stuff a:hover,
footer #footer-links-tech a:hover,
footer #footer-links-social a:hover {
    color: #fcb912;}

footer #footer-links-social li a:before {display: none;}

footer #footer-links-social li a img {
    width: 22px;
}

footer #footer-links-social li a:hover img {
   filter: invert(13%) sepia(20%) saturate(3600%) hue-rotate(347deg) brightness(102%) contrast(102%);
}


@media (max-width: 599px) {
footer #footer-links > div {
    width: 49%;
    float: none;
    padding: 0 .5em;
    display: inline-block;
    vertical-align: top; }

footer #footer-links #footer-links-social li {
    display: inline-block;
    margin: 0 5px;}

}

@media (max-width: 499px) {
footer #footer-links > div {
    width: 100%;
    float: none;
    padding: 0 .5em;}

}



/* Logged in */
#user-tools-dropdown {
    background: #2d2d2d;
    font-size: 13px;
    padding: 10px;
    min-width: 180px;
    top: 3em;
    left: auto;
    right: 10px;}

#user-tools-dropdown li,
#user-tools-dropdown #msl_admin li, 
#user-tools-dropdown #controlpanel li {
    border-bottom: 0px solid #555;}
    
#user-tools-dropdown #controlpanel li.msl_add {
    display: none;}

#user-tools-dropdown h3,
#user-tools-dropdown h3,
#msl_admin h4 {
    border-bottom: 0px solid #555;
    text-transform: uppercase;}

#user-tools-button {padding: 0 15px;}

#user-tools-button.open {
    background: #2d2d2d;
    padding: 0 15px;}

#user-tools-dropdown a:hover {
    background-color: transparent;
    color: #fcb912;}
    
#user-tools-dropdown #msl_admin ul#ulAdmin {
    background: #2d2d2d;
    font-size: 13px;
    padding: 10px;}
    

@media (min-width: 800px) {  
#user-tools-dropdown {
    left: 0;
    right: auto;}
}

   
/* MENU GENERAL */  
#main-menu > ul {
   list-style: none;
   padding: 0 18px;}
  
header menu .level_1 {
    padding: 30px;}
   
header menu #main-menu ul li > a {
    font-size: 15px;
    text-align: left;
    font-weight: normal;
    line-height: normal;}
    
header menu #main-menu ul li > a.current {
    border-bottom: 2px solid #fcb912; padding-bottom: 3px;}
    
header menu #main-menu .secl ul li > a.current {
    border: 0;
    color: #fcb912;
    margin-bottom: 13px;
}
    
    
#user-tools {
    margin-right: 0;}
    
#main-menu li ul > li.hasChild.active > a {
    color: #fcb912;} 
    
header menu #main-menu li > a {
    color: white;
    text-transform: capitalize;
    font-size: 13px;
    position: relative;
    text-decoration: none;}

header menu #main-menu ul li:hover > a {
    color: #fcb912;}  
    
header menu #main-menu ul li:hover > a.current {
    color: #ffffff;
}

#main-menu li ul > li.hasChild > a:before {
    background-size: 17px 17px;
    background-repeat: no-repeat;
    display: inline-block;
    width: 20px;
    height: 20px;
    content: "";
    top: 5px;
    margin-right: 8px;
    background-image: url('/stylesheet/WarwickSU2019/plus3.png');
    left: 0px;
    top: 8px;
    position: absolute;}

#main-menu li ul > li.hasChild.active > a:before {
    background-image: url('/stylesheet/WarwickSU2019/minus3.png');
    left: 0px;
    top: 8px;
    position: absolute;} 

@media (min-width: 1101px) {
#main-menu > ul { padding: 0;}
header menu .level_1 {padding: 30px 0;}
}

/* MENU MOBILE */
@media (max-width: 800px) {
#main-menu > ul {
    padding: 0;
    margin: 0;}    

#main-menu {
    position: relative;
    right: 110%;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    top: -6px;
    padding: 0;
    overflow: hidden;}

#main-menu.menuOpened {
    right: 0;}

header menu .level_1 {
    padding: 10px 29px;
    margin: 0;}

header menu li.spacer {border-top: 0px solid #eee;margin-top: 0;}
    
header menu li.top-level ul.second-level.menu-open {
    display: none; }

label[for="nav-close"] {
    background: transparent;
    width: 50px;
    height: 50px;
    position: absolute;
    z-index: 9999;
    right: 12px;
    top: 50px;
    left: auto;
    cursor: pointer;}    

li.active a {color: #fcb912;}

header menu li.top-level.active > a,
header menu li.top-level:hover > a {color: white}

header menu li.second-level.active > a {
    background: none;
    color: #fcb912;
}
    
header .secl {
    /*display: none;*/
    width: 100vw;
    background: #2d2d2d;
    top: auto;
    margin: 0 auto;}
    
header menu div.top-level  {
    /*width: 100%;*/
    background: #4c4d4f;
    box-shadow: none;
    text-transform: uppercase;
    font-size: 13px;
    transition: all .5s;}

header menu div.top-level a {
    color: white;
    font-size: 15px;}
  
header menu div.top-level li:not(:last-child) {
    border-bottom: 1px solid #2d2d2d;
    padding: 0px;}
  
  
header menu div.top-level li a {
    color: white;
    font-size: 14px;
    position: relative;
    font-weight: 700;
    padding: 7px 10px 16px 10px;
    display: block;} 
    
#main-menu > ul.msl_navbar > li > a {
    height: 47px;
    line-height: 31px;} 

#main-menu ul.msl_navbar > li.hasChild > a:before {
    background-image: url('/stylesheet/WarwickSU2019/plus.png');
    background-size: 17px 17px;
    background-repeat: no-repeat;
    display: inline-block;
    width: 20px;
    height: 20px;
    content: "";
    position: relative;
    top: 7px;
    margin-right: 8px;}  

#main-menu ul.msl_navbar > li.hasChild.active > a:before {
    background-image: url('/stylesheet/WarwickSU2019/minus.png');}  


#main-menu ul.msl_navbar > li.hasChild.active > a:hover {
    background: transparent;
    color: #fcb912;}

header li.top-level.active .secl {
    padding: 20px 15px;}


/*header menu .level_1 {display: block;}*/
header menu .level_1,
header menu .level_1 li .level_2 {display: none;list-style: none;}

header menu .level_1 li .level_2 {
    padding: 0;
    margin: 5px 0 15px;}

header li.second-level.active .secl {
    padding: 10px 0px 20px 0;}

header li.top-level.active .secl li.second-level:not(.active) .secl {
    padding: 0px;
}

header menu div.top-level li.second-level a {
    padding: 10px 30px;}
  
header menu a.second-level:hover { 
    background: transparent;
    color: #fcb912;}

/*#nav-open:checked ~ #main-menu {
    left: 0px;
    width: 100%;}  */

header menu ul.third-level {
    display: none;
    list-style: none;
    position: relative;
    left: 30px;
    top: 0;
    padding: 0;}
    

#main-menu ul.level_2 li a {
    text-transform: capitalize;
    font-weight: 500;
    padding: 3px 10px 10px 10px;}
    
header menu div.top-level li.second-level li.third-level a {
    padding: 0;
    text-decoration: none;}


#main-menu li ul > li.hasChild > a:before {
    background-image: url('/stylesheet/WarwickSU2019/plus3.png');
    left: -11px;
    top: 3px;
    position: absolute;}

#main-menu li ul > li.hasChild.active > a:before {
    background-image: url('/stylesheet/WarwickSU2019/minus3.png');
    left: -11px;
    top: 3px;
    position: absolute;} 
    
    
}

@media (max-width: 500px) {
label[for="nav-close"] {top: 20px;} 
}




/* Basket - Header */
header #basketIcon {display: none; float: right;}
header #basketIcon a {    
    color: white;
    text-decoration: none;
    margin: 1px 0 0 0;
    display: block;
    font-size: 14px;}

header #basketIcon img { width: 14px; }

header #basket.sidepanel {
    z-index: 99;
    width: 280px;
    display: none;
    position: absolute;
    top: 30px;
    text-align: left;
    line-height: 16px;}

header #basketIcon .admin-label {display: none;} 

@media (min-width: 500px) {
   header #basketIcon {display: inline-block;} 
}
    
@media (min-width: 650px) {
   header #basketIcon .admin-label {display: inline-block;} 
}
    
@media (min-width: 880px) {
   header #basketIcon a {  
    margin: 4px 7px 0 0;} 
}

@media (min-width: 967px) {
   header #basketIcon a {  
    margin: 4px 7px 0 0;} 
}