/*
 * This CSS file is for handling mobile and print media.
*/





/* hide or alter various elements when we go to print */
@media print {
  
  #top-nav, 
  #sidebar-left,
  .dash-welcome-block,
  #page-print-options,
  #breadcrumbs-wrapper,
  a.button,
  .change-term-link a,
  .header-profile-image,
  td.actions, 
  th.header-sortable-actions,  
  .fp-boxes-submit-button,
  .admin-toolbox-link-wrapper,
  fieldset.new-comment-fs,
  fieldset.upload-file-fs,
  #render-advise_history_left_column a.view-print-all,
  #render-advise_history_right_column a.view-print-all,
  td.student-files-delete-td,
  a.approval-edit,
  fieldset.enter-audit-comment-fs,
  fieldset.view-url-options-fs,
  .fp-bottom-message 
  {
    display: none !important;
  }
  
   #page-content {
     width: 100% !important;
     padding: 0 !important;
   }
  
   .student-mini-profile .profile-top-details-wrapper {
     width: 50% !important;
   }
   
   .profile-line-content a {
     display: none;
   }
   
   
  
} /* media print */











@media screen and (max-width: 1550px) {  
  
  .student-profile-header-full .profile-top-wrapper-right-side {
    width: 400px;
  }
  
  .student-profile-header-full .profile-inline-line label {
    min-width: 130px;
  }
  
  
  
  
  
  
}  




@media screen and (max-width: 1450px) {  
  
  .student-mini-profile .profile-top-wrapper-right-side {
    width: 400px;
  }
  
  .student-mini-profile .profile-inline-line label {
    min-width: 130px;
  }
  
  
}  /* max-width 1450px */



@media screen and (max-width: 1380px) {
  .student-profile-header-full .profile-top-wrapper-right-side {
    width: 300px;
  }
  
  .student-profile-header-full .profile-top-wrapper-right-side {
    width: 300px;
  }
  
  

  .page--login #page-login-user-form {
    float: left;
    width: calc(100% - 600px);  
    text-align: center; 
    
  }
  
  .page--login #page-login-page__wallpaper {
    width: 600px;       
  }
  
  
  
  

} /* max-width 1380px */




@media screen and (max-width: 1170px) {
  
  .student-mini-profile .profile-top-details-wrapper .profile-detail-line-degree .profile-line-content {
    display: inline;    
    vertical-align: top;  
  }  
  
  
}




@media screen and (max-width: 1130px) {  
  
  .top-banner img {
    height: 50px !important;
    width: auto;
  }
  

  .student-mini-profile {
    font-size: 1.0em;
  }

  .student-mini-profile .profile-inline-line label {
    min-width: 100px;
  }


  table.student-alerts {
    font-size: 0.9em;
  }

  
  .page--login #page-login-user-form {
    float: left;
    width: calc(100% - 400px);  
    text-align: center; 
    
  }
  
  .page--login #page-login-page__wallpaper {
    width: 400px;       
  }
  
  
  
}  /* max-width 1130px */



@media screen and (max-width: 1075px) {  
  
  .student-mini-profile h2 {
    font-size: 1.0em;
    font-weight: bold;
  }


  .student-mini-profile .profile-top-wrapper-left-side {
    width: 300px;
  }

  .student-mini-profile .profile-top-wrapper-right-side {
    width: 200px;
  }


  
  .student-mini-profile .profile-inline-line label {
    display: none;
  }

  .student-mini-profile .has-mobile-content .profile-line-content{
    display: none;
  }
  .student-mini-profile .has-mobile-content .mobile-profile-line-content {
    display: inline !important;
  }

 
  table.student-alerts td.short-desc {
    max-width: 300px;
  }

  table.student-alerts td.short-desc .short-desc-wrapper {
    max-width: 300px;
    white-space: nowrap;
    overflow-x: hidden;
    text-overflow: ellipsis;
    
  }
  
  .dash-box {
    display: inline-block !important;
    width: 100% !important;
  }
  
  
  .dash-box .contents {    
    max-height: none !important;
    overflow-y: auto !important;  
  }
  
  .dash-box .dash-feed-block {
    margin: 0 !important;    
  }
  
  
  .select-from-event-types a.event-type {
    margin-right: 0;
    margin-bottom: 30px;
  }
  
  .force-spaces {
    display: none;
  } 
  
  
}  /* max-width 1075px */










