/*UNIVERSAL STYLES*/

header{background-image:url("images/mary_paris.jpg"); background-repeat:no-repeat; background-size:cover; min-height:30vh; font-family:Helvetica, sans-serif; font-size:5vw; letter-spacing:.3em; text-shadow: 2px 2px 8px #7E6F6C;}
   header a{text-decoration:none; color:#263647; line-height:3em; padding-left:1em;}

nav{width:100%; overflow:hidden; background-color:#263647; text-align:center; position:relative;}
   nav a{display:block; float:left; color:#FFFFFF; padding:14px 16px; text-decoration:none; text-align:center;}
   nav a:hover, .subnav:hover .subnavbtn{background-color:#7E6F6C;}
   .subnav{font-size:inherit; float:left; overflow:hidden;}
      .subnav .subnavbtn{font-size:inherit; border:none; outline:none; color:#FFFFFF; padding:14px 16px; background-color:inherit; font-family:inherit; margin:0;}
   .subnav-content{display:none; left:0; background-color:#263647; z-index:1;}
   .subnav-content a{float:left; color:#FFFFFF; text-decoration:none;}
   .subnav-content a:hover{background-color:#7E6F6C; color:#263647; width:100%;}
   .subnav:hover .subnav-content {display:block;}
   

main{padding:1vh 2vw;}
   main nav{background-color:#E0C3C2; color:#000000; text-align:center; float:none; font-family:sans-serif; font-variant:small-caps;}
   main nav a{color:#000000; text-align:center; margin:auto;}
   main nav a:hover{color:#000000;}

h3{font-variant:small-caps; font-family:sans-serif; color:#263647;}

dt{font-weight:bold; font-variant:small-caps;}

dd{padding-bottom:1em;}

blockquote{font-style:italic;}

iframe{border:0; width:100%;}

img{width:100%;}

form{display:flex; flex-direction:column; padding-left:1em; width:80%; margin-bottom:1.5em;}
   input, textarea{margin-bottom:0.5em;}

footer{font-size:.70em; font-style:italic; text-align:center; padding:1em;}

.wrapper{background-color:#608782; background-image:conic-gradient(from 110deg, #FFFFFF, #608782); background-repeat:no-repeat; box-shadow:5px 5px 5px; width:85%; margin-right:auto; margin-left:auto; font-size:1.5em;}

.checkboxes{flex-direction:row;}

.submitbutton{width:100px; height:50px; margin:auto;}

#videos p, #videos a, #videos iframe{padding-left:1em;}

div.gallery {border: 1px solid #ccc;}
   div.gallery:hover {border: 1px solid #777;}
   div.gallery img {width: 100%; height: auto;}
   div.desc {padding: 15px; text-align: center;}

* {box-sizing: border-box;}

.responsive {padding: 0 6px; float: left; width: 50%;}

.clearfix:after{content:""; display:table; clear:both;}

/*SMALL DISPLAY STYLES*/

@media (max-width: 600px) or (orientation:portrait) {
header{font-size:10vw; font-weight:bold; height:100px;}
header a{line-height:150%; text-align:center; vertical-align:middle;}

.wrapper{width:100%; font-size:5vw;}

h2{font-size:5vw;}

   nav {float:none; position: relative; right: 0; top: 0;}
   nav a {float: none; display: block; text-align: center; padding:0.5em;}
   nav .subnav {display: block; width: 100%; text-align: center;}
   .subnav {text-align:center; display:block; width:100%;}
   .subnav a{width:100%; background-color:#7E6F6C;}
   .subnav-content{width:inherit; text-align:inherit; background-color:#7E6F6C; color:#7E6F6C;}
   .subnav-content a{text-align:center;}
   .subnav-content a:hover{text-align:inherit; display:inherit; width:inherit; background-color:#E0C3C2; color:black;}

main{padding:5%; padding-top:0;}

input[type="text"]{min-height:8vw;}
input[type="email"]{min-height:8vw;}
input.checkboxes{width:50px;}

.responsive-iframe{position:absolute; top:0; left:0; bottom:0; right:0; width:100%; height:100%;}

.responsive{width:100%;}

footer{font-size:0.6em; padding:3%;}

}

/*MEDIUM DISPLAY STYLES*/

@media (min-width:600px) {

form{width:60%;}

.responsive{width:50%; margin:6px 0;}


}


/*LARGE DISPLAY STYLES*/

@media (min-width:1024px) {

.submitbutton{width:400px; height:50px; font-weight:bold;}

}