header, .main-nav-mod {
  display: none !important; }

@font-face{
    font-family:VBlack;
    src: url(VitesseSans-Black.otf)
}
@font-face{
    font-family:Vmed;
    src: url(VitesseSans-Medium.otf)
}

.body{
    margin: 0;
    padding: 0;
    height: 100%;
    background-color:rgb(223 232 241);
}

.navbar{
    background-color: rgb(146 179 210);
    font-family: VBlack;
    color:white;
    align-content: center;
    margin: 0px;
    
}

nav ul a:hover{
    border-top: 2px solid;
    border-top-right-radius: 3%;
    border-top-left-radius: 3%;
    border-bottom: 2px solid;
    border-bottom-right-radius: 3%;
    border-bottom-left-radius: 3%;
    border-color: purple;
    transition: 1s;
    
}
.title{
    text-align:center;
    font-family:VBlack;
    width: 100%;
    height: auto;
}

.runitback img{
    width: 100%;
    height: auto;
}

.container{
display:flex;
    flex-wrap: wrap;
justify-content: center;
margin:10px;
font-family: Vmed;
perspective: 1000px;
}

.art-container{
    display:flex;
    justify-content: center;
    margin:10px;
    }

.card{
    height:500px;
    width:300px;
    border: solid 4x black; 
    margin: 10px;
  }

  .card{
    height:500px;
    width:300px;
    margin: 10px;
    position: relative;
    display: inline-block;

  }
 .card .img-top{
      display: none;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 2;
  }
.card:hover .img-top{
    display:inline;
}
    

.editor-note{
    margin:30px;
    padding: 50px;
    border-top: 7px solid;
    border-top-right-radius: 3%;
    border-top-left-radius: 3%;
    padding: 15px;
    border-bottom: 7px solid;
    border-bottom-right-radius: 3%;
    border-bottom-left-radius: 3%;
    border-color: purple;
    font-family: Vmed;
    display:flex;

}
.editors-pic img{
    margin: 20px;
}

.editor-note-title{
    margin: 20px;
    padding:30px;
    font-weight:bold;
    text-align:center;
    font-size: 30px;
    font-family: VBlack;
    
}
.note{
    padding-top: 100px;
   display:flex;
}

.footer{
    background-color: rgb(146 179 210);
    height: 130px;
    width: 100%;
    padding: 20px ;
    display: flex;
    justify-content: center;
    
    
}

.carflex{
    display: flex;
    justify-content: center;
    margin: 30px;
}

.car{
    border-top: 7px solid;
    border-top-right-radius: 3%;
    border-top-left-radius: 3%;
    padding: 15px;
    border-bottom: 7px solid;
    border-bottom-right-radius: 3%;
    border-bottom-left-radius: 3%;
    border-color: purple;
    font-family: Vmed;
}
.firstcharacter {
    float: left;
    font-size: 75px;
    line-height: 60px;
    padding-top: 4px;
    padding-right: 8px;
    padding-left: 3px;
  }

  .article-container{ 
      display: flex;
     width:100%;
     display:flex;
     margin:10px;
     justify-content: center;
  }
  .article{ 
      margin: 10px; 
      width: 75%; 
      font-family:Vmed;
      justify-content: center;
  }
  .img-container{ 
      width: 100%;
      margin: 0px;
      
  }
  .intext-contain{ 
      align-content: center;
  }
  .alt-img{ 
      width: 100%;
      margin: 0px;
      position: relative;
     
  }

.alt-image{
    position: relative;
}
  .alt-mac{ 
      font-size: 100px;
      color:rgb(163 87 161);
      position: absolute;
      top: 0px;
      text-align: center;
      font-family:VBlack;
  }
  .byline{
      justify-content: flex-end;
      font-family: VBlack;
      
  }

 .intext img{ 
    margin: 20px 0px;
}

.alt-mac2{
    font-size: 100px;
      color:rgb(163 87 161);
      position: absolute;
      text-align: center;
      font-family: VBlack;
      bottom: 0px;
      text-align: center;
      padding-left: 20px;
}

.alt-mac3{
    font-size: 100px;
    color:rgb(163 87 161);
    position: absolute;
    text-align: center;
    font-family: VBlack;
      bottom: 0px;
      text-align: center;
      padding-left: 20px;
}
body{
    background-color: #D6DFEB;
}
.row{
    display: flex;
    justify-content: center;
}

.responsiveimg img{
}
@media only screen and (max-width: 10000px) {
    .title img{
    height:800px; width:1200px;
    }
    .alt-img img{
        width: 100%;
        height: auto;
    }

}

@media only screen and (max-width: 1200px) {
    .title img{
        width: 100%;
        height: auto;
    }
    
    .editor-note{
        padding: 20px;
        flex-wrap: wrap;
        justify-content: center;
    }
    .note{
        padding-top: 20px;
    }
    .navbar{
        display: block;
    }
    
    .alt-mac2{ 
      font-size: 75px;
      color:rgb(163 87 161);
      position: absolute;
      text-align: center;
      font-family: VBlack;
      bottom: 0px;
      text-align: center;
      padding-left: 20px;
  }
    .alt-mac3{
      font-size: 68px;
      color:rgb(163 87 161);
      position: absolute;
      text-align: center;
      font-family: VBlack;
      bottom: 0px;
      text-align: center;
      padding-left: 20px;  
    }
}
  
@media only screen and (max-width: 1000px) {
.alt-mac3{
        font-size: 55px;
    }
@media only screen and (max-width: 800px) {
    .alt-mac2{
        font-size: 50px;
    }
     .alt-mac3{
        font-size: 42px;
    }
}

@media only screen and (max-width: 500px) {
    .alt-mac2{
        font-size: 50px;
    }
     .alt-mac3{
        font-size: 30px;
    }
}