/* This file has been changed to add Main-Menu to the CSS to seperate the sidebar menu styling */

/* *********************************************************** */
/*                                                             */
/*                This file should not be changed.             */
/* If changes are required - override in styles-navigation.css */
/*                                                             */
/* *********************************************************** */

/* --------------- navigation ---------------- */
/* === Main menu settings === */
.navigation-wrap { /* navigation menu container to edge of screen */
  padding:0;
  margin:0;
  width: 100%;
}
.navigation { /* navigation menu container to edge of dislay area */
  margin:0; 
  z-index:500; 
  position:relative; 
  padding:0;
  padding-bottom: 50px; /* This is to add extra space to the bottom of the navigation for the overflow scroll fixed Menubox - reset on desktop */
  padding-bottom: 8rem; /* This is to add extra space to the bottom of the navigation for the overflow scroll fixed Menubox - reset on desktop */
}
.menu-icons-wrap {
  float: right;
  position: relative;
}
#menu-icon,
#search-icon,
#search-icon-nav { /* 'Menu' tab on mobile/tablet */
  float:right;
  position:relative;
  display:none !important;
}
.js #menu-icon,
.js #search-icon { /* If there is javascript, show 'Menu' and 'Search' tabs on mobile/tablet */
  display:block !important;
}
#menubox,
#searchbox { /* navigation menu and search field containers */
  padding:10px 0; /* padding between 'Menu' and 'Search' buttons and espanded menu */
  padding:1rem 0;
}
#menubox {
  /* For websites with loads of navigation links that run off the end of the page uncomment the following*/
  /* Also need to increase the padding-bottom on #menubox */
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  position: fixed;
  background-color: #fff;
  /* Remeber to reset this CSS on desktop */
}
#searchbox {
  clear: both;
}
#menubox.menubox-full-width {
  padding-left:3%;
  padding-right:3%;
  width:94%; /* 100% minus padding left and right from above */
}
.fixed-header #menubox,
.fixed-header #searchbox { /* navigation menu and search field containers when header is fixed */
}
.js #menubox,
.js #searchbox { /* if there is javascript. hide the navigation menu and the search field */
  display:none; 
}


/* === Top level menu items === */
nav.main-menu ul.menu { /* navigation menu UL */
  padding-left:0 !important; /* distance between left edge and first tab */
  margin:0;
  list-style:none;
  width:100%;
}
nav.main-menu ul.menu, 
nav.main-menu ul.menu ul,
nav.main-menu ul.menu li {
  border:none; /*reset Nice-Menus CSS*/
  list-style-image: url(data:0) /* This is for IE 10, 11 and Edge to prevent bullets from appearing */
}
nav.main-menu ul.menu li { /* navigation menu tab container */
  position:relative;
  float:none;
}
nav.main-menu ul.menu li a,
#menu-icon,
#search-icon,
#search-icon-nav { /* navigation menu, 'Menu' and 'Search' tabs */
  border-style:solid;
  border-width:1px;
  text-decoration:none;
  display: block; /* required to makew the <a> links appear as full height tabs */
}
#menu-icon,
#search-icon,
#search-icon-nav { /* 'Menu' tab on mobile/tablet */
  border-style:solid;
  border-width:1px;
  margin:0;
  padding:0;
  cursor:pointer;
  text-indent:-9999px;
  text-transform:capitalize; /* This forces IE7 to accept the negative text-indent */
  overflow:hidden;
}
#search-icon,
#search-icon-nav { /* 'Search' tab on mobile/tablet */
}
nav.main-menu ul.menu li.first a { /* use to add/remove border on first navigation tab */
}
nav.main-menu ul.menu li.last a { /* use to add/remove border on last navigation tab */
}

