/* Mobile layout, large screens*/

@media only screen and (max-width: 990px) {

  body {
    overflow-x: hidden;
    min-width: 100%;
  }

  .nomobile-med {
    display: none;
  }

  #header-text {
    font-size: .9em;
  }

  #page div.container {
    width: 100%;
    padding: 20px;
  }

  #page #banner .container,
  #page #results_box > .container {
    padding: 0 1em;
  }

  #page #banner img {
    width: 100%;
    background-color: #fff;
  }


  .sidebar-layout #content .column.first {
    padding-right: 20px;
    display: table-cell;
    float: none;
    max-width: 100%;
    width: 100%;
  }

  .sidebar-layout #content .column.last {
    padding-left: 20px;
    width: 275px;
  }

  #content .content-bg {
    display: none;
  }

  fieldset input[type='radio'] + label {
    padding: 0.7em 10% 0.5em 27%;
  }

  .fieldset-text input {
    width: 65%;
  }

  .fieldset-text label {
    width: 33.5%;
  }

  fieldset.fieldset-radio li {
    width: 33.1%;
  }
}

/* Mobile layout, medium screens*/

@media only screen and  (max-width: 760px) {
  h1 {
    font-size: 2.5em;
    margin: 0;
  }

  small {
    font-size: 14px;
  }

  fieldset {
    padding: 0.8em 1em 0.5em;
    margin-top: 0.25em;
  }

  fieldset:first-child {
    padding-top: .8em;
  }

  fieldset:last-child {
    margin-bottom: 0;
  }

  fieldset legend {
    left: .8em;
    font-size: 1em;
  }

  form {
    margin-bottom: .25em;
  }

  #content a,
  .sidebar-title {
    display: block;
  }

  #content .notification {
    margin-bottom: .9em;
  }

  #content #resultsinfo {
    padding: 0;
  }

  #content .fieldset-text li {
    padding: 0;
    margin-right: 0;
    display: block;
    margin-top: 0;
  }

  #content ul {
    float: none;
  }

  #content .fieldset-text input {
    width: 100%;
    margin: 0;
  }

  #content .fieldset-radio ul {
    display: table;
    width: 100%;
    margin: 0.4em 0 0.7em 0;
  }

  #content .fieldset-radio li {
    display: table-cell;
    padding: 0;
    width: 33%;
    text-align: center;
  }

  #content fieldset.fieldset-radio li {
    float: none;
  }

  #content fieldset input[type='radio'] {
    left: -9999em;
  }

  #content fieldset input[type='radio'] + label {
    padding: 0.7em 15px 0.5em;
    margin-right: 0;
    display: block;
  }
  #content fieldset li:last-child input[type='radio'] + label  {
    border-left: 0;
  }

  #content fieldset ul .mobile-visible {
    display: inline-block;
  }

  #content .button-cell {
    display: table-cell;
    width: 50%;
    float: none;
  }

  #content .buttons {
    display: table;
    width: 100%;
  }

  #content .buttons input {
    width: 100%;
    padding: 0.7em;
    font-size: 1.2em;
  }

  #content .buttons .button-cell:first-child {
    padding-right: 0.5em;
  }

  #content .buttons .button-cell:last-child {
    padding-left: 0.5em;
  }

  #header-logo {
    display: none;
  }

  #header-text {
    font-size: .9em;
    margin-top: 0;
  }

  #header h1 {
    margin-top: 0;
  }

  #content p.subheading {
    margin: 15px 0;
  }

  #content .container, #content .column.first, #content .column.last {
    display: block;
  }

  body #page div.container {
    padding: 1em;
  }

  #page #content div.container {
    width: auto;
    float: none;
    padding: 0px 20px;
  }

  body.sidebar-layout #page #content div.container {
    padding: 0;
  }

  #page #banner, #content .buckeyebox-logo {
    display:none;
  }

  body.sidebar-layout #page #content {
    background: #fdfdfd;
  }

  #content p {
    margin: 15px 0;
  }

  #content .column.first,
  #content .column.last,
  .sidebar-layout #content .column.first,
  .sidebar-layout #content .column.last {
    width: auto;
    float: none;
    margin: 0;
  }

  .sidebar-layout #content .column {
    border-bottom: 1px solid #ccc;
  }

  .sidebar-layout #content .column.first {
    padding: 1em;
    margin: 0;
    border-bottom: 1px solid #ccc;
    display: block;
  }

  .sidebar-layout #content .column.last {
    margin: 0;
    background-color: #efefef;
    padding: 1em;
    box-shadow: inset 0px 20px 20px -20px rgba(0, 0, 0, 0.05);
    display: block;
  }

  #content .content-bg {
    display: block;
  }

  #page #content .featured-content {
    width: auto;
    padding: 20px 0;
    border-width: 0 0 1px 0;
  }

  #page #content .featured-content h2 {
    margin: 15px 0;
    float: left;
    width: 40%;
  }

  #page #content .featured-content h3 {
    float: left;
    width: 60%;
    margin: 5px 0;
  }

  #page #content .featured-content h3 a {
    display: block;
  }

  .note img {
    margin: 7px 10px 10px 0;
  }

  #results-table tr.results_label th,
  #results-table tr.record-data td {
    display: none;
  }

  #results-table .detail-table,
  #results-table td {
    border-left: 0;
    border-right: 0 none;
  }

  #results #results-table tr.record-data td.record-data-vcard,
  #results #results-table tr.record-data th.record-data-name {
    display: table-cell;
    position: relative;
    height: auto;
    width: auto;
    left: 0;
  }

  #results #results-table tr.record-data th.record-data-name {
    width: 100%;
  }

  #results #results-table tr.record-data td.results-vcard {
    float: left;
    position: relative;
    z-index: 900;
  }

  #results #results-table tr.record-data th .results-name {
    width: 100%;
    position: relative;
    z-index: 800;
    display: block;
  }

  tr.record-collapsed:hover td,
  tr.record-collapsed:hover th {
    background-color: #fff;
  }

  #page #buttons li a:hover,
  #page .button a:hover {
    background-color: #880000;
    background-image: none;
    border: 1px solid #330000 ;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3) inset;
  }

  #footer p {
    margin-top: 1em;
  }

}

