@charset "UTF-8";
/*CSS Document*/


body {
    font-family:"Special Elite","Trebuchet MS", "Segoe UI";
    font-size:16px;
    text-align: left;
    line-height: 24px;
    color:#430A0A;
    background:#D6D6D6;
    background-image:url(https://themalformation.neocities.org/images/meat-ground.png);
    margin:0;
    padding:0;
}

h1,h2,h3,h4 
     {
    font-family: "Love Ya Like A Sister","Georgia";

    color: #820003;
}

  h1 {
    Color:#712833;
    font-size: 48px;
    line-height: 50px;
    background-color:#E4DDD8;
    padding:10px;
    text-align:center;

  }
      
  h2 {
      color:#D6ABB1;
      font-size: 30px;
      line-height: 35px;
      background-color:#55020B;
      padding:13px 10px;
      
  }
  
  h3 {
      font-size: 26px;
      line-height: 20px;

  }
    
  h4 {
      font-size: 24px;
      line-height: 29px;
      
  }
  
blockquote {
      font-size:22px;
      background-color:#E4DDD8;
      padding:10px 20px;
}

/*Header STYLES \/
==========================*/

header{
  text-align: center;
}


/*Nav STYLES \/
==========================*/

nav {
  background-color:#DEC0C3;
  padding:16px;
  text-align: center;
  text-transform:uppercase;
  margin-bottom:20px;
 }

nav li {
    display:inline;
    margin-right:48px;
    
 }
 
 nav a:focus,
 nav a:hover {
   color:#fff;
   text-decoration: blink;
 }
 
 nav a:active {
   color:#A41919;
 }




/*MAIN STYLES \/
==========================*/
main{
      background-color:#CCA4A8;
      padding:4px 32px 24px;
      width: 68%;/*680 pixels*/
      float:left;
      -webkit-box-sizing: boarder-box;
      -moz-box-sizing:boarder-box;
      box-sizing:border-box;
      margin-bottom:20px;
}


/*LINK STYLES \/
==========================*/

a:link {
    color: #A41919;
    font-weight:bold;
    text-decoration:none;
}

a:visited {
    color: #792026;
}

a:focus,
a:hover {
    color:#222;
    text-decoration:underline;
}

a:active {
    color: #A41919;
}

/*Aside STYLES \/
==========================*/

aside {
  background-color:#CCA4A8;
  padding:4px 16px 24px;
  width:30%;/*300 pixels*/
  float:right;
    -webkit-box-sizing:boarder-box;
    -moz-box-sizing:boarder-box;
    box-sizing:border-box;
    margin-bottom: 20px;
  
}

aside h2 {
  background-color:#E4DDD8;
  color:#712833;
  text-align: center;
  padding:0;

}


/*FOOTER STYLES \/
==========================*/

footer {
  clear: both;
  text-align:center;
  height:200px;
  background-color:#DEC0C3;
  padding: 32px 8px 0px;
  -webkit-box-sizing:boarder-box;
  -moz-box-sizing:boarder-box;
  box-sizing:border-box;
  
}

/*IMAGE STYLES \/
==========================*/

.float-left{
  float:left;
  margin-right:20px;
  margin-bottom:20px;
}

.float-right{
  float: right;
  margin-left:20px;
  margin-bottom:20px;
}


/*BUTTON STYLES \/
==========================*/

.button:link,
.button:visited {
  color:#E4DDD8;
  background-color:#A41919;
  border-color:#222; 
  border-style: dotted;
  border-width: thick;
  text-decoration: none;
  padding:20px;
  -webkit-box-sizing:boarder-box;
  -moz-box-sizing:boarder-box;
  box-sizing:border-box;
  display:block;
  margin:20px;
}

.button:focus,
.button:hover {
  background-color:#222;
}

.button:active {
  background-color:#A41919;
}


/*CUSTOM STYLES \/
==========================*/

.dark-red-section {
  color: #2C0102;
}

#wrapper {
  max-width: 1000px;
  margin:0 auto;
}

.flesh-background {
  background-color:#DEC0C3;
  padding:10px;
}

.light-pink-background {
  background-color:#FFC7C7;
  padding:10px;
}


/*MEDIA QUARIES\/
==========================*/


/*48em (768px and smaller) \/
==========================*/

@media screen and (max-width:48em) {
  main {
      width: 100%;
  }
  
  Aside {
      width: 100%;
      padding:4px 32px 24px;
  }
  

}

/* 40em (640px and smaller) \/
==========================*/
@media screen and (max-width:40em) {
.float-left,
.left-right {
  width:100%;
  }
  
    }

/* 30em (480px and smaller) \/
==========================*/
@media screen and (max-width: 30em) {
  main{
    padding:0.125em 0.5em 0.25em;
  }
  aside{
    padding:0.125em 0.5em 0.25em;
  }
  
  blockquote {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0.5em;
    padding-right: 0.5em;
  }
}