/* Top level menu items - hover styles */
#menu-icon:hover,
#search-icon:hover,
#search-icon-nav:hover { /* navigation menu tabs on hover */
}
nav.main-menu ul.menu li a:hover,
nav.main-menu ul.menu li a.active,
nav.main-menu ul.menu li a.active:hover {
  visibility:visible;/* makes IE7 think something changes on hover, fixes IE sticking dropdown */
}


/* === Drop down first level === */
/*Child Trigger */
.js nav.main-menu ul.menu li.expanded .child-trigger {
  position:absolute;
  top:0;
  right:0;
  cursor:pointer;
}
.js nav.main-menu ul.menu li.expanded .child-trigger .arrow {
  -moz-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
  display:block;
}
.js nav.main-menu ul.menu li.expanded.open-child .child-trigger .arrow {
  -moz-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

nav.main-menu ul.menu li.expanded ul { /* Drop down navigation menu UL */ 
  list-style:none;
  left:0; /* IE6&7 need this to position the sublist correctly on hover*/
  top:0; /*position of first level drop down menu - height of top level menu plus height of border*/
  background:#fff;/* IE needs some sort of background on the nested ul */
  width:100%; /*width of drop down tab */
  position:relative; /* position the sublist to nearest positioned ancestor, the (nav.main-menu ul.menu li) in this case*/
}
nav.main-menu ul.menu li.expanded ul li,
nav.main-menu ul.menu li.expanded ul li.expanded ul li { /* Drop down navigation tab container */ 
  border:none;  /*reset borders from nav.main-menu ul.menu li*/
  width:100% !important;
}
nav.main-menu ul.menu li.expanded ul li a,
nav.main-menu ul.menu li.expanded ul li.expanded ul li a { /* Drop down navigation tab */ 
  padding:5px 3%;  /* padding above/below and left/right on the first level drop down menu */
  padding:0.5rem 3%;  
  float: none;  /*reset the float from nav.main-menu ul.menu li a*/
  text-transform:none;
}
nav.main-menu ul.menu li.expanded ul li.active a,
nav.main-menu ul.menu li.expanded ul li.expanded ul li.active a { /* Drop down navigation active tab */ 
}

/* drop down first level - hover styles */
nav.main-menu ul.menu li.expanded ul li a:hover { /* Drop down navigation tab on hover */ 
}
nav.main-menu ul.menu li.expanded ul li.active a:hover { /* Drop down navigation active tab on hover*/ 

}
nav.main-menu ul.menu li ul { /* first level drop down menu */
  display:block; /* Initially show first level drop down menu on mobile/tablet */
  visibility:visible;
}
.js nav.main-menu ul.menu li ul { /* first level drop down menu */
  display: none; /* Initially hide first level drop down menu if Javascript is on */
}
.js nav.main-menu ul.menu li.open-child ul { /* first level drop down menu */
  display: block; /* Initially hide first level drop down menu if Javascript is on */
}
nav.main-menu ul.menu li:hover ul { /* first level drop down menu on hover */
}
nav.main-menu ul.menu li.expanded ul li ul { /* second level drop down menu*/ 
  display:none; /* Initially hide second level drop down menu */
}



/* --------------- Responsive Adjustments ---------------- */
/* Note, the CSS outside these Media Queries is used for all devices incl. mobiles */

@media only screen and (min-width: 320px) {
  /* Mobile & Small screen, non-retina */

}

@media
only screen and (-webkit-min-device-pixel-ratio: 2)and (min-width: 320px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 320px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (min-width: 320px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 320px),
only screen and (min-resolution: 192dpi) and (min-width: 320px),
only screen and (min-resolution: 2dppx) and (min-width: 320px) { 
  /* Mobile & Small screen, retina, stuff to override above media query */

}

@media only screen and (min-width: 700px) {
  /* Tablet & Medium screen, non-retina */


  /* --------------- navigation ---------------- */
  /* === Main menu settings === */
  #navigation-wrap { /* navigation menu container to edge of screen */
  }
  .fixed-header #navigation-wrap { /* navigation menu container to edge of screen when scrolling */
  }
  .navigation { /* navigation menu container to edge of dislay area */
  }
  .menu-icons-wrap {
    margin-top: 15px;
    margin-top: 1.5rem;
  }
  .fixed-header .menu-icons-wrap {
    margin-top: 0;
  }
  #menu-icon,
  #search-icon,
  #search-icon-nav { /* 'Search' tab on mobile/tablet */
  }
  .js #menu-icon,
  .js #search-icon,
  .js #search-icon-nav { /* If there is javascript, show 'Menu' and 'Search' tabs on mobile/tablet */
  }
  #menubox,
  #searchbox { /* navigation menu and search field containers */
  }
  #menubox.menubox-full-width {
    padding-left:2%;
    padding-right:2%;
    width:96%; /* 100% minus padding left and right from above */
  }
  #menubox { /* navigation menu field containers */
  }
  .fixed-header #menubox,
  .fixed-header #searchbox { /* navigation menu and search field containers when header is fixed */
  }
  .fixed-header #menubox { /* navigation menu containers when header is fixed */
  }
  .js #menubox,
  .js #searchbox { /* if there is javascript. hide the navigation menu and the search field */
  }
  
  
  /* === Top level menu items === */
  nav.main-menu ul.menu { /* navigation menu UL */
  }
  nav.main-menu ul.menu, 
  nav.main-menu ul.menu ul,
  nav.main-menu ul.menu li {
  }
  nav.main-menu ul.menu li { /* navigation menu tab container */
  }
  nav.main-menu ul.menu li a,
  #menu-icon,
  #search-icon { /* navigation menu, 'Menu' and 'Search' tabs */
  }
  nav.main-menu ul.menu li a {/* navigation menu tabs */
  }
  nav.main-menu ul.menu li.first a { /* use to add/remove border on first navigation tab */
  }
  nav.main-menu ul.menu li.last a { /* use to add/remove border on last navigation tab */
  }
  
  /* Top level menu items - hover styles */
  nav.main-menu ul.menu li.active a:hover,  /* This line and the next is needed to prevent hover errors on active tabs in Nice Menu Superfish Javascript */
  nav.main-menu ul.menu li.active:hover a, 
  nav.main-menu ul.menu li a:hover, 
  nav.main-menu ul.menu li:hover a,
  #menu-icon:hover,
  #search-icon:hover { /* navigation menu tabs on hover */
  }
  nav.main-menu ul.menu li a.active:hover, 
  nav.main-menu ul.menu li.active a:hover, 
  nav.main-menu ul.menu li.active:hover a { /* navigation menu active tabs on hover*/ 
  }
  nav.main-menu ul.menu li a.active,
  nav.main-menu ul.menu li.active a { /* navigation menu active tabs */
  }
  
  /* === Drop down first level === */
  nav.main-menu ul.menu li.expanded ul { /* Drop down navigation menu UL */ 
  }
  nav.main-menu ul.menu li.expanded ul li,
  nav.main-menu ul.menu li.expanded ul li.expanded ul li { /* Drop down navigation tab container */ 
  }
  nav.main-menu ul.menu li.expanded ul li a,
  nav.main-menu ul.menu li.expanded ul li.expanded ul li a { /* Drop down navigation tab */ 
  }
  nav.main-menu ul.menu li.expanded ul li.active a,
  nav.main-menu ul.menu li.expanded ul li.expanded ul li.active a { /* Drop down navigation active tab */ 
  }
  
  /* drop down first level - hover styles */
  nav.main-menu ul.menu li.expanded ul li a:hover { /* Drop down navigation tab on hover */ 
  }
  nav.main-menu ul.menu li.expanded ul li.active a:hover { /* Drop down navigation active tab on hover*/ 
  }
  nav.main-menu ul.menu li ul { /* first level drop down menu */
  }
  nav.main-menu ul.menu li:hover ul { /* first level drop down menu on hover */
  }
  nav.main-menu ul.menu li.expanded ul li ul { /* second level drop down menu*/ 
  }


}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 700px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 700px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (min-width: 700px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 700px),
only screen and (min-resolution: 192dpi) and (min-width: 700px),
only screen and (min-resolution: 2dppx) and (min-width: 700px) { 
  /* Tablet & Medium screen, retina, stuff to override above media query */

}

