@font-face {
    font-family: 'NeutrTexGre';
    src: url('NeutrTexGreLig.otf');
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: 'NeutrTexGre';
    src: url('NeutrTexGreDem.otf');
    font-weight: 700;
    font-style: normal
}
@font-face {
    font-family: 'NeutrTexGre';
    src: url('NeutrTexGreBoo.otf');
    font-weight: 500;
    font-style: normal
}
@font-face {
    font-family: 'NeutrTexGre';
    src: url('NeutrTexGreBol.otf');
    font-weight: 900;
    font-style: normal
}
@font-face {
    font-family: 'MyriadPro';
    src: url('MyriadPro-Regular.otf');
    font-weight: 500;
    font-style: normal
}
@font-face {
    font-family: 'MyriadPro';
    src: url('MyriadPro-Semibold.otf');
    font-weight: 600;
    font-style: normal
}
@font-face {
    font-family: 'MyriadPro';
    src: url('MyriadPro-Bold.otf');
    font-weight: 900;
    font-style: normal
}

	* {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	body {margin:0;padding:0;font-size:16px;line-height:1.5}
	h1 {
		font-weight: 700;
		line-height: 1;
		font-size: 2em;
		margin: 1.5em 0;
		color: #a276b4;
		font-family: 'NeutrTexGre', serif;
		width:100%; text-align:center;
	}
	h2 {
		font-weight: 700;
		line-height: 1.25em;
		font-size: 1.5em;
		margin-bottom: 8px;
		color: #a276b4;
		font-family: 'NeutrTexGre', serif;
		width:100%;
	}
	h3 {
		font-weight: 900;
		font-size: 1em;
		color: #a276b4;
		font-family: 'NeutrTexGre', serif;
	}
	h4 {
		font-weight: 500;
		font-size: 1em;
		margin: 0px 0px 20px;
	}

	header {
		position:relative; width:100vw; height:750px; top:0; left:0;
		background-repeat:no-repeat; background-position:right top; background-size:cover;
	}
	header img {position:absolute;}
	header img.logo {top:5%;left:12%;width:300px;}
	header img.newlogo {top:5%;left:12%;width:300px;}
	header img.trademark {width:400px; top:50%;left:50%; transform:translate(-50%,-50%)}

	#contact-form {
		position:relative;width:60vw;top:-50px;left:50%;transform:translateX(-50%);
		background-color:#fff; 
	}
	#contact-form form {
		background:#FFF;
		display:flex;flex-wrap:wrap; justify-content: space-around;
		padding:2em;
		font-family:Roboto; color:#666; border:1px solid #eee;
	}
	#contact-form form h2 {text-align:center}
	#contact-form form input[type="text"],
	#contact-form form input[type="email"],
	#contact-form form input[type="tel"],
	#contact-form form select {
		width:47%; 
		background-color:#eee; border:1px solid #ccc; border-radius:4px;
		padding:.5em; margin:.75em 0;
		color:#666; font-size:1em; font-style: italic;
	}
	#contact-form form fieldset {width:100%; border:none;text-align:center}
	#contact-form form .terms {width:100%;margin:2em 0;font-size:.75em; font-style:italic; color:#999; text-align:center;line-height:1}
	.button {
		background-color:#A276B4; 
		padding:.75em 2.5em; border:none; border-radius:6px; 
		line-height:1;font-family:NeutrTexGre; font-size:1.25em; font-weight:bold; color:#FFF; 
		cursor: pointer;
	}

	article div.panel {
		display:flex; align-items:stretch; position:relative;left:50%;transform:translateX(-50%);
		max-width:1350px; padding:1em;
	}
	article div.panel img {
		width:60%;object-fit:cover;
	}
	article div.panel div.context {
		width:40%;padding:1em;font-family: roboto; line-height:2; color:#666;
	}
	article div.panel div.context a.button {
		display:inline-block;margin-top:1em;text-align: center;padding:.5em 1em;
	}
	article div.panel:nth-child(even) {
		flex-direction: row-reverse;
	}
	article div.icons {
		position:relative; display:flex; flex-wrap:wrap; justify-content:space-around; text-align:center;
		margin:0 auto; max-width:1350px; padding-bottom:4em;
	}
	article div.icons figure {width:150px;margin:0;padding:0;padding-top:8em}
	article div.icons figure img {height:60px}
	article div.icons figure figcaption {font-family:'NeutrTexGre';font-size:1em;line-height:1.5em;font-weight:bold; color:#a276b4}

	footer {position:relative; padding:3em; background-color:#A276B4}
	footer div.container{max-width:1350px;display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center;margin:0 auto}
	footer div.container img.logo {width:20%}
	footer div.container table.contact-data {width:30%;border:none; padding:0;margin:0; font-family:Roboto; color:#FFF;}
	footer div.container table.contact-data td {border-bottom:1px dotted rgba(255,255,255,.25);}
	footer div.container table.contact-data td.area {max-width:120px; font-size:1.25em; font-weight:bold}
	footer div.container table.contact-data td.addr {max-width:150px;font-size:1em;color:rgba(255,255,255,.5)}
	footer div.container span.prompt {padding:10px 0; text-align:center; font-family:Roboto; font-size:1.25em; color:rgba(255,255,255,.5);line-height: 1em}
	footer div.container span.tel {text-decoration:none; font-family:Roboto; font-size:2em; font-weight:bold; color:#FFF;line-height: 1em}

	footer div.top {width:50%;margin:2em auto 0}
	footer div.top a.button {
		position:relative;display:block;
		width:100%; height:60px;
		background-color:rgba(0,0,0,.10);
		padding:.5em; margin:0;
		line-height:1em;text-align:center; font-size:1em;
	}

@media all and (max-width:1200px) {
	#contact-form {width:80vw}
}

@media all and (max-width:900px) {
	
	header {height:265px; background-position:85% top;}
	header img.logo {width:100px; top:0;left:0;}
	header img.newlogo {width:200px; top:10px;left:10px;}
	header img.trademark {width:200px}

}
@media all and (max-width:750px){
	#contact-form form h2 {text-align:center}
	
	#contact-form form input[type="text"],
	#contact-form form input[type="email"],
	#contact-form form input[type="tel"],
	#contact-form form select {width:80%}
	
	article div.icons figure{padding:0}
	
	article div.panel:nth-child(even) {flex-direction: column;}
	article div.panel {flex-direction:column;align-items:center}
	article div.panel img {width:100vw;margin:0;padding:0}
	article div.panel div.context {position:relative;padding:0em 2em;width:90%;background-color:#FFF;top:-50px;line-height:2em}
	
	footer div.container {flex-direction: column;font-size:.9em}
	footer div.container img.logo {min-width:200px;padding:0}
	footer div.container table.contact-data {width:100%;margin:3em 0;padding:0}
	footer div.container table.contact-data td.area {text-align: right}
}
@media all and (max-width:550px){
	p,h2,h3,h4 {text-align: center}

	#contact-form {width:90vw}
	#contact-form form h2 {text-align:center}
	#contact-form form input[type="text"],
	#contact-form form input[type="email"],
	#contact-form form input[type="tel"],
	#contact-form form select {width:100%}
	
	article div.panel div.context {padding:0 0.5em}
	article div.panel div.context a.button {display:block;width:80%;margin:0 auto;}
}