@font-face{
	font-family: 'MaisonNeue';
	src: url('/fonts/MaisonNeue-Light.woff'), url('/fonts/MaisonNeue-Light.woff2');
	font-weight: normal;
}

@font-face{
	font-family: 'MaisonNeue';
	src: url('/fonts/MaisonNeue-Medium.woff'), url('/fonts/MaisonNeue-Medium.woff2');
	font-weight: bold;
}

::-moz-selection{background: #7A6855; color: white;}

::selection{background: #7A6855; color: white;}

/**************** RESET STYLES IS A GOOD THING *************************************************************************/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, 
menu, footer, header, nav, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0;}

main, article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {display: block;}

a{text-decoration: none; color: inherit;}
a img {border: 0;}

figure {position: relative;}
figure img {width: 100%;}

img{user-drag: none; -moz-user-select: none; -webkit-user-drag: none;}

label{cursor: pointer;}
*{box-sizing: border-box; margin: 0; padding: 0; outline: none;}

html{font-family: 'MaisonNeue'; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 24px; line-height: 1.2500001; letter-spacing: 0.05em; color: #7A6855; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto;}
body{background: rgb(250,250,250);}

article p:not(:last-child){margin-bottom: 24px;margin-bottom: 1rem;}

h1{font-size: 42px;font-size: 1.75000014rem;}
h1 span{font-weight: normal;}
h2{font-size: 42px;font-size: 1.75000014rem; font-weight: bold; letter-spacing: 0.03em; margin-bottom: 24px; margin-bottom: 1rem; text-align: center;}
h3{font-size: 24px;font-size: 1rem;}

.intro{height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;}
.intro header{padding: 140px; text-align: center;}
.intro .slider{-webkit-box-flex: 1;-ms-flex: 1;flex: 1; display: flex; flex-direction: column;}

main{max-width: 1220px; margin: 90px auto 0; padding: 0 90px;}

.introduction{text-align: center; max-width: 820px; font-size: 32px; font-size: 1.33333344rem; margin: 0 auto 130px;}
.introduction footer{font-size: 0.8rem;}

.content{margin-bottom: 110px;}
.content .people{margin-bottom: 50px;}
.content .people .person{display: inline-block; min-width: calc(50% - 50px); margin: 0 25px 50px;}
.content .body{margin: 0 auto; text-align: left; margin-left: 25px;}

.map{margin-bottom: 60px; width: 100%; height: 580px;}
/** some comment **/

.contact{font-style: normal; margin-bottom: 25px; display: flex; width: 100%;}
.contact .address{float: left; margin-bottom: 24px; margin-bottom: 1rem; padding-right: 50px;}
.contact .media{float: left; margin-left: auto;}

footer.main{padding-bottom: 80px;}
footer.main img{width: 400px; max-width: 100%; display: block; margin: 0 auto;}

.slider .slider-inner{width: 100%; height: 100%; position: relative; overflow: hidden; cursor: pointer;}
.slider .slider-image{width: 100%; height: 100%; background-size: cover; background-position: center center; position: absolute; left: 0; top: 0;}

.slider .slider-controlls {height: 70px; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0 0 5px 0;}
.slider .slider-controlls a{width: 16px; height: 16px; border-radius: 100%; display: block; margin: 0 15px; position: relative;}
.slider .slider-controlls a:before{width: 14px; height: 14px; background: #7A6855;}
.slider .slider-controlls a:before,
.slider .slider-controlls a:after{content: '.'; font-size: 0; line-height: 0; letter-spacing: 0; display: block; border-radius: 100%; position: absolute; top: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: .3s; transition: .3s;}
.slider .slider-controlls a:after{width: 0px; height: 0px; background: white;}
.slider .slider-controlls a.active{pointer-events: none;}

.slider .slider-controlls a:hover:before{width: 12px; height: 12px;}
.slider .slider-controlls a.active:before{width: 14px; height: 14px;}
.slider .slider-controlls a.active:after{width: 8px; height: 8px;}
.slider .slider-image:nth-child(n+2){left: 100%;}

.intro .slider .slider-inner{height: calc(100% - 120px); flex: 1;}
.intro .slider .slider-inner:only-child{height: 100%;}
.intro .slider .slider-image{background-attachment: fixed;}

.intro .slider .slider-controlls {height: 120px; -webkit-box-align: center; -ms-flex-align: center; -ms-grid-row-align: center; align-items: center;}

main .slider{height: 580px; margin-bottom: 60px; padding-bottom: 60px;}


/******* Misc *******/

.cf:after{content: "."; font-size: 0; line-height: 0; clear: both; display: block; visibility: hidden; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}

@media all and (max-width: 1200px){
	.contact{margin-bottom: 160px;}
	.contact {flex-direction: column;}
	.contact .media {margin-left: 0;}
}    

@media all and (max-width: 1000px){
	h1 span{width: 100%; display: block;}
}

@media all and (max-width: 640px){
	.intro header{padding: 100px 0;}
	main{margin-top: 10px; padding: 0 20px;}
	.introduction{margin-bottom: 60px;}
	
	.slider .slider-controlls a,
	.slider .slider-controlls a:before{width: 12px; height: 12px;}
	.slider .slider-controlls a:hover:before{width: 8px; height: 8px;}
	.slider .slider-controlls a.active:before{width: 12px; height: 12px;}
	.slider .slider-controlls a.active:after{width: 6px; height: 6px;}
	
	.intro .slider .slider-inner{height: calc(100% - 80px);}
	.intro .slider .slider-image{background-attachment: initial;}
	.intro .slider .slider-controlls {height: 80px;}
	
	.content .body{margin-left: 0;}

	
	main .slider{height: 330px; margin-bottom: 20px; padding-bottom: 40px;}
	main .slider .slider-controlls{height: 40px; margin-bottom: 30px;}
	
	.content .people .person{display: block; width: 100%; margin: 0 0 50px 0;}
	
	.map{display: none;}
	
	footer.main{border-width: 30px;}
}

@media all and (max-width: 480px){
	html{font-size: 16px};
}

@media all and (min-width: 640px) and (max-height: 800px){
	
	.intro header{padding: 100px 0;}
	
}

@media all and (min-width: 640px) and (max-height: 600px){
	
	.intro header{padding: 50px 0;}
	
}