@media only screen and (min-width: 1024px) { 
  /* Desktop & Large screen, non-retina */


  /* --------------- navigation ---------------- */
  /* === Main menu settings === */
  
  /* === Top level menu items === */
  
  /* Top level menu items - hover styles */
  
  /* === Drop down first level === */
  
  /* drop down first level - hover styles */


}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 1024px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 1024px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (min-width: 1024px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 1024px),
only screen and (min-resolution: 192dpi) and (min-width: 1024px),
only screen and (min-resolution: 2dppx) and (min-width: 1024px) { 
  /* Desktop & Large screen, retina, stuff to override above media query */


}

@media only screen and (min-width: 1280px) { 
  /* Desktop & Extra Large screen, non-retina */


  /* --------------- navigation ---------------- */
  /* === Main menu settings === */
  #navigation-wrap { /* navigation menu container to edge of screen */
    padding:0; /* Reset extra padding from mobile version */
    clear:none;
    float:right;
    position:relative;
  }
  .fixed-header #navigation-wrap { /* navigation menu container to edge of screen when scrolling */
  }
  .navigation { /* navigation menu container to edge of dislay area */
    float:left; /* required to make it work on IE7 */
    position:relative; /* required to make it work on IE7 */
    padding: 0; /* reset from mobile nav */
  }
  #menu-icon, 
  #search-icon { /* 'Menu' and 'Search' tab on desktop */
    display:none !important;
  }
  .js #menu-icon,
  .js #search-icon { /* Hide 'Menu' and 'Search' tabs on desktop */
    display:none !important;
  }
  #search-icon-nav {
    display:block !important;
    width:0;
    float:right;
    position:relative;
  }
  .block-nice-menus {
    float:left;
    position:relative;
  }
  .fixed-header .block-nice-menus,
  .fixed-header #search-icon-nav {
  }
  .fixed-header #search-icon-nav {
  }
  #menubox,
  #searchbox { /* navigation menu and search field containers */
    display:block !important;
  }
  #menubox.menubox-full-width {
    max-width: 1280px;
    margin: 0 auto;
  }
  #menubox {
    overflow: visible;
    position:relative;
    top:0;
    width:auto;
    height: auto;
    background:none;
  }  
  #searchbox {
    float:right;
    position:relative;
    height:25px;  /* required to make it work on IE7 */
    clear: none;
  }
  .js #menubox,
  .js #searchbox { /* if there is javascript. hide the navigation menu and the search field */
  }
  .fixed-header #menubox {
    top:0;
  }
  .fixed-header #searchbox {
    margin-top:-100px; /* Scrolls the Seachbox off the page when the page scrolls */
  }
  .drop-menu-search #searchbox {
    margin-top:0; /* makes it reappear when search icon is pressed */
  }
  
  
  /* === Top level menu items === */
  nav.main-menu ul.menu { /* navigation menu UL */
    width:auto;
    padding-left:0 !important; /* distance between left edge and first tab */
  }
  .fixed-header nav.main-menu ul.menu {
  }
  nav.main-menu ul.menu, 
  nav.main-menu ul.menu ul,
  nav.main-menu ul.menu li {
  }
  nav.main-menu ul.menu li { /* navigation menu tab container */
    float:left;
    position:relative;
  }
  nav.main-menu ul.menu li a,
  #menu-icon,
  #search-icon { /* navigation menu, 'Menu' and 'Search' tabs */
  }
  nav.main-menu ul.menu li a {/* navigation menu tabs */
    border-style:solid;
    border-width:1px;
  }
  .fixed-header nav.main-menu ul.menu li a {
  }
  nav.main-menu ul.menu li.first a { /* use to add/remove border on first navigation tab */
  }
  nav.main-menu ul.menu li.last a { /* use to add/remove border on last navigation tab */
  }
  
  /* Top level menu items - hover styles */
  nav.main-menu ul.menu li.active a:hover,  /* This line and the next is needed to prevent hover errors on active tabs in Nice Menu Superfish Javascript */
  nav.main-menu ul.menu li.active:hover a, 
  nav.main-menu ul.menu li a:hover, 
  nav.main-menu ul.menu li:hover a,
  #menu-icon:hover,
  #search-icon:hover {/* navigation menu tabs on hover */
  }
  nav.main-menu ul.menu li a.active:hover, 
  nav.main-menu ul.menu li.active a:hover, 
  nav.main-menu ul.menu li.active:hover a { /* navigation menu active tabs on hover */
  }
  nav.main-menu ul.menu li a.active,
  nav.main-menu ul.menu li.active a { /* navigation menu active tabs */
  }
  
  /* === Drop down first level === */
  /*Child Trigger */
  ul.menu li.expanded .child-trigger {
    display:none; /*Hide the child-trigger on Desktop devices */
  }
  nav.main-menu ul.menu li.expanded ul { /* Drop down navigation menu UL */ 
    width:185px; /*width of sub list tab  - make same as 'nav.main-menu ul.menu li ul li a' below */
    width:18.5rem; /*width of sub list tab  - make same as 'nav.main-menu ul.menu li ul li a' below */
    position:absolute; /* position the sublist to nearest positioned ancestor, the (nav.main-menu ul.menu li) in this case*/
  }
  .fixed-header nav.main-menu ul.menu li.expanded ul {
  }
  nav.main-menu ul.menu li.expanded ul li,
  nav.main-menu ul.menu li.expanded ul li.expanded ul li { /* Drop down navigation tab container */ 
  }
  nav.main-menu ul.menu li.expanded ul li a,
  nav.main-menu ul.menu li.expanded ul li.expanded ul li a { /* Drop down navigation tab */ 
    border-width:1px !important;
    border-style:solid !important;
    border-top:none !important;
    line-height:18px; /* center the text vertically - should be the same height as 'height' in 'nav.main-menu ul.menu' */
    line-height:1.8rem; /* center the text vertically - should be the same height as 'height' in 'nav.main-menu ul.menu' */
  }
  nav.main-menu ul.menu li.expanded ul li.active a,
  nav.main-menu ul.menu li.expanded ul li.expanded ul li.active a { /* Drop down navigation active tab */ 
  }
  
  /* drop down first level - hover styles */
  nav.main-menu ul.menu li.expanded ul li a:hover { /* Drop down navigation tab on hover */ 
    visibility:visible;  /* makes IE7 think something changes on hover, fixes IE sticking dropdown */
  }
  nav.main-menu ul.menu li.expanded ul li.active a:hover { /* Drop down navigation active tab on hover*/ 
    visibility:visible;  /* makes IE7 think something changes on hover, fixes IE sticking dropdown */
  }
  nav.main-menu ul.menu li ul { /* first level drop down menu */
    display:none;
  }
  nav.main-menu ul.menu li:hover ul,
  .js nav.main-menu ul.menu li:hover ul{ /* first level drop down menu on hover */
    display:block; /* Show first level drop down menu on hover */
  }
  nav.main-menu ul.menu li.expanded ul li ul { /* second level drop down menu*/ 
  }



}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 1280px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 1280px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (min-width: 1280px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 1280px),
only screen and (min-resolution: 192dpi) and (min-width: 1280px),
only screen and (min-resolution: 2dppx) and (min-width: 1280px) { 
  /* Desktop & Extra Large screen, retina, stuff to override above media query */


}