/* Internal Homepage Custom Styles */ /*======================================================== MAJOR ALERT =========================================================*/ .major-alerts { position: relative; z-index: 4; color: white; } .major-alerts > .container { background-color: #862020; padding: 16px; border-radius: 10px; } .major-alerts > .container > .fa-warning-custom { float: left; padding: 14px 17px 0px 0px; } .major-alert { font-size: 20px; font-weight:600; } .ma-title { color:#fff; font-size:28px; text-transform: uppercase; } .ma-title > span { vertical-align: text-bottom; } .ma-message {color:#ccc;} .ma-date { font-weight: 300; font-size: medium; padding-left: 50px; line-height: 2.3; } .fa-blink { animation: blinker 2s linear infinite; } #hp-int__row3 ul li a:not( [href*='etsu.edu'] ):not( [href^='#'] ):not( [href^='/'] ):after, #header #nav__secondary li[role="alert"]:after, #header #nav__secondary li[role="alert"] .submenu .title:before, #hp-int__row1 #hp-int__events h2 > a:after {display: inline-block;font: normal normal normal 14px/1 FontAwesome;font-size: inherit; text-rendering: auto;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;} /** ETSU Colors (branded). Originally in picnic_etsu.css. Moved here to keep picnic more BEM focused **/ #logo h5,.box--blue,#hp-int__row3 h3 a:link,#hp-int__row3 h3 a:visited,#hp-int__row3 h3 a:active,.card.card--gold > a,nav .burger:hover,nav .burger:focus{color:#FFC72C} .box--gold,a,a:link,a:visited,.card.card--gold > a,.card.card--blue:hover > a,.card.card--blue:focus > a,.cards > .card > a:hover > h3,.cards > .card > a:focus > h3, #footer p{color:#041E42} #hp-int__row3 h3 a:focus,#hp-int__row3 h3 a:hover,#hp-int__row3 ul li a:focus,#hp-int__row3 ul li a:hover,#header #nav__secondary label.border--blue:hover,#header #nav__secondary label.border--blue:focus,.card.card--blue > a,#header #nav__secondary #etsusearch label.border--blue.text--center,.cards > .card > a > h3{color:#FFF} #hp-int__row3 li a:link, #hp-int__row3 li a:visited, #hp-int__row3 li a:active{color:#C6AA76} #footer p.footer_txt {color:#653024;} #header #nav__primary .menu > li > a {font-size:calc(0.5em + 2vmin);line-height:1.2;} #header #nav__secondary label.border--blue:hover,#header #nav__secondary label.border--blue:focus, #header #nav__secondary #etsusearch label.border--blue.text--center, .cards > .card > a > h3 {background-color:#041E42;} #header #nav__secondary label.border--blue:hover,#hp-int__row3, {border:solid 1px #FFC72C;} #internal nav .menu > li > a {border: solid 1px transparent;} #hp-int__row2 #hp-int__announcements:after {background-color:transparent;background:-webkit-linear-gradient(to right,transparent 0,#707372 50%,transparent 100%);background:-moz-linear-gradient(to right,transparent 0,#707372 50%,transparent 100%);background:-o-gradient(to right,transparent 0,#707372 50%,transparent 100%);background:-ms-linear-gradient(to right,transparent 0,#707372 50%,transparent 100%);background:linear-gradient(to right,transparent 0,#707372 50%,transparent 100%);content:'';height:1px;margin:0;padding:0} /** Med. / Pharm. Tab, Med & Pharm main column headers */ #hp-int__tabs > div > div > article:nth-child(4) > div > div:nth-child(1) > h2, #hp-int__tabs > div > div > article:nth-child(4) > div > div:nth-child(2) > h2 {line-height:1;} /** RIBBONS **/ .ribbon {z-index:1;} /** LISTS **/ /** Shared List Styles */ #hp-int__row3 h3 + ul {list-style:none outside;margin:0;padding:0;} /* no bullets or numbers, list-style:none */ .list--none, .list--pretty,.list--striped, .list--inline, #nav__primary ul, #nav__secondary ul {list-style:none outside;margin:0;padding:0;} /* square bullets */ .list--squareBullets, .list--none > li > ul {list-style-type:square;padding-left:1.5rem;} /* default bullets */ .list--bullets {list-style-type:circle;padding-left:1.5rem;} .list--bullets > li > ul {list-style-type:disc;padding-left:3rem} /* alternating row striping, aka prettylist */ .list--striped li, .list--pretty li, .hp-int__tabs__linkLists li {border:solid 1px transparent;padding:0.15rem;} .list--pretty li:nth-child(odd), .list--striped li:nth-child(odd), .hp-int__tabs__linkLists li:nth-child(odd) {background-color:rgba(0,0,0,0.03);border-color:rgba(0,0,0,0.04);} .list--pretty li > a + .fa, .list--striped li > a + .fa {padding-left:0.5rem;} /** Ordered/Numbered list defaults to nice Norwester Font for the counter bullet */ ol:not(#tour) { counter-reset: fancy-counter;list-style:none outside; } ol:not(#tour) > li { font: 300 1.1em/1.5 Norwester,sans-serif;position: relative;} ol:not(#tour) > li:before { content: counter(fancy-counter)')';counter-increment:fancy-counter;font: 400 1.25rem/1 Norwester,sans-serif;left:-2rem;position: absolute;top: 0;} ol:not(#tour) > li ol > li:before {content: counter(fancy-counter)'.';color:#4A4A4A;font-size:1.25rem;font-weight:200;left:-1.5rem;} ol:not(#tour) > li p {margin:0;padding: 0 2rem 1rem;} ol:not(#tour) > li > h4+p:first-letter {color:#000;float:left;font-size:5rem;line-height:1;margin:-.2em 0 -.1em -.2em;padding:0;} #content {margin: 1rem auto 0;max-width: 80%;overflow:visible;} /** NAVIGATION: * See Media Queries for the majority of Navigation Styles. MOBILE is default */ #header #nav__primary .brand #header__logo {display:none;} nav .menu > div > ul > li > a {text-transform:capitalize;} nav .menu > div > ul > li > a:link {text-decoration:none;} nav .menu > div > ul > li > a:hover, nav .menu > div > ul > li > a:focus {text-decoration:underline;} #header #nav__secondary li[role="alert"] span#adviscount {background-color:#A6192E;border-radius:1rem;color:#FFF;display:inline-block;font-size:1rem;padding:0 0.1rem 0.1rem;position:absolute;text-align:center;} #header #nav__secondary #switch__int-ext {animation:fadein--faded 0.25s ease-out;} #header #nav__secondary li[role="alert"] .submenu .title {border-bottom: solid 1px #9B9B9B;color:#A6192E;padding:0.75rem 0 0.5rem;text-align:center;text-transform:uppercase;} #header #nav__secondary li[role="alert"] .submenu .title:before {content:'\f071\00a0';} /** homepage row #1, student feature **/ #hp-int__row1 {} #hp-int__row1 #hp-int__video {position:relative;} #hp-int__row1 #hp-int__video #hp-int__video__bkgd:before {background-color: #FFC72C;border: solid 1px #C6AA76;border-bottom: none;color: #041E42;content:'';/*display: block;*/display:none;font: normal 1.5em/1.25 Norwester,Arial,sans-serif;left: -48%;position:absolute;text-align:center;text-shadow: -1px 1px 0 #FFE94E;top:40%;transform:rotateZ(-90deg);width:90%;z-index:4;} #hp-int__row1 #hp-int__video__bkgd {background-repeat:no-repeat;background-position:top center;background-size:cover;height:100%;} #hp-int__row1 a:hover #hp-int__video__bkgd, #hp-int__row1 a:focus #hp-int__video__bkgd {border: solid 1px #FFC72C;box-shadow: 0 0 10rem #FFC72C;} #hp-int__row1 a:hover #hp-int__video__bkgd:before, #hp-int__row1 a:focus #hp-int__video__bkgd:before {box-shadow: 0 0rem 3rem #041E42, inset 0 -0.5rem 1rem #F5A623;} #hp-int__row1 #hp-int__video > a {cursor:pointer;display:block;height:100%;position:relative;width:100%;} #hp-int__row1 #hp-int__video > a:link,#hp-int__row1 #hp-int__video > a:visited,#hp-int__row1 #hp-int__video > a:hover,#hp-int__row1 #hp-int__video > a:active {text-decoration:none;} #hp-int__row1 #vidtop-content {} #hp-int__row1 a:hover #vidtop-content {border-color:#000;} #hp-int__row1 #vidtop-content h2 {background-color: #041E42;background-color:rgba(4,30,68,0.8);border: solid 1px transparent;border-top:none;bottom:0;color:#fff;font-size:1em;line-height:1;margin:0 auto;min-width:100%;padding:1rem 0.5rem;position:absolute;text-align:left;text-shadow:0 0 0.5rem #000;text-transform: capitalize;z-index:4;} #hp-int__row1 a:hover #vidtop-content h2 {border-color:#FFC72C;box-shadow: inset 0rem 2rem 7rem -3rem #000;text-decoration:underline;} /** homepage row #1, events (3UP) **/ #hp-int__row1 #hp-int__events {overflow: visible;} #hp-int__row1 #hp-int__events > .border--gray {border-radius: 0 0 0 1rem;} #hp-int__row1 #hp-int__events h2 {margin-bottom:-0.1rem} #hp-int__row1 #hp-int__events h2 > a {font-size:0.75rem;margin:0.7rem 0.25rem 0 0;} #hp-int__row1 #hp-int__events h2 > a:after {content:'\00a0\f073';} #hp-int__row1 #hp-int__events ul {list-style:none;margin:0;max-width: 100%;padding:0;} #hp-int__row1 #hp-int__events ul > li {padding-bottom:0;padding-left:0;} #hp-int__row1 #hp-int__events ul > li a {display:block;height:100%;min-height:23rem;overflow:hidden;position:relative;width:100%;} #hp-int__row1 #hp-int__events ul > li .event__image {display:block;background-repeat:no-repeat;background-position:center;background-size:cover;-webkit-filter:contrast(1);-moz-filter:contrast(1);-ms-filter:contrast(1);-o-filter:contrast(1);filter:contrast(1);height:100%;position:absolute;width:100%;transform:scale3d(1,1,1); -webkit-transition:all 0.3s ease-in;-moz-transition:all 0.3s ease-in;-ms-transition:all 0.3s ease-in;-o-transition:all 0.3s ease-in;transition:all 0.3s ease-in;} /** REMOVED: callkw, 4-1-19 #hp-int__row1 #hp-int__events ul > li:focus .event__image, #hp-int__row1 #hp-int__events ul > li:hover .event__image {-webkit-filter: contrast(2);-moz-filter: contrast(2);-ms-filter: contrast(2);-o-filter: contrast(2);filter: contrast(2);transform:scale3d(1.5,1.5,1.5);} */ #hp-int__row1 #hp-int__events ul > li a > .event__info {background-color:rgba(4,30,68,0.6);color:#fff;text-shadow: 1px 1px 0 #000;} #hp-int__row1 #hp-int__events ul > li:focus a > .event__info, #hp-int__row1 #hp-int__events ul > li:hover a > .event__info {background-color:rgba(4,30,68,0.9);padding-bottom:1rem;} #hp-int__row1 #hp-int__events ul > li:nth-child(even) a .event__info {background-color:rgba(255,199,44,0.8);} #hp-int__row1 #hp-int__events ul > li:focus:nth-child(even) a .event__info, #hp-int__row1 #hp-int__events ul > li:hover:nth-child(even) a .event__info {background-color:rgba(255,199,44,0.9);} #hp-int__row1 #hp-int__events ul > li:nth-child(even) a h3, #hp-int__row1 #hp-int__events ul > li:nth-child(even) a p {color:#041E42;text-shadow:1px 1px 0 #FFC72C;} #hp-int__row1 #hp-int__events ul > li a > .event__info {bottom:0;display:block;max-height:0;min-height:3.5rem;padding: 0.25rem 0.5rem 0;overflow:hidden;position: absolute;width: 100%;} #hp-int__row1 #hp-int__events ul li h3, #hp-int__row1 #hp-int__events ul li p {line-height:1.3;margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap;} #hp-int__row1 #hp-int__events ul > li:focus h3, #hp-int__row1 #hp-int__events ul > li:focus p, #hp-int__row1 #hp-int__events ul > li:hover h3, #hp-int__row1 #hp-int__events ul > li:hover p {overflow:visible;white-space:normal;} #hp-int__row1 #hp-int__events ul > li a:focus h3, #hp-int__row1 #hp-int__events ul > li a:hover h3 {text-decoration:underline;} #hp-int__row1 #hp-int__events ul > li p {font-size:0.9rem;} #hp-int__row1 #hp-int__events ul > li:focus a .event__info, #hp-int__row1 #hp-int__events ul > li:hover a .event__info {max-height:100%;} /** homepage row #2, sidebar/academic calendar/notifications * AND Tab Area Calendar Embeds**/ #hp-int__row2 {} #hp-int__row2 #hp-int__calendar {} #hp-int__row2 #hp-int__calendar > .border--gray {border-radius: 0 1rem 0 0;} #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul li, .calendar__embed ul li {font-weight:300;-webkit-hyphens: auto;-moz-hyphens: auto;-ms-hyphens: auto;hyphens: auto;margin:0;min-height:4rem;padding:0.5rem;word-wrap: break-word;overflow-wrap: break-word;} #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul li .miniCal, .calendar__embed ul li .miniCal {font-size:0.8rem;line-height:1;margin-left:-0.5rem;min-width:3rem;} #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul li .miniCal span, .calendar__embed ul li .miniCal span {color:#4A4A4A;display:block;font-weight:bold;margin:0 auto;text-align:center;} #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul li .miniCal .month, .calendar__embed ul li .miniCal .month {margin-bottom:0.25rem;} #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul li .miniCal .calendar-text, .calendar__embed ul li .miniCal .calendar-text{ margin-top:0.3rem;margin-left:-0.025rem; } #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul li a, .calendar__embed ul li a {cursor:pointer;} #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul li:hover, .calendar__embed ul li:hover {border-color:#FFC72C;} #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul li:hover span, .calendar__embed ul li:hover span {color:#000;} #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul:hover li {opacity:0.62;} #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul:hover li:hover, #hp-int__row2 #hp-int__calendar #hp-acad-calfeed ul:hover li:focus {opacity:1;} #hp-int__row2 #calendar__extra__links {margin:1rem 0;justify-content:space-between;max-width:100%;padding:0;} #hp-int__row2 #calendar__extra__links li {background-color:#5E8AB4;border:solid 1px #005EB8;border-radius:0.25rem;color:#fff;font-size:0.8rem;list-style-type:none;max-width:30%;padding:1.5%;} #hp-int__row2 #calendar__extra__links li:hover {background-color:#005EB8;color:#FFC72C;list-style-type:none;} #hp-int__row2 #calendar__extra__links li a {color:#fff;display:block;font-weight:bold;height:100%;position:relative;text-decoration:none;width:100%;} #hp-int__row2 #calendar__extra__links li a:hover {color:#FFC72C;text-decoration:underline;} #hp-int__row2 #calendar__extra__links li a .fa {line-height:1.2;} #hp-int__row2 #hp-int__announcements {} #hp-int__row2 #hp-int__announcements h4 {background-position:8% 35%;background-repeat:no-repeat;background-size:25%;font-size:1.2rem;line-height:1.2;padding:1rem 0 0;} #hp-int__row2 #hp-int__announcements h4 a {display:block;height:100%;min-height:5rem;padding-left:38%;position:relative;width:100%;} #hp-int__row2 #hp-int__announcements h4 a:link, #hp-int__row2 #hp-int__announcements h4 a:visited {text-decoration:none;} #hp-int__row2 #hp-int__announcements h4 a:hover {color:#000;text-decoration:underline;} /** homepage row #2, TABS: Student / Graduate / Faculty & Staff / Medicine & Pharmacy **/ #hp-int__tabs {} #internal #hp-int__tabs .tabs label.pseudo.button.toggle {background-color:#041E42;border:solid 1px transparent;border-radius:0.2rem;box-shadow:0 0 1rem #fff;color:#FFC72C;display:block;font-size:1rem;opacity:0.38;padding:0.3rem 0.1rem;position:relative;text-transform:lowercase;vertical-align:middle;} #internal #hp-int__tabs .tabs input[type=radio]:checked + label.pseudo.button.toggle {background-color:#FFF;border-color:#FFC72C;color:#000;font-size:1.25rem;font-weight:bold;letter-spacing:0;line-height:1;margin-bottom:7px;opacity:1;padding:1.5rem 0.3rem;text-decoration:underline;text-transform:uppercase;z-index:5;} #internal #hp-int__tabs .tabs:hover label.pseudo.button.toggle {opacity:0.62} #internal #hp-int__tabs .tabs:hover label.pseudo.button.toggle:hover {opacity:1;} #hp-int__tabs .row {z-index:1;} #hp-int__tabs .row > article {background-color:#fff;border: solid 1px #FFC72C;padding:0;} #hp-int__tabs .row > article > ul {justify-content:space-around/* IE11 */;justify-content:space-evenly/* everything else */;max-width:100%;} #hp-int__tabs .tabs .flex h3 + ul {margin-top:0.5rem;} #hp-int__tabs .tabs .flex h3 + ul li {padding-left:1rem;} /** Faculty/Staff News in Faculty/Staff Tab **/ #internal #homepagenews {} #internal #homepagenews #hpnewsList {} #internal #homepagenews #hpnewsList > p {} #internal #homepagenews #hpnewsList > p a {text-align:left;} #internal #homepagenews #hpnewsList > p > .rss_imgspan {display:block;overflow:hidden;} #internal #homepagenews #hpnewsList > p > .rss_imgspan > img {object-fit:contain;width:100%;} /** See additional styles in Desktop Media Queries. */ /** homepage row #3, SITE LINKS **/ #hp-int__row3 {border-left:none;border-right:none;box-shadow:inset 0 0 12rem #000;max-width:100%;padding:1% 5%;} #hp-int__row3 h3 {} #hp-int__row3 h3 a {} #hp-int__row3 h3 + ul {font-size:0.8rem;} #hp-int__row3 h3 + ul li {} #hp-int__row3 h3 + ul li a {} #hp-int__row3 ul li a:link, #hp-int__row3 ul li a:visited, #hp-int__row3 ul li a:active {text-decoration:none;} #hp-int__row3 ul li a:focus, #hp-int__row3 ul li a:hover {text-decoration:underline;} #hp-int__row3 ul li a:not( [href*='etsu.edu'] ):not( [href^='#'] ):not( [href^='/'] ):after {content:'\00a0\f14c';opacity:0.38;} /** FOOTER **/ #footer {padding:1rem 2rem 5rem;position:relative;text-align:center;} #footer:before {animation: gentleLoad 0.75s ease-out;background-image: url(//www.etsu.edu/_images/logos/etsu-logo_inline2_0padding.svg); background-repeat:no-repeat;background-position:center;background-size:contain;content:'';display:block;height:5rem;margin:0 auto;position:relative;top:0;width:100%;} #footer p.footer_txt {font-size:1.1rem;} /** *** Mobile & smaller tablets *** **/ @media only all and (max-width: 60rem) { .hide--mobile {display:none;height:0;visibility:hidden;width:0;} .major-alerts > .container > .fa-warning-custom { float: none; padding: 34px 17px 0px 0px; } #header { position: relative; z-index: 6; height: 3rem; left: 0; position: fixed; right: 0; top: 6.15rem; z-index: 10; } #header nav#intNavElement {background:#fff url(//www.etsu.edu/_images/logos/etsu-logo_inline2_0padding.svg) no-repeat 0 0;background-size:25%;background-size:contain;background-origin:content-box;padding:0.25rem;} nav .show ~ .menu {background-color:#041E42; background: linear-gradient(to bottom, #041e42 62%, rgba(4,30,66,0) 100%) 0 0 / 100% no-repeat; height: 100vh; } nav .burger ~ .menu > * {margin:0;padding:0;} nav .menu {float:none;top:0;-webkit-transform:none;transform:none;} nav label.burger {/* bottom: -1000em; */cursor: pointer;display: inline-block;margin: 0;} nav .menu > div form, nav .menu > div ul, nav .menu > div > ul > li, nav .menu > div h1 {display:block} #nav__primary ul, #nav__secondary ul, .hp-int__tabs__linkLists ul, #hp-int__row3 h3 + ul {width:100%;} #nav__primary > ul, #nav__secondary > ul {float:none;top: 0;-webkit-transform-style: none;transform: none;z-index:5;} nav #nav__primary > ul.menu li a, nav #nav__secondary > ul.menu {padding-left:1rem;} nav #nav__secondary .menu > li > a {font-weight:bold;text-transform:uppercase;} nav .menu > div > ul > li > ul {list-style-type:square;padding-left:1rem;} nav .menu > div > ul > li > ul > li {display:inline-block;font-size:0.8rem;line-height:1.5;} nav .menu > div > ul > li > a {display:block;height:100%;position:relative;width:100%;} #header #nav__secondary {padding-bottom:0.5rem;} #header #nav__secondary #etsusearch {display:block;margin:0.25rem auto 0.5rem;position:relative;width:100%;z-index:12;} #header #nav__secondary #etsusearch input#q {max-width:90%;} #header #nav__secondary #etsusearch label[for="q"], #header #nav__secondary #etsusearch input#q, #header #nav__secondary #etsusearch label.border--blue.text--center {display:block;margin:0 auto 0.25rem;} #header #nav__secondary #etsusearch label.border--blue.text--center {color:#fff;border-radius:0.25rem;max-width:62%;} #header #nav__secondary #etsusearch label.border--blue.text--center:hover {color:#FFC72C;} #header #nav__secondary li[role="alert"] #alertLink {display:inline;} #header #nav__secondary li[role="alert"] span#adviscount {right:1rem;} #header #nav__secondary li[role="alert"] .fa, #header #nav__secondary li[role="alert"] .submenu {display:none;} #header #nav__secondary li[role="alert"]:after {content:'\00a0\f14c';opacity:0.38;} #nav__secondary > ul > li > ul {padding-left:1rem;} #nav__secondary > ul > li > ul > li {padding-right:1rem;} #nav__secondary > li > a {font-weight:bold;} #header #nav__secondary #switch__int-ext {margin:0 auto;padding:0} #header #nav__secondary #switch__int-ext form {margin:0 auto;padding:0;width:100%;} #header #nav__secondary #switch__int-ext button {display:block;margin:1rem auto 0;} #header #nav__secondary #switch__int-ext:before {border-bottom: 1px solid #4A4A4A;margin-bottom: 0.25rem;} [data-action="aria-switch"] > span > .fa.fa-university:after, [data-action="aria-switch"] > span > .fa.fa-globe:after {font-size:0.6rem;} [data-action="aria-switch"] > span > .fa.fa-university:after {content:'\00a0On-Campus\00a0';display:inline;font-family:Roboto,Helvetica-Neue,'Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:300;} [data-action="aria-switch"] > span > .fa.fa-globe:after {content:'\00a0Off-Campus\00a0';display:inline;font-family:Roboto,Helvetica-Neue,'Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:300;} #switch__int-ext [data-action="aria-switch"][aria-checked="true"]:before, #switch__int-ext [data-action="aria-switch"][aria-checked="false"]:before {color:#4A4A4A;content:'\00a0Viewing Options\00a0\25bc'!important;display:block;text-align:center;} button.switch span {padding:0.1rem 0.6rem} #header #nav__primary {padding-top:1rem;} #header #nav__primary:after {height:100vh;left:0;margin:0;padding:0;position:absolute;width:113%;} #header #nav__primary .brand #header__logo{} #header #nav__primary > ul li a {letter-spacing:1px;} #header #nav__primary > ul li a:link,#header #nav__primary > ul li a:visited, #header #nav__primary > ul li a:active {color:#fff;} #header #nav__primary > ul li a:hover,#header #nav__primary > ul li a:focus {color:#FFC72C;} #content {margin-top:6rem;} #hp-int__row1 #hp-int__video {display:block;width:100%;} #hp-int__row1 #hp-int__video:before {left:-20%;top:30%;width:50%;} #hp-int__video #hp-int__video__bkgd {min-height:90vmin;} .cards > .card {width:100%;} .cards > .card > a:hover > h3, .cards > .card > a:focus > h3{background-color: rgba(255,199,44,0.62);} .cards > .card > a:hover > h3:after, .cards > .card > a:focus > h3:after {bottom:-62%;left:35%;height:100%;position:absolute;width:30%;} #hp-int__tabs .tabs .flex h3 {bottom:0;} /** Faculty Staff Tab: News */ #internal #homepagenews #hpnewsList > p {clear:both;margin:0 auto 1rem;overflow:hidden;width:90%;} #internal #homepagenews #hpnewsList > p > .rss_imgspan {float:left;margin-right:3%;max-width:35%;} #internal #homepagenews #hpnewsList > p > .rss_titlespan {font-weight:400;} #internal #homepagenews #hpnewsList > p .newstagline {display:block;font-weight:300;} #internal #homepagenews #hpnewsList:hover > p {opacity:0.62;} #internal #homepagenews #hpnewsList:hover > p:hover{opacity:1;} } /** *** TABLET *** **/ @media only all and (min-width: 60.01rem) { .hide--tablet {display:none;height:0;visibility:hidden;width:0;} /** LISTS **/ .list--inline > li {white-space:pre-line;} /** NAV **/ #header nav#intNavElement {background: none;box-shadow: none;} nav label.burger {display: none}/** Hide the Hamburger */ /** homepage row #0, header & primary naviagations **/ #header {margin:0 0 3rem;} #header nav form[action="/search"] {max-width:33%;max-width:32vw;position:relative;white-space:nowrap;} #header #nav__primary {-webkit-backface-visibility: hidden;background:rgba(255,255,255,1);height:7rem;margin-top:0;margin-right:0;position:relative;} #header #nav__primary.scrolled {-webkit-backface-visibility: hidden;background:rgba(255,255,255,0.8);border-bottom: 1px solid #fff;border-bottom-color:rgba(255,255,255,0.9);height:3.5rem;font-size:0.8rem;position:fixed;text-shadow:1px 1px 0 #fff;top:0;width:100%;} #header #nav__primary.scrolled:hover {background-color:#fff;/* REMOVED: callkw, 4-1-19, box-shadow: -1rem 2rem 62vh 100vh rgba(255,255,255,0.8),0 0 62vh 62vh rgba(255,255,255,0.5);*//*height:3rem;*//*padding-top:0.25rem;*/} #header #nav__primary.scrolled, #header #nav__primary.scrolled > * {transition:none;} #header #nav__primary {transition:height 0.3s ease-in, box-shadow 0.3s ease-in;-webkit-backface-visibility: hidden;} #header #nav__primary > * {transition:font-size 0.3s ease-in;-webkit-backface-visibility: hidden;} /*#header #nav__primary.scrolled {transition:height 0.3s ease-out, box-shadow 0.3s ease-out;-webkit-backface-visibility: hidden;} #header #nav__primary.scrolled > * {transition:font-size 0.3s ease-out;-webkit-backface-visibility: hidden;}*/ #header #nav__primary.scrolled:after { background:inherit;bottom:0;box-shadow: inset 0 0 0 5rem rgba(255,255,255,0.8);content:'';filter: blur(0.25rem);height:120%;left:-10%;overflow:hidden;position:absolute;right:0;top:-16%;width:120%;z-index:-1; } #header ul > li > ul {text-shadow:none;} #header #nav__primary h1 {filter: drop-shadow(-1px 1px 0 #fff);} #header #nav__primary .brand {clear:both;height:100%;max-height:4rem;width:22rem;z-index:6;} #header #nav__primary.scrolled .brand {max-height:100%;max-width:30%;max-width:30vmin;} #header #nav__primary .brand a {display:block;height:100%;position:relative;width:100%;} #header #nav__primary > .menu > li, #header #nav__primary > .menu > li > a, #header #nav__primary > .menu > li > a:after,#header #nav__primary.scrolled > .menu > li {font-size:1.15rem;letter-spacing:1px;padding:0 0.25rem;} #header #nav__primary .brand #header__logo{animation:gentleLoad 0.75s ease-out; background: transparent url(//www.etsu.edu/_images/logos/etsu-logo_inline2_0padding.svg) no-repeat left center;background-size: contain;color:transparent;display:block;width:100%;} #header #nav__primary .brand #header__logo strong, #header #nav__primary.scrolled .brand #header__logo strong {color:transparent;font-size:0;visibility:hidden;} #header #nav__primary .brand:hover, #header #nav__primary .brand:focus {filter: drop-shadow(-0.1rem -0.1rem 0.25rem #9B9B9B);} #header #nav__primary > .menu {padding-top:0.9rem;} #header #nav__primary.scrolled > .menu {padding-top:0;} #header #nav__primary.scrolled:hover > .menu {line-height:3;padding-top:0;transition:line-height 0.1s ease-out;-webkit-backface-visibility: hidden;} #header #nav__primary.scrolled > .menu > li {font-size:1rem;letter-spacing:0;padding:0.5rem 0.5rem 0;} #header #nav__primary > .menu > li:after {content:'/';display:inline;font-size:inherit;position:relative;vertical-align:baseline;} #header #nav__primary > .menu > li:last-child:after{content:'';display:none;visibility:hidden;} #header #nav__secondary #switch__int-ext {padding-right:1.5rem;} #header #nav__secondary #switch__int-ext #switch__int-ext__form {transform:translateY(-0.5rem);} /** BOTH Primary and Secondary Nav's **/ nav .menu {} nav .menu li {line-height:1.25;margin:0;position:relative;white-space:nowrap;vertical-align:baseline;} nav .menu:hover > li, nav .menu:focus > li {opacity:0.62;} nav .menu > li:hover, nav .menu > li:focus {opacity:1;} nav .menu > li > a {display:inline-block;font-weight:normal;height:100%;padding:0.5rem;position:relative;width:100%;z-index:6;} nav .menu > li:hover > a {background-color:#fff;box-shadow:0 0 5rem rgba(4,30,68,0.1);} nav .menu > li .submenu {animation: fadein 0.25s ease-out;background-color:#fff;box-shadow:0 0 5rem rgba(4,30,68,0.8);display:none;font-size:0.9rem;min-width:10rem;opacity:0;position:absolute;right:0;transition: all 0.5s ease;visibility:hidden;} nav .menu li .submenu > li {display:block;margin:0;padding:0;} nav .menu li .submenu > li > a {display:block;height:100%;padding:0.5rem;position:relative;width:100%;} nav .menu li .submenu li:hover {cursor:pointer;} nav .menu li a:focus + .submenu, nav .menu li .submenu li:focus-within {cursor:pointer;} nav .menu li .submenu li:focus-within a {outline:none;} nav .menu li:hover > ul, nav .menu li ul:hover, nav .menu li ul:focus {display:block;opacity:1;visibility:visible;} nav .menu li:focus-within > ul {display:block;opacity:1;visibility:visible;} nav .menu li .submenu > li:hover a:hover, nav .menu li .submenu > li a:focus {background-color:#041E42;color:#FFC72C;} nav .menu li .submenu > li:hover a, nav .menu li .submenu > li:focus a {color:#FFC72C;display:block;height:100%;position:relative;width:100%;} nav .menu li .submenu > li a:hover, nav .menu li .submenu > li a:focus {text-decoration:underline;} nav .menu li .submenu > li a:link, nav .menu li .submenu > li a:visited, nav .menu li .submenu > li a:active {text-decoration:none!important;} nav .menu li .submenu > li:hover a[target="_blank"]:after {animation:fadein--faded 0.25s forwards;} /** * (UN)hover intent * makes dropdowns more forgiving * TUT: https://css-tricks.com/dropdown-menus-with-more-forgiving-mouse-movement-paths/ * http://www.positioniseverything.net/css-dropdowns-red.html */ nav .submenu:before{content:'';height:110%;left:-5%;position:absolute;top:-3%;text-align:left;min-width: 12rem;width:110%; /* TEST IT: border: 1px solid red;background: red;*/ } #header > nav > .menu {margin-right:-0.6em;margin-left:-0.6em} #header > nav {height:auto;position:relative;} #header > nav > .menu {float:none;} #header #nav__primary.scrolled > .menu {margin-top: 0;} #header #nav__primary > .menu, #header #nav__secondary > .menu, #header > nav > .menu, #nav__primary > .brand {top:0;-webkit-transform:none;transform:none;white-space:nowrap;} #header #nav__secondary {box-shadow: 0 -0.5rem 2rem rgba(4,30,68,0.15);height:3rem;margin:0;position:relative;z-index:7;} #header #nav__secondary #etsusearch {} #header #nav__secondary #etsusearch label {display:inline;} #header #nav__secondary #etsusearch label[for="q"], #header #nav__secondary #etsusearch label[for="q"] input {transition:all 0.3s ease-out;} #header #nav__secondary #etsusearch label[for="q"]:hover,#header #nav__secondary #etsusearch label[for="q"]:focus, #header #nav__secondary #etsusearch label[for="q"]:active {width:38vw;z-index:9;} #header #nav__secondary #etsusearch input#q:focus {appearance:normal;-webkit-appearance:none;-moz-appearance:none;box-shadow: inset 0 0 0.75rem rgba(65,182,230,0.5),0 0 38vw 38vw rgba(255,255,255,0.7), 0 0 100vw 100vw rgba(255,255,255,0.8);font-size:1.5rem;height:3rem;width:29vw;} #header #nav__secondary #etsusearch input#q:focus + label.border--blue.text--center {height:3rem;} #header #nav__secondary #etsusearch input#q:focus:before {content:'';width:43rem;} #header #nav__secondary #etsusearch label[for="q"]:after {content:'';float:left;height:1rem;width:38vw;} #header #nav__secondary input[type="text"] {-webkit-appearance:none;font-size:1rem;height:1.75rem;max-width:29vw;vertical-align:top;width:24vw;} #header #nav__secondary #etsusearch label.border--blue.text--center {padding:0.1rem 0;vertical-align:middle;white-space:nowrap;} #header #nav__secondary label .fa {vertical-align:text-top;} #header #nav__secondary label.border--blue:hover {} #header #nav__secondary span#adviscount {left:-0.5rem;top:0.25rem;z-index:11;} #header #nav__secondary .burger {margin-left:3rem;padding:0 0.5rem;} #header #nav__secondary #switch__int-ext button:hover:before, #header #nav__secondary #switch__int-ext button:focus:before {color:#000;} #header #nav__secondary #switch__int-ext button {display:block;margin:0 auto;} [data-action="aria-switch"] > span {color:#9B9B9B;letter-spacing:-0.4rem;} [data-action="aria-switch"] > span > .fa {letter-spacing:0;text-indent:5px;vertical-align:text-top;} #switch__int-ext [data-action="aria-switch"][aria-checked="true"]:before, #switch__int-ext [data-action="aria-switch"][aria-checked="false"]:before {color:#4A4A4A;content:'';display:block;font-size:0.7rem;left:-1rem;line-height:1.2;overflow:visible;position:absolute;text-align:center;text-transform:uppercase;top:-1rem;width:100%;white-space:nowrap;} #switch__int-ext [data-action="aria-switch"][aria-checked="true"]:before {color:#32631D;content:'On-Campus\00a0';font-family:Roboto,Helvetica-Neue,'Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:300;} #switch__int-ext [data-action="aria-switch"][aria-checked="false"]:before {content:'Off-Campus';font-family:Roboto,Helvetica-Neue,'Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:300;} #header #nav__secondary > .menu.list--inline > li:nth-child(-n+2) {margin:0 1rem;}/* Targets First 2
  • */ /** * HAMBURGER MENU OPTIONS, low carb and what not. #header #nav__secondary .burger:after {content:'MENU';display:block;font-size:0.5rem;} * #header #nav__secondary .burger:before {content:'\2261';display:block;font-size:0.5rem;}/** HTML Special Character for Hamburger: ≡ **/ #hp-int__video, #hp-int__events {min-height:27rem;} #hp-int__row1 #hp-int__video #hp-int__video__bkgd:before {left: -50%;top:40%;width:100%;} #hp-int__row1 #hp-int__video__bkgd {border-radius: 0 0 1rem 0;} #hp-int__row1 #vidtop-content h2 {border-radius:0 0 1rem 0;font-size:1.25rem;padding:1.5rem 0 1.5rem 1rem;} #hp-int__row1 #hp-int__events h2 > a {font-size:1rem;margin: 0.4rem 1rem 0 0;} #internal #hp-int__tabs .tabs label.pseudo.button.toggle {letter-spacing:0;padding:0.3rem;text-transform:capitalize;} #internal #hp-int__tabs .tabs input[type=radio]:checked + label.pseudo.button.toggle {padding:1rem 0.5rem;} #internal #hp-int__tabs .tabs label.pseudo.button.toggle {border-bottom:none;border-radius: 0.2em 0.2em 0 0;white-space:pre-line;vertical-align:text-bottom;} #hp-int__tabs .row {top:-12px;} #hp-int__tabs .row > article {padding:2rem 1rem;} #internal #hp-int__tabs .tabs label.pseudo.button.toggle {display:inline-block;} /** Faculty Staff Tab: News */ #internal #homepagenews #hpnewsList > p {clear:both;margin-bottom:1rem;overflow:hidden;} #internal #homepagenews #hpnewsList > p > .rss_imgspan {float:left;margin-right:3%;max-width:35%;} #internal #homepagenews #hpnewsList > p > .rss_titlespan {font-weight:400;} #internal #homepagenews #hpnewsList > p .newstagline {display:block;font-weight:300;} #internal #homepagenews #hpnewsList:hover > p {opacity:0.62;} #internal #homepagenews #hpnewsList:hover > p:hover{opacity:1;} } /** DESKTOP **/ @media only all and (min-width: 90.01rem) { .hide--desktop {display:none;height:0;visibility:hidden;width:0;} #header #nav__secondary span#adviscount {max-width:1.25rem;left:-0.75rem;top:0.25rem;} #header #nav__secondary #switch__int-ext:before, nav .menu > div > ul > li > a {text-transform:uppercase;} [data-action="aria-switch"] > span {letter-spacing:0px;} [data-action="aria-switch"] > span > .fa.fa-university:after {content:'\00a0On-Campus\00a0';display:inline;font-family:Roboto,Helvetica-Neue,'Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:300;} [data-action="aria-switch"] > span > .fa.fa-globe:after {content:'\00a0Off-Campus\00a0';display:inline;font-family:Roboto,Helvetica-Neue,'Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:300;} #switch__int-ext [data-action="aria-switch"][aria-checked="true"]:before, #switch__int-ext [data-action="aria-switch"][aria-checked="false"]:before {color:#4A4A4A;content:'Viewing Options'!important;left:0;letter-spacing:2px;} #header #nav__primary > .menu > li, #header #nav__primary > .menu > li > a, #header #nav__primary > .menu > li > a:after,/*#header */ #header #nav__primary > .menu > li, #nav__primary.scrolled > .menu > li {font-size:1.5rem;letter-spacing:1px;/*padding:0;*/} #header #nav__primary > .menu > li {padding:0 0.5rem;} #nav__primary.scrolled > .menu > li {padding:0 1rem;} #header #nav__primary > .menu > li:first-child {padding-left:0;} #header #nav__primary > .menu > li:last-child {margin-right:1rem;padding-right:0;} #internal #hp-int__tabs .tabs label.pseudo.button.toggle {margin-left:0.5rem;margin-right:0.5rem;} #internal #hp-int__tabs .tabs label.pseudo.button.toggle:nth-of-type(1) {margin-left:1rem;} #internal #hp-int__tabs .tabs input[type=radio]:checked + label.pseudo.button.toggle {font-size:2rem;letter-spacing:1px;margin-left:1rem;padding-left:1rem;padding-right:1rem;} #hp-int__tabs .row > article {border-radius: 1rem;} #internal #hp-int__tabs .tabs label.pseudo.button.toggle {white-space:normal;} /** Faculty/Staff News in Faculty/Staff Tab **/ #internal #homepagenews #hpnewsList > p {clear:both;display:block;width:100%;} #internal #homepagenews #hpnewsList > p:before, #internal #homepagenews #hpnewsList > p:after{ clear: both; content:''; } #internal #homepagenews #hpnewsList > p > .rss_imgspan {float:left;margin-right:3%;margin-bottom:2rem;max-width:35%;min-height:7rem;} #internal #homepagenews #hpnewsList > p > .rss_imgspan > img {min-height:7rem;} #internal #homepagenews #hpnewsList > p > .rss_titlespan {display:block;font-weight:300;} #internal #homepagenews #hpnewsList > p > .rss_titlespan > a.rss_hyperlink {color:#000;padding:0.25rem;text-decoration:none;} #internal #homepagenews #hpnewsList p .newstagline {color:#4A4A4A;font-size:0.9rem;} #internal #homepagenews #hpnewsList p .newstagline a.rss_readmore {color:#041E42;font-size:1.1rem;} #internal #homepagenews #hpnewsList p a.rss_readmore:link, #internal #homepagenews #hpnewsList p a.rss_readmore:visited, #internal #homepagenews #hpnewsList p a.rss_readmore:active {text-decoration:none;} #internal #homepagenews #hpnewsList p:hover a.rss_readmore, #internal #homepagenews #hpnewsList p:focus a.rss_readmore {color:#000;text-decoration:underline;} #internal #homepagenews #hpnewsList > p > .rss_titlespan a.rss_hyperlink {} #internal #homepagenews #hpnewsList > p:hover > .rss_titlespan a.rss_hyperlink {} #internal #homepagenews #hpnewsList > p .newstagline {display:block;font-weight:300;} #internal #homepagenews #hpnewsList > p:hover .newstagline {} #internal #homepagenews #hpnewsList > p .newstagline a.rss_readmore {} #internal #homepagenews #hpnewsList > p:hover .newstagline a.rss_readmore, #internal #homepagenews #hpnewsList > p:focus .newstagline a.rss_readmore {} /** FOOTER ** #footer:before {background-position:100% 0%;display:block;height:30%;position:absolute;right:1rem;top:1rem;width:38%;} */ } /** BIG DESKTOP **/ @media only all and (min-width: 110.01rem) { #header #nav__primary > .menu > li, #header #nav__primary > .menu > li > a, #header #nav__primary > .menu > li > a:after,#header #nav__primary.scrolled > .menu > li {font-size:1.75rem;} } /** *************************** IE 10 & 11 HACKS *************************** **/ @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) { /* IE10+ specific styles go here */ }