/* Overall content */
body {

background-color: orange;
}

header{
font-family:cursive;

font-size: -webkit-xxx-large;

font-style: normal;

text-align: center;

color: navy;

width: 100%;

height: 10vh;

}

nav{

  text-align: center;
  display: inline;
  width: 20%;
}

nav ul li{
  background-color: brown;
  display: inline;
  padding: 1%;
margin: 1vh;
width: 2vh;
}

nav ul li a{
  font-size: 20px;
  font-family: sans-serif;
text-decoration: none;
color: floralwhite;

}

nav ul li a:hover{
  background-color: orange;
}

/* home index */
 h1{

font-family: cursive;

font-size: x-large;

color: navy;

text-align: center;

margin: 5px;

padding: 1%;

}

p{
text-align: center;
font-family: sans-serif;
font-size: 18px;
color: floralwhite;
padding-bottom: 1%;
}

button{
  cursor: pointer;
  text-align: center;
  border: solid;
  font-family: cursive;
  font-size: 20px;
  color: floralwhite;
  background-color: deepskyblue;
  text-transform: uppercase;
  padding: 1%;
  clear: both;
  display: flex;
  justify-content:center;
  margin-top: 2%;
  margin-left: 40%;
}

button:hover{
background:darkblue);
}

section img{
width: 100%;
padding: 2vh inherit;
margin-top: 1%;
}

footer{
  display: block;
  font-family: cursive;
  font-style: italic;
  color: navy;
  float: none;
}

/* about content */
.Boxtype{
  border: solid;
    background-color: brown;
    color: white;
    padding: 1%;
    border-block-width: 5px;
    text-align:center;
    margin-left: 500px;
    margin-top: 40px;
}

.Boxtype h1{
  font-family: cursive;

  font-size: x-large;

  color: floralwhite;

  text-align: center;

  margin: 5px;

  padding: 1%;

}
.Boxtype p{
  text-align: center;
  font-family: sans-serif;
  font-size: 18px;
  color: floralwhite;
  padding-bottom: 1%;
}


.imagecreative{
  padding: 130px;
  text-align: left;
margin-top: 60% auto;
display: flex;
}

/* portfolio content */
.design{
  border: solid;
    background-color: brown;
    color: white;
    padding: 1%;
    border-block-width: 5px;
    text-align:center;
    margin-left: 5px;
    margin-top: 4px;
}
.design h2{
  font-family: cursive;

  font-size: x-large;

  color: floralwhite;

  text-align: center;

  margin: 5px;

  padding: 1%;

}


.branding{
  border: solid;
    background-color: brown;
    color: white;
    padding: 1%;
    border-block-width: 5px;
    text-align:center;
    margin-left: 5px;
    margin-top: 4px;
}
.branding h3{
  font-family: cursive;

  font-size: x-large;

  color: floralwhite;

  text-align: center;

  margin: 5px;

  padding: 1%;
}

.packaging{
  border: solid;
    background-color: brown;
    color: white;
    padding: 1%;
    border-block-width: 5px;
    text-align:center;
    margin-left: 5px;
    margin-top: 4px;
}
.packaging h4{
  font-family: cursive;

  font-size: x-large;

  color: floralwhite;

  text-align: center;

  margin: 5px;

  padding: 1%;
}

.media{
  border: solid;
    background-color: brown;
    color: white;
    padding: 1%;
    border-block-width: 5px;
    text-align:center;
    margin-left: 5px;
    margin-top: 4px;
}
.media h5{
  font-family: cursive;

  font-size: x-large;

  color: floralwhite;

  text-align: center;

  margin: 5px;

  padding: 1%;
}

label{
  font-family: cursive;

  font-size: x-large;

  color: navy;

  text-align: center;

  margin: 5px;

  padding: 1%;
}

/* contact content */
.Boxtype h2{
  font-family: cursive;

  font-size: x-large;

  color: floralwhite;

  text-align: center;

  margin: 2px;

  padding: 1%;
}

.Boxtype h3{
  font-family: cursive;

  font-size: x-large;

  color: floralwhite;

  text-align: center;

  margin: 2px;

  padding: 1%;
}

.Boxtype h4{
  font-family: cursive;

  font-size: x-large;

  color: floralwhite;

  text-align: center;

  margin: 2px;

  padding: 2px;
}
.girlwithphonecontactimage{
  
}