@charset "UTF-8";

/* screens smaller than 768---------------------------------------------------------- */
@media only screen and (max-width:768px) {

html{
	font-size: 11px;
}
body {
	min-width: inherit;
	width: 100vw;
	font-size: 1rem;
}
img {
	width: 100%;
	height: auto;
}
.spdisn{
	display: none;
}
.pcdisn{
	display: block;
}

#nav{
	position: relative;
	height: 12vmax;
}
#nav h1{
	top: 3.6vmax;
	left: 5vw;
}
#nav h1 > a{
	font-size: 1.5rem;
}
#nav h1 > a span{
	font-size: 1.0rem;
}

footer{
	background: #454545;
}
footer p{
	padding: 3vmax 0;
	font-size: 1rem;
}

#hero{
	height: 28vmax;
}
#hero.top{
	height: calc(100vh - 12vmax);
}

#main{
	width: 100%;
	min-height: inherit;
	padding: 4vmax 5vw 8vmax;
	font-size: 1rem;
}
#main h2{
	padding: 0 0 2vmax;
	font-size: 2.43rem;
}
#main h3{
	font-size: 1.4rem;
}
#main li{
	margin: 0 0 2rem;
}


/* PROFILE */

#main.profile .image{
	margin: 0 0 3vmax;
}
#main.profile h3{
	margin: 0 0 1rem;
	font-size: 1.57rem;
}


/* CONTACT */

#main.contact #formWrap {
	margin:2rem auto 0;
}
#main.contact table.formTable th{
	width:45%;
}
#main.contact table.formTable input,
#main.contact table.formTable textarea{
	width: 100%;
	padding: 0.5rem;
	box-sizing: border-box;
	font-size: 16px;
}
#main.contact p.btn{
	padding: 4vmax 0 0;
}
#main.contact p.btn > *:hover{
	cursor: pointer;
}
#main.contact input[type="submit"],
#main.contact input[type="button"],
#main.contact input[type="reset"]{
	width: 100%;
	margin: 0 0 2rem;
	padding: 1.6rem 0;
}
#main.contact p{
	margin: 0 0 1rem;
}

/*------------------------------------------------------------------------------*/
}