@media screen and (max-width: 975px) {  
  
  
  #header #top-nav form .smallinput {
    width: 150px;
  }
  
  .student-mini-profile .header-profile-image {
    display: none;
  }  
  
  .student-profile-header-full .header-profile-image {
    display: block;    
    width: 100px !important;
  }
  
  .student-profile-header-full .header-profile-image img {
    width: 90px;
    height: auto;
    border-radius: 5px;
  }
  
  
  .page--login .login-content-div .left-side-content {
    width: 100%;
  }
  
  .page--login #page-login-user-form {
    float: left;
    width: 100%;  
    text-align: center; 
    
  }
  
  .page--login #page-login-page__wallpaper {
    display: none;       
  }
  
  
  
}  /* max-width 975px */


@media screen and (max-width: 825px) {  
  
  
  #header #top-nav form .smallinput {
    display: none;
  }
  
  #header #top-nav form a {
    margin-left: 0px;
  }
  
  #sidebar-left {
    width: 75px;
  }
  
  #sidebar-left ul.sidebar-left-nav li {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  
  #sidebar-left ul.sidebar-left-nav li i {
    font-size: 1.5em !important;
  }
  #sidebar-left ul.sidebar-left-nav li .desc {
    display: none;
  }
  
  
  .has-sidebar-left #page-content {
    width: calc(100vw - 100px);
    padding-left: 5px;
  }  
  
  #page-content {    
    font-size: 0.9em;
  }
  
  
  
  .change-term-link {
    display: block;
  }

  .student-profile-header-full .header-profile-image {
    display: none;    
    
  }


  table.student-alerts td.short-desc {
    max-width: 200px;
  }

  table.student-alerts td.short-desc .short-desc-wrapper {
    max-width: 200px;
    white-space: nowrap;
    overflow-x: hidden;
    text-overflow: ellipsis;
    
  }

  
}  /* max-width 825px */











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

  #page-content {
    font-size: 0.8em;
  }

  
  /* at this point, we need to get rid of ALL the navigation (top and side) and replace with
   * a single hamburger menu, which expands to show all options.
   */
  .mobile-hamburger-icon {
    display: inline-block !important;    
    float: left;
    font-size: 2em;
    margin-left: 10px;    
    margin-right: 10px;
  }
  
  .mobile-hamburger-icon a {
    display: inline-block;
    width: 50px;
    padding-bottom: 3px;
    text-align: center;
    zborder: 1px solid #ccc;
    zborder-radius: 5px;    
  }
  
  #sidebar-left,
  ul.top-nav-ul {
     display: none !important;
  }
    

  .has-sidebar-left #page-content {
    width: calc(100% - 10px);
    
    padding-left: 5px;
  }  


  #element-inner-wrapper-course-search-subject {
    width: 100% !important;
  } 

  #mobile-hamburger-menu ul.top-nav-ul
  {
    display: block !important;
  }

  #mobile-hamburger-menu ul.top-nav-ul li.cog-only {
    display: block !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #mobile-hamburger-menu .mobile-hamburger-icon {
    display: none !important;
  }
  
  #mobile-hamburger-menu a {
    color: white;
  }
  
  #mobile-hamburger-menu .sidebar-left-nav li {
    font-size: 1.4em !important;
  }
  
  #mobile-hamburger-menu .sidebar-left-nav li i {
    font-size: 2em !important;
  }
  
  #mobile-hamburger-menu .top-nav-ul .tub-icon-element-alert {
    display: inline-block !important;
  }
  
  #mobile-hamburger-menu .top-nav-ul .tub-icon-element-alert .tub-alert-count {
    top: 12px;
    right: -6px;
    font-size: .65em;
  }
  
  
  .student-mini-profile .profile-top-wrapper-left-side {
    width: 250px;
  }

  .student-mini-profile .profile-top-wrapper-right-side {
    width: 150px;
  }
  
  
  table.student-alerts .author,
  table.student-alerts .updated
  {
    display: none; 
  }
  
  table.student-alerts td.short-desc {
    max-width: 100%
  }

  table.student-alerts td.short-desc .short-desc-wrapper {
    max-width: 400px;
    white-space: nowrap;
    overflow-x: hidden;
    text-overflow: ellipsis;
    
  }  
  
  
  .advising-stats-block-inner-wrapper .advising-stat-box {
    padding-right: 0px !important;
  }
  
 .advising-stats-block-inner-wrapper .advising-stat-box-wide {  
    min-width: 100% !important;    
  }
  
  .element-type-textfield input, 
  .element-type-password input, 
  .element-type-datetime-local input, 
  .element-type-time input, 
  .element-type-search input {
    width: 90%;
  }  
  
  
  .select-from-event-types {
    width: 100%;
  }
  
  .select-from-event-types a.event-type {
      display: inline-block;
      margin-left: 20px;
      
      margin-bottom: 30px;
  }
  
  table.custom-calendar .calendar-entry {
    display: none;
  }
  table.custom-calendar .mobile-day-count {
    display: block !important;
  }
  
  
  
  
  
}  /* max-width 650px */









