/*layout*/
:root {
font-size: 18px;
}
/*body {background: #EEE;}*/
header {
height: 68px;
line-height: 68px;
padding-left: 3%;
padding-right: 3%;
}
.header-logo {
display: inline-block;
height: 100%;
width: 320px;
background-image: url("https://colby-sawyer.edu/assets/site/csc-wordmark.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: 0% 55%;
}
.header-nav {
float: right;
height: inherit;
line-height: inherit;
}
.header-nav a {
display: none;
}
.header-nav button {
width: 55px;
height: inherit;
line-height: inherit;
font-size: 21px;
}
.header-nav button {
color: #E4E4E4;
}
.header-nav button:hover {
color: #5CA3CD;
}
.header-nav .nav-icon {
vertical-align: -1px;
}
.hide-mobile {
display: none !important;
}
.page-wrap {
/*max-width: 896px;*/
margin: 0 auto;
height: 100%;
background: #fff;
}
/*depreciate*/
.mobile .extended-banner, .mobile .limited-banner {
height: 300px;
}
.feature-banner, .story-banner {
height: 365px;
}
/*mobile-banner*/
.aspect.mobile-banner {
padding-top: 55%;
margin-bottom: 0;
}
/*detail-banner*/
.detail-banner {
display: block;
max-width: 400px;
margin: 0 auto 2.5em;
}
.detail-banner img {
width: 100%;
}
.content {
padding: 8% 10%;
background: #FFF;
}
.page {
background: #FFF;
}
.mobile .block-text {
font-size: 1em;
}
/*depreciate aside for .aside*/
.mobile .content aside, .mobile .content figure.full {
margin: 6% 0px 6%;
}
.mobile .aside {
margin: 6% 0px 6%;
}
.content .aside:first-child {
margin-top: 0;
}
.mobile .spacer-top {
margin-top: 1.75em;
}
.mobile .spacer-bottom {
margin-bottom: 1.75em;
}
/*.mobile .sidebar {*/
.sidebar aside, .sidebar figure {
max-width: 300px;
margin-left: auto;
margin-right: auto;
margin-top: 2em;
}
.mobile .column.gutter {
display: none;
}
.mobile .column {
display: block;
}
/*default menu states*/
.main-menu {
display: none;
}
.search-form {
display: none;
}
.section-nav {
display: none;
}
.sublinks {
display: none;
}
.menu-header, .student-nav {
display: none;
}
/*active menu state*/
.active-menu .main-menu {
display: block;
}
.active-menu .section-header {
display: none;
}
.active-search .search-form {
display: block;
}
.active-search .section-nav {
display: none;
}
.active-section .section-nav {
display: block;
}
.active-section  .main-menu {
display: none;
}
.active-section .search-form {
display: none;
}
/*section-nav and menu*/
.section-nav, .menu, .menu-title {
background-color: #373737;
line-height: 46px;
}
.section-nav, .menu {
font-size: 20px;
}
.menu-title {
font-size: 18px;
}
.dropdown button, .menu-title {
width: 100%;
text-align: left;
line-height: inherit;
}
.section-links .dropdown > a, .section-links .dropdown > span {
display: none;
}
.section-actions {
background-color: #634040;
}
.section-header {
width: 100%;
height: 1.8em;
padding-left: 3.5%;
padding-right: 5.5%;
padding-bottom: 1px;
background-color: #116999;
font-size: 1.11111111em;
color: #EEE;
text-align: left;
text-transform: uppercase;
}
.section-header i {
margin-left: 1em;
}
.section-header i::before {
content: "\f05b";
}
.active-section .section-header i::before {
content: "\f057";
}
.section-header:hover {
background-color: #2B7CA9;
}
/*section-nav links*/
.section-nav a, .menu a, .dropdown button, .menu-title {
display: block;
padding-left: 8%;
padding-right: 3%;
border-bottom: 1px solid #666;
color: #FFF;
text-decoration: none;
}
.section-nav a:hover, .menu a:hover, .dropdown button:hover, .menu-title:hover {
background: #666;
}
.headline-link a:hover::after {
font-weight: 400;
}
.close-section i {
float: right;
}
/*sublinks*/
.sublinks {
padding-top: 8px;
padding-bottom: 18px;
padding-left: 8%;
padding-right: 5.5%;
background-color: #505050;
column-count: 2;
}
.sublinks a {
padding: 0;
border: 0;
line-height: 36px;
font-size: 18px;
}
.sublinks a:hover {
background-color: transparent;
text-decoration: underline;
}
.subnav i {
float: right;
width: 55px;
text-align: center;
font-size: 1em;
color: #BBB
}
.subnav i::before {
content: "\f05b";
}
.open-subnav i::before {
content: "\f057";
}
.open-subnav > button {
background-color: #666;
}
.open-subnav .sublinks {
display: block;
}
/*search*/
.search-form {
display: none;
}
.main-search {
/*height: 75px;
line-height: 75px;*/
background-color: #F7F7F7;
}
#searchbox {
box-sizing: border-box !important;
/*-webkit-box-sizing: border-box !important;
-moz-box-sizing: border-box !important;*/
width: 100%;
padding: 20px 3.5%;
height: 75px !important;
background: none !important;
border: none !important;
font-family: lato !important;
font-size: 1.25em !important;
font-weight: 400 !important;
font-style: italic;
color: inherit;
}
/*lists*/
.list-colx4.x-axis h5 {
margin-top: 0;
margin-bottom: 0.4em;
}
/*items and blocks*/
.item img {
width: 165px;
}
.toggle-title {
margin-left: 0;
}
.grid-x4 img {
width: 33.33%;
}
.mobile-request-button {
margin: 2em 0;
}
.spotlight-image {
width: 100%;
height: 0;
overflow: hidden;
padding-top: 67%;
}
.mobile .spotlight-item br {
display: none;
}
.mobile .spotlight-item .textbox {
padding: 18px 35px 12px;
color: #FFF;
background-color: #000;
}
/*images*/
.promo img {
width: 100%;
}
figure.left, figure.right {
width: 38%;
}

