@import url('https://fonts.googleapis.com/css?family=Comfortaa:400,700|Open+Sans:400,600');

header img{width:100%; max-width:220px; transition:all .7s ease; transition-delay:.25s}
.top-bar{z-index:9999;}
#navigation li a{padding:1rem;font-size:1.125rem; font-family:'Comfortaa',cursive; font-weight:700; color:#000}
#navigation li a:hover, #navigation ul li a:focus{background-color:rgba(255,255,255,1); color:#000}
#navigation li ul li a{font-size:.9rem; line-height:1.4; color:#000}

#navigation a.button{border-top:1px solid #221e1f; border-radius:0; background:#fff; color:#221e1f}
#navigation .button:hover, #navigation .button:focus{background:#fff; color:#221e1f}

#navigation li ul li a:hover, #navigation ul li ul li a:focus{background-color:rgba(255,255,255,1); color:#000}

#navigation li ul.menu.vertical{border-bottom:1px solid #fff}

#navigation ul.list-columns{columns:2; min-width:52vw}

#navigation ul.submenu{padding:0.5rem}
.is-dropdown-submenu{background-color:rgba(255,255,255,1)}
.dropdown.menu > li.is-active > a{background-color:rgba(255,255,255,1); color:#000 !important}
.dropdown .is-dropdown-submenu a{padding:0.5rem !important; background-color:transparent !important}
.dropdown .is-dropdown-submenu a:hover{text-decoration:underline}

.is-dropdown-submenu{min-width:8.85rem}

.dropdown.menu.large-horizontal > li.solutions.opens-left > .is-dropdown-submenu{
    top:100%;
    right:-180%;
    left:auto}

.accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle) > a::after{border-color:#000 transparent transparent}

.sticky.is-stuck img{max-width:180px}

.top-bar, #homepage .sticky.is-stuck{background-color:rgba(34,30,31,.9)}
#homepage .top-bar{background:none}

#toggle-button{float:right}
#toggle-button a{color:#fff}
#toggle-button a:hover{background:none}
.top-bar-left{padding:0 0.9375rem; justify-content:space-between; align-items:center}

#navigation{margin-top:1rem; background-color:rgba(255,255,255,.9)}

#hero{
	position:relative;
	padding:0}
#hero video{
	display:block;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	transform:translate(0%, 0%);
	object-fit:cover;
	z-index:-1}
.button.hollow.secondary{
    border:1px solid #fff;
    color:#fff}
.button.hollow.secondary:focus, .button.hollow.secondary:hover{
	background-color:rgba(255,255,255,0.6);
    border:1px solid #fff;
    color:#111}

#hero-content{padding:3rem .9375rem 1.5rem .9375rem; color:#fff; height:90%; text-align:center; width:100%}
#hero-content .button{margin-bottom:4rem}
#hero-content.flex{flex-direction:column; align-items:center; justify-content:center; align-content:center}

#hero-content .titles{
    overflow:hidden;
    position:relative;
    width:100%;
    max-width:930px;
    height:50vmax;
    max-height:12rem}
#hero-content .titles h1{
    width:100%;
    position:absolute;
    /* height:176px; */
    top:0}
#hero-content .titles h1:not(:first-child){
}

#hero-content .titles h1.prev{
    opacity:0;
    left:-100%;
    transition:opacity 450ms ease-out 150ms, left 2s ease-in}
#hero-content .titles h1.next{
    opacity:0;
    left:100%;
    transition:opacity 450ms ease-out 150ms, left 2s ease-in}
#hero-content .titles h1.current{
    opacity:1;
    left:0;
    transition:opacity 500ms ease 750ms, left 1.5s ease}


.lvl2 #hero{
	background:linear-gradient(-45deg, #17b48b, #122d81);
	background-image:url(../img/hero-why-fisential.jpg)}
.lvl2 #hero, #why-fisential.lvl2 #hero, #digital-marketing.lvl2 #hero, #website-design.lvl2 #hero, #integrations.lvl2 #hero, #security-compliance.lvl2 #hero{
	background-size:166%;
	background-position:center top}
#integrations.lvl2 #hero{background-size:180%}
#why-fisential.lvl2 #hero{background-image:url(../img/hero-why-fisential.jpg)}
#digital-marketing.lvl2 #hero{background-image:url(../img/hero-digital-strategy.jpg)}
#integrations.lvl2 #hero{background-image:url(../img/hero-digital-marketing.jpg)}
#website-design.lvl2 #hero{background-image:url(../img/hero-website-design.jpg)}
#data-analytics.lvl2 #hero{background-image:url(../img/hero-data-analytics.jpg)}
#contact-fisential.lvl2 #hero{background-image:url(../img/1011-building.jpg)}
#security-compliance.lvl2 #hero{background-image:url(../img/hero-integrations.jpg);	background-position:center top}
.lvl2 #hero-content{padding:5.5rem 1rem 2.75rem}

#our-story.lvl2 #hero {background-image:url(../img/cups-of-coffee.jpg); background-position:center top}
#case-study.lvl2 #hero {background-image:url(../img/marking-map.jpg); background-position:center center}
#why-fisential.lvl2 #hero {background-image:url(../img/tablet-on-laptop.jpg); background-position:center center}
#rebranding.lvl2 #hero {background-image:url(../img/devices-on-desktop.jpg); background-position:center center}

h1{font-size:2.5rem; line-height:1.2; margin-bottom:0.5rem}
h1 span{display:block}
.lvl2 h1{font-size:2.25rem}
#lead h1{font-size:2.375rem}
h2{font-size:1.7rem}
h3{font-size:1.3rem}
h4{font-size:1.2rem}
h5{font-size:1rem}

p a{font-weight:600; text-decoration:underline; color:inherit}
p a:hover, p a:focus{text-decoration:none}
.fhl{margin-bottom:0.75rem}
.fhl strong{font-size:1.15rem}

section{padding:4rem 0 3.1rem}
#digital-experience{
	position:relative;
	z-index:2;
	background:url('../img/spiral-bg.jpg') no-repeat center left #fff; background-size:cover}
#digital-experience .lead{font-size:inherit; margin-bottom:0}

