html, body {
  position: fixed;
  top: 0;
  right: 0;
  height: 100%;
  width: 100vw;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  justify-content:space-between;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.cornellLinks{
  width: 100%;
  display: flex;
  flex-direction: row;
}
.ilrLink{
  justify-content: flex-start;
}
.slerLink{
  justify-content: flex-end;
}
.slerLink img{
  height:  150px;
  margin-top:  -15px;
  margin-bottom: 10px;
}
h2.section-heading__heading {
  text-align:  center;
}

.linkButton{
  border-radius: 2px;
  border: 4px solid #073949;
  padding: 0.5rem 1rem;
  width: auto;
  display: inline-block;
  text-decoration: none;
  background: #073949;
  min-height: 50px;
  color: white;
}
.linkButton:visited{
  color: white;
  text-decoration: none;
}
#follow-button img{
  width: 23px;
  margin: -5px 20px 0 0;
}
#main {
  display: flex;
  min-height: calc(100vh - 17vh);
}

#main > article {
  flex: 1;
}
#main > nav,
#main > aside {
  flex: 0 0 30vw;
}
#main > nav {
  order: -1;
}
nav{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
header {
  height: 17vh;
  min-height: 180px;
  display: flex;
  flex-direction: column;
  justify-content: start;
}
.topNav{
  display: flex;
  height: 65%;
  padding: 10px;
  flex-direction: row;
  justify-content: space-between;
}
.navLinks{
 text-decoration: none;
  color: #222;
  margin-left: 3px;
  margin-right: 40px;
}
.navLinks:after{
  content: '';
display: block;
width: 40%;
max-width: 100%;
 border-bottom: #b31b1b 2px solid;
transition: width ease-in .25s;
}
.navLinks:hover:after{
  width: 100%;
}
.navLinks:hover{
  text-decoration: none;
  color: #222;
}
.ss-main .ss-multi-selected .ss-values .ss-value{
  background-color: #073949!important;
}
.ss-content .ss-list .ss-option.ss-highlighted, .ss-content .ss-list .ss-option:hover {
  background-color:  #073949!important;
}
.bottomNav{
  border-top: 1px solid #dedede;
  display: flex;
  height: 35%;
  flex-direction: row;
  justify-content: space-between;
  background: white;
    z-index: 100;
}
.titleSection{
  margin-left: 10px;
}
.websiteTitle{
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-size: 30px;
  color: #000000;
  font-weight: bold;
  margin: 0;
  line-height: 1.4;
}
.navLinks{
 text-decoration: none;
  color: #222;
  margin-left: 3px;
  margin-right: 40px;
}
.navLinks:after{
  content: '';
display: block;
width: 40%;
max-width: 100%;
 border-bottom: #b31b1b 2px solid;
transition: width ease-in .25s;
}
.navLinks:hover:after{
  width: 100%;
}
.navLinks:hover{
  text-decoration: none;
  color: #222;
}
.ss-main .ss-multi-selected .ss-values .ss-value{
  background-color: #073949!important;
}
.ss-content .ss-list .ss-option.ss-highlighted, .ss-content .ss-list .ss-option:hover {
  background-color:  #073949!important;
}
#map {
    height: 100%;
    /* The height is 400 pixels */
    width: 100%;
    /* The width is the width of the web page */
  }
  .ilrLink img{
    max-height: 100%;
    margin: 2px;
  }
  .header-right{
    margin-right: 2em;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .rangeCell{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
  }
  #labOrgSearch{
    width: 100%;
  }
  .first{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50%;
    text-align: center;
  }
  #maxNoOfEmpLabel{
    min-width: 3em;
    text-align: center;
  }
  #maxUnitSizeLabel{
    min-width: 3em;
    text-align: center;
  }
  #minUnitSizeLabel{
    float: right;
  }
  #minNoOfEmpLabel{
    float: right;
  }
  .rangeInput{
    width: 100%;
  }
  #resultCount{
    text-align: center;
    padding-top: 5px;
    margin-bottom: 5px;
  }
  .resultText{
    border-bottom: #073949 2px solid;

  }
  /* body{
    margin: 0%!important;
    width: 100vw;
    overflow: scroll;
  } */
  .height-100cent{
    height: 100%;
  }
  .padding-0{
    padding: 0%!important;
  }
  table {     table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0 1em;
    /* padding: 1%; */
   }
  td {
    width: 33%;

  }
