html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }

/* Custom fonts */
@font-face {
    font-family: 'Geologica Roman';
    src: url('/_resources/fonts/GeologicaRoman-Regular.woff2') format('woff2'),
        url('/_resources/fonts/GeologicaRoman-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Geologica Roman';
    src: url('/_resources/fonts/GeologicaRoman-Bold.woff2') format('woff2'),
        url('/_resources/fonts/GeologicaRoman-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


/* Reset */
h1, h2, h3, h4, h5, p { margin:0;  }
html, body { margin:0; }
body { font-family:'Geologica Roman', Arial, sans-serif; }

/* Hyperlinks */
a { text-decoration:none; color:#4753b1; }

/* Oldschool Grid */
.row::after { content:""; clear:both; display:table; }
[class*="col-"] { float:left; width:100%; }
.col-1 { width:8.33%; }
.col-2 { width:16.66%; }
.col-3 { width:25%; }
.col-4 { width:33.33%; }
.col-5 { width:41.66%; }
.col-6 { width:50%; }
.col-7 { width:58.33%; }
.col-8 { width:66.66%; }
.col-9 { width:75%; }
.col-10 { width:83.33%; }
.col-11 { width:91.66%; }
.col-12 { width:100%; }

.nowrap { white-space: nowrap; }

/* Alignment */
.ar { text-align:right; }
.ac { text-align:center; }

.inner { max-width:1200px; margin:0 auto; padding:0 45px; }

header { background:black; padding:16px; }
#logo { background:url('/_resources/gfx/notedit-weblogo.png') 0 0 no-repeat; background-size:contain; display:inline-block; vertical-align:middle; width:161px; height:56px; cursor:pointer; }

#top { background:#4854b2; color:white;  }
#top .inner { padding:120px 0; }
#top .top-text { width:50%; padding:0 65px; }
#top .top-text p { font-size:32px; }
.bg-graphic { background: url('/_resources/gfx/notedit-topgraphic.svg') 80% center no-repeat; background-size:35%; }

.footer-links,
.menu-sbs { list-style:none; margin:0; padding:0; }
.menu-sbs li { display:inline-block; padding:0 1em; border-right:1px solid rgba(0,0,0,.3); }
.menu-sbs li:first-child { padding-left:0; }
.menu-sbs li:last-child { border-right:0; }
.footer-links li { display:block; margin-bottom:10px; }

#content { background:white; padding:50px 16px; }

#top-steps { background: rgb(255,0,0); background: linear-gradient(0deg, rgba(220,220,220,1) 0%, rgba(225,225,225,0) 100%); }
.step-circle { position:absolute; width:60px; height:60px; background:#4854b2; color:white; font-size:28px; margin-left:-20px; margin-top:-20px; border-radius:50%; line-height:60px; }

#recent-examples { background:#4854b2; color:white; }

/* Text Styles */
p { margin:0; padding:0; }
.bold { font-weight:bold; }
.small { font-size:13px; }
.blue-color { color:#4854b2 }

/* Buttons */
.cta { display:inline-block; background:white; border-radius:6px; padding:9px 18px; color:black; font-weight:bold; }
.btn { display:inline-block; vertical-align:middle; padding:9px 18px; border:1px solid white; border-radius:6px; color:white; font-weight:bold; }
.blue-btn { display:inline-block; vertical-align:middle; padding:9px 18px; background:#4854b2; border:1px solid #4854b2; border-radius:6px; color:white; font-weight:bold; }
.button { cursor:pointer; background:#4753b1; border-radius:12px; padding:8px 12px; display:inline-block; }

.grid { display:grid; grid-template-columns: repeat(3, 1fr); gap:30px 80px; }
.grid-thumb { background:rgba(72,84,178,.1); width:100%; margin-bottom:20px; }
.grid-thumb img { display:block; width:100%; }

textarea, input[type=text], input[type=tel], input[type=email], input[type=password] { font-family:inherit; padding:10px; width:90%; margin-bottom:10px; font-size:16px; }
textarea { font-family:inherit; }
#c_email2 { display:none; }
.error { background: #f4acac }
.success { background: #d1e9fc; }
.response { padding:20px; border-radius:10px; margin-bottom:25px; }
input[type=submit] { font-size:16px; }

/* Footer */
footer { }
.footer-section { display:inline-block; vertical-align:top; min-width:160px; padding-right:60px; margin-bottom:20px; }
#footer-toprow { background:#E6E6E6; padding:40px 16px; }
#footer-bottomrow { background:#CCC; padding:16px; }
#notedit-small-icon { display:inline-block; width:50px; margin-right:16px; vertical-align:middle; }

/* Cookie Notice */
.nocconsent footer { padding-bottom:68px; }
#cookie-consent { position:fixed; width:100%; bottom:0; background:black; padding:16px; }
#cookie-consent p { font-size:14px; display:inline-block; color:white; }

/* Misc */
.padr { padding-right:50px; }

/* Media Queries */
@media (max-width: 1000px) {
	.grid { grid-template-columns: repeat(2, 1fr); gap:30px 82px; }
}
@media (max-width: 770px) {

	.inner { padding:0 24px; }

	#top .inner { padding:55px 0; }
	.bg-graphic { background: url('/_resources/gfx/notedit-topgraphic.svg') 110% center no-repeat; background-size:60%; }
	#top .top-text { padding:0 40px; }
	#top .top-text p { font-size:24px; }

	header .inner { padding:0 16px; }
	#logo { background-size:161px; width:51px; }

	.grid { grid-template-columns: repeat(1, 1fr); gap:30px 50px; }
	
	.fw { width:100%; }
	.mob-center { text-align:center; }
	#footer-bottomrow .menu-sbs { margin-bottom:10px; }

	.footer-section { padding-right:40px; min-width:auto; }
	#mob-flex { display:flex; flex-direction:column; }
	#mob-flex-2 { order:1; }
	#mob-flex-1 { order:2; }

	.nopad { padding:0 !important; }
}