.blue-grade, .org-grade{padding:0}
.blue-grade .content{
	padding:3rem 0.9375rem;
	margin:0;
	background:#0d2e58;
	background:-moz-linear-gradient(-45deg, #0d2e58 0%, #085885 100%);
	background:-webkit-linear-gradient(-45deg, #0d2e58 0%,#085885 100%);
	background:linear-gradient(135deg, #0d2e58 0%,#085885 100%);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#0d2e58', endColorstr='#085885',GradientType=1 );
	color:#fff;
	justify-content:center;
	align-items:center}
.blue-grade p:last-of-type, .org-grade p:last-of-type{margin-bottom:0.25rem}

#accessibility-test {padding:3rem 0.9375rem;
	margin:0;
	background:#0d2e58;
	background:-moz-linear-gradient(-45deg, #0d2e58 0%, #085885 100%);
	background:-webkit-linear-gradient(-45deg, #0d2e58 0%,#085885 100%);
	background:linear-gradient(135deg, #0d2e58 0%,#085885 100%);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#0d2e58', endColorstr='#085885',GradientType=1 );
	color:#fff;
	text-align:center;}

.org-grade .content{
	padding:3rem 0.9375rem;
	margin:0;
	background:#fd7300;
	background:-moz-linear-gradient(-45deg, #ffad22 0%, #fd7300 100%);
	background:-webkit-linear-gradient(-45deg, #ffad22 0%,#fd7300 100%);
	background:linear-gradient(135deg, #ffad22 0%,#fd7300 100%);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffad22', endColorstr='#fd7300',GradientType=1 );
	color:#fff;
	justify-content:center;
	align-items:center}

#headlines{
	font-size:.85rem;
	padding:3.3rem 0;
	background:url('../img/yellow-orange-lines.jpg') no-repeat center center;
	background-size:cover}
#headlines .large-2.cell{background:#fdf6e1}
#headlines h5{text-transform:uppercase}
#headlines p{
	margin-bottom:0;
	font-size:0.885rem}
#headlines .block{padding:1.9rem}
#headlines .fas, #headlines .far{display:none}
#headlines .flex{text-align:center; flex-direction:column; align-items:center; align-content:center; justify-content:center}
#headlines .button{margin:1rem 0 0 0}
#headlines .button:hover, #headlines .button:focus{background:rgba(0,0,0,.1)}

#contact-us, #expert-advice{color:#fff; padding:6.6rem 0; background:linear-gradient(-45deg, #9a0a54, #9a1831)}
#contact-us ul{margin-left:2.4rem; margin-bottom:2rem}
#contact-us ul li{font-size:1.125rem; margin:1rem 0}
#contact-us ul i{margin-right:2rem}
#contact-us .button{background:#fff; color:#221e1f; margin-top:1.5rem; border-radius:0; padding:1rem 1.25rem!important}
#contact-us .button:hover, #contact-us .button:focus{background:rgba(255,255,255,.9); color:#221e1f}
#contact-us .hide-for-medium, #contact-us .show-for-medium{margin-top:2rem}

form label {line-height:1.6;}
[type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], 
 [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], 
 [type='time'], [type='url'], [type='color'], textarea {margin-bottom:1.25rem;}


#digital-experience, #headlines, #contact-us{padding:3rem 0}

#contact{
	display:block;
	margin-top:1.5rem}

footer{background:#333; color:#fff; font-size:.9rem; padding:1.5rem 0; text-align:right}
footer p{
	margin:0;
	font-size:0.9rem}
footer a{font-weight:normal; float:left}
footer a:hover, footer a:focus{color:inherit}

footer .flex {flex-direction:column; justify-content:space-between; align-content:center; align-items: center;}
footer span {margin:1rem 0;}
@media print, screen and (min-width:64em){
	footer .flex {flex-direction:row;}
}

.flex{
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:flex}

#ada-test #hero {background:linear-gradient(#ffd72f, #fcb330);}
#ada-test #hero-content .lead {font-size:100%;}
#ada-test #hero-content {padding:3rem .9375rem 4rem .9375rem;}
#ada-test #hero-content img {width:90%; max-width:220px; margin-bottom:2rem;}
#ada-test #hero-content h1 {font-size:1.9rem; margin-bottom:1.5rem;}
#ada-test #hero-content span {display:inline-block; font-weight:inherit;}
#ada-test #hero h1 {color:#000;}
.test-input form, .report-example {
	display:block;
	margin-top:2rem}
#ada-form .scan{
	padding:1rem 1.5rem!important;
	background:linear-gradient(#fec10f, #ffad22);
	color:#000;
	margin-top:1rem;
	border-radius: 200px;
	font-size:1.25rem;
	cursor:pointer}
#ada-form .scan:focus, #ada-form .scan:hover {background:linear-gradient(#ffad22, #ffad22);}
.report-example img{
	display:inline-block;
	width:100%;
	max-width:400px;}
.report-example a{color:#005499}
/*#ada-form {background:linear-gradient(#eef8fd, #fff);}*/




#our-story-logos {background:#404040;}
.logos-flex {display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex;display:flex; flex-wrap: wrap; justify-content:space-around; align-content:stretch; align-items:stretch;}
.logos-flex img {margin:1.5rem .3rem;}

#lead, #case-studies{padding:4.2rem 0}

#our-experience{padding:0!important; color:#fff; background:#0f1b53}
#experience-content{padding:5rem 0.9375rem}
#experience-image{margin-top:-2.5rem; margin-bottom:-2.5rem; background:url('../img/building.jpg') no-repeat center center; background-size:cover}

#choose-fisential{padding:4.2rem 0 5rem 0}

p:last-of-type{margin-bottom:0}

/*#case-study #approach-midcoast h2{display:block}
#case-study #approach-midcoast h2:before{content:url(../img/fisential-spiral.svg); margin-right:.7rem}*/

#why-fisential #approach-midcoast{color:#fff; background:linear-gradient(162deg, #18548d 42%, #14b4dc 100%)}
#choose-fisential{color:#fff; background:linear-gradient(45deg, #ffad22 20%, #fd7300 100%)}
#why-fisential main section .flex{flex-direction:column; align-content:center; align-items:center; justify-content:center}
#case-studies{
	position:relative;
	border-top:1px solid #ccc}
#homepage #contact-us, #why-fisential #contact-us, #rebranding #contact-us{margin-bottom:-1px}
.cms-dev, .video{position:relative}
#cases, #cms, #video{
	position:absolute;
	top:-5.25rem}
#case-studies h3{margin-top:1.75rem}

#results h2{align-self:flex-start}
#rebranding #motion{color:#fff; background:linear-gradient(162deg, #fd7300 42%, #ffad22 100%)}

#rebranding .org-grade .content{width:100%; flex-direction:column; align-items:flex-start; justify-content:center}
#rebranding .org-grade .content .text{width:100%}

.m-prompt{
	order:2;
	width:100%;
	height:auto;
	margin-top:2.5rem;
	text-align:center}
.m-prompt video{
	width:100% !important;
	height:auto !important}

#core-banking, #aba-endorsed, #cms-platforms, #crm-systems, #email-marketing{border-top:1px solid #ccc}

#packages #plans{background:#fd7300;
	background:-moz-linear-gradient(45deg, #ffad22 0%, #fd7300 100%);
	background:-webkit-linear-gradient(45deg, #ffad22 0%,#fd7300 100%);
	background:linear-gradient(135deg, #ffad22 0%,#fd7300 100%);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffad22', endColorstr='#fd7300',GradientType=1 );}
#packages #plans table, #packages #plans table tfoot td, #packages #plans table thead th{text-align:center;}
#packages #plans table{font-size:.9rem;}
#packages #plans table td:first-of-type{text-align:left; font-size:.9rem; line-height:1.4}
#packages #plans thead{background:#595959; color:#fff; border:none;}
#packages #plans th{border:1px solid #999; border-top:none; border-bottom:none;}
#packages #plans th:first-of-type{border-left:none; width:50%;}
#packages #plans th:last-of-type, #packages #plans tfoot td:last-of-type{border-right:none;}
#packages #plans tbody, #packages #plans td{border:1px solid #595959;}
#packages #plans .fa-check{color:#188d29;}
#packages #plans .fa-minus{font-size:80%; color:#999;}
tbody tr:nth-child(even){background:#fff;}
#packages #plans tfoot{border:none; background:#595959; color:#fff; text-transform:uppercase;}
#packages #plans tfoot td{border:1px solid #999; border-top:none; border-bottom:none;}
#packages #plans tfoot td:first-of-type{border-left:none;}
.link-bank-site{display:inline-block;padding-bottom:0.0625rem;border-bottom:1px solid #bcbcbc;text-decoration:none}
.link-bank-site:hover{border-bottom:none;}

/* CS */
.gray{padding-bottom:2rem;background-color:#555;color:#fff}
.toggle-prompt{display:none}
.toggle-old-new{margin:3rem 0 3.3rem;padding:0.75rem 1rem 1rem;background-color:#414141;text-align:center}
.old{color:#c2c2c2}
.new{color:#97ff84}
.cue{font-size:2.4rem}
.old-new-design{padding:0;text-align:center;clear:both}
.old-new-design img{display:block;width:100%;height:auto}

#toggle-check + .toggle-ui{background-color:#bcdaa9}
#toggle-check + .toggle-ui .pill > span{
	background:#1a9e02;
	color:#fff}

#toggle-check:checked + .toggle-ui{background-color:#afafaf}
#toggle-check:checked + .toggle-ui .pill > span{
	background:#f6f6f6;
	color:#515151}

#toggle-check + .toggle-ui .pill > span:nth-child(1){display:block}
#toggle-check + .toggle-ui .pill > span:nth-child(2){display:none}
#toggle-check:checked + .toggle-ui .pill > span:nth-child(1){display:none}
#toggle-check:checked + .toggle-ui .pill > span:nth-child(2){display:block}

.pill{
	display:flex;
	flex-flow:row nowrap;
	justify-content:flex-start}
#toggle-check:checked + .toggle-ui .pill{justify-content:flex-end}
.pill span{
	flex:0 0 45%;
	border-radius:2.5rem;
	padding:0.1875rem 1rem;
	text-align:center;
	user-select:none}

#toggle-check ~ .old-new-design img{display:none}
#toggle-check:not(:checked) ~ .old-new-design img:nth-child(1){display:block}
#toggle-check:checked ~ .old-new-design img:nth-child(2){display:block}

.toggle-ui{display:inline-block;width:15rem;height:2.5rem;margin-top:0.5rem;margin-bottom:1rem;padding:0.1875rem;border-radius:2.5rem;}

.mc-dyna{margin-top:1.8rem}
.fi-logos img{
	display:inline-block;
	margin:0.25rem 0.12rem}
.branding{
	flex-direction:column;
	background:#fd7300;
	background:-moz-linear-gradient(45deg, #fd7300 20%, #ffad22 100%);
	background:-webkit-linear-gradient(45deg, #fd7300 20%,#ffad22 100%);
	background:linear-gradient(45deg, #fd7300 20%,#ffad22 100%);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#fd7300', endColorstr='#ffad22',GradientType=1 )}
.branding .flex{flex-direction:column;align-items:flex-start;justify-content:space-around;padding:1.5rem 4.8rem 0.75rem}
.branding .text{width:100%;color:#fff}
.branding .image{width:100%;padding-top:2.5rem;text-align:center}
.branding .image img{display:block;width:100%;margin:0 auto}
/* END CS */

@media print, screen and (min-width:40em){
	.lvl2 #hero, #why-fisential.lvl2 #hero, #digital-marketing.lvl2 #hero, #website-design.lvl2 #hero, #integrations.lvl2 #hero, #security-compliance.lvl2 #hero{}
	#hero-content{padding:8.5rem 0 1.75rem 0}
	.lvl2 #hero-content{padding:8.25rem 0 4.75rem}
	#digital-experience{padding:5rem 0}
	.blue-grade .content, .org-grade .content{padding:5rem}
	#headlines .fas, #headlines .far{display:block; color:#df6b0c; margin-bottom:2rem}
	#contact{margin-top:0}
	#packages #plans table{font-size:1rem;}
	#packages #plans table td{padding:1rem;}
	#packages #plans table td:first-of-type{font-size:inherit;}
	#packages #plans th:first-of-type{width:60%;}
	#packages #plans th, #packages #plans tfoot td{font-size:1.125rem;}
	#packages #plans table th{padding:1rem 2rem;}
	#packages #plans .fa-check{font-size:1.25em;}
	#packages #plans tbody td{padding-top:1.75rem; padding-bottom:1.75rem;}
	.toggle-old-new{padding:1.75rem 2rem 2rem}
	#ada-test #hero-content .lead {font-size:125%;}
	#ada-test #hero-content img {margin-bottom:3.5rem;}
	#ada-test #hero-content h1 {font-size:3rem;}
}
@media print, screen and (min-width:64em){
	.no-js .is-dropdown-submenu{
		display:none;
		transform:scale(0)}
	.menu .menu{
		transform-origin:center top;
		transform:scale(0);
		display:block;
		transition:transform 0.2s ease}
	.menu .menu.js-dropdown-active{
		transform:scale(1);
		transition:transform 0.2s ease}
	.why-fisential .is-dropdown-submenu{transform-origin:left top}
	#navigation{background:none; margin-top:0}
	#navigation a.button{border:none; background:rgba(255,255,255,.8); color:#221e1f}
	#navigation li a{
		padding:0.675rem;
		color:#fff;
		font-size:1rem}
	#navigation li ul.menu.vertical{border-bottom:none}
	.top-bar-left{margin-bottom:0}
	.top-bar{padding:1rem 2rem}
	#navigation a.button{margin-left:1rem}
	#hero-content{padding:9rem 0 1.875rem}
	.lvl2 #hero-content{padding:10.25rem 1rem 6.75rem}
	h1{font-size:3.75rem}
	.lvl2 h1{font-size:3.25rem}
	h2{font-size:2.1rem}
	h3{font-size:1.7rem}
	h4{font-size:1.425rem}
	h5{font-size:1.1rem}
	p{font-size:1.075rem}
	#hero-content .button{margin-bottom:8rem}
	#digital-experience, .lvl2 #lead{padding:6rem 0 7rem 0; background:url('../img/spiral-bg.jpg') no-repeat center left #fff; background-size:contain}
	#our-story.lvl2 #lead {background:none;}
	.blue-grade .content, .org-grade .content{width:50%; padding:5rem 7rem}
	.blue-grade .content .text, .org-grade .content .text{max-width:37.5rem}
	.blue-grade .image{flex-grow:1; background:url('../img/community.jpg') no-repeat center left; background-size:cover}
	#why-fisential .blue-grade .image{flex-grow:1; background:url('../img/choose-fisential.jpg') no-repeat center left; background-size:cover}
	#why-fisential .org-grade .image{flex-grow:1; background:url('../img/best-of-both.jpg') no-repeat center center; background-size:cover}
	#digital-marketing .blue-grade .image{flex-grow:1; background:url('../img/defining-goals.jpg') no-repeat center left; background-size:cover}
	#digital-marketing .org-grade .image{flex-grow:1; background:url('../img/touchpoints.jpg') no-repeat center center; background-size:cover}
	#website-design .blue-grade .image{flex-grow:1; background:url('../img/planning.jpg') no-repeat center left; background-size:cover}
	#website-design .org-grade .image{flex-grow:1; background:url('../img/cms.jpg') no-repeat center center; background-size:cover}
	#security-compliance .blue-grade .image{flex-grow:1; background:url('../img/security.jpg') no-repeat center center; background-size:cover}
	#choose-fisential .large-5.cell{background:url('../img/planning.jpg') no-repeat center center; background-size:cover; border:1px solid #fff}
	#data-analytics .blue-grade .image{flex-grow:1; background:url('../img/data.jpg') no-repeat center left; background-size:cover}
	#rebranding .blue-grade .image{flex-grow:1; background:url('../img/brand.jpg') no-repeat center left; background-size:cover}
	#rebranding .org-grade .content{flex-direction:row; justify-content:space-around}
	#rebranding .org-grade .content .text{max-width:49%}
	.m-prompt{
		order:0;
		width:auto;
		margin-top:0;
		margin-right:2.625rem;
		text-align:center}
	#headlines{padding:6rem 0 7rem}
	#headlines .block{padding:1.75rem 0.9rem 1.625rem}
	#contact-us{padding:5.4rem 0}

	/* CASE STUDY */
	#lead h2{margin-bottom:1.75rem}
	.gray{padding-bottom:2.5rem}
	.gray.results{padding-bottom:4.3rem}
	.toggle-prompt{display:inline-block;float:left;padding-bottom:0.5rem;font-size:1.6rem}
	.toggle-old-new{padding:2.4rem 4.5rem 3rem;text-align:left}
	.toggle-ui{display:inline-block;float:right;margin-bottom:0.25rem}
	.branding{flex-direction:row}
	.branding .flex{flex-direction:row;align-items:flex-start;justify-content:space-around;padding:1.5rem 4.8rem 0.75rem}
	.branding .text{width:42%}
	.branding .image{width:auto;padding-top:0;text-align:left}
	.branding .image img{display:inline-block;width:auto;max-width:38.5rem;margin:auto}
	.branding .image div{padding-left:2rem}
	#case-study #lead{background-image:none}
	.mb-screens{
		position:relative;
		top:-1.4rem;
		float:right;
		display:inline-block;
		width:30rem;
		height:auto;
		padding-left:1.25rem}
	/* END CS */
}
@media print, screen and (min-width:64.0625em){
	.lvl2 #hero, #why-fisential.lvl2 #hero, #digital-marketing.lvl2 #hero, #website-design.lvl2 #hero, #integrations.lvl2 #hero, #security-compliance.lvl2 #hero{
		background-size:cover;
		background-attachment:fixed;
		background-position:center center}
}
@media print, screen and (min-width:66em){
	#navigation li a{
		padding:0.725rem;
		font-size:1.025rem}
	.is-dropdown-submenu{min-width:9.1rem}

	.branding .text{width:40%}
}
@media print, screen and (min-width:68em){
	#navigation li a{
		padding:0.775rem;
		font-size:1.075rem}
	.is-dropdown-submenu{min-width:9.55rem}

	.branding .text{width:36%}
}
@media print, screen and (min-width:70em){
	#navigation li a{
		padding:0.825rem;
		font-size:1.1rem}
	.is-dropdown-submenu{min-width:9.9rem}

	.branding .text{width:33%}
	.mb-screens{width:33rem}
}
@media print, screen and (min-width:72em){
	#navigation li a{
		padding:1rem;
		font-size:1.125rem}
	.is-dropdown-submenu{min-width:10.3875rem}
	#hero-content{padding:9.5rem 0 2.25rem}

	.branding .text{width:30%}
	.mb-screens{width:34rem}
}
@media print, screen and (min-width:80em){
	#navigation li a{padding:1rem 1.375rem}
	#navigation ul.list-columns{columns:2; min-width:46vw}
	#hero-content{padding:10rem 0 2.75rem}
	.is-dropdown-submenu{min-width:11.125rem}

	.branding .text{width:31%}
	.mb-screens{width:36rem}
}
@media print, screen and (min-width:84em){
	#navigation li a{padding:1rem 1.3875rem}
	#navigation ul.list-columns{columns:2; min-width:43vw}
	#hero-content{padding:10.25rem 0 3rem}
	.is-dropdown-submenu{min-width:11.15rem}

	.branding .text{width:32%}
	.mb-screens{width:39rem}
}
@media print, screen and (min-width:87em){#hero-content{padding:10.5rem 0 3.1rem}.branding .text{width:33%}}
@media print, screen and (min-width:90em){#hero-content{padding:10.75rem 0 3.2rem}.branding .text{width:34%}}
@media print, screen and (min-width:92em){#navigation ul.list-columns{columns:2; min-width:39vw}.branding .text{width:36%}}
@media print, screen and (min-width:93em){#hero-content{padding:11rem 0 3.3rem}.branding .text{width:39%}}
@media print, screen and (min-width:96em){#hero-content{padding:11.25rem 0 3.4rem}.branding .text{width:40%}}
@media print, screen and (min-width:99em){#hero-content{padding:11.5rem 0 3.5rem}.branding .text{width:41%}}
@media print, screen and (min-width:100em){#navigation ul.list-columns{columns:2; min-width:35vw}.branding .text{width:42%}}
@media print, screen and (min-width:102em){#hero-content{padding:11.75rem 0 3.6rem}}
@media print, screen and (min-width:105em){#hero-content{padding:12rem 0 3.7rem}}
@media print, screen and (min-width:108em){#hero-content{padding:12.25rem 0 3.8rem}}
@media print, screen and (min-width:111em){
	#navigation ul.list-columns{columns:2; min-width:31vw}
	#hero-content{padding:12.5rem 0 3.9rem}
}
@media print, screen and (min-width:114em){#hero-content{padding:12.75rem 0 4rem}}
@media print, screen and (min-width:117em){#hero-content{padding:13rem 0 4.1rem}}
@media print, screen and (min-width:120em){#hero-content{padding:13.25rem 0 4.2rem}}