.strikes-box{
  width: 100%;
  height: 47vh;
  border-top: none;
  /* border: 1px solid #dedede;  */
  padding: 0 .75em 2em .75em;
  }
  #list-box{
   height: 100%;
   overflow-y: scroll;
  }
  .filter-box{
    border-bottom: none;
    width: 100%;
    padding: 0 10px 0 10px;
    display: block;
    overflow: auto;
  }
  .from-box{
    display: flex;
    flex-flow: row;
    justify-content: space-evenly;
  }
  #approved{
    margin-top: 5px;
    margin-left: 5px;
  }
  .approved-box{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
  }
  .date-box{
    display: flex;
    flex-direction: row;
    justify-content: center;
  }
  .toggle-box{
    display: flex;
    flex-direction: row;
    justify-content: center;
  }
  .toggle-label{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
  }
  .strike-label{
    margin-top: 5px;
    margin-right: 5px;
  }
  .protest-label{
    margin-top: 5px;
    margin-left: 5px;
  }
  .state-box{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
  }
  .yn-box{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
  }
  .button-box{
    display: flex;
    flex-direction: row;
    justify-content: center;
  }
  #filterButton{
    width: 80%;
    border-radius: 5px;
  }
  .linksSection{
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    padding: 10px 0 10px 0;
  }
  .filter-placeholder{
    text-align: center;
  }
  .nav-height{
    height:10%;
    width: 100%;
  }
.main-container{
  height:90%
}
.hidechk {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
.tab {
  width: 100%;
  overflow: hidden;
  margin-bottom: 3px;
  box-shadow: 0 5px 10px rgba(154,160,185,.05), 0 15px 40px rgba(166,173,201,.2);
  border-radius: .25rem;
  border: 4px solid #073949;

}

.tab-label {
  display: flex;
  justify-content: space-between;
  padding: 1em;
  font-weight: bold;
  cursor: pointer;
  /* Icon */
}
.tab-label:hover {
}
.tab-label::after {
  width: 1em;
  height: 1em;
  text-align: center;
  transition: all 0.35s;
}

.tab-content {
  max-height: 0;
  padding: 0 1em;
  /* background:#F7F7F7; */
  transition: all 0.35s;
}
.addressLink{
  color: #007bff; ;
  cursor: pointer;
}
.addressLink:hover{
  text-decoration: underline;
}
.no-box{
  opacity: 0;
  max-height: 30vh;
}
.tab-close {
  display: flex;
  justify-content: flex-end;
  padding: 1em;
  font-size: 0.75em;
  /* background:#F7F7F7; */
  cursor: pointer;
}
/* .tab-close:hover {
  background: #F7F7F7;
}

.tab-close:hover {
  background: #F7F7F7;
}

.hidechk:checked {
  background: #F7F7F7;
} */

.hidechk:checked + .tab-label::after {
  transform: rotate(90deg);
}

.hidechk:checked ~ .tab-content {
  max-height: 100vh;
  padding: 1em;
}

/* TOGGLE BUTTON CSS */
.switch {
  display: inline-block;
  height: 34px;
  position: relative;
  width: 60px;
}

.switch input#togglechk {
  display:none;
}

.slider {
  background-color: #ccc;
  bottom: 0;
  cursor: pointer;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: .4s;
}
.labelDiv{
  width: 100%;
    font-style: oblique;
    font-weight: lighter;
    font-size: small;
}
.date-card{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.info-card{

}
.slider:before {
  background-color: #fff;
  bottom: 4px;
  content: "";
  height: 26px;
  left: 4px;
  position: absolute;
  transition: .4s;
  width: 26px;
}

input#togglechk:checked + .slider {
  background-color: #ccc;;
}

