@font-face {font-family: 'Avenir-Light';src: url('fonts/39edc3_0_0.eot');src: url('fonts/39edc3_0_0.eot?#iefix') format('embedded-opentype'),url('fonts/39edc3_0_0.woff2') format('woff2'),url('fonts/39edc3_0_0.woff') format('woff'),url('fonts/39edc3_0_0.ttf') format('truetype'); font-display: swap;} @font-face {font-family: 'Avenir-Black';src: url('fonts/39edc3_1_0.eot');src: url('fonts/39edc3_1_0.eot?#iefix') format('embedded-opentype'),url('fonts/39edc3_1_0.woff2') format('woff2'),url('fonts/39edc3_1_0.woff') format('woff'),url('fonts/39edc3_1_0.ttf') format('truetype'); font-display: swap;} @font-face {font-family: 'Walbaum-Italic';src: url('fonts/39edc3_2_0.eot');src: url('fonts/39edc3_2_0.eot?#iefix') format('embedded-opentype'),url('fonts/39edc3_2_0.woff2') format('woff2'),url('fonts/39edc3_2_0.woff') format('woff'),url('fonts/39edc3_2_0.ttf') format('truetype'); font-display: swap;} :root { --color-brand-royal-blue: rgba(0, 113, 206, 1); --color-brand-aqua-blue: rgba(0, 191, 215, 1); --color-brand-green: rgba(118, 189, 34, 1); --color-brand-yellow: rgb(225, 224, 0); --color-brand-gray: rgb(112, 114, 113); --color-brand-royal-blue--light: rgb(76, 155, 220); --color-brand-royal-blue--lighter: rgb(127, 184, 230); --color-brand-royal-blue--lightest: rgb(204, 226, 245); --color-brand-royal-blue--dark: rgb(0, 102, 185); --color-brand-royal-blue--darker: rgb(0, 90, 165); --color-brand-royal-blue--darkest: rgb(0, 79, 144); --color-brand-aqua-blue--light: rgb(76, 209, 227); --color-brand-aqua-blue--lighter: rgb(127, 222, 235); --color-brand-aqua-blue--lightest: rgb(204, 242, 247); --color-brand-aqua-blue--dark: rgb(0, 172, 194); --color-brand-aqua-blue--darker: rgb(0, 153, 172); --color-brand-aqua-blue--darkest: rgb(0, 134, 151); --color-brand-green--light: rgb(159, 208, 100); --color-brand-green--lighter: rgb(187, 222, 144); --color-brand-green--lightest: rgb(227, 241, 210); --color-brand-green--dark: rgb(106, 170, 31); --color-brand-green--darker: rgb(94, 151, 27); --color-brand-green--darkest: rgb(83, 132, 24); --color-brand-yellow--light: rgb(237, 237, 102); --color-brand-yellow--lighter: rgb(243, 243, 153); --color-brand-yellow--lightest: rgb(249, 249, 204); --color-brand-yellow--dark: rgb(187, 186, 0); --color-brand-yellow--darker: rgb(174, 173, 0); --color-brand-yellow--darkest: rgb(158, 157, 0); --color-hondros-sec-black: rgb(0, 0, 0); --color-hondros-sec-dark-gray: rgb(83, 86, 90); --color-hondros-sec-medium-gray: rgb(177, 179, 179); --color-hondros-sec-light-gray: rgb(217, 217, 214); --color-hondros-sec-white: rgb(255, 255, 255); --color-hondros-sec-blue-gray: rgb(46,67,83); --color-hondros--cloud: rgb(237, 237, 237); --color-hondros--fog: rgb(221, 230, 234); --color-hondros--steam: rgb(229, 240, 250); --color-hondros--main: rgb(252, 252, 252); --font: "Avenir-Light", Arial, Helvetica, Geneva, sans-serif; --font-bold: "Avenir-Black", sans-serif; --font-decorative: "Walbaum-Italic", serif; } * { box-sizing: border-box; scroll-margin-top: 80px; } html, body { color: var(--color-hondros-sec-black); line-height: normal; font-family: var(--font); font-weight: normal; font-style: normal; font-size: 16px; vertical-align: baseline; background-color: var(--color-hondros--main); } h1, h2, h3, h4, h5, h6, ol, ul, p { margin: 16px 0; } h1, h2, h3, h4, h5, h6 { font-family: var(--font-bold); font-weight: normal; text-transform: none; line-height: 1.125; } h1 { font-size: 2.4em; } h2 { font-size: 2em; } h3 { font-size: 1.6em; } h4 { font-size: 1.4em; } h5 { font-size: 1.2em; } h6 { font-size: 1em; } p, ul, ol { font-size: 1em; line-height: 1.5em; } @media only screen and (max-width: 768px) { h1 { font-size: 1.8em; } h2 { font-size: 1.5em; } h3 { font-size: 1.3em; } h4 { font-size: 1.2em; } h5 { font-size: 1.1em; } h6 { font-size: 1em; } } .center-align { text-align: center; } .left-align { text-align: left; } .image-text img { margin: 16px 0; } .alert { position: relative; padding: 0; display: flex; height: auto; min-height: 3rem; min-width: 18rem; width: 100%; border: 0; border-left: 3px solid var(--color-hondros-sec-dark-gray); background: var(--color-hondros-sec-light-gray); color: var(--color-hondros-sec-black); } .alert-details { display: flex; flex-grow: 1; margin: 0 1rem; } .alert-icon { flex-shrink: 0; margin-right: 1rem; margin-top: .875rem; fill: var(--color-hondros-sec-dark-gray); } .alert-content { display: flex; flex-wrap: wrap; align-items: center; padding: .75rem 0; } .alert-title { font-size: 1rem; font-family: var(--font-bold); font-weight: normal; line-height: 1.125rem; margin: 0 .25rem 0 0; line-height: 1.5rem; } .alert-subtitle { display: block; width: 100%; font-size: 1rem; font-family: var(--font); font-weight: normal; line-height: 1.125rem; margin: 0 .25rem 0 0; line-height: 1.5rem; } .alert-subtitle span { display: block; } .alert .alert-content a { color: var(--color-brand-royal-blue); text-decoration: underline; } .alert .alert-content a:hover { color: var(--color-brand-royal-blue--darkest); text-decoration: underline; } .alert-close { background: transparent; color: var(--color-hondros-sec-black); display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0; margin: 0; height: 3rem; width: 3rem; min-width: 3rem; max-width: 3rem; outline: 2px solid transparent; outline-offset: -2px; border: none; cursor: pointer; transition: outline .11s cubic-bezier(.2,0,.38,.9),background-color .11s cubic-bezier(.2,0,.38,.9); } .alert-close .alert-close-icon { fill: var(--color-hondros-sec-black); transition: all .11s cubic-bezier(.2,0,.38,.9); } .alert-close:hover .alert-close-icon { transform: scale(1.5); } .alert-info { border-left: 3px solid var(--color-brand-aqua-blue); background: var(--color-brand-aqua-blue--lightest); color: var(--color-hondros-sec-black); } .alert-info .alert-icon { fill: var(--color-brand-aqua-blue); } .alert-success { border-left: 3px solid var(--color-brand-green); background: var(--color-brand-green--lightest); color: var(--color-hondros-sec-black); } .alert-success .alert-icon { fill: var(--color-brand-green); } .alert-warning { border-left: 3px solid #ffbe2e; background: #faf3d1; color: var(--color-hondros-sec-black); } .alert-warning .alert-icon { fill: #ffbe2e; } .alert-error { border-left: 3px solid #d54309; background: #f4e3db; color: var(--color-hondros-sec-black); } .alert-error .alert-icon { fill: #d54309; } .image-filter { position: relative; width: 100%; } .image-filter img { position: relative; width: 100%; height: auto; vertical-align: bottom; } .image-filter svg { position: absolute; top: 0; left: 0; } .image-text svg { margin: 16px 0; } .testimonial { display: flex; flex-flow: row nowrap; align-items: center; padding: 0; } .testimonial div { flex-basis: 66.66%; max-width: 66.66%; } .testimonial blockquote { flex: 0 0 33.33%; } .testimonial blockquote { text-align: center; margin: 0; padding: 1em 0; position: relative; } .testimonial blockquote p { color: var(--color-brand-gray); font-size: 1.5em; line-height: 1.325; max-width: 100%; margin: 0; padding: 2em; z-index: 5; } .testimonial blockquote p span { font-family: "Walbaum-Italic"; } .testimonial blockquote::before { content: ""; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); z-index: 50; opacity: 0.05; background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 70 70" width="70" height="70"><rect x="0" y="40" width="30" height="30"></rect><path d="M 0 40 q 0 -40 30 -40 v 15 q -15 0 -15 25"></path><rect x="40" y="40" width="30" height="30"></rect><path d="M 40 40 q 0 -40 30 -40 v 15 q -15 0 -15 25"></path></svg>'), url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 70 70" width="70" height="70" transform="rotate(180)"><rect x="0" y="40" width="30" height="30"></rect><path d="M 0 40 q 0 -40 30 -40 v 15 q -15 0 -15 25"></path><rect x="40" y="40" width="30" height="30"></rect><path d="M 40 40 q 0 -40 30 -40 v 15 q -15 0 -15 25"></path></svg>'); background-position: 5% 5%, 95% 95%; background-repeat: no-repeat; } .testimonial blockquote::after { content: ''; display: block; background: var(--color-hondros--steam); transform: rotate(45deg); -webkit-transform: rotate(45deg); width: 50px; height: 50px; position: absolute; top: calc(50% - 24px); left: -24px; margin: auto; z-index: 50; } .testimonial blockquote h2 { color: var(--color-brand-royal-blue); font-family: "Avenir-Black"; font-size: 1.25em; line-height: 1.125; } .testimonial blockquote h2 span { color: var(--color-brand-gray); display: block; font-family: "Avenir-Light"; font-size: 0.8em; text-transform: none; } @media only screen and (max-width: 1160px) { .testimonial div { flex-basis: 50%; max-width: 50%; } .testimonial blockquote { flex-basis: 50%; } .testimonial blockquote p { font-size: 1.25em; } } @media only screen and (max-width: 1000px) { .testimonial blockquote p { font-size: 1em; } .testimonial blockquote h2 { margin-top: 0; } } @media only screen and (max-width: 900px) { .testimonial blockquote p { font-size: 1.5em; padding: 1em 2em; } .testimonial blockquote::after { left: calc(50% - 24px); top: -24px; } .testimonial { flex-wrap: wrap; } .testimonial div { flex-basis: 100%; max-width: 100%; } .testimonial blockquote { flex-basis: 100%; } } @media only screen and (max-width: 500px) { .testimonial blockquote p { font-size: 1em; } } .acc-toggle { margin-top: 10px; } .acc-toggle-title { display: flex; justify-content: space-between; align-items: center; font-size: 1.25rem; font-family: var(--font); margin-bottom: 0; padding: 1rem 2rem; cursor: pointer; border-top: 1px solid; border-color: var(--color-brand-royal-blue); } .acc-toggle-title:hover{ background-color: var(--color-brand-royal-blue--lightest); } .acc-toggle-title.active { color: var(--color-hondros-sec-white); background-color: var(--color-brand-royal-blue--darkest); border-color: var(--color-brand-royal-blue--darkest); } .acc-toggle-title.active:hover { background-color: var(--color-brand-royal-blue); } .acc-toggle-content { display: none; overflow: hidden; background-color: var(--color-hondros--main); border: 1px solid var(--color-brand-royal-blue); border-top: none; margin: 0; padding: 1rem 2rem; } .ac_expand h2, .ac_expand h3, .ac_expand h4, .ac_expand h5, .ac_expand h6 { display: inline-block; margin: 20px 0; } .acc-toggle-swap { float: right; margin: 16px 0; text-align: center; } .acc-toggle-title::after { content: "+"; display: flex; justify-content: center; color: var(--color-hondros-sec-black); background-color: var(--color-brand-yellow); font-size: 2rem; font-family: var(--font); font-style: normal; text-align: center; line-height: 1.07; margin-left: 1rem; width: 2rem; height: 2rem; box-sizing: border-box; border: 1px solid inherit; border-radius: 100%; cursor: pointer; } .acc-toggle-title.active::after { content: "\2013"; } .acc-toggle-title::after { transition: all 0.2s ease-in-out 0s; } .acc-toggle-invert a { color: var(--color-hondros-sec-white); text-decoration: underline; } .acc-toggle-invert a.button { text-decoration: none; } .acc-toggle-invert .acc-toggle-title, .acc-toggle-invert .acc-toggle-content, .acc-toggle-invert h3 { color: var(--color-hondros-sec-white); } .acc-toggle-invert .acc-toggle-title { border-color: var(--color-hondros-sec-white); } .acc-toggle-invert .acc-toggle-title:hover{ background-color: var(--color-brand-royal-blue--darkest); } .acc-toggle-invert .acc-toggle-title.active { color: var(--color-hondros-sec-black); background-color: var(--color-hondros-sec-white); border-color: var(--color-hondros-sec-white); } .acc-toggle-invert .acc-toggle-title.active:hover { background-color: var(--color-brand-royal-blue--lightest); border-color: var(--color-brand-royal-blue--lightest); } .acc-toggle-invert .acc-toggle-title::before { border-color: var(--color-hondros-sec-white); } .acc-toggle-invert .acc-toggle-content { background-color: var(--color-brand-royal-blue--darkest); border: 1px solid var(--color-hondros-sec-white); border-top: none; } .embed { position: relative; width: 100%; } .embed::before { content: ""; display: block; padding-bottom: calc(100% / (16/9)); } .embed.four-by-three::before { padding-bottom: calc(100% / (4/3)); } .embed>div, .embed>iframe { position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .embed-responsive { position: relative; } .embed-responsive-16by9::before { padding-top: 56.25%; } .embed-responsive::before { display: block; content: ""; } .embed-responsive embed, .embed-responsive iframe, .embed-responsive object, .embed-responsive video { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0; } .map { display: flex; flex-flow: row nowrap; } .map li { flex-basis: 66.666%; } .map li:first-child { flex-basis: calc(33.333% - 2em); margin-right: 2em; } @media only screen and (max-width: 1060px) { .map { flex-flow: row wrap; } .map li { flex-basis: 50%; } .map li:first-child { flex-basis: calc(50% - 2em); } } @media only screen and (max-width: 900px) { .map { flex-flow: row wrap; } .map li { flex-basis: 100%; } .map li:first-child { flex-basis: 100%; order: 2; } } @media only screen and (max-width: 600px) { .map .embed>div { padding-bottom: calc(100% / (4/3)); } .map .embed::before { padding-bottom: calc(100% / (4/3)); } } ul, ol { list-style: none; margin-left: 0; padding: 0; } ul li, ol li { margin: 0; padding: 0; } .dotted-list { list-style: disc; margin-left: 1.6em; } .numbered-list { list-style: decimal; margin-left: 1.6em; } .leaders-list { overflow-x: hidden; } .leaders-list li { margin-bottom: 1em; background: url(/common/images/bg-leaders.png) transparent 0 17px repeat-x; } .leaders-list.leader-dark li { margin-bottom: 1em; background: url(/common/images/bg-leaders-dark.png) transparent 0 17px repeat-x; } .leaders-list li > span { background-color: var(--color-hondros-sec-white)fff; } .leaders-list li > span:first-child { padding-right: 0.6em; } .leaders-list li > span.leader-stat { font-family: "Avenir-Black", sans-serif; } .leaders-list li > span + span { float: right; padding-left: 0.6em; } a { font-weight: 700; color: var(--color-brand-royal-blue); } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: 400; } a:link, a:visited { text-decoration: none; } a:active, a:hover { text-decoration: underline; color: var(--color-brand-royal-blue--darkest); } a[rel=follow] { display: block; } a[rel=follow]::after { content: "⟩"; margin-left: .2em; } a.arrow-link { display: inline-block; font-family: var(--font-bold); font-weight: 700; font-size: 1rem; color: #000; padding: .25rem 0; transition: color .2s ease-in-out; } a.arrow-link::after { content: ' '; height: 1.625rem; width: 1.625rem; border-radius: 50%; display: inline-block; background: #e1e000 url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTYiIHdpZHRoPSIxNiIgdmlld0JveD0iMCAwIDUwIDUwIj48cGF0aCBzdHlsZT0iZmlsbDogIzAwMCIgZD0iTTIuNjQsMjcuMTVoMzkuOUwyNS4xOSw0Ni40MmEyLjE1LDIuMTUsMCwwLDAsMy4xOSwyLjg3TDQ5LDI2LjQzbC4wNi0uMDguMDktLjExLjA3LS4xMS4wOC0uMTMuMDYtLjEyLDAtLjEyYS44OC44OCwwLDAsMSwwLS4xNWwwLS4xM2EuNS41LDAsMCwwLDAtLjEyLjc4Ljc4LDAsMCwwLDAtLjE2LjY2LjY2LDAsMCwwLDAtLjE0LjEzLjEzLDAsMCwwLDAtLjA2czAsMCwwLS4wNWEuNzYuNzYsMCwwLDAsMC0uMTUsMSwxLDAsMCwwLDAtLjE3LjM2LjM2LDAsMCwwLDAtLjFsMC0uMTQtLjA2LS4xNiwwLS4xTDQ5LjI1LDI0bC0uMDktLjE0YS40MS40MSwwLDAsMCwwLS4wOWwtLjEtLjEyTDQ5LDIzLjU3LDI4LjM4LjcxYTIuMTUsMi4xNSwwLDEsMC0zLjE5LDIuODdMNDIuNTUsMjIuODZIMi42NGEyLjE1LDIuMTUsMCwwLDAsMCw0LjI5WiIvPjwvc3ZnPg==) no-repeat center; background-size: auto; background-size: .875rem .875rem; vertical-align: bottom; transform: translateX(.5rem); transition: transform .2s ease-in-out; transform: translateX(.5rem) rotate(90deg); } em { font-style: italic; } sup, .fine, .finePrint, .fineprint, .small, .smallPrint, .smallprint, .sources, .htmlSection { font-family: var(--font); font-size: .75em; margin-top: 2em; } sup { position: relative; line-height: 1; } main > section { position: relative; padding: 1rem; margin: 0 auto; overflow: visible; background-color: transparent; } @media only screen and (min-width: 620px) { main > section { position: relative; padding: 2rem; margin: 0 auto; overflow: visible; background-color: transparent; } } @media only screen and (min-width: 960px) { main > section { position: relative; padding: 4rem; margin: 0 auto; overflow: visible; background-color: transparent; } } @media only screen and (min-width: 1500px) { main > section { position: relative; padding: 6rem; margin: 0 auto; overflow: visible; background-color: transparent; } } @media only screen and (min-width: 2100px) { main > section { position: relative; padding: 8rem; margin: 0 auto; overflow: visible; background-color: transparent; } } section.no-padding { padding: 0 !important; } section.svg-shape-before { padding-bottom: 1em; } section.svg-shape-spacer { padding-top: calc(4em + 5vw + 16px); } section figure.svg-shape { position: absolute; top: 0; left: 0; margin: 0; width: 100%; } section figure.svg-shape svg { position: relative; display: block; width: 100%; max-width: 1000px; top: -1px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } section.cloud { background-color: var(--color-hondros--cloud); } section.fog { background-color: var(--color-hondros--fog); } section.steam { background-color: var(--color-hondros--steam); } section.royal { background-color: var(--color-brand-royal-blue--lightest); } section.aqua { background-color: var(--color-brand-aqua-blue--lightest); } section.green { background-color: var(--color-brand-green--lightest); } section.yellow { background-color: var(--color-brand-yellow--lightest); } section.royal--full { background-color: var(--color-brand-royal-blue); color: var(--color-hondros-sec-white); } section.aqua--full { background-color: var(--color-brand-aqua-blue); color: var(--color-hondros-sec-white); } section.green--full { background-color: var(--color-brand-green); color: var(--color-hondros-sec-white); } section.yellow--full { background-color: var(--color-brand-yellow); } section.royal--full h1, section.aqua--full h1, section.green--full h1, section.royal--full h2, section.aqua--full h2, section.green--full h2, section.royal--full h3, section.aqua--full h3, section.green--full h3, section.royal--full h4, section.aqua--full h4, section.green--full h4, section.royal--full h5, section.aqua--full h5, section.green--full h5, section.royal--full h6, section.aqua--full h6, section.green--full h6 { color: var(--color-hondros-sec-white); } section.royal--full a, section.aqua--full a, section.green--full a { color: var(--color-hondros-sec-white); } figure.svg-shape { color: var(--color-hondros--main); } figure.svg-shape.cloud { color: var(--color-hondros--cloud); } figure.svg-shape.fog { color: var(--color-hondros--fog); } figure.svg-shape.steam { color: var(--color-hondros--steam); } figure.svg-shape.royal { color: var(--color-brand-royal-blue--lightest); } figure.svg-shape.aqua { color: var(--color-brand-aqua-blue--lightest); } figure.svg-shape.green { color: var(--color-brand-green--lightest); } figure.svg-shape.yellow { color: var(--color-brand-yellow--lightest); } figure.svg-shape.royal--full { color: var(--color-brand-royal-blue); } figure.svg-shape.aqua--full { color: var(--color-brand-aqua-blue); } figure.svg-shape.green--full { color: var(--color-brand-green); } figure.svg-shape.yellow--full { color: var(--color-brand-yellow); } .flex-panes .panes { display: flex; flex-direction: column; align-items: stretch; } .pane { color: var(--color-brand-gray); background-color: var(--color-hondros--main); -webkit-box-shadow: 0px 3px 5px 0px var(--color-hondros-sec-light-gray); -moz-box-shadow: 0px 3px 5px 0px var(--color-hondros-sec-light-gray); box-shadow: 0px 3px 5px 0px var(--color-hondros-sec-light-gray); flex: 1 auto; display: flex; flex-direction: column; } .pane-image { width: 100%; } .pane-heading { font-size: 1.4em; text-transform: none; margin-top: 0; padding: 8px 16px; color: var(--color-hondros-sec-white); background-color: var(--color-hondros-sec-dark-gray); border-bottom: 3px solid var(--color-hondros-sec-medium-gray); } .pane-footer { font-size: 0.9em; text-transform: none; margin-top: auto; padding: 8px 16px; border-top: 1px solid var(--color-hondros-sec-medium-gray); } .pane-footer a { margin-top: 8px; } .pane-footer a.cta { font-size: 1.1em; } .flex-panes.cloud .pane-heading, .flex-panes.fog .pane-heading, .flex-panes.steam .pane-heading, .flex-panes.main .pane-heading { background-color: var(--color-hondros-sec-dark-gray); border-bottom: 3px solid var(--color-hondros-sec-medium-gray); } .flex-panes.royal .pane-heading { background-color: var(--color-brand-royal-blue); border-bottom: 3px solid var(--color-brand-royal-blue--lighter); } .flex-panes.aqua .pane-heading { background-color: var(--color-brand-aqua-blue); border-bottom: 3px solid var(--color-brand-aqua-blue--lighter); } .flex-panes.green .pane-heading { background-color: var(--color-brand-green); border-bottom: 3px solid var(--color-brand-green--lighter); } .flex-panes.yellow .pane-heading { color: var(--color-hondros-sec-black); background-color: var(--color-brand-yellow); border-bottom: 3px solid var(--color-brand-yellow--lighter); } .pane-body { padding: 0 16px; } .flex-panes.cloud .pane { background-color: var(--color-hondros--cloud); } .flex-panes.fog .pane { background-color: var(--color-hondros--fog); } .flex-panes.steam .pane { background-color: var(--color-hondros--steam); } .flex-panes.main .pane { background-color: var(--color-hondros--main); } .flex-panes.royal .pane { background-color: var(--color-brand-royal-blue--lightest); } .flex-panes.aqua .pane { background-color: var(--color-brand-aqua-blue--lightest); } .flex-panes.green .pane { background-color: var(--color-brand-green--lightest); } .flex-panes.yellow .pane { background-color: var(--color-brand-yellow--lightest); } footer { background-color: var(--color-brand-gray); color: var( --color-hondros-sec-white); text-align: left; padding: 1em 10%; } footer h4 { margin: 0; } footer nav li { list-style: none; display: inline; margin-right: .5em; border-right: 1px solid rgba(255, 255, 255, 0.37); padding-right: .5em; } footer nav li:last-of-type { border-right-style: none; margin-right: 0; padding-right: 0; } footer p { font-family: var(--font); font-size: .7em; margin: .6em 0; } footer a { transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; } footer a:link, footer a:visited { color: var(--color-hondros-sec-white); text-decoration: underline; } footer a:active, footer a:hover { color: var(--color-hondros-sec-white); opacity: 1; text-decoration: none; } .nowrap { display: inline-block; } i { font-style: italic; color: #b27c7c; } header.masthead { position: fixed; margin: 0; padding: 0; width: 100%; z-index: 10000; display: block; background-color: var(--color-brand-royal-blue); } header.masthead .utility { padding: 1em 2em; overflow: hidden; top: 0; height: 80px; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: flex-start; background-color: transparent; } header.masthead .logo { flex: 0 0 210px; background: url(/common/images/logos/hondros-w.png) no-repeat; max-width: 210px; height: 50px; text-indent: -999em; } header.masthead .ctaPanel { background-color: transparent; text-transform: uppercase; top: -21px; position: relative; display: flex; flex-direction: row; line-height: 1em; font-size: 1em; } header.masthead .utility li { display: inline-block; list-style-type: none; padding: 0.75em; margin: .5em 0; border-right: 1px solid var(--color-brand-royal-blue--lightest); line-height: 1em; font-size: 1em; } header.masthead .utility li a.phone { color: var(--color-hondros-sec-white); background-color: transparent; font-weight: 400; } header.masthead .utility li .button { margin: 0; display: inline; } header.masthead .utility li:last-of-type { border-right-style: none; } header.masthead nav { display: block; position: relative; } header.masthead nav ul { display: flex; flex-flow: row wrap; justify-content: space-around; margin: 0; background-color: var(--color-brand-aqua-blue); } header.masthead nav ul li { flex: 1 auto; margin: 0; background-color: transparent; border-right: 1px solid var(--color-brand-royal-blue--lightest); text-align: center; } header.masthead nav ul li:last-child { border-right: none; } header.masthead nav ul li a { display: block; background-color: transparent; color: var(--color-hondros-sec-white); width: 100%; padding: 0.5em 1em; } header.masthead nav ul li:hover, header.masthead nav ul li:hover a { background-color: var(--color-hondros-sec-white); color: var(--color-brand-royal-blue); } header.masthead nav ul li:hover a { background-color: inherit; color: inherit; text-decoration: none; opacity: 1; } header.masthead nav ul li.active { background-color: var(--color-brand-green); } header.masthead nav ul li.active:hover { background-color: var(--color-brand-green--light); } header.masthead nav ul li.active:hover a { color: var(--color-hondros-sec-white); } #main-nav label, #hamburger { display: none; } @media only screen and (max-width: 830px) { header.masthead .ctaPanel { flex-direction: column; top: -.3em; padding: 0; margin: 0; text-align: center; font-size: .9em; } header.masthead .ctaPanel li { padding: 0; margin: 0; border-right: none; margin-bottom: 1em; } #main-nav label { display: inline-block; color: var(--color-hondros-sec-white); background: var(--color-brand-aqua-blue); font-style: normal; font-size: 1em; line-height: 1.5em; padding: 0.5em 1em; cursor: pointer; } #main-nav label span { position: relative; font-size: 1.5em; line-height: 1; } header.masthead nav ul li { display: block; } header.masthead nav ul li { border-right: none; border-top: 1px solid var(--color-brand-royal-blue--lightest); } header.masthead nav ul { display: none; } header.masthead nav input:checked ~ ul { display: block; } } @media only screen and (max-width: 580px) { header.masthead .logo { flex: 0 0 50px; max-width: 50px; } header.masthead .ctaPanel { top: 0; font-size: .8em; } } table { margin: 2em 0; width: 100%; } table + table { margin-top: -1em; } th { font-size: 1.125em; font-family: var(--font-bold); text-align: left; } .table-container { overflow: auto; } .table-default { font-size: 14px; background-color: var(--color-hondros-sec-white); border-collapse: separate; border-spacing: 0px; border: #ccc 1px solid; -moz-box-shadow: 0 1px 2px var(--color-hondros-sec-light-gray); -webkit-box-shadow: 0 1px 2px var(--color-hondros-sec-light-gray); box-shadow: 0 1px 2px var(--color-hondros-sec-light-gray); } .table-full-blue { background-color: var(--color-brand-royal-blue--lighter); border: var(--color-brand-gray) 1px solid; color: #000; } .table-full-green { background-color: var(--color-brand-green--lighter); border: var(--color-brand-gray) 1px solid; color: #000; } .table-full-aqua { background-color: var(--color-brand-aqua-blue--lighter); border: var(--color-brand-gray) 1px solid; color: #000; } .table-default th { padding: 0.5em 1em; width: auto; border-top: 1px solid var(--color-brand-gray); border-bottom: 1px solid var(--color-hondros-sec-dark-gray); background-color: var(--color-brand-gray); color: var(--color-hondros-sec-white); } .table-blue th, .table-full-blue th { border-top: 1px solid var(--color-brand-royal-blue); background-color: var(--color-brand-royal-blue); } .table-green th, .table-full-green th { border-top: 1px solid var(--color-brand-green); background-color: var(--color-brand-green); } .table-aqua th, .table-full-aqua th { border-top: 1px solid var(--color-brand-aqua-blue); background-color: var(--color-brand-aqua-blue); } .table-default th:first-child { } .table-default tr { } .table-default td:first-child { text-align: left; border-left: 0; } .table-default td { padding: 0.5em 1em; width: auto; border-top: 1px solid var(--color-hondros-sec-white)fff; border-bottom: 1px solid var(--color-hondros-sec-light-gray); border-left: 1px solid var(--color-hondros-sec-light-gray); } .table-full-blue td { padding: 0.5em 1em; width: auto; border-top: 1px solid var(--color-brand-royal-blue--lighter); border-bottom: 1px solid var(--color-brand-royal-blue--light); border-left: 1px solid var(--color-brand-gray); } .table-full-green td { padding: 0.5em 1em; width: auto; border-top: 1px solid var(--color-brand-green--lightest); border-bottom: 1px solid var(--color-brand-green--lighter); border-left: 1px solid var(--color-brand-gray); } .table-full-aqua td { padding: 0.5em 1em; width: auto; border-top: 1px solid var(--color-brand-aqua-blue--lightest); border-bottom: 1px solid var(--color-brand-aqua-blue--lighter); border-left: 1px solid var(--color-brand-gray); } .table-default tbody tr { background-color: var(--color-hondros-sec-white); } .table-full-blue tbody tr { background-color: var(--color-brand-royal-blue--lighter); } .table-full-green tbody tr { background-color: var(--color-brand-green--lightest); } .table-full-aqua tbody tr { background-color: var(--color-brand-aqua-blue--lightest); } .table-default tbody tr:nth-of-type(2n) { background-color: var(--color-hondros-sec-white); } .table-full-blue tbody tr:nth-of-type(2n) { background-color: var(--color-brand-royal-blue--lighter); } .table-full-green tbody tr:nth-of-type(2n) { background-color: var(--color-brand-green--lightest); } .table-full-aqua tbody tr:nth-of-type(2n) { background-color: var(--color-brand-aqua-blue--lightest); } .table-default.zebra tbody tr:nth-of-type(2n) { background-color: var(--color-hondros--cloud); } .table-default tr:last-child td { border-bottom: 0; } hr { display: block; clear: both; border-bottom-style: solid; border-bottom-width: 1px; } button, .button, input[type=submit], input[type=reset], input[type=button] { position: relative; display: inline-block; font: 1em var(--font-bold); font-style: normal; font-weight: normal; font-variant: normal; text-align: center; text-transform: capitalize; text-decoration: none; margin: 0; margin-bottom: 0.75em; margin-right: 0.75em; padding: 0.75rem 1.5rem; min-width: 150px; max-width: 100%; border-width: 2px; border-style: solid; border-radius: 5rem; white-space: normal; transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; } button, .button, input, select { transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; padding: 0.75em 1.5em; display: inline-block; } .button.border, input[type=submit], input[type=reset] { border-width: 2px; border-style: solid; padding: 0.64em 1.42em; } button:hover, .button:hover { text-decoration: none; opacity: 1; } .button.ghost { border-width: 2px; border-style: solid; } .button, .button.default, input[type=submit], input[type=reset] { color: var(--color-hondros-sec-white); background-color: var(--color-brand-royal-blue); border-color: var(--color-brand-royal-blue); } .button.ghost, .button.default.ghost { border-color: var(--color-brand-royal-blue); } .button.invert:hover, .button.default.invert:hover, .button.ghost:hover, .button:hover, input[type=submit]:hover { color: var(--color-hondros-sec-white); background-color: var(--color-brand-royal-blue--dark); border-color: var(--color-brand-royal-blue--dark); } .button.invert, .button.default.invert { color: var(--color-brand-royal-blue); border-color: var(--color-hondros-sec-white); background-color: var(--color-hondros-sec-white); } .button.ghost, .button.default.ghost { color: var(--color-brand-royal-blue); border-color: var(--color-brand-royal-blue--dark); background-color: transparent; } .button.ghost.invert, .button.default.ghost.invert { color: var(--color-hondros-sec-white); border-color: var(--color-hondros-sec-white); background-color: transparent; } .button.ghost.invert:hover { color: var(--color-brand-royal-blue); border-color: var(--color-hondros-sec-white); background-color: var(--color-hondros-sec-white); } .button.aqua { color: var(--color-hondros-sec-white); background-color: var(--color-brand-aqua-blue); border-color: var(--color-brand-aqua-blue); } .button.aqua.ghost { border-color: var(--color-brand-aqua-blue); } .button.aqua.invert:hover, .button.aqua.ghost:hover, .button.aqua:hover { color: var(--color-hondros-sec-white); background-color: var(--color-brand-aqua-blue--dark); border-color: var(--color-brand-aqua-blue--dark); } .button.aqua.invert { color: var(--color-brand-aqua-blue); background-color: var(--color-hondros-sec-white); } .button.aqua.ghost { color: var(--color-brand-aqua-blue); border-color: var(--color-brand-aqua-blue); background-color: transparent; } .button.green { color: var(--color-hondros-sec-white); background-color: var(--color-brand-green); border-color: var(--color-brand-green); } .button.green.ghost { border-color: var(--color-brand-green); } .button.green.invert:hover, .button.green.ghost:hover, .button.green:hover { color: var(--color-hondros-sec-white); background-color: var(--color-brand-green--dark); border-color: var(--color-brand-green--dark); } .button.green.invert { color: var(--color-brand-green); background-color: var(--color-hondros-sec-white); } .button.green.ghost { color: var(--color-brand-green); border-color: var(--color-brand-green); background-color: transparent; } .button.yellow, .button.yeller { color: var(--color-hondros-sec-blue-gray); background-color: var(--color-brand-yellow); border-color: var(--color-brand-yellow); } .button.yellow.ghost, .button.yeller.ghost { border-color: var(--color-brand-yellow); } .button.yellow.invert:hover, .button.yellow.ghost:hover, .button.yellow:hover, .button.yeller.invert:hover, .button.yeller.ghost:hover, .button.yeller:hover { color: var(--color-hondros-sec-blue-gray); background-color: var(--color-brand-yellow--dark); border-color: var(--color-brand-yellow--dark); } .button.yellow.invert, .button.yeller.invert { color: var(--color-brand-yellow); background-color: var(--color-hondros-sec-blue-gray); } .button.yellow.ghost, .button.yeller.ghost { color: var(--color-brand-yellow); border-color: var(--color-brand-yellow); background-color: transparent; } .button.dark-grey { color: var(--color-hondros-sec-white); background-color: var(--color-hondros-sec-dark-gray); border-color: var(--color-hondros-sec-dark-gray); } .button.dark-grey.ghost { border-color: var(--color-hondros-sec-dark-gray); } .button.dark-grey.invert:hover, .button.dark-grey.ghost:hover, .button.dark-grey:hover { color: var(--color-hondros-sec-white); background-color: var(--color-brand-gray); border-color: var(--color-brand-gray); } .button.dark-grey.invert { color: var(--color-hondros-sec-dark-gray); background-color: var(--color-hondros-sec-white); } .button.dark-grey.ghost { color: var(--color-hondros-sec-dark-gray); border-color: var(--color-hondros-sec-dark-gray); background-color: transparent; } .button.light-grey, input[type=reset] { color: var(--color-hondros-sec-white); background-color: var(--color-hondros-sec-medium-gray); border-color: var(--color-hondros-sec-medium-gray); } .button.light-grey.ghost, input[type=reset] { border-color: var(--color-hondros-sec-medium-gray); } .button.light-grey.invert:hover, .button.light-grey.ghost:hover, .button.light-grey:hover, input[type=reset]:hover { color: var(--color-hondros-sec-white); background-color: var(--color-hondros-sec-light-gray); border-color: var(--color-hondros-sec-light-gray); } .button.light-grey.invert { color: var(--color-hondros-sec-medium-gray); background-color: var(--color-hondros-sec-white); } .button.light-grey.ghost { color: var(--color-hondros-sec-medium-gray); border-color: var(--color-hondros-sec-medium-gray); background-color: transparent; } .button-group { white-space: nowrap; font-size: 0; display: flex; flex-flow: row nowrap; justify-content: center; } .button-group .button { font-size: 1rem; text-align: center; margin: 0; display: inline-block; flex: 0 1 50%; max-width: 300px; } .mktoForm { display: none; color: #fff; width: 100% !important; border: 2px dotted gray; padding: 10px; box-sizing: border-box; } .mktoForm input { border: 2px dotted gray; } input, textarea, select { font: inherit; font-size: 1.07rem; letter-spacing: inherit; } .label { box-sizing: border-box; padding: 0; border: 0; font-size: 0.85rem; color: var(--color-hondros-sec-dark-gray); font-weight: 400; display: inline-block; vertical-align: baseline; margin: 0 0 .2rem; line-height: 1rem; } legend { display: none; } select, input[type=text], input[type=email], input[type=tel], input[type=number] { display: inline-block; -webkit-appearance: none; -moz-appearance: none; appearance: none; color: var(--color-hondros-sec-black); background: var(--color-hondros-sec-white); border: 1px solid var(--color-hondros-sec-white); border-radius: 0; width: 100%; text-align: left; text-decoration: none; text-overflow: ellipsis; margin: 0; padding: 0.75rem; } select.form-req-active, input[type=text].form-req-active, input[type=email].form-req-active, input[type=tel].form-req-active, input[type=number].form-req-active { border: 1px solid red; } select, input[type=text] { text-transform: capitalize; } input[type=checkbox] { display: inline-block; } input[type=checkbox] ~ label { display: inline-block; } select { padding-right: 2em; } select::-ms-expand { display: none; } textarea { width: 100%; color: var(--color-hondros-sec-dark-gray); border: 1px solid var(--color-hondros-sec-medium-gray); } .text-area { outline: 2px solid transparent; outline-offset: -2px; background-color: var(--color-hondros-sec-white); width: 100%; min-width: 10rem; min-height: 2.5rem; padding: .6875rem 1rem; color: var(--color-hondros-sec-black); order: 3; resize: vertical; border: none; border-bottom: 1px solid var(--color-hondros-sec-medium-gray); transition: background-color 70ms cubic-bezier(.2,0,.38,.9),outline 70ms cubic-bezier(.2,0,.38,.9); } select:hover, input:hover, textarea:hover, select:focus, input:focus, textarea:focus { background: var(--color-brand-green--lightest); border: 1px solid var(--color-brand-green--lightest); } select:focus, input:active, textarea:active, select:focus, input:focus, textarea:focus { outline: 1px dashed var(--color-brand-green); } ::placeholder { color: var(--color-hondros-sec-dark-gray); opacity: 1; } :-ms-input-placeholder { color: var(--color-hondros-sec-dark-gray); opacity: 1; } ::-ms-input-placeholder { color: var(--color-hondros-sec-dark-gray); opacity: 1; } optgroup:before { font-style: italic; } optgroup option { margin-left: 1rem; } .select { box-sizing: border-box; margin: 0; padding: 0; border: 0; font-size: 100%; font-family: inherit; vertical-align: baseline; position: relative; display: flex; flex-direction: column; width: 100%; } .select-input-wrapper { position: relative; display: flex; align-items: center; height: 100%; } .select-arrow { fill: var(--color-hondros-sec-black); position: absolute; right: 1rem; pointer-events: none; } .select-arrow-color { position: absolute; fill: var(--color-hondros-sec-dark-gray); right: 0; top: 0; pointer-events: none; } .radio-button-group { display: flex; align-items: center; margin-top: .375rem; border: none; } .radio-button { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; visibility: visible; white-space: nowrap; visibility: inherit; } .radio-button-wrapper:not(:last-of-type) { margin-right: 1rem; } .radio-button-wrapper .radio-button-label { display: flex; align-items: center; justify-content: center; margin: 0; } .radio-button-label { font-size: 1rem; font-weight: 400; line-height: 1.125rem; display: flex; align-items: center; cursor: pointer; margin-right: 1rem; } .radio-button-appearance { box-sizing: border-box; padding: 0; font-size: 100%; font-family: inherit; vertical-align: baseline; background-color: transparent; border-radius: 50%; border: 1px solid #161616; flex-shrink: 0; height: 1.125rem; width: 1.125rem; margin: 0 .5rem 0 0; } .radio-button:checked + .radio-button-label .radio-button-appearance { display: flex; align-items: center; justify-content: center; border-color: var(--color-hondros-sec-black); } .radio-button:checked + .radio-button-label .radio-button-appearance::before { content: ""; display: inline-block; position: relative; width: .5rem; height: .5rem; border-radius: 50%; background-color: var(--color-brand-royal-blue); } .checkbox { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; visibility: visible; white-space: nowrap; } .checkbox-label { box-sizing: border-box; margin: 0; border: 0; vertical-align: baseline; line-height: 1.5rem; position: relative; display: flex; cursor: pointer; padding: 0 0 0 1.625rem; min-height: 1.5rem; -webkit-user-select: none; -ms-user-select: none; user-select: none; } .checkbox-label::before { content: ""; width: 1rem; height: 1rem; margin: .125rem; position: absolute; left: 0; top: .125rem; background-color: transparent; border: 1px solid var(--color-hondros-sec-black); border-radius: 1px; } .checkbox-label[data-contained-checkbox-state="mixed"]::before, .checkbox-label[data-contained-checkbox-state="true"]::before, .checkbox:checked + .checkbox-label::before, .checkbox:indeterminate + .checkbox-label::before { background-color: var(--color-hondros-sec-black); border-color: var(--color-hondros-sec-black); border-width: 1px; } .checkbox-label::after { content: ""; position: absolute; left: .375rem; top: .5rem; width: .5625rem; height: .3125rem; background: none; border-left: 2px solid var(--color-hondros-sec-white); border-bottom: 2px solid var(--color-hondros-sec-white); -webkit-transform: scale(0) rotate(-45deg); transform: scale(0) rotate(-45deg); -webkit-transform-origin: bottom right; transform-origin: bottom right; margin-top: -.25rem; } .checkbox-label[data-contained-checkbox-state="true"]::after, .checkbox:checked + .checkbox-label::after { -webkit-transform: scale(1) rotate(-45deg); transform: scale(1) rotate(-45deg); } .checkbox-label[data-contained-checkbox-disabled="true"], .checkbox:disabled + .checkbox-label { cursor: not-allowed; color: var(--color-hondros-sec-medium-gray); } .checkbox-label[data-contained-checkbox-disabled="true"]::before, .checkbox:disabled + .checkbox-label::before { border-color: var(--color-hondros-sec-medium-gray); } fieldset { border: none; margin: 0; padding: 0; } .toggle-input { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; visibility: visible; white-space: nowrap; } .toggle-input-label { color: var(--color-hondros-sec-black); font-size: 0.85rem; display: flex; flex-direction: column; align-items: flex-start; cursor: pointer; } .toggle-switch { position: relative; display: flex; align-items: center; width: 3rem; height: 1.5rem; margin: .5rem 0; cursor: pointer; } .toggle-switch::after, .toggle-switch::before { box-sizing: border-box; position: absolute; display: block; content: ""; } .toggle-switch::before { top: 0; width: 3rem; height: 1.5rem; border-radius: .9375rem; background-color: var(--color-hondros-sec-dark-gray); will-change: box-shadow; box-shadow: 0 0 0 1px transparent,0 0 0 3px transparent; -webkit-transition: box-shadow 70ms cubic-bezier(.2,0,1,.9),background-color 70ms cubic-bezier(.2,0,1,.9); transition: box-shadow 70ms cubic-bezier(.2,0,1,.9),background-color 70ms cubic-bezier(.2,0,1,.9); } .toggle-text--off, .toggle-text--on { position: absolute; font-size: 1rem; margin-left: 3.5rem; -webkit-user-select: none; -ms-user-select: none; user-select: none; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .toggle-input:checked + .toggle-input-label > .toggle-switch > .toggle-text--off, .toggle-input:not(:checked) + .toggle-input-label > .toggle-switch > .toggle-text--on { visibility: hidden; } .toggle-text--off, .toggle-text--on { position: absolute; margin-left: 3.5rem; -webkit-user-select: none; -ms-user-select: none; user-select: none; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .toggle-switch::after { top: .1875rem; left: .1875rem; width: 1.125rem; height: 1.125rem; border-radius: 50%; background-color: var(--color-hondros-sec-white); -webkit-transition: -webkit-transform 70ms cubic-bezier(.2,0,1,.9); transition: -webkit-transform 70ms cubic-bezier(.2,0,1,.9); transition: transform 70ms cubic-bezier(.2,0,1,.9); transition: transform 70ms cubic-bezier(.2,0,1,.9),-webkit-transform 70ms cubic-bezier(.2,0,1,.9); } .toggle-switch::after, .toggle-switch::before { box-sizing: border-box; position: absolute; display: block; content: ""; } .toggle-input:checked + .toggle-input-label > .toggle-switch::before { background-color: var(--color-pri-green); } .toggle-input:checked + .toggle-input-label > .toggle-switch::after { background-color: var(--color-hondros-sec-white); -webkit-transform: translateX(1.5rem); transform: translateX(1.5rem); } .form-item-group { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; } .form-item { display: flex; flex-direction: column; flex: 1 1 auto; align-items: flex-start; margin-bottom: 0.5rem; } .oneField { position: relative; display: block; width: 100%; } .inputWrapper { display: block; margin-bottom: 0.5rem; } .form-item-group > .form-item { flex: 0 0 49%; } .text-input-field-wrapper, .text-area-wrapper { position: relative; display: flex; align-items: center; width: 100%; } .form-requirement { color: #990f04; background-color: #fcd8d5; width: 100%; padding: 0 0.85rem; font-size: 0.85rem; font-family: inherit; font-weight: 400; line-height: 1.5; box-sizing: border-box; border: 0; margin: -0.5rem 0 0.5rem 0; max-height: 0; overflow: hidden; display: none; } .form-requirement.form-req-active { max-height: none; overflow: visible; display: block; } .errMsg { color: #990f04; background-color: #fcd8d5; width: 100%; padding: 0 0.85rem; font-size: 0.85rem; font-family: inherit; font-weight: 400; line-height: 1.5; box-sizing: border-box; border: 0; vertical-align: baseline; margin: -0.5rem 0 0.5rem 0; } .select-input-wrapper[data-invalid] ~ .form-requirement, .text-area-wrapper[data-invalid] ~ .form-requirement, .text-input-field-wrapper[data-invalid] ~ .form-requirement, .time-picker[data-invalid] ~ .form-requirement, input[data-invalid] ~ .form-requirement { max-height: 12.5rem; display: block; overflow: visible; color: red; } .hero-rfi-form .label { color: var(--color-hondros-sec-white); } .hero-rfi-form a { color: var(--color-hondros-sec-white); text-decoration: underline; } .hero-rfi-form #lp5_apply_rfi { text-decoration: none; } .rfi-apply { display: block; color: var(--color-hondros-sec-dark-gray); font-size: 1.2rem; font-family: var(--font-bold); font-weight: normal; text-transform: capitalize; line-height: 1.125; } .hero-rfi-form .rfi-apply { color: var(--color-hondros-sec-white); } #mktFrmSubmit { margin-top: 1rem; } .hero-rfi-form #mktFrmSubmit { margin-top: 0; } @media only screen and (max-width:500px) { .form-item-group { flex-wrap: wrap; } .form-item-group > .form-item { flex: 1 1 100%; } } .form-controls { margin-top: 1.65rem; display: flex; flex-flow: row nowrap; justify-content: flex-start; } .cards > div { display: flex; flex-flow: row nowrap; } .card { width: 100%; font-family: var(--font); font-weight: normal; line-height: 1; text-align: center; padding: 1rem; } .card-icon { width: 8rem; height: 8rem; background: var(--color-brand-aqua-blue); border-radius: 100%; font-size: 4rem; line-height: 8rem; text-align: center; color: #343a40; transition: ease-in-out .2s; overflow: hidden; position: relative; z-index: 2; display: inline-block; } .card:hover { background-color: #e9ecef; } .card:hover .card-icon { color: #e1e000; } .card-icon svg { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; height: 4rem; width: 4rem; fill: currentColor; } .card .card-icon-stage { display: block; position: relative; margin: auto; margin: 0 auto 1rem 0; } .card .card-title { font-family: var(--font-bold); text-transform: none; color: #343a40; font-size: 1.6rem; margin-top: .5rem; clear: both; display: inline-block; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: transparent; transition: ease-in-out .2s; padding-bottom: .25rem; max-width: 100%; text-overflow: ellipsis; overflow: hidden; } .card:hover .card-title { } .card .card-desc { margin-top: 0.5rem; } .card .card-desc p { margin-top: 0; line-height: 1.125rem; } .card .card-icon-stage .card-icon::after { transition: inherit; content: ""; display: block; position: absolute; background-color: var(--color-brand-royal-blue); height: 160%; width: 160%; top: -100%; left: -150%; border-radius: 100%; z-index: -1; } .card:hover .card-icon::after { top: -30%; left: -30%; } .regDeadline.text { position: relative; } .regDeadline #deadline { margin-left: 2rem; } .regDeadline .cta { margin-top: 2rem; } .regDeadline.text span { font-family: var(--font-bold); font-weight: normal; } .regDeadline.text::before { content: ' '; display: block; background: url(/common/images/icons/alarmclock.svg) no-repeat; background-size: contain; height: 1.5em; width: 1.5em; float: left; position: absolute; top: 5%; left: 0; } #digiClock { display: flex; justify-content: center; margin: 1rem auto; } #digiClock > span { font-size: 2.25rem; font-family: var(--font-bold); font-weight: normal; text-align: center; text-transform: uppercase; padding: 0; flex: 0 1 100px; } #digiClock span > span { display: block; font-size: 3.2rem; font-family: var(--font); font-weight: normal; } @media screen and (max-width: 900px) { #digiClock > span { font-size: 2rem; } } @media screen and (max-width: 600px) { #digiClock > span { font-size: 1.5rem; flex: 0 1 60px; font-family: var(--font); font-weight: normal; } #digiClock span > span { font-size: 2rem; } } .next-steps { font-size: 3rem; } .cta { max-width: 600px; margin: 0 auto; } .cta a { width: calc(50% - 0.5rem); } .cta a:first-child { margin-right: 1rem; } @media only screen and (min-width: 100px) and (max-width: 599px) { .cta { max-width: 300px; margin: 0 auto; } .cta a { width: 100%; } .cta a:first-child { margin-right: 0; margin-bottom: 1rem; } } @media only screen and (min-width: 600px) and (max-width: 799px) { .cta a { width: calc(50% - 0.5rem); } } @media only screen and (min-width: 500px) { .cta-list li span { display: block; } } @media only screen and (max-width: 499px) { .cta-list { margin-top: 2rem; } .cta-list li p { margin: 0; } } .slick-slider { position: relative; display: block; background-color: var(--color-brand-royal-blue); padding: 0 1rem; margin-top: 4rem; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; top: -3rem; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slider-default.slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } .slider .slick-slide { border: 2px solid transparent; } .slider .slick-slide:focus { border: 2px dashed var(--color-hondros-sec-black); } .slider.slick-initialized .slick-dots { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; order: -1; padding: 0; margin-right: 1rem; z-index: 100; } .slider.slick-initialized .slick-dots li { padding: 0; margin: 0 3px; } .slider.slick-initialized .slick-dots li button { min-width: auto; margin: 0; padding: 0.5rem 0.75rem; color: var(--color-hondros-sec-white); background-color: var(--color-hondros-sec-white); opacity: 0.5; cursor: pointer; } .slider.invert.slick-initialized .slick-dots li button { color: var(--color-hondros-sec-black); } .slider.slick-initialized .slick-dots li.slick-active button, .slider.slick-initialized .slick-dots li button:hover { opacity: 1; } .slider.slick-initialized .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 0.75rem; height: 0.75rem; padding: 0; border: 0; border-radius: 1rem; outline: none; } .slider .slide-quote { display: block; } .slider .slide-quote .slide-image { max-width: 380px; } .slider .slide-quote .slide-content { padding: 2rem 0; } @media only screen and (min-width: 768px) { .slider .slide-quote { display: flex; align-items: center; justify-content: center; } .slider .slide-quote .slide-image { order: 2; align-self: flex-start; flex: 0 0 33%; margin-bottom: -2rem; padding: 0 2rem 2rem 0; box-sizing: content-box; max-width: 33%; } .slider .slide-quote .slide-content { flex: 0 0 66%; padding: 7rem 2rem 2rem 2rem; } } .slider .slide-quote .slide-quote-text { color: var(--color-hondros-sec-white); font-size: 1.5rem; line-height: 1.5; max-width: 900px; } @media only screen and (min-width: 1600px) { .slider .slide-quote .slide-quote-text { font-size: 1.75rem; line-height: 1.75; max-width: 1060px; } } .slider .slide-quote-text::after, .slider .slide-quote-text::before { font-family: "Avenir",sans-serif; font-weight: 700; } .slider .slide-quote-text::before { content: open-quote; } .slider .slide-quote-text::after { content: close-quote; } .slider .slide-quote-text::after, .slider .slide-quote-text::before { color: #e1e000; } .slider .slide-quote .slide-quote-citation { display: flex; color: var(--color-hondros-sec-white); margin-top: 2rem; width: 70%; } @media only screen and (min-width: 900px) { .slider .slide-quote .slide-quote-citation { margin-top: 4rem; padding-right: 1rem; } } .slider .slide-quote .slide-quote-citation .slide-author { font-family: var(--font-bold); } .slider .slide-quote .slide-quote-citation .slide-author-subtext { border-left: solid 1px #fff; margin-left: 1rem; padding-left: 1rem; } .slider .slide-quotes-controls { display: flex; justify-content: flex-end; min-width: calc(220px + 4rem); max-width: calc(300px + 4rem); padding: 2rem; margin-left: auto; color: var(--color-hondros-sec-white); } .slider .slick-arrows { display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between; min-width: 120px; } .slider .slider-link { display: inline-block; height: 2.25rem; width: 2.25rem; border-radius: 50%; background-color: #e1e000; position: relative; border: 2px solid #e1e000; transition: all .2s ease-in-out; } .slider .slider-link:hover { background-color: #aead00; } .slider .slider-link:focus { outline: 0; border: 2px solid #343a40; box-shadow: 0 0 0 4px rgba(255,255,255,.8); } .slider .slider-link .prev-icon { display: block; position: absolute; height: 1.25rem; width: 1.25rem; top: 0; right: 0; bottom: 0; left: 0; margin: auto; } .slider .slider-link svg { height: 100%; width: 100%; vertical-align: baseline; } .slick-sr-only, .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; } .slick-autoplay-toggle-button { position:absolute; z-index:10; opacity:.75; background:0 0; border:0; cursor:pointer; color:#000; bottom: 0; left: 0; padding: 2rem; } .slick-autoplay-toggle-button .slick-pause-icon:before { content:"\f04c"; width:20px; height:20px; font-family:"FontAwesome"; font-size:18px; font-weight:400; line-height:20px; text-align:center } .slick-autoplay-toggle-button .slick-play-icon:before { content:"\f04b"; width:20px; height:20px; font-family:"FontAwesome"; font-size:18px; font-weight:400; line-height:20px; text-align:center } .slider-campus { padding: 0; } .slider-campus .slick-list { top: 0; } .image-panel { padding: 0; } .image-panel.flex { margin-left: 0; width: 100%; } .image-panel > .panel-image { display: flex; padding: 0; } .image-panel > .panel-image img { object-fit: cover; } main .image-panel .panel-content { position: relative; padding: 2rem 1rem; margin: 0 auto; overflow: visible; background-color: transparent; } @media only screen and (min-width: 620px) { main .image-panel .panel-content { position: relative; padding: 4rem 2rem; margin: 0 auto; overflow: visible; background-color: transparent; } } @media only screen and (min-width: 960px) { main .image-panel .panel-content { position: relative; padding: 8rem 4rem; margin: 0 auto; overflow: visible; background-color: transparent; } } @media only screen and (min-width: 1500px) { main .image-panel .panel-content { position: relative; padding: 12rem 6rem; margin: 0 auto; overflow: visible; background-color: transparent; } } @media only screen and (min-width: 2100px) { main .image-panel .panel-content { position: relative; padding: 16rem 8rem; margin: 0 auto; overflow: visible; background-color: transparent; } } .fast-fact p { margin-top: 0px; margin-bottom: 0px; } .fact-number { font-weight: 900; font-size: 120px; font-family: var(--font-bold); color: var(--color-brand-royal-blue); line-height: 0.9; margin-bottom: 0px; } .fact-number span { font-size: 70px; font-family: var(--font-bold); color: var(--color-brand-royal-blue); } .fast-fact h3 { margin-bottom: 0px; margin-top: 0px; } @media (max-width: 800px) { .fact-number { font-size: 80px; } } .campus-flex { display: flex; flex-flow: column; } .campus-flex .campus-content { color: var(--color-hondros-sec-white); background-color: var(--color-brand-royal-blue); padding: 1rem; flex: 1 auto; order: 2; } .campus-flex .campus-media { flex: 1 auto; order: 1; } @media only screen and (min-width: 620px) { .campus-flex .campus-content { padding: 2rem; } } @media only screen and (min-width: 1090px) { .campus-flex { flex-flow: row nowrap; } .campus-flex .campus-content { padding: 3rem; flex: 1 1 33%; order: 0; } .campus-flex .campus-media { flex: 1 1 66%; } } @media only screen and (min-width: 1500px) { .campus-flex .campus-content { padding: 4rem; } } @media only screen and (min-width: 2100px) { .campus-flex .campus-content { padding: 5rem; } } body, .layout { display: table; width: 100%; margin: 0 auto; } body > header, .layout > header { display: table-row; width: 100%; vertical-align: top; } body > .main, .layout > .main { display: table-row; width: 100%; vertical-align: top; } body > footer, .layout > footer { display: table-row; width: 100%; vertical-align: top; } body > .banner, .layout > .banner { display: table-row; vertical-align: top; } body, .layout { display: grid; grid-template-columns: 100%; grid-template-rows: auto; grid-template-areas: "header" "banner" "main" "footer" ; } body > header, .layout > header { grid-area: header; } body > .banner, .layout > .banner { grid-area: banner; } body > .main, .layout > .main { grid-area: main; } body > footer, .layout > footer { grid-area: footer; } .flex { display: -ms-flexbox; display: flex; margin-top: 0; margin-bottom: 0; margin-left: -2em; width: calc(100% + 2em); flex-wrap: wrap; transition: all .3s ease; } .flex>* { box-sizing: border-box; flex: 1 1 auto; padding-left: 2em; padding-bottom: 1em; } _:-ms-fullscreen, :root .flex>* { flex-basis: calc(50% - 2em); } .flex[class*="one"]>*, .flex[class*="two"]>*, .flex[class*="three"]>*, .flex[class*="four"]>*, .flex[class*="five"]>*, .flex[class*="six"]>*, .flex[class*="seven"]>*, .flex[class*="eight"]>*, .flex[class*="nine"]>*, .flex[class*="ten"]>*, .flex[class*="eleven"]>*, .flex[class*="twelve"]>* { flex-grow: 0 } .flex.grow>* { flex-grow: 1 } .center { justify-content: center } .one>* { width: 100% } .two>* { width: 50% } .three>* { width: 33.33333% } .four>* { width: 25% } .five>* { width: 20% } .six>* { width: 16.66666% } .seven>* { width: 14.28571% } .eight>* { width: 12.5% } .nine>* { width: 11.11111% } .ten>* { width: 10% } .eleven>* { width: 9.09091% } .twelve>* { width: 8.33333% } @media all and (min-width: 500px) { .one-500>* { width: 100% } .two-500>* { width: 50% } .three-500>* { width: 33.33333% } .four-500>* { width: 25% } .five-500>* { width: 20% } .six-500>* { width: 16.66666% } .seven-500>* { width: 14.28571% } .eight-500>* { width: 12.5% } .nine-500>* { width: 11.11111% } .ten-500>* { width: 10% } .eleven-500>* { width: 9.09091% } .twelve-500>* { width: 8.33333% } } @media all and (min-width: 600px) { .one-600>* { width: 100% } .two-600>* { width: 50% } .three-600>* { width: 33.33333% } .four-600>* { width: 25% } .five-600>* { width: 20% } .six-600>* { width: 16.66666% } .seven-600>* { width: 14.28571% } .eight-600>* { width: 12.5% } .nine-600>* { width: 11.11111% } .ten-600>* { width: 10% } .eleven-600>* { width: 9.09091% } .twelve-600>* { width: 8.33333% } } @media all and (min-width: 700px) { .one-700>* { width: 100% } .two-700>* { width: 50% } .three-700>* { width: 33.33333% } .four-700>* { width: 25% } .five-700>* { width: 20% } .six-700>* { width: 16.66666% } .seven-700>* { width: 14.28571% } .eight-700>* { width: 12.5% } .nine-700>* { width: 11.11111% } .ten-700>* { width: 10% } .eleven-700>* { width: 9.09091% } .twelve-700>* { width: 8.33333% } } @media all and (min-width: 800px) { .one-800>* { width: 100% } .two-800>* { width: 50% } .three-800>* { width: 33.33333% } .four-800>* { width: 25% } .five-800>* { width: 20% } .six-800>* { width: 16.66666% } .seven-800>* { width: 14.28571% } .eight-800>* { width: 12.5% } .nine-800>* { width: 11.11111% } .ten-800>* { width: 10% } .eleven-800>* { width: 9.09091% } .twelve-800>* { width: 8.33333% } } @media all and (min-width: 900px) { .one-900>* { width: 100% } .two-900>* { width: 50% } .three-900>* { width: 33.33333% } .four-900>* { width: 25% } .five-900>* { width: 20% } .six-900>* { width: 16.66666% } .seven-900>* { width: 14.28571% } .eight-900>* { width: 12.5% } .nine-900>* { width: 11.11111% } .ten-900>* { width: 10% } .eleven-900>* { width: 9.09091% } .twelve-900>* { width: 8.33333% } } @media all and (min-width: 1000px) { .one-1000>* { width: 100% } .two-1000>* { width: 50% } .three-1000>* { width: 33.33333% } .four-1000>* { width: 25% } .five-1000>* { width: 20% } .six-1000>* { width: 16.66666% } .seven-1000>* { width: 14.28571% } .eight-1000>* { width: 12.5% } .nine-1000>* { width: 11.11111% } .ten-1000>* { width: 10% } .eleven-1000>* { width: 9.09091% } .twelve-1000>* { width: 8.33333% } } @media all and (min-width: 1100px) { .one-1100>* { width: 100% } .two-1100>* { width: 50% } .three-1100>* { width: 33.33333% } .four-1100>* { width: 25% } .five-1100>* { width: 20% } .six-1100>* { width: 16.66666% } .seven-1100>* { width: 14.28571% } .eight-1100>* { width: 12.5% } .nine-1100>* { width: 11.11111% } .ten-1100>* { width: 10% } .eleven-1100>* { width: 9.09091% } .twelve-1100>* { width: 8.33333% } } @media all and (min-width: 1200px) { .one-1200>* { width: 100% } .two-1200>* { width: 50% } .three-1200>* { width: 33.33333% } .four-1200>* { width: 25% } .five-1200>* { width: 20% } .six-1200>* { width: 16.66666% } .seven-1200>* { width: 14.28571% } .eight-1200>* { width: 12.5% } .nine-1200>* { width: 11.11111% } .ten-1200>* { width: 10% } .eleven-1200>* { width: 9.09091% } .twelve-1200>* { width: 8.33333% } } @media all and (min-width: 1300px) { .one-1300>* { width: 100% } .two-1300>* { width: 50% } .three-1300>* { width: 33.33333% } .four-1300>* { width: 25% } .five-1300>* { width: 20% } .six-1300>* { width: 16.66666% } .seven-1300>* { width: 14.28571% } .eight-1300>* { width: 12.5% } .nine-1300>* { width: 11.11111% } .ten-1300>* { width: 10% } .eleven-1300>* { width: 9.09091% } .twelve-1300>* { width: 8.33333% } } @media all and (min-width: 1400px) { .one-1400>* { width: 100% } .two-1400>* { width: 50% } .three-1400>* { width: 33.33333% } .four-1400>* { width: 25% } .five-1400>* { width: 20% } .six-1400>* { width: 16.66666% } .seven-1400>* { width: 14.28571% } .eight-1400>* { width: 12.5% } .nine-1400>* { width: 11.11111% } .ten-1400>* { width: 10% } .eleven-1400>* { width: 9.09091% } .twelve-1400>* { width: 8.33333% } } @media all and (min-width: 1500px) { .one-1500>* { width: 100% } .two-1500>* { width: 50% } .three-1500>* { width: 33.33333% } .four-1500>* { width: 25% } .five-1500>* { width: 20% } .six-1500>* { width: 16.66666% } .seven-1500>* { width: 14.28571% } .eight-1500>* { width: 12.5% } .nine-1500>* { width: 11.11111% } .ten-1500>* { width: 10% } .eleven-1500>* { width: 9.09091% } .twelve-1500>* { width: 8.33333% } } @media all and (min-width: 1600px) { .one-1600>* { width: 100% } .two-1600>* { width: 50% } .three-1600>* { width: 33.33333% } .four-1600>* { width: 25% } .five-1600>* { width: 20% } .six-1600>* { width: 16.66666% } .seven-1600>* { width: 14.28571% } .eight-1600>* { width: 12.5% } .nine-1600>* { width: 11.11111% } .ten-1600>* { width: 10% } .eleven-1600>* { width: 9.09091% } .twelve-1600>* { width: 8.33333% } } @media all and (min-width: 1700px) { .one-1700>* { width: 100% } .two-1700>* { width: 50% } .three-1700>* { width: 33.33333% } .four-1700>* { width: 25% } .five-1700>* { width: 20% } .six-1700>* { width: 16.66666% } .seven-1700>* { width: 14.28571% } .eight-1700>* { width: 12.5% } .nine-1700>* { width: 11.11111% } .ten-1700>* { width: 10% } .eleven-1700>* { width: 9.09091% } .twelve-1700>* { width: 8.33333% } } @media all and (min-width: 1800px) { .one-1800>* { width: 100% } .two-1800>* { width: 50% } .three-1800>* { width: 33.33333% } .four-1800>* { width: 25% } .five-1800>* { width: 20% } .six-1800>* { width: 16.66666% } .seven-1800>* { width: 14.28571% } .eight-1800>* { width: 12.5% } .nine-1800>* { width: 11.11111% } .ten-1800>* { width: 10% } .eleven-1800>* { width: 9.09091% } .twelve-1800>* { width: 8.33333% } } @media all and (min-width: 1900px) { .one-1900>* { width: 100% } .two-1900>* { width: 50% } .three-1900>* { width: 33.33333% } .four-1900>* { width: 25% } .five-1900>* { width: 20% } .six-1900>* { width: 16.66666% } .seven-1900>* { width: 14.28571% } .eight-1900>* { width: 12.5% } .nine-1900>* { width: 11.11111% } .ten-1900>* { width: 10% } .eleven-1900>* { width: 9.09091% } .twelve-1900>* { width: 8.33333% } } @media all and (min-width: 2000px) { .one-2000>* { width: 100% } .two-2000>* { width: 50% } .three-2000>* { width: 33.33333% } .four-2000>* { width: 25% } .five-2000>* { width: 20% } .six-2000>* { width: 16.66666% } .seven-2000>* { width: 14.28571% } .eight-2000>* { width: 12.5% } .nine-2000>* { width: 11.11111% } .ten-2000>* { width: 10% } .eleven-2000>* { width: 9.09091% } .twelve-2000>* { width: 8.33333% } } .full { width: 100% } .half { width: 50% } .third { width: 33.33333% } .two-third { width: 66.66666% } .fourth { width: 25% } .three-fourth { width: 75% } .fifth { width: 20% } .two-fifth { width: 40% } .three-fifth { width: 60% } .four-fifth { width: 80% } .sixth { width: 16.66666% } .none { display: none } @media all and (min-width: 500px) { .full-500 { width: 100%; display: block } .half-500 { width: 50%; display: block } .third-500 { width: 33.33333%; display: block } .two-third-500 { width: 66.66666%; display: block } .fourth-500 { width: 25%; display: block } .three-fourth-500 { width: 75%; display: block } .fifth-500 { width: 20%; display: block } .two-fifth-500 { width: 40%; display: block } .three-fifth-500 { width: 60%; display: block } .four-fifth-500 { width: 80%; display: block } .sixth-500 { width: 16.66666%; display: block } } @media all and (min-width: 600px) { .full-600 { width: 100%; display: block } .half-600 { width: 50%; display: block } .third-600 { width: 33.33333%; display: block } .two-third-600 { width: 66.66666%; display: block } .fourth-600 { width: 25%; display: block } .three-fourth-600 { width: 75%; display: block } .fifth-600 { width: 20%; display: block } .two-fifth-600 { width: 40%; display: block } .three-fifth-600 { width: 60%; display: block } .four-fifth-600 { width: 80%; display: block } .sixth-600 { width: 16.66666%; display: block } } @media all and (min-width: 700px) { .full-700 { width: 100%; display: block } .half-700 { width: 50%; display: block } .third-700 { width: 33.33333%; display: block } .two-third-700 { width: 66.66666%; display: block } .fourth-700 { width: 25%; display: block } .three-fourth-700 { width: 75%; display: block } .fifth-700 { width: 20%; display: block } .two-fifth-700 { width: 40%; display: block } .three-fifth-700 { width: 60%; display: block } .four-fifth-700 { width: 80%; display: block } .sixth-700 { width: 16.66666%; display: block } } @media all and (min-width: 800px) { .full-800 { width: 100%; display: block } .half-800 { width: 50%; display: block } .third-800 { width: 33.33333%; display: block } .two-third-800 { width: 66.66666%; display: block } .fourth-800 { width: 25%; display: block } .three-fourth-800 { width: 75%; display: block } .fifth-800 { width: 20%; display: block } .two-fifth-800 { width: 40%; display: block } .three-fifth-800 { width: 60%; display: block } .four-fifth-800 { width: 80%; display: block } .sixth-800 { width: 16.66666%; display: block } } @media all and (min-width: 900px) { .full-900 { width: 100%; display: block } .half-900 { width: 50%; display: block } .third-900 { width: 33.33333%; display: block } .two-third-900 { width: 66.66666%; display: block } .fourth-900 { width: 25%; display: block } .three-fourth-900 { width: 75%; display: block } .fifth-900 { width: 20%; display: block } .two-fifth-900 { width: 40%; display: block } .three-fifth-900 { width: 60%; display: block } .four-fifth-900 { width: 80%; display: block } .sixth-900 { width: 16.66666%; display: block } } @media all and (min-width: 1000px) { .full-1000 { width: 100%; display: block } .half-1000 { width: 50%; display: block } .third-1000 { width: 33.33333%; display: block } .two-third-1000 { width: 66.66666%; display: block } .fourth-1000 { width: 25%; display: block } .three-fourth-1000 { width: 75%; display: block } .fifth-1000 { width: 20%; display: block } .two-fifth-1000 { width: 40%; display: block } .three-fifth-1000 { width: 60%; display: block } .four-fifth-1000 { width: 80%; display: block } .sixth-1000 { width: 16.66666%; display: block } } @media all and (min-width: 1100px) { .full-1100 { width: 100%; display: block } .half-1100 { width: 50%; display: block } .third-1100 { width: 33.33333%; display: block } .two-third-1100 { width: 66.66666%; display: block } .fourth-1100 { width: 25%; display: block } .three-fourth-1100 { width: 75%; display: block } .fifth-1100 { width: 20%; display: block } .two-fifth-1100 { width: 40%; display: block } .three-fifth-1100 { width: 60%; display: block } .four-fifth-1100 { width: 80%; display: block } .sixth-1100 { width: 16.66666%; display: block } } @media all and (min-width: 1200px) { .full-1200 { width: 100%; display: block } .half-1200 { width: 50%; display: block } .third-1200 { width: 33.33333%; display: block } .two-third-1200 { width: 66.66666%; display: block } .fourth-1200 { width: 25%; display: block } .three-fourth-1200 { width: 75%; display: block } .fifth-1200 { width: 20%; display: block } .two-fifth-1200 { width: 40%; display: block } .three-fifth-1200 { width: 60%; display: block } .four-fifth-1200 { width: 80%; display: block } .sixth-1200 { width: 16.66666%; display: block } } @media all and (min-width: 1300px) { .full-1300 { width: 100%; display: block } .half-1300 { width: 50%; display: block } .third-1300 { width: 33.33333%; display: block } .two-third-1300 { width: 66.66666%; display: block } .fourth-1300 { width: 25%; display: block } .three-fourth-1300 { width: 75%; display: block } .fifth-1300 { width: 20%; display: block } .two-fifth-1300 { width: 40%; display: block } .three-fifth-1300 { width: 60%; display: block } .four-fifth-1300 { width: 80%; display: block } .sixth-1300 { width: 16.66666%; display: block } } @media all and (min-width: 1400px) { .full-1400 { width: 100%; display: block } .half-1400 { width: 50%; display: block } .third-1400 { width: 33.33333%; display: block } .two-third-1400 { width: 66.66666%; display: block } .fourth-1400 { width: 25%; display: block } .three-fourth-1400 { width: 75%; display: block } .fifth-1400 { width: 20%; display: block } .two-fifth-1400 { width: 40%; display: block } .three-fifth-1400 { width: 60%; display: block } .four-fifth-1400 { width: 80%; display: block } .sixth-1400 { width: 16.66666%; display: block } } @media all and (min-width: 1500px) { .full-1500 { width: 100%; display: block } .half-1500 { width: 50%; display: block } .third-1500 { width: 33.33333%; display: block } .two-third-1500 { width: 66.66666%; display: block } .fourth-1500 { width: 25%; display: block } .three-fourth-1500 { width: 75%; display: block } .fifth-1500 { width: 20%; display: block } .two-fifth-1500 { width: 40%; display: block } .three-fifth-1500 { width: 60%; display: block } .four-fifth-1500 { width: 80%; display: block } .sixth-1500 { width: 16.66666%; display: block } } @media all and (min-width: 1600px) { .full-1600 { width: 100%; display: block } .half-1600 { width: 50%; display: block } .third-1600 { width: 33.33333%; display: block } .two-third-1600 { width: 66.66666%; display: block } .fourth-1600 { width: 25%; display: block } .three-fourth-1600 { width: 75%; display: block } .fifth-1600 { width: 20%; display: block } .two-fifth-1600 { width: 40%; display: block } .three-fifth-1600 { width: 60%; display: block } .four-fifth-1600 { width: 80%; display: block } .sixth-1600 { width: 16.66666%; display: block } } @media all and (min-width: 1700px) { .full-1700 { width: 100%; display: block } .half-1700 { width: 50%; display: block } .third-1700 { width: 33.33333%; display: block } .two-third-1700 { width: 66.66666%; display: block } .fourth-1700 { width: 25%; display: block } .three-fourth-1700 { width: 75%; display: block } .fifth-1700 { width: 20%; display: block } .two-fifth-1700 { width: 40%; display: block } .three-fifth-1700 { width: 60%; display: block } .four-fifth-1700 { width: 80%; display: block } .sixth-1700 { width: 16.66666%; display: block } } @media all and (min-width: 1800px) { .full-1800 { width: 100%; display: block } .half-1800 { width: 50%; display: block } .third-1800 { width: 33.33333%; display: block } .two-third-1800 { width: 66.66666%; display: block } .fourth-1800 { width: 25%; display: block } .three-fourth-1800 { width: 75%; display: block } .fifth-1800 { width: 20%; display: block } .two-fifth-1800 { width: 40%; display: block } .three-fifth-1800 { width: 60%; display: block } .four-fifth-1800 { width: 80%; display: block } .sixth-1800 { width: 16.66666%; display: block } } @media all and (min-width: 1900px) { .full-1900 { width: 100%; display: block } .half-1900 { width: 50%; display: block } .third-1900 { width: 33.33333%; display: block } .two-third-1900 { width: 66.66666%; display: block } .fourth-1900 { width: 25%; display: block } .three-fourth-1900 { width: 75%; display: block } .fifth-1900 { width: 20%; display: block } .two-fifth-1900 { width: 40%; display: block } .three-fifth-1900 { width: 60%; display: block } .four-fifth-1900 { width: 80%; display: block } .sixth-1900 { width: 16.66666%; display: block } } @media all and (min-width: 2000px) { .full-2000 { width: 100%; display: block } .half-2000 { width: 50%; display: block } .third-2000 { width: 33.33333%; display: block } .two-third-2000 { width: 66.66666%; display: block } .fourth-2000 { width: 25%; display: block } .three-fourth-2000 { width: 75%; display: block } .fifth-2000 { width: 20%; display: block } .two-fifth-2000 { width: 40%; display: block } .three-fifth-2000 { width: 60%; display: block } .four-fifth-2000 { width: 80%; display: block } .sixth-2000 { width: 16.66666%; display: block } } @media all and (min-width: 500px) { .none-500 { display: none } } @media all and (min-width: 600px) { .none-600 { display: none } } @media all and (min-width: 700px) { .none-700 { display: none } } @media all and (min-width: 800px) { .none-800 { display: none } } @media all and (min-width: 900px) { .none-900 { display: none } } @media all and (min-width: 1000px) { .none-1000 { display: none } } @media all and (min-width: 1100px) { .none-1100 { display: none } } @media all and (min-width: 1200px) { .none-1200 { display: none } } @media all and (min-width: 1300px) { .none-1300 { display: none } } @media all and (min-width: 1400px) { .none-1400 { display: none } } @media all and (min-width: 1500px) { .none-1500 { display: none } } @media all and (min-width: 1600px) { .none-1600 { display: none } } @media all and (min-width: 1700px) { .none-1700 { display: none } } @media all and (min-width: 1800px) { .none-1800 { display: none } } @media all and (min-width: 1900px) { .none-1900 { display: none } } @media all and (min-width: 2000px) { .none-2000 { display: none } } .off-none { margin-left: 0 } .off-half { margin-left: 50% } .off-third { margin-left: 33.33333% } .off-two-third { margin-left: 66.66666% } .off-fourth { margin-left: 25% } .off-three-fourth { margin-left: 75% } .off-fifth { margin-left: 20% } .off-two-fifth { margin-left: 40% } .off-three-fifth { margin-left: 60% } .off-four-fifth { margin-left: 80% } .off-sixth { margin-left: 16.66666% } @media all and (min-width: 500px) { .off-none-500 { margin-left: 0 } .off-half-500 { margin-left: 50% } .off-third-500 { margin-left: 33.33333% } .off-two-third-500 { margin-left: 66.66666% } .off-fourth-500 { margin-left: 25% } .off-three-fourth-500 { margin-left: 75% } .off-fifth-500 { margin-left: 20% } .off-two-fifth-500 { margin-left: 40% } .off-three-fifth-500 { margin-left: 60% } .off-four-fifth-500 { margin-left: 80% } .off-sixth-500 { margin-left: 16.66666% } } @media all and (min-width: 600px) { .off-none-600 { margin-left: 0 } .off-half-600 { margin-left: 50% } .off-third-600 { margin-left: 33.33333% } .off-two-third-600 { margin-left: 66.66666% } .off-fourth-600 { margin-left: 25% } .off-three-fourth-600 { margin-left: 75% } .off-fifth-600 { margin-left: 20% } .off-two-fifth-600 { margin-left: 40% } .off-three-fifth-600 { margin-left: 60% } .off-four-fifth-600 { margin-left: 80% } .off-sixth-600 { margin-left: 16.66666% } } @media all and (min-width: 700px) { .off-none-700 { margin-left: 0 } .off-half-700 { margin-left: 50% } .off-third-700 { margin-left: 33.33333% } .off-two-third-700 { margin-left: 66.66666% } .off-fourth-700 { margin-left: 25% } .off-three-fourth-700 { margin-left: 75% } .off-fifth-700 { margin-left: 20% } .off-two-fifth-700 { margin-left: 40% } .off-three-fifth-700 { margin-left: 60% } .off-four-fifth-700 { margin-left: 80% } .off-sixth-700 { margin-left: 16.66666% } } @media all and (min-width: 800px) { .off-none-800 { margin-left: 0 } .off-half-800 { margin-left: 50% } .off-third-800 { margin-left: 33.33333% } .off-two-third-800 { margin-left: 66.66666% } .off-fourth-800 { margin-left: 25% } .off-three-fourth-800 { margin-left: 75% } .off-fifth-800 { margin-left: 20% } .off-two-fifth-800 { margin-left: 40% } .off-three-fifth-800 { margin-left: 60% } .off-four-fifth-800 { margin-left: 80% } .off-sixth-800 { margin-left: 16.66666% } } @media all and (min-width: 900px) { .off-none-900 { margin-left: 0 } .off-half-900 { margin-left: 50% } .off-third-900 { margin-left: 33.33333% } .off-two-third-900 { margin-left: 66.66666% } .off-fourth-900 { margin-left: 25% } .off-three-fourth-900 { margin-left: 75% } .off-fifth-900 { margin-left: 20% } .off-two-fifth-900 { margin-left: 40% } .off-three-fifth-900 { margin-left: 60% } .off-four-fifth-900 { margin-left: 80% } .off-sixth-900 { margin-left: 16.66666% } } @media all and (min-width: 1000px) { .off-none-1000 { margin-left: 0 } .off-half-1000 { margin-left: 50% } .off-third-1000 { margin-left: 33.33333% } .off-two-third-1000 { margin-left: 66.66666% } .off-fourth-1000 { margin-left: 25% } .off-three-fourth-1000 { margin-left: 75% } .off-fifth-1000 { margin-left: 20% } .off-two-fifth-1000 { margin-left: 40% } .off-three-fifth-1000 { margin-left: 60% } .off-four-fifth-1000 { margin-left: 80% } .off-sixth-1000 { margin-left: 16.66666% } } @media all and (min-width: 1100px) { .off-none-1100 { margin-left: 0 } .off-half-1100 { margin-left: 50% } .off-third-1100 { margin-left: 33.33333% } .off-two-third-1100 { margin-left: 66.66666% } .off-fourth-1100 { margin-left: 25% } .off-three-fourth-1100 { margin-left: 75% } .off-fifth-1100 { margin-left: 20% } .off-two-fifth-1100 { margin-left: 40% } .off-three-fifth-1100 { margin-left: 60% } .off-four-fifth-1100 { margin-left: 80% } .off-sixth-1100 { margin-left: 16.66666% } } @media all and (min-width: 1200px) { .off-none-1200 { margin-left: 0 } .off-half-1200 { margin-left: 50% } .off-third-1200 { margin-left: 33.33333% } .off-two-third-1200 { margin-left: 66.66666% } .off-fourth-1200 { margin-left: 25% } .off-three-fourth-1200 { margin-left: 75% } .off-fifth-1200 { margin-left: 20% } .off-two-fifth-1200 { margin-left: 40% } .off-three-fifth-1200 { margin-left: 60% } .off-four-fifth-1200 { margin-left: 80% } .off-sixth-1200 { margin-left: 16.66666% } } @media all and (min-width: 1300px) { .off-none-1300 { margin-left: 0 } .off-half-1300 { margin-left: 50% } .off-third-1300 { margin-left: 33.33333% } .off-two-third-1300 { margin-left: 66.66666% } .off-fourth-1300 { margin-left: 25% } .off-three-fourth-1300 { margin-left: 75% } .off-fifth-1300 { margin-left: 20% } .off-two-fifth-1300 { margin-left: 40% } .off-three-fifth-1300 { margin-left: 60% } .off-four-fifth-1300 { margin-left: 80% } .off-sixth-1300 { margin-left: 16.66666% } } @media all and (min-width: 1400px) { .off-none-1400 { margin-left: 0 } .off-half-1400 { margin-left: 50% } .off-third-1400 { margin-left: 33.33333% } .off-two-third-1400 { margin-left: 66.66666% } .off-fourth-1400 { margin-left: 25% } .off-three-fourth-1400 { margin-left: 75% } .off-fifth-1400 { margin-left: 20% } .off-two-fifth-1400 { margin-left: 40% } .off-three-fifth-1400 { margin-left: 60% } .off-four-fifth-1400 { margin-left: 80% } .off-sixth-1400 { margin-left: 16.66666% } } @media all and (min-width: 1500px) { .off-none-1500 { margin-left: 0 } .off-half-1500 { margin-left: 50% } .off-third-1500 { margin-left: 33.33333% } .off-two-third-1500 { margin-left: 66.66666% } .off-fourth-1500 { margin-left: 25% } .off-three-fourth-1500 { margin-left: 75% } .off-fifth-1500 { margin-left: 20% } .off-two-fifth-1500 { margin-left: 40% } .off-three-fifth-1500 { margin-left: 60% } .off-four-fifth-1500 { margin-left: 80% } .off-sixth-1500 { margin-left: 16.66666% } } @media all and (min-width: 1600px) { .off-none-1600 { margin-left: 0 } .off-half-1600 { margin-left: 50% } .off-third-1600 { margin-left: 33.33333% } .off-two-third-1600 { margin-left: 66.66666% } .off-fourth-1600 { margin-left: 25% } .off-three-fourth-1600 { margin-left: 75% } .off-fifth-1600 { margin-left: 20% } .off-two-fifth-1600 { margin-left: 40% } .off-three-fifth-1600 { margin-left: 60% } .off-four-fifth-1600 { margin-left: 80% } .off-sixth-1600 { margin-left: 16.66666% } } @media all and (min-width: 1700px) { .off-none-1700 { margin-left: 0 } .off-half-1700 { margin-left: 50% } .off-third-1700 { margin-left: 33.33333% } .off-two-third-1700 { margin-left: 66.66666% } .off-fourth-1700 { margin-left: 25% } .off-three-fourth-1700 { margin-left: 75% } .off-fifth-1700 { margin-left: 20% } .off-two-fifth-1700 { margin-left: 40% } .off-three-fifth-1700 { margin-left: 60% } .off-four-fifth-1700 { margin-left: 80% } .off-sixth-1700 { margin-left: 16.66666% } } @media all and (min-width: 1800px) { .off-none-1800 { margin-left: 0 } .off-half-1800 { margin-left: 50% } .off-third-1800 { margin-left: 33.33333% } .off-two-third-1800 { margin-left: 66.66666% } .off-fourth-1800 { margin-left: 25% } .off-three-fourth-1800 { margin-left: 75% } .off-fifth-1800 { margin-left: 20% } .off-two-fifth-1800 { margin-left: 40% } .off-three-fifth-1800 { margin-left: 60% } .off-four-fifth-1800 { margin-left: 80% } .off-sixth-1800 { margin-left: 16.66666% } } @media all and (min-width: 1900px) { .off-none-1900 { margin-left: 0 } .off-half-1900 { margin-left: 50% } .off-third-1900 { margin-left: 33.33333% } .off-two-third-1900 { margin-left: 66.66666% } .off-fourth-1900 { margin-left: 25% } .off-three-fourth-1900 { margin-left: 75% } .off-fifth-1900 { margin-left: 20% } .off-two-fifth-1900 { margin-left: 40% } .off-three-fifth-1900 { margin-left: 60% } .off-four-fifth-1900 { margin-left: 80% } .off-sixth-1900 { margin-left: 16.66666% } } @media all and (min-width: 2000px) { .off-none-2000 { margin-left: 0 } .off-half-2000 { margin-left: 50% } .off-third-2000 { margin-left: 33.33333% } .off-two-third-2000 { margin-left: 66.66666% } .off-fourth-2000 { margin-left: 25% } .off-three-fourth-2000 { margin-left: 75% } .off-fifth-2000 { margin-left: 20% } .off-two-fifth-2000 { margin-left: 40% } .off-three-fifth-2000 { margin-left: 60% } .off-four-fifth-2000 { margin-left: 80% } .off-sixth-2000 { margin-left: 16.66666% } } article.content.no-sidebar { display: block; width: 100%; margin: 0 auto; max-width: 600px; float: none; } section.tagline.no-sidebar h2 { max-width: 600px; margin: 0 auto; } .rfi-off-canvas { position: absolute; left: -100%; top: 0; height: 100%; width: 100%; overflow-y: scroll; overflow-x: visible; -webkit-overflow-scrolling: touch; transition: left 0.5s ease; z-index: 99900000; } .rfi-off-canvas section { margin: 0 auto; padding: 2.5em; min-height: 100%; width: 100%; background-color: var(--color-brand-green); } .rfi-off-canvas .menu-close { background: #555; position: absolute; right: 1em; top: 1em; } .rfi-off-canvas .menu-close:hover, .rfi-off-canvas .menu-close:focus { background: #aaa; } .rfi-open { position: fixed; bottom: 0; left: 0; width: 100%; overflow: hidden; } .rfi-off-canvas:target, .rfi-off-canvas[aria-expanded="true"] { left: 0; outline: none; -moz-box-shadow: 3px 0 12px rgba(0,0,0,.25); -webkit-box-shadow: 3px 0 12px rgba(0,0,0,.25); box-shadow: 3px 0 12px rgba(0,0,0,.25); } .rfi-off-canvas:target .menu-close, .rfi-off-canvas[aria-expanded="true"] .menu-close { z-index: 1001; } .rfi-off-canvas:target section, .rfi-off-canvas[aria-expanded="true"] section { position: relative; z-index: 1000; } .rfi-off-canvas:target + .backdrop, .rfi-off-canvas[aria-expanded="true"] + .backdrop { position: absolute; display: block; content: ""; left: 0; top: 0; width: 100%; height: 100%; z-index: 998; cursor: default; } #off-canvas-rfi { display: flex; flex-direction: row; justify-content: space-around; } #rfi-info { color: #fff; flex-basis: 40%; flex-grow: 0; padding: 0 1em; } #rfi-info h2 { font-size: 2.75em; line-height: 1; } #rfi-info h3 { } #rfi-info a, #off-canvas-rfi #rfi a { color: #fff; text-decoration: underline; } #rfi-info a:active, #rfi-info a:hover, #rfi a:active, #rfi a:hover { opacity: 0.75; } #rfi { flex-basis: 60%; max-width: 700px; flex-grow: 0; margin: 0 auto; padding: 0 1em; color: var(--color-hondros-sec-white); } #rfi input[type="text"]:-moz-read-only { background-color: var(--color-rfi); color: var(--color-text); pointer-events: none; } #rfi input[type="text"]:read-only { background-color: var(--color-rfi); color: var(--color-text); pointer-events: none; } #rfi input[disabled], #rfi select[disabled] { background-color: var(--color-rfi); color: var(--color-text); pointer-events: none; } #rfi .mktInput.locked .mktFormMsg { display: none; background-color: #fff; padding: 20px 10px; margin: 0 1em; width: calc(100% - 2em); position: absolute; border-radius: 3px; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2); left: 0; color: #1E2021; font-size: 15px; line-height: 1; } #rfi .mktInput.locked:hover .mktFormMsg { display: block; } #rfi select, #rfi input { color: var(--color-text); border: 2px solid #fff; border-radius: 0; } #rfi select option { background-color: rgba(255, 255, 255, 1); color: var(--color-text); } #rfi .button-rfi input { border: 0; color: var(--color-hondros-sec-black); } #rfi select:hover, #rfi input:hover, #rfi select:focus, #rfi input:focus { color: var(--color-text); background-color: rgba(255, 255, 255, 1); } #rfi .mktLblLeft li:nth-child(1),#rfi .mktLblLeft li:nth-child(2),#rfi .mktLblLeft li:nth-child(3), #rfi .mktLblLeft li:nth-child(4), #rfi .mktLblLeft li:nth-child(6), #rfi .mktLblLeft li:nth-child(7), #rfi .mktLblLeft li:nth-child(8) { width: 50%; float: left; } #rfi .progressIndicator > * { background-color: #15342c; } #rfi .progressIndicator .active { background-color: white; } #rfi label { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; color: var(--color-hondros-sec-black); } .groupedInputs { display: flex; justify-content: space-between; } .groupedInputs .mktInput { flex-grow: 0; flex-shrink: 1; flex-basis: calc(50% - 5px); } #rfi-overlay-content { text-align: center; } .rfi-overlay-button { margin: 0; } @media only screen and (max-width:1160px) { #rfi-info { flex-basis: 50%; flex-direction: row; } #rfi-info h2 { font-size: 2em; line-height: 1; } } @media only screen and (max-width:900px) { section#off-canvas-rfi { flex-direction: column-reverse; } #rfi-info, #rfi { flex-basis: 100%; padding: 0; } } @media only screen and (max-width:767px) { #rfi .mktLblLeft li { float: none !important; width: 100% !important; } .groupedInputs { display: block; } } @media only screen and (max-width:500px) { .rfi-off-canvas section { padding: 1em; } #rfi { width: calc(100% - 2em); } } #off-canvas-rfi #rfi .wForm form > div.oneField { flex-basis: 48%; max-width: 48%; flex-grow: 0; flex-shrink: 1; } @media only screen and (max-width:600px) { #off-canvas-rfi #rfi .wForm form > div.oneField { flex-basis: 100%; max-width: 100%; flex-grow: 0; flex-shrink: 1; } } @supports (position: fixed) { .rfi-off-canvas, .rfi-off-canvas:target + .backdrop, .rfi-off-canvas[aria-expanded="true"] + .backdrop { position: fixed; } } .flex #rfi { flex-basis: 100%; max-width: 100%; width: 100%; flex-grow: 0; margin: 0; padding: 1em; } .flex #rfi label { } .flex #rfi .wFormFooter, .flex #rfi .supportInfo { display: none; } .flex #rfi .htmlContent { font-size: 0.8em; line-height: 1.25em; } #rfi .wForm form { display: flex; flex-flow: row wrap; justify-content: space-between; } #rfi .wForm form > div.oneField { flex-basis: 100%; max-width: 100%; flex-grow: 0; flex-shrink: 1; } #rfi .wForm { padding: 0; font-family: inherit; color: var(--color-hondros-sec-black); } #rfi .wForm .inputWrapper { display: block; } #rfi .wFormContainer .wFormTitle { padding: 0; font-weight: 400; } #rfi .wForm .oneField { padding: 0; } #rfi .wForm form > div.oneField { margin-top: 0; } #rfi .wForm select, #rfi .wForm input, #rfi .wForm input[type="text"], #rfi .wForm input[type="time"], #rfi .wForm input[type="number"], #rfi .wForm input[type="url"], #rfi .wForm input[type="email"], #rfi .wForm textarea { display: inline-block; text-decoration: none; -webkit-appearance: none; color: var(--color-hondros-sec-black); background-color: #fcfcfc; border: 1px solid var(--color-brand-gray); border-radius: 2px; width: 100%; text-align: left; margin-bottom: .5em; } #rfi input.validate-email { text-transform: none; } #rfi .wForm select:focus, #rfi .wForm input:focus { display: inline-block; text-decoration: none; -webkit-appearance: none; color: var(--color-hondros-sec-black); background-color: #fff; border: 1px solid var(--color-brand-gray); border-radius: 0; width: 100%; text-align: left; margin-bottom: .5em; } #rfi .wForm label.label { font-size: 90%; padding: 0; } #rfi .wForm .labelsAbove label.preField { padding-bottom: 4px; } #rfi .wForm label.preField { min-width: auto; padding-right: 5px; } div.actions { width: 100%; } #rfi .wForm input[type="submit"] { width: 100%; color: #fff; background-color: var(--color-brand-royal-blue); border-color: var(--color-brand-royal-blue); border-radius: 5rem; pointer-events: all; text-align: center; } #rfi .wForm input[type="submit"]:hover { color: #fff; background-color: var(--color-brand-royal-blue--light); border-color: var(--color-brand-royal-blue--light); } #rfi .wForm select option { background-color: rgba(255, 255, 255, 1); color: var(--color-hondros-sec-black); } #rfi .wForm button, #rfi .wForm input, #rfi .wForm select, #rfi .wForm input.primaryAction, #rfi .wForm input[type="text"], #rfi .wForm input[type="time"], #rfi .wForm input[type="number"], #rfi .wForm input[type="url"], #rfi .wForm input[type="email"], #rfi .wForm textarea { transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; padding: 0.75em; display: inline-block; font-size: 16px; } #rfi .wForm .inline div.oneField { width: 100%; } #rfi .wForm .htmlSection { border: none; padding: 0 0 0 2px; margin-bottom: 10px; } #rfi .wForm .actions { border: none; } #rfi .wForm input[type="submit"] { font-family: "Avenir-Black", sans-serif; font-size: 1em; } #rfi #tfa_93, #rfi #tfa_96, #rfi #tfa_97, #rfi #tfa_104 { display: none; } #rfi .wForm .reqMark::after { color: var(--color-hondros-sec-white); } .hero-viewport { display: flex; flex-direction: row; justify-content: space-between; width: 100vw ; height: auto; max-width:100%; min-height: 360px; margin: 80px 0 0 0; padding: 0; color: var(--color-hondros-sec-white); background-image: url(/common/images/banners/hero-graduation-2.jpg); background-position: center top; background-size: cover; background-repeat: no-repeat; } .hero-indianapolis { background-image: url(/common/images/banners/campus-indianapolis.jpg); } .hero-img-left { background-position: top left; } .hero-img-right { background-position: top right; } .hero-img-sepia { filter: sepia(90%); -webkit-filter: sepia(90%); } .hero-img-contrast { filter: contrast(150%); -webkit-filter: contrast(150%); } .hero-img-saturate { filter: saturate(200%); -webkit-filter: saturate(200%); } .hero-spacer { flex-basis: 1px; flex-grow: 1; flex-shrink: 1; padding: 0; } .hero-content { position: relative; flex-basis: 33.333%; flex-grow: 0; flex-shrink: 1; min-width: 400px; display: flex; flex-direction: column; justify-content: center; padding: 30px; overflow: auto; } .hero-content-no-padding { padding: 0; } .hero-content-full-height { flex-direction: row; } .hero-content-one-half { flex-basis: 50%; } .hero-content-two-third { flex-basis: 66.666%; } .hero-content-three-fourth { flex-basis: 75%; } .hero-content.hero-content-full { flex-basis: 100%; align-items: center; } .hero-content-align-center { text-align: center; } .hero-content-align-right { text-align: right; } .hero-justify-start { justify-content: flex-start; } .hero-justify-end { justify-content: flex-end; } .hero-left { order: -1; } .hero-right { order: 2; } .hero-header { background: transparent; color: var(--color-hondros-sec-white); padding: 30px; text-align: left; filter: blur(0); } .hero-header a { background-color: transparent; color: var(--color-hondros-sec-white); } .hero-header .hero-school a { background-color: transparent; color: var(--color-hondros-sec-white); font-size: 1.25rem; padding: 0 0 4px 0; } .hero-title { margin: 0; color: var(--color-hondros-sec-white); font-size: 2rem; line-height: 1; } .hero-title > span { margin: 0 0 1rem 0; line-height: 1; display: block; text-transform: capitalize; } .hero-title span.tooltip, .hero-title span.tooltip-parent { display: inline-block; } .hero-title span.degreeType, .hero-program span.degreeType { display: block; text-transform: uppercase; margin: 1rem 0 0 0; font-size: 1.2rem; font-family: var(--font); font-weight: normal; line-height: 1; } .hero-title + .button { margin-top: 1rem; } .hero-image { margin: 1rem auto; max-width: fit-content; } .hero-footer { padding: 0 30px 30px; } .hero-blur { backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); } .hero-sepia { backdrop-filter: sepia(90%); -webkit-backdrop-filter: sepia(90%); } .hero-contrast { backdrop-filter: contrast(200%); -webkit-backdrop-filter: contrast(200%); } .hero-saturate { backdrop-filter: saturate(200%); -webkit-backdrop-filter: saturate(200%); } .hero-darken { color: var(--color-hondros-sec-white); background: rgba(0,0,0,0.5); } .hero-lighten { color: var(--color-hondros-sec-black); background: rgba(255,255,255,0.5); } .hero-fixed { position: relative; display: block; width: 100%; height: auto; margin: auto; padding: 0; color: var(--color-hondros-sec-white); } .hero-fixed:after { content:" "; display: table; clear: both; } .hero-fixed img { width: 100%; height: auto; position: absolute; z-index: 1; overflow: hidden; margin: 0; } .hero-fixed .hero-container { display: flex; flex-direction: row; justify-content: space-between; margin: 0; padding: 0; width: 100%; height: auto; } .hero-fixed .hero-content { position: relative; overflow-y: auto; z-index: 10; } .hero-fixed .hero-content .hero-header, .hero-fixed .hero-content .hero-footer { color: var(--color-hondros-sec-white); background-color: transparent; } figure.banner.loopVid { background-image: none; background-color: var(--color-hondros-sec-black); color: var(--color-hondros-sec-white); padding-top: 30%; margin: 0; position: relative; display: block; overflow: hidden; } .banner.loopVid .fine { font-size: .8em; line-height: 1em; } .banner.loopVid h1 { margin-top: 0; font-size: 1.5em; color: var(--color-hondros-sec-white); } .banner.loopVid .hero-title span { margin: 0; } .banner.loopVid p { font-size: 0.85em; line-height: 1.125; } .banner.loopVid .button { text-decoration: none; font-size: 0.85em; } .banner.loopVid > div.wistia_responsive_padding { position: absolute; margin: -32% 0; } .banner.loopVid.fbh { margin-top: 5.5em; } .banner.loopVid figcaption { text-align: left; z-index: 10; position: absolute; bottom: 0; right: 0; background-color: rgba(0, 0, 0, 0.4); padding: 2.5rem 1.5rem; height: 100%; width: 40%; overflow: auto; } .banner.loopVid figcaption.video-overlay-full { text-align: center; width: 100%; } .banner.loopVid figcaption.video-overlay-full h1 { margin-top: 0; font-size: 3.4rem; color: var(--color-hondros-sec-white); } .banner.loopVid figcaption.video-overlay-full p { font-size: 1rem; line-height: 1.125; max-width: 650px; } .banner.loopVid figcaption.video-overlay-full .button { text-decoration: none; font-size: 1rem; } .loopVid figcaption { display: flex; flex-direction: column; flex-wrap: nowrap; align-items: center; justify-content: center; } .banner.loopVid .w-ui-container button.w-vulcan-v2-button { display: none !important; } .fbh figcaption { width: 30%; background-color: rgba(0, 13, 88, 0.8); } @media only screen and (max-width: 767px) { .fbh figcaption { background-color: #000d58; } .banner.loopVid > div { margin-left: 0; width: 100%; background-color: var(--color-hondros-sec-black); padding: 2rem; } .banner.loopVid figcaption { position: relative; background-color: black; padding: 1rem; width: 100%; margin-top: 22%; } .banner.loopVid figcaption.video-overlay-full h1 { font-size: 2.5rem; } } @media only screen and (max-width: 620px) { .banner.loopVid figcaption.video-overlay-full h1 { font-size: 1.75rem; } .banner.loopVid figcaption.video-overlay-full h1 span.degreeType { font-size: 1rem; } } @media only screen and (min-width: 768px) and (max-width: 900px) { .banner.loopVid figcaption { padding: 1rem 1rem; } .banner.loopVid h1 { margin-top: 0; font-size: 1.125em; } .banner.loopVid p { font-size: 0.8em; } .banner.loopVid .button { font-size: 0.8em; } .banner.loopVid figcaption.video-overlay-full h1 { font-size: 3rem; } } @media only screen and (max-width: 1000px) { .hero-title { font-size: 1.8rem; } .hero-title span.degreeType { font-size: 1rem; } .hero-content { min-width: auto; flex-basis: 50%; } } @media only screen and (max-width: 768px) { .hero-title { font-size: 1.4rem; } .hero-title span.degreeType { font-size: 0.9rem; } .hero-spacer { display: none; } .hero-content { flex-basis: 100%; } .hero-fixed .hero-content { padding: 0; justify-content: flex-start; } .hero-content.hero-content-one-half { flex-basis: 100%; } .hero-content.hero-content-two-third { flex-basis: 100%; } .hero-content.hero-content-three-fourth { flex-basis: 100%; } .hero-fixed .hero-content div { flex-grow: 1; display: flex; flex-direction: column; } .hero-fixed .hero-header { padding: 20px 30px; } } @media only screen and (max-width: 620px) { .hero-viewport { height: auto; } .hero-viewport .hero-content { padding: 0; } .hero-viewport .hero-header { position: absolute; width: 100%; height: 100%; } .hero-fixed { font-size: 0; } .hero-fixed .hero-darken { background-color: var(--color-hondros-sec-black); } .hero-fixed img { position: relative; } .hero-header { padding: 30px 1rem; } } @media only screen and (min-width: 1801px) and (max-width: 3000px) { .hero-creative .hero-content { min-width: auto; flex-basis: 40%; } .hero-creative .hero-content.hero-content-full { flex-basis: 100%; align-items: center; } } @media only screen and (min-width: 1301px) and (max-width: 1800px) { .hero-creative .hero-content { min-width: auto; flex-basis: 50%; } .hero-creative .hero-content.hero-content-full { flex-basis: 100%; align-items: center; } } @media only screen and (min-width: 1100px) and (max-width: 1300px) { .hero-creative .hero-content { min-width: auto; flex-basis: 50%; } .hero-creative .hero-content.hero-content-full { flex-basis: 100%; align-items: center; } } @media only screen and (min-width: 800px) and (max-width: 1099px) { .hero-creative .hero-content { min-width: auto; flex-basis: 60%; } .hero-creative .hero-program { font-size: 3rem; line-height: 3rem; } .hero-creative .hero-content.hero-content-full { flex-basis: 100%; align-items: center; } } @media only screen and (max-width: 799px) { .hero-creative .hero-spacer { display: none; } .hero-viewport.hero-creative { height: auto; } .hero-viewport.hero-creative .hero-content { flex-basis: 100%; padding: 30px 0; } .hero-viewport.hero-creative .hero-header { text-align: center; height: auto; position: relative; } .hero-creative .hero-header > div { flex-flow: row wrap; } .hero-creative .hero-header > div .button { flex-basis: 100%; flex-grow: 1; margin: 0.5rem 0; } .hero-creative .hero-program { font-size: 2rem; line-height: 2rem; } } .hero-content.hero-rfi-form { padding: 0; flex-direction: row; flex-wrap: nowrap; overflow: auto; flex-basis: 45%; justify-content: flex-end; } .hero-viewport.hero-rfi .hero-content.hero-rfi-form .hero-header { overflow: auto; } .hero-content.hero-rfi-form .hero-darken { background-color: rgba(0,0,0,0.6); width: 100%; } .hero-viewport.hero-rfi .rfi-apply { padding: 0 1rem; } .hero-content.hero-rfi-form .flex-panes.black-n-blue.pane-single-color .pane .pane-footer { border-top: none; } .hero-content.hero-rfi-form .flex-panes.black-n-blue.pane-single-color .pane { background-color: transparent; } .hero-content.hero-rfi-form .flex-panes.black-n-blue.pane-single-color .pane .pane-heading { background-color: transparent; } .hero-content.hero-rfi-form .flex-panes.black-n-blue.pane-single-color .pane .progress-bar { background-color: transparent; } .hero-content.hero-rfi-form h1, .hero-content.hero-rfi-form h2, .hero-content.hero-rfi-form h3, .hero-content.hero-rfi-form h4, .hero-content.hero-rfi-form h5, .hero-content.hero-rfi-form h6 { color: var(--color-hondros-sec-white); } .hero-viewport.hero-rfi .hero-spacer .hero-header { display: flex; flex-direction: column; justify-content: center; width: 100%; height: 100%; text-align: center; } .hero-viewport.hero-rfi .hero-spacer .hero-header h1 { color: var(--color-hondros-sec-white); font-size: 4rem; } .hero-viewport.hero-rfi .hero-spacer .hero-header .hero-program { color: var(--color-hondros-sec-white); font-size: 4rem; font-family: var(--font-bold); font-weight: normal; line-height: 1; margin: 1rem 0; } .hero-viewport.hero-rfi .hero-spacer .hero-header .hero-title { color: var(--color-hondros-sec-white); font-size: 1.5rem; } .hero-viewport.hero-rfi .hero-spacer .hero-header .hero-title:only-child { color: var(--color-hondros-sec-white); font-size: 4rem; } @media only screen and (max-width: 1000px) { .hero-viewport.hero-rfi .hero-spacer .hero-header .hero-title:only-child { font-size: 2rem; } .hero-viewport.hero-rfi .hero-spacer .hero-header .hero-title:only-child span.degreeType { font-size: 1rem; } } .hero-viewport.hero-rfi .hero-spacer .hero-header.hero-content-align-center { text-align: center; } .hero-viewport.hero-rfi .hero-spacer .hero-header.hero-content-align-right { text-align: right; } .hero-viewport.hero-rfi .hero-spacer .hero-header.hero-justify-start { justify-content: flex-start; } .hero-viewport.hero-rfi .hero-spacer .hero-header.hero-justify-end { justify-content: flex-end; } @media only screen and (max-width: 1100px) { .hero-content.hero-rfi-form { min-width: auto; flex-basis: 55%; } .hero-viewport.hero-rfi .hero-spacer .hero-header h1, .hero-viewport.hero-rfi .hero-spacer .hero-header .hero-program { color: var(--color-hondros-sec-white); font-size: 3rem; } } @media only screen and (max-width: 900px) { .hero-viewport.hero-rfi .hero-spacer .hero-header h1, .hero-viewport.hero-rfi .hero-spacer .hero-header .hero-program { font-size: 2rem; } } @media only screen and (max-width: 800px) { .hero-viewport.hero-rfi { flex-wrap: wrap; background: none; } .hero-content.hero-rfi-form { flex-basis: 100%; } .hero-content.hero-rfi-form .hero-darken { flex-basis: 100%; background: var(--color-hondros-sec-black) !important; } .hero-viewport.hero-rfi .hero-spacer:first-of-type { flex-basis: 100%; display: block; background-image: url(/common/images/banners/hero-graduation-2.jpg); background-position: top left; background-size: cover; background-repeat: no-repeat; min-height: 300px; } .hero-viewport.hero-rfi .hero-header { position: relative; } } .hero-content.hero-rfi-form .flex-panes.black-n-blue.pane-single-color .pane { border: none; } .hero-content.hero-rfi-form.revert-to-old { justify-content: flex-start; } .hero-content.hero-rfi-form.revert-to-old .hero-darken { background: rgba(0,0,0,0.6); } .hero-content.hero-rfi-form.revert-to-old .flex-panes.black-n-blue.pane-single-color .pane { } _:-ms-fullscreen, :root .hero-rfi-form .flex > * { flex-basis: 100%; } @media only screen and (max-width: 800px) { .hero-content.hero-rfi-form.revert-to-old .hero-darken { background: rgba(0,0,0,1) !important; } } .video-embed { height: 0; overflow: hidden; padding-bottom: 48%; padding-top: 30px; position: relative; margin: 0; } .video-embed iframe, .video-embed object, .video-embed embed { height: 100%; left: 0; position: absolute; top: 0; width: 100%; } .player-app { font-family: "Avenir-Light", sans-serif; } .filler { display: none; } .player-app .title-bar .title { color: var(--color-brand-gray); } .videorow { width: 100%; padding: 0; } .player-app { margin: 0; padding: 0; } .player-app, .player-core, .title-bar { width: 100% } .player-core { display: flex; flex-flow: row wrap; } .videorow h3 { text-align: center; width: 100%; color: var(--color-brand-gray); } .playerflex { width: 100%; position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0 } .playerflex iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .titleblock { background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.01) 1%, rgba(0, 0, 0, 0.5) 38%, rgba(0, 0, 0, 0.7) 99%, rgba(0, 0, 0, 0.7) 100%); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.01) 1%, rgba(0, 0, 0, 0.5) 38%, rgba(0, 0, 0, 0.7) 99%, rgba(0, 0, 0, 0.7) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.01) 1%, rgba(0, 0, 0, 0.5) 38%, rgba(0, 0, 0, 0.7) 99%, rgba(0, 0, 0, 0.7) 100%); filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#b3000000', GradientType=0) } .player, .thumb-panel { flex-basis: 100%; display: flex; flex-flow: row wrap; justify-content: space-between; } .vidnail { display: block; position: relative; height: auto; flex-basis: 48%; flex-grow: 0; flex-shrink: 1; cursor: pointer; margin-bottom: 4%; } .vidnail img { width: 100%; height: auto; display: block } .vidnail .titleblock { height: 45%; position: absolute; width: 100%; top: 55%; } .vidnail .titleblock .title { color: var(--color-hondros-sec-white); text-align: Center; margin: 0; padding: 0; text-transform: uppercase; font-size: 1em; margin: 8% 5% 0; font-weight: 500 } .vidnail .hoverstate { height: 100%; width: 100%; position: absolute; top: 0; left: 0; text-align: center; background-color: rgba(0, 0, 0, .4); display: none } .vidnail .hoverstate i { color: rgba(255, 255, 255, .75); margin-top: .35em; font-size: 4.75em } @media only screen and (min-width:1000px) { .videorow { width: 100%; padding: 0; padding: 0; margin: 0 auto; } .player-app { padding: 0; background-color: transparent; } .player-core { width: 100%; margin: 0 auto; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: flex-start; } .player { margin: 0; padding: 0; flex-basis: 55%; flex-grow: 0; flex-shrink: 1; } .thumb-panel { flex-basis: 42%; flex-grow: 0; flex-shrink: 1; } .titleblock .title { font-weight: 600 } } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } code { background: #444 none repeat scroll 0% 0%; color: #FFF; font: 16px/24px "GibsonLight"; text-align: left; margin: 0; white-space: pre-wrap; } .notes { background: #666 none repeat scroll 0% 0%; color: var(--color-hondros-sec-white); padding: 15px 30px; } .notes li { font: 14px/24px "GibsonLight"; margin-bottom: 0; } .panel { background: var(--color-hondros-sec-white) none repeat scroll 0% 0%; padding: 50px 80px; } .panelGrey { background: #f1f3f2 none repeat scroll 0% 0%; padding: 50px 80px; } .container { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } .row { margin-right: -30px; margin-left: -30px; } .rowHack { margin-right: 0; margin-left: -30px; } .row::after { clear: both; } .row::before, .row::after { content: " "; display: table; } .col-1, .col-sm-1, .col-md-1, .col-lg-1, .col-2, .col-sm-2, .col-md-2, .col-lg-2, .col-3, .col-sm-3, .col-md-3, .col-lg-3, .col-4, .col-sm-4, .col-md-4, .col-lg-4, .col-5, .col-sm-5, .col-md-5, .col-lg-5, .col-6, .col-sm-6, .col-md-6, .col-lg-6, .col-7, .col-sm-7, .col-md-7, .col-lg-7, .col-8, .col-sm-8, .col-md-8, .col-lg-8, .col-9, .col-sm-9, .col-md-9, .col-lg-9, .col-10, .col-sm-10, .col-md-10, .col-lg-10, .col-11, .col-sm-11, .col-md-11, .col-lg-11, .col-12, .col-sm-12, .col-md-12, .col-lg-12 { position: relative; min-height: 1px; padding-right: 30px; padding-left: 30px; } .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 { float: left; } .col-12 { width: 100%; } .col-11 { width: 91.66666667%; } .col-10 { width: 83.33333333%; } .col-9 { width: 75%; } .col-8 { width: 66.66666667%; } .col-7 { width: 58.33333333%; } .col-6 { width: 50%; } .col-5 { width: 41.66666667%; } .col-4 { width: 33.33333333%; } .col-3 { width: 25%; } .col-2 { width: 16.66666667%; } .col-1 { width: 8.33333333%; } .col-pull-12 { right: 100%; } .col-pull-11 { right: 91.66666667%; } .col-pull-10 { right: 83.33333333%; } .col-pull-9 { right: 75%; } .col-pull-8 { right: 66.66666667%; } .col-pull-7 { right: 58.33333333%; } .col-pull-6 { right: 50%; } .col-pull-5 { right: 41.66666667%; } .col-pull-4 { right: 33.33333333%; } .col-pull-3 { right: 25%; } .col-pull-2 { right: 16.66666667%; } .col-pull-1 { right: 8.33333333%; } .col-pull-0 { right: auto; } .col-push-12 { left: 100%; } .col-push-11 { left: 91.66666667%; } .col-push-10 { left: 83.33333333%; } .col-push-9 { left: 75%; } .col-push-8 { left: 66.66666667%; } .col-push-7 { left: 58.33333333%; } .col-push-6 { left: 50%; } .col-push-5 { left: 41.66666667%; } .col-push-4 { left: 33.33333333%; } .col-push-3 { left: 25%; } .col-push-2 { left: 16.66666667%; } .col-push-1 { left: 8.33333333%; } .col-push-0 { left: auto; } .col-offset-12 { margin-left: 100%; } .col-offset-11 { margin-left: 91.66666667%; } .col-offset-10 { margin-left: 83.33333333%; } .col-offset-9 { margin-left: 75%; } .col-offset-8 { margin-left: 66.66666667%; } .col-offset-7 { margin-left: 58.33333333%; } .col-offset-6 { margin-left: 50%; } .col-offset-5 { margin-left: 41.66666667%; } .col-offset-4 { margin-left: 33.33333333%; } .col-offset-3 { margin-left: 25%; } .col-offset-2 { margin-left: 16.66666667%; } .col-offset-1 { margin-left: 8.33333333%; } .col-offset-0 { margin-left: 0; } .col-12.calloutBox, .col-12.calloutBox-alt { width: calc(100% - 30px); } .col-11.calloutBox, .col-11.calloutBox-alt { width: calc(91.66666667% - 30px); } .col-10.calloutBox, .col-10.calloutBox-alt { width: calc(83.33333333% - 30px); } .col-9.calloutBox, .col-9.calloutBox-alt { width: calc(75% - 30px); } .col-8.calloutBox, .col-8.calloutBox-alt { width: calc(66.66666667% - 30px); } .col-7.calloutBox, .col-7.calloutBox-alt { width: calc(58.33333333% - 30px); } .col-6.calloutBox, .col-6.calloutBox-alt { width: calc(50% - 30px); } .col-5.calloutBox, .col-5.calloutBox-alt { width: calc(41.66666667% - 30px); } .col-4.calloutBox, .col-4.calloutBox-alt { width: calc(33.3333333% - 30px); } .col-3.calloutBox, .col-3.calloutBox-alt { width: calc(25% - 30px); } .col-2.calloutBox, .col-2.calloutBox-alt { width: calc(16.66666667% - 30px); } .col-1.calloutBox, .col-1.calloutBox-alt { width: calc(8.33333333% - 30px); } @media (max-width: 768px) { .col-12.calloutBox, .col-12.calloutBox-alt, .col-11.calloutBox, .col-11.calloutBox-alt, .col-10.calloutBox, .col-10.calloutBox-alt, .col-9.calloutBox, .col-9.calloutBox-alt, .col-8.calloutBox, .col-8.calloutBox-alt, .col-7.calloutBox, .col-7.calloutBox-alt, .col-6.calloutBox, .col-6.calloutBox-alt, .col-5.calloutBox, .col-5.calloutBox-alt, .col-4.calloutBox, .col-4.calloutBox-alt, .col-3.calloutBox, .col-3.calloutBox-alt, .col-2.calloutBox, .col-2.calloutBox-alt, .col-1.calloutBox, .col-1.calloutBox-alt { width: 100%; float: none; min-height: 60px; padding: 20px 10px; } } @media (max-width: 768px) { .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 { width: 100%; float: none; min-height: 60px; padding: 20px 10px; } .row { margin: 0 -10px 0 -10px; } .col-pull-12, .col-pull-11, .col-pull-10, .col-pull-9, col-pull-8, .col-pull-7, .col-pull-6, .col-pull-5, .col-pull-4, .col-pull-3, .col-pull-2, .col-pull-1, .col-pull-0 { right: auto; } .col-push-12, .col-push-11, .col-push-10, .col-push-9, .col-push-8 , .col-push-7, .col-push-6, .col-push-5, .col-push-4, .col-push-3, .col-push-2, .col-push-1, .col-push-0 { left: auto; } .col-offset-12, .col-offset-11, .col-offset-10, .col-offset-9, .col-offset-8, .col-offset-7, .col-offset-6, .col-offset-5, .col-offset-4, .col-offset-3, .col-offset-2, .col-offset-1, .col-offset-0 { margin-left: 0; } } .clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }