@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300&display=swap');
*{margin:0;padding:0;border:0;}
html{overflow-y:scroll;}
body{font-family:Arial,Helvetica,sans-serif;font-size:13px;}
a{text-decoration:none;}
a:hover{color:#000;text-decoration:none;}
#wrap{width:633px;margin:10px auto 0 auto;padding-bottom:10px;}
#logo{padding-left:5px;}#logo img{width:125px;}

#nav{width:633px;border-top:2px solid #6e8a97;padding-bottom:20px;margin-top:6px;}
#nav ul{list-style-type:none;text-align:center;}
#nav li{display:inline-block;padding:0 10px;margin:0 10px;font-family:'Comfortaa',sans-serif;font-size:15px;}
#nav li a{color:#000;}
#nav li a:hover{color:#6e8a97;}
#nav li.active{background:#6e8a97;color:#fff;}

#copybox{width:633px;height:400px;background:#fff;}
#copy{padding:10px;}
#copy p{color:#000;font-size:13px;margin-bottom:1em;line-height:1.5em;}
#copy a{color:#000;font-weight:bold;}
#copy a:hover{color:#ccc;}
#rend-grid p,#illus-grid p,#home-grid p{text-align:center;padding-bottom:10px;}
#rend-grid p a,#illus-grid p a{padding:0 5px;}
#home-grid p img{margin:0 5px;}
#rend-grid p.rend-blue img{border:3px solid #000;}
#rend-grid p.rend-red img{border:3px solid #000;}
#home-grid p.home1 img{border:3px solid #000;}
#home-grid p.home2 img{border:3px solid #000;}
#home-grid p.home3 img{border:3px solid #000;}

#contactform textarea,#contactform input{border:1px solid #000;}


@media (max-width:650px)
{
#wrap{width:90%;margin:0 auto;}
#nav,#copybox{width:100%;margin:0 auto;}
#nav-home{margin-left:0;}
#home-grid p{padding-bottom:4px;width:100%;}
#home-grid p img{margin:0 3px;}
#home-grid img{width:28%;margin:0;}
#contactform textarea{width:80%;}
}