/* Mobile layout, small screens*/

@media only screen and  (max-width: 560px) {

  .mobile-visible {
    display: inherit;
  }

  .mobile-hidden {
    display: none;
  }

  .mobile-block, .mobile-only {
    display: block;
  }

  h1 {
    font-size: 1.8em;
  }

  #content .notification {
    margin-bottom: 0;
    border-radius: 0;
    border-width: 0 0 1px 0;
  }

  #content #resultsinfo {
    padding: 0;
  }

  #content fieldset {
    margin: 0;
    border-width: 0;
    border-radius: 0;
    padding: 0.5em 1em;
  }

  #content fieldset:first-child {
    padding-bottom: 0.1em;
    padding-top: 0.8em;
  }

  #content fieldset legend {
    left: -9999em;
    padding: 0;
    margin: 0;
    height: 1px;
    width: 1px;
    position: absolute;
  }

  #content .fieldset-radio ul {
    margin: 0;
  }

  .sidebar-layout #content .column.first {
    padding: 0;
  }

  .sidebar-layout #content .column.first form .buttons {
    padding: 1em 1em 1.4em;
    background-color: #f3f3f3;
  }

  .sidebar-layout #content .column.first form,
  .sidebar-layout #content .column.first form .buttons input {
    margin: 0;
  }

  #content .buttons .button-cell:first-child {
    padding-right: .8em;
  }

  #content .buttons .button-cell:last-child {
    padding-left: .8em;
  }

  #content .fieldset-text li {
    margin-top: 0;
  }

  #header h1 {
    margin: 0;
  }

  #page .inline-list {
    margin: 20px 0 10px 0;
  }

  #page .inline-list li {
    display: block;
    margin-left: 10px;
  }

  #header #buttons  {
    margin-top: 1em
    width: 100%;
  }

  #header #buttons li{
     width: 49%;
  }

  #header #buttons li.login a {
    margin: 0;
  }

  #header #buttons li.signup a {
    margin-left: 15px;
  }

  #header #buttons li.signup{
    float: right;
  }

  #content .content-bg {
    display: none;
  }

  .nomobile {
    position: absolute;
    left: -9999em;
    width: 1px
  }

  #page #content .featured-content {
    margin: 0;
    float: none;
    padding: 0 0 10px 0;
  }

  #page #content .featured-content h2,
  #page #content .featured-content h3 {
    float: none;
    margin: 10px 0;
    width: auto;
  }

  #page #content div.container {
    padding: 1px 10px;
  }

  #page #content .note {
    padding-top: 15px;
  }

  .detail-table table td {
    width: 100%;
    display: block;
  }

  tr.record-details .detail-table {
    padding: 0;
  }

  tr.record-details .detail-table table {
    border-radius: 0;
    border-width: 1px 0 0 0 ;
  }

  #resultsinfo {
    padding: .8em;
  }

  tr.record-details .detail-table td {
    padding: 1em 1em 0 1em;
  }

  tr.record-details .detail-table tr:last-child td:last-child {
    padding: 1em;
  }

  .detail_print .link {
    float: none;
  }
}

/* Retina icons */
@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (min-device-pixel-ratio: 2) {

  #content .notification.error {
    background-image: url('../images/dialog-error@2x.png');
    background-size: 20px 20px;
  }

  #content .notification.warning {
    background-image: url('../images/dialog-important@2x.png');
    background-size: 20px 20px;
  }

  #content .notification.success {
    background-image: url('../images/dialog-success@2x.png');
    background-size: 20px 20px;
  }

  #header-logo .osu-logo {
    background-image: url('../images/osu-web-header-stacked@2x.png');
  }

  #footer-logo .osu-logo {
    background-image: url('../images/osu-web-footer@2x.png');
  }

  .results-vcard {
    background-image: url('../images/icon-vcard@2x.png');
  }

  .results-vcard:hover {
    background-image: url('../images/icon-vcard-active@2x.png');
  }

  .detail_print .link {
    background-image: url("../images/icon-print@2x.png");
  }

  .detail_print .link:hover {
    background-image: url("../images/icon-print-active@2x.png");
  }
}