input#togglechk:checked + .slider:before {
  transform: translateX(26px);
}

.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
@media only screen and (max-width: 500px) {
  .websiteTitle {
    font-size: 15px;
  }
#l{
  display: none;
}
  .navLinks{
    font-size: 10px;
    margin-right: 8px;
  }
  #main > nav, #main > aside {
    flex: 0 0 100vw;
    width: auto;
    overflow-x: scroll;
}
.filter-box{
  font-size: 12px;
}
#labOrgSearch {
  width: 100%;
  font-size: 10px;
}
.ss-main{
  width: 100%;
  font-size: 10px;
}
.removetd{
  display: none;
}
#fromDate{
  font-size: 0.7rem;
}
#endDate{
  font-size: 0.7rem;
}
#map{
  display: none;
}
article{
  display: none;
}
/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
   /* Hidden by default. Visible on click */
  min-width: 250px; /* Set a default minimum width */
  background-color: #073949;; /* Black background color */
  color: #fff; /* White text color */
  text-align: center; /* Centered text */
  border-radius: 10px; /* Rounded borders */
  padding: 16px; /* Padding */
  position: fixed; /* Sit on top of the screen */
  z-index: 1; /* Add a z-index if needed */
  bottom: 30px; /* 30px from the bottom */
  margin: 0 20px 0 20px;
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
   /* Show the snackbar */
  /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
  However, delay the fade out process for 2.5 seconds */
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}
}