@media screen and (max-width: 450px) {  
  
  
  .top-banner img {
    height: 40px !important;
    width: auto;
  }
  
  .mobile-hamburger-icon {
    font-size: 1.9em;
  }  
  
  #page-print-options {
    display: none;
  }
  
  body.has-page-tabs .inner-page-content-wrapper { 
    margin-left: 0;
  }
  
  #page-student-mini-profile-wrapper {
    margin-left: 0;
  }
  
  ul.tabs {
    padding-left: 0;
  }
  
  /* at this width, we go down to displaying the Degree plan in a single column. */
  .fp-semester-table {
    width: calc(100% - 10px);
  }
  .fp-semester-table td.fp-boxes {
    display: block;
    width: 100%;
    text-align: left !important;
  }
  
  .fp-semester-table td.fp-boxes table {
    width: 100%;
    margin-right: 0;
    padding-right: 0;
  }
  
  .student-mini-profile .profile-detail-line-student-name-cwid,
  .student-mini-profile .profile-detail-line-empty
  {
    display: none;
  }
    
  
  #engagements-list-page .add-engagements-buttons {
    font-size: 0.9em;
    float: none;
    clear: both;
    text-align: center;
  }
  

 table.student-alerts td.short-desc .short-desc-wrapper {
    max-width: 250px;
    white-space: nowrap;
    overflow-x: hidden;
    text-overflow: ellipsis;
    
  }  

  
}  /* max-width 450px */







@media screen and (max-width: 375px) {  
  
  
  .top-banner img {
    height: 30px !important;
    width: auto;
  }
  
  .mobile-hamburger-icon {
    font-size: 1.8em;
  }  

  .student-mini-profile .profile-top-wrapper-left-side {
    width: 100%;
  }

  .student-mini-profile .profile-top-wrapper-right-side {
    width: 100%;
  }


  
  .student-mini-profile .profile-detail-line-rank,
  .student-mini-profile .profile-detail-line-cumu
  {
    display: inline;
    padding-right: 20px;
  }
  
  
 table.student-alerts td.short-desc .short-desc-wrapper {
    max-width: 200px;
    white-space: nowrap;
    overflow-x: hidden;
    text-overflow: ellipsis;
    
  }  
  
  
}  /* max-width 375px */