/* =========================
   MAIN LAYOUT
========================= */

main{
max-width:900px;
margin:40px auto;
padding:28px;
background:#ffffff;
color:#222;
font-size:17px;
line-height:1.75;
}


/* =========================
   SECTION SPACING
========================= */

main section{
margin-bottom:48px;
}


/* =========================
   INTRO SECTION
========================= */

.section-intro{
border-bottom:1px solid #e5e5e5;
padding-bottom:18px;
}


/* =========================
   HEADINGS
========================= */

main h1{
font-size:34px;
font-weight:700;
margin-bottom:16px;
line-height:1.3;
color:#111;
}

main h2{
font-size:26px;
font-weight:600;
margin-top:26px;
margin-bottom:14px;
color:#1a1a1a;
}

main h3{
font-size:20px;
margin-top:20px;
margin-bottom:10px;
}


/* =========================
   PARAGRAPHS
========================= */

main p{
margin-bottom:16px;
color:#333;
}


/* =========================
   LISTS
========================= */

main ul{
margin-top:10px;
margin-bottom:18px;
padding-left:22px;
}

main li{
margin-bottom:8px;
}


/* =========================
   LINKS
========================= */

main a{
color:#0a58ca;
text-decoration:none;
font-weight:500;
}

main a:hover{
text-decoration:underline;
color:#063a8f;
}


/* =========================
   CONTENT BOX STYLE
========================= */

main section{
background:#ffffff;
padding:6px 0;
}


/* =========================
   HIGHLIGHT BLOCK
========================= */

main blockquote{
border-left:4px solid #dcdcdc;
padding-left:16px;
margin:22px 0;
color:#555;
font-style:italic;
background:#fafafa;
}


/* =========================
   IMAGE STYLE
========================= */

main img{
max-width:100%;
height:auto;
border-radius:6px;
margin:16px 0;
}


/* =========================
   MOBILE RESPONSIVE
========================= */

@media (max-width:768px){

main{
padding:20px;
font-size:16px;
}

main h1{
font-size:28px;
}

main h2{
font-size:22px;
}

main h3{
font-size:18px;
}

}