/* General For All
light brown: #C99F71;
brown: #B97A46;
plum: #7B4D5A;
yellow: #F2E4AA;
light pink: #F2A88D;
hot pink: #DA736B;
off-white: #E2DEDC;

font-family: 'strawberrymilkshakemedium'
–––––––––––––––––––––––––––––––––––––––––––––––––– */
* {text-decoration: none; box-sizing: border-box;}

body{margin: 0;  background-color: #f4eeec;}

img{max-width: 100%;}

header {width: 100%; height: auto; margin-top: 40px; background-color: #836F6F;}

header img {width: 100%; max-width: 1400px;}

.center {display: block; margin-left: auto; margin-right: auto;}

section {width: 100%; max-width: 500px; height: auto; margin: auto; text-align: center; padding-top: 20px;}

section p {font-family:'strawberrymilkshakemedium'; color: #7B4D5A; font-size: 1.25em; line-height: 25px; padding: none;}

.summary {width: 100%; max-width: 800px; margin: auto;  font-family: 'Helvetica', sans-serif; color: black; font-size: 1em;}

nav {width: 100%; height: 40px; background-color: #C99F71; margin: auto; text-align: center; padding: 6px; box-sizing: border-box; position: fixed; top: 0; z-index: 10000000;}

nav a {color: white; margin: auto; padding-left: 100px; padding-right: 100px; box-sizing: border-box; font-family: 'strawberrymilkshakemedium'; font-size: 1.35em;}

nav a:hover {color:#7B4D5A;}

.container {width: 100%; max-width: 1024px; height: auto; margin: auto; text-align: center;}

h1 {font-family:  'strawberrymilkshakemedium'; text-align: center; color: #7B4D5A;}

#video {width: 100%; height: 500px; margin: auto; padding-top: 50px;}


video::-webkit-media-controls-panel {
   background-image: none !important;
    filter: brightness(4.0);
}

/*
video::-webkit-text-fill-color {
color: white; !important;
 text-decoration-color: white; !important;

}

video::-webkit-media-controls {
display:none !important;
}
*/



#idea, #gallery, #prototype, #conclusion {width: 100%; height: auto; padding: 30px;}

p {font-family: 'Helvetica', sans-serif; text-align: center; padding-left: 50px; padding-right: 50px; line-height: 22px; }

#prototype a {color: #DA736B; }

#prototype ul {  list-style-type: none; list-style-position: inside;
  margin: 0;
  padding: 0;}

#prototype li {list-style-type: none;}

.image_wrap {width: 100%;  max-width: 1024px; height: auto; display: flex;  flex-wrap: wrap; flex-direction: row; justify-content: space-between;}

.names {width: 50%; max-width: 1024px;}

.names p {font-family:  'strawberrymilkshakemedium'; color: #7B4D5A; font-size: 1.4em;}

footer {width: 100%; height: 40px; background-color: #7B4D5A; text-align: center; color: white; padding-top: 10px; padding-bottom: 10px; font-family: 'Helvetica', sans-serif;}



/* Tablet
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (min-width: 481px) and (max-width: 800px) {
 body {background-color: blue;}
    
 nav a {padding-left: 30px; padding-right: 30px;}


}
/* Mobile
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (max-width: 480px)
{
 body {background-color: red;}
    
 header img {width: 100%; max-width: 480px;}
    
 nav {display: block; height: 250px; text-align: center; padding-left: 10px; padding-right: 10px; padding-top:12px; line-height: 42px;}
    


}