/*
 Theme Name:   Resources - Portland Community College
 Theme URI:    https://www.pcc.edu/resources/
 Description:  A custom theme for A-Z resources list. Child of pcc
 Author:       Portland Community College
 Author URI:   https://www.pcc.edu/
 Version:      1.0
 Template:     pcc
*/


/* ----------------------------------------------------------------
    sidebar
---------------------------------------------------------------- */
#sidenav .card ul {padding-left:0.9375rem;} /* toRem(15), a little less than default since there's only a list */



/* ----------------------------------------------------------------
    indexlist
---------------------------------------------------------------- */
.indexlist h4 {
  border-bottom:0.0625rem solid #c1c1c1; /* toRem(1), $medium-gray */
  font-size:1.9375em; /* a little bigger */
  margin-bottom:0.9375rem; /* toRem(15), a little more */
}
.indexlist ul {margin-left:0;}
.indexlist ul li {
  line-height:1.4; /* less */
  margin-right:0.625rem; /* toRem(10) */
  padding-bottom:0.625rem; /* toRem(10), farther apart */
  width:calc(50% -1.25rem); /* toRem(20) */
}
.indexlist ul li a {font-size:0.96875em;} /* 15.5px, a little smaller */
.indexlist ul li a:not(:hover):not(:focus) {text-decoration:none;}



/* ----------------------------------------------------------------
    filtering form
---------------------------------------------------------------- */
form#radio-form {padding:0.9375rem 1.25rem 0.3125rem 1.25rem;} /* toRem(15), toRem(20), toRem(5), toRem(20), less than default */
form#radio-form fieldset legend {display:none;}
form#radio-form span.label {
  font-size:0.96875em !important; /* 15.5px, same as the radio button labels */
  padding:0 !important; /* no top padding on "showing" */
}


/* ------------------------------------
    radio selection
------------------------------------ */
#radio-form label {
  display:inline;
  font-size:0.96875em !important; /* 15.5px, same as the span.label */
  margin-left:0.625rem; /* toTem(10), more space from "showing" */
}
#radio-form input {margin-right:0.3125rem;} /* toRem(5), less than default */


/* ------------------------------------
    jump to section
------------------------------------ */
#jump-letter select, #jump-letter option {width:2.5rem;} /* toRem(40), so the label and input are on the same line */
#jump-letter select {
  background-position:right center;
  height:auto; /* not taller than the rest of the form elements */
  margin-bottom:0;
  margin-left:0.625rem; /*toRem(10), more space from the label */
  padding:0.125rem 0.375rem; /* toRem(2), toRem(6) */
}


/* ------------------------------------
    large screens
------------------------------------ */
@media only screen and (min-width:64em) { /* 1024px, $large-min */
  #jump-letter, #jump-letter select {float:right;} /* push all the way to the right */
}


/* ------------------------------------
    medium and small screens
------------------------------------ */
@media only screen and (max-width:63.9375em) { /* 1023px, $medium-max */
  form#radio-form {padding-bottom:0.9375rem;} /* toRem(15), match top once things wrap */
  #jump-letter label {margin-left:0;} /* line up with the other elements */
  form span.label {
    display:block;
    margin-bottom:0.625rem; /* toRem(10) */
  }
  form span.label + label {margin-left:0 !important;}
  form label {display:inline-block !important;}
}