#count,
.btn,
.btn .label,
.btn-o,
.count-o {
  display: inline-block;
  vertical-align: top;
  zoom: 1;
}
.btn-o {
  max-width: 100%;
}
.btn {
  display: flex;

  position: relative;
  height: 25px;
  box-sizing: border-box;
  padding: 1px 8px 1px 6px;
  background-color: #1b95e0;
  color: #fff;
  border-radius: 3px;
  font-weight: 500;
  font-size: 500;
  cursor: pointer;
}
.rtl .btn {
  padding: 1px 6px 1px 8px;
}
.btn:active,
.btn:focus,
.btn:hover {
  background-color: #0c7abf;
}
.btn:active {
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.1);
}
.xl .btn:active {
  box-shadow: inset 0 3px 7px rgba(0, 0, 0, 0.1);
}
.btn i {
  position: relative;
  top: 5px;
  display: inline-block;
  width: 14px;
  height: 14px;
  background: transparent 0 0 no-repeat;
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2072%2072%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h72v72H0z%22%2F%3E%3Cpath%20class%3D%22icon%22%20fill%3D%22%23fff%22%20d%3D%22M68.812%2015.14c-2.348%201.04-4.87%201.744-7.52%202.06%202.704-1.62%204.78-4.186%205.757-7.243-2.53%201.5-5.33%202.592-8.314%203.176C56.35%2010.59%2052.948%209%2049.182%209c-7.23%200-13.092%205.86-13.092%2013.093%200%201.026.118%202.02.338%202.98C25.543%2024.527%2015.9%2019.318%209.44%2011.396c-1.125%201.936-1.77%204.184-1.77%206.58%200%204.543%202.312%208.552%205.824%2010.9-2.146-.07-4.165-.658-5.93-1.64-.002.056-.002.11-.002.163%200%206.345%204.513%2011.638%2010.504%2012.84-1.1.298-2.256.457-3.45.457-.845%200-1.666-.078-2.464-.23%201.667%205.2%206.5%208.985%2012.23%209.09-4.482%203.51-10.13%205.605-16.26%205.605-1.055%200-2.096-.06-3.122-.184%205.794%203.717%2012.676%205.882%2020.067%205.882%2024.083%200%2037.25-19.95%2037.25-37.25%200-.565-.013-1.133-.038-1.693%202.558-1.847%204.778-4.15%206.532-6.774z%22%2F%3E%3C%2Fsvg%3E);
}
.btn .label {
  margin-left: 3px;
  white-space: nowrap;
}
.btn .label b {
  font-weight: 500;
  white-space: nowrap;
}
.rtl .btn .label {
  margin-right: 3px;
}
.rtl .btn .label b {
  display: inline-block;
  direction: ltr;
}
.xl {
  font-size: 13px;
  line-height: 26px;
}
.xl .btn {
  height: 28px;
  border-radius: 4px;
  padding: 1px 10px 1px 9px;
}
.rtl.xl .btn {
  padding: 1px 9px 1px 10px;
}
.xl .btn i {
  top: 4px;
  height: 18px;
  width: 18px;
}
.xl .btn .label {
  margin-left: 4px;
}
.rtl.xl .btn .label {
  margin-right: 4px;
}
.aria {
  position: absolute;
  left: -999em;
}
.rtl .aria {
  left: auto;
  right: -999em;
}
.count-o {
  position: relative;
  background: #fff;
  border: #8799a6 solid 1px;
  border-radius: 3px;
  visibility: hidden;
  min-height: 18px;
  min-width: 15px;
  text-align: center;
}
#count {
  white-space: nowrap;
  color: #292f33;
}
#count:focus,
#count:hover {
  color: #333;
  text-decoration: underline;
}
.ncount .count-o {
  display: none;
}
.count-ready .count-o {
  visibility: visible;
}
.count-o i,
.count-o u {
  position: absolute;
  zoom: 1;
  line-height: 0;
  width: 0;
  height: 0;
  left: 0;
  top: 50%;
  margin: -4px 0 0 -4px;
  border: 4px transparent solid;
  border-right-color: #66757f;
  border-left: 0;
}
.count-o u {
  margin-left: -3px;
  border-right-color: #fff;
}
.rtl .count-o i,
.rtl .count-o u {
  left: auto;
  right: 0;
  margin: -4px -4px 0 0;
  border: 4px transparent solid;
  border-left-color: #66757f;
  border-right: 0;
}
.rtl .count-o u {
  margin-right: -3px;
  border-left-color: #fff;
}
.hcount .count-o {
  margin: 0 0 0 5px;
}
.hcount.rtl .count-o {
  margin: 0 5px 0 0;
}
.hcount #count {
  padding: 0 5px;
}
.xl .count-o {
  font-size: 11px;
  border-radius: 4px;
}
.xl.hcount .count-o {
  margin: 0 0 0 6px;
}
.xl.rtl.hcount .count-o {
  margin: 0 6px 0 0;
}
.xl.hcount .count-o i,
.xl.hcount .count-o u {
  margin: -5px 0 0 -5px;
  border-width: 5px 5px 5px 0;
}
.xl.hcount .count-o u {
  margin-left: -4px;
}
.xl.rtl.hcount .count-o i,
.xl.rtl.hcount .count-o u {
  margin: -5px -5px 0 0;
  border-width: 5px 0 5px 5px;
}
.xl.rtl.hcount .count-o u {
  margin-right: -4px;
}
.xl #count {
  padding: 0 7px;
}

@media only screen and (max-width: 1000px) {  
  .field--field-components.people {
    grid-template-columns:  1fr;
  }
}

@media only screen and (max-width: 850px) {
  header {
    min-height: 280px;
  }
  .topNav{
    display: flex;
    height: 65%;
    padding: 10px;
    flex-direction: column;
    justify-content: space-between;
  }
  .cornellLinks{
    width: 80%;
    display: flex;
    flex-direction: row;
  }
  .ilrLink{
    height:  75px;
    justify-content: flex-start;
  }
  .slerLink{
    justify-content: flex-start;

  }
  .ilrLink img{
    padding:  2px 0 0 4px;
    height:  100%;
    align-self: start;
  }
  .slerLink img{
  align-self: start;
  margin-top: 0:  ;
  }
}

@media only screen and (max-width: 400px) {
  .topNav {
    padding-bottom:  0;
  }
  .ilrLink{
    height:  50px;
  }
  .slerLink img{
    height:  110px;
    margin:  -125px 0 0 -5px;
  }
  #main {
    margin-top:  0;
  }
  .person {
    flex-direction: column;
  }
}
