﻿html, body { padding: 0; margin: 0; width: 100%; height: 100%; }
body { font-family: 'Barlow Condensed',sans-serif; display: flex; }
body * { box-sizing: border-box; }
body > div.cnt { height: 100%; width: 50%; background: #FFF; display: flex; flex-direction: column; justify-content: center; align-items: center; }
body > div.cnt > * { width: 75%; margin: 0 0 25px 0; text-align: left; font-size: 1.2em; line-height: 1.4em; }
body > div.cnt > .img { margin: 25px 0 25px 0; text-align: center; }
body > div.cnt > .img > img { width: 80px; height: auto; }
body > div.cnt > .title { display: inline-block; font-size: 2em; line-height: 2rem; letter-spacing: 0em; font-weight: 700; text-align: center; text-transform: uppercase; color: #164648; }
body > div.cnt > .contact { border-top: 1px solid grey; padding-top: 15px; }
body > div.cnt > .contact strong { color: #164648; }
body > div.cnt > .footer { text-align: left; font-size: 1em; line-height: 1.2em;}
body > img { width: 50%; object-fit: cover; }
body a {color: #164648; font-weight: 500; }

@media (max-width:1500px) {
    body > div.cnt { width: 70%; }
    body > img { width: 30%; }
    body > div.cnt > .title { font-size: 1.8em; line-height: 2rem; }
}

@media (max-width:1023px) {
    body > div.cnt > * { width: 90%; }
}

@media (max-width:767px) {
	html, body { height: auto; }
    body { flex-direction: column; }		
    body > div.cnt { width: 100%; padding: 0 15px; }
	body > div.cnt > * { width: 95%; font-size: 1em; line-height: 1.2em; }
	body > div.cnt > .img > img { width: 60px; height: auto; }
	body > div.cnt > .title { font-size: 1.1em; line-height: 1.2rem; }
    body > img { width: 100%; flex-grow: 0; height: 250px; max-height: 30vh; }   
}