/*move to _page/css/mobile.css*/
.mobile .content-blurb {
max-width: 28em;
margin: 4em auto;
line-height: 1.4;
}
.content-blurb .imagebox {
margin-bottom: 0.65em;
}
.media .content-blurb img {
width: 100%;
}
.content-blurb h6 {
margin-top: 0.55em;
}
.content-blurb .item-button {
/*margin-right: 0.5em;*/
/*margin-left: 0.5em;*/
}
/*KEY VALUE TABLES*/
.key-value-table th {
display: block; 
border: none;
border: 1px solid #DDD;
}
.key-value-table th + th {
display: none; 
}
.key-value-table td {
display: block; 
border: none;
border-left: 1px solid #DDD;
border-right: 1px solid #DDD;
}
.key-value-table td:first-child {
padding-bottom: 0.2em;
font-weight: 400;
}
.key-value-table td:last-child {
padding-top: 0;
padding-bottom: 1em;
border-bottom: 1px solid #DDD;
}
/*CATEGORY TABLES*/
.resource-table th {
font-weight: 400;
}
.resource-table th:first-child {
display: none;
}
 .resource-table td:first-child {
display: none;
}
a.media-link {
color: inherit;
}
a.media-link:hover, a.media-link:hover .headline {
text-decoration: none;
color: inherit;
}
a.media-link:hover .mobile-banner {
filter: grayscale(100%);
}
.feature-story .headline {
max-width: 500px;
}
.media-index p {
line-height: 1.4;
}
.mobile-banner {
margin-bottom: 2em;
}
.feature-list .mobile-banner {
margin-bottom: 0;
}
.mobile-form-button {
margin-bottom: 1.75em;
margin-top: 1.75em;
/*font-size: 1.22222222em;*/
text-align: center;
}
/*.item-button + .item-button {
margin-left: 7%;
}*/

@media only screen and (max-width: 560px) {
/*:root {
font-size: 16px;
}*/
header {
height: 50px;
font-size: 26px;
line-height: 50px;
}
.header-logo {
width: 185px;
background-image: url("/assets/site/cs-wordmark.svg");
}
.main-search .btn-search {
width: 2em;
}
.mobile .extended-banner, limited-banner {
height: 200px;
}
.mobile .content {
padding-top: 6%;
}
.mobile .grid-x4 img {
width: 50%;
}
}
@media only screen and (max-width: 475px) {
.sublinks {
column-count: 1;
}
.mobile .hover-icon.img-link i {
bottom: 16px;
right: 20px;
font-size: 24px;
}
.mobile .content {
padding-top: 6%;
}
.mobile .item.event .textbox {
display: block;
text-align: left;
}
.mobile .schedule td:first-child {
min-width: 5em;
white-space: normal;
}
}
@media only screen and (min-width: 800px) {
body {
background-color: #DDD;
}
.page-wrap {
max-width: 800px;
background-color: #FFF;
}
}