.flex 
{
    display: flex;
}

p 
{
    color: aliceblue;
    text-shadow: 2px 2px black;
    font-size: 21px;
    
    
}

.EvalImg
{
    position: absolute;
    height: 25%;
   
}

b
{
 color: aliceblue;
 text-shadow: 2px 2px black;
 font-size: 21px;
 
}

.images
{
    width: 12%;
    height: 25%;


}
.column {
  float: left;
  width: 33.33%;
  padding: 5px;
}

.column2 {
  float: left;
  width: 33.33%;
  padding: 5px;
}



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

.style
{
  display: block;
  margin: auto;

}

h1 
{
    font-size: 33px;
    color: #E0FFFF;
    text-shadow: 2px 2px black;
}

.ImageInspirations
{
  width : 50%;
  height : 100%;
  
}
.Indextitle
{
     font-size: 60px;
    color: #E0FFFF;
    height: 100px;
    text-shadow: 2px 2px black;
    padding: 0;
    display: inline-block;
     display: flex;
    justify-content: center;
    align-items: center;
}

.icon
{
   width: 9%;
   height: 15%;
   top: 32px;
   position: absolute;
}
.icon2
{
   width: 10%;
   height: 15%;
   top: 22px;
   right: 22px;
   position: absolute;
}

.ImageSplit
{
    display: flex;
  justify-content: center;
  align-items: center;
}

.Box2Title {
    font-size: 60px;
    color: #E0FFFF;
    
    height: 100px;
    text-shadow: 2px 2px black;
    padding: 0;
    display: inline-block;
     display: flex;
    justify-content: center;
    align-items: center;
    
}

.BoxSubTitle
{
 font-family: "Lexend Bold";
 font-size: 28px;
 color: #E0FFFF;
 text-shadow: 2px 2px black;
}

.BoxText 
{
    position: relative;
    animation: move-words 20s linear infinite;
    margin: 0;
    color: aquamarine;
    font-size: 34px;
}

div 
{
    overflow: hidden;
    cursor: pointer;
}

@keyframes move-words {
    0% {
        left: 100%;
    }

    100% {
        left: -100%;
    }
}

.listheadings
{
    font-size: 25px;
}
ul 
{
    list-style-type: none;
    margin: 0;
    padding: 0px;
    font-size: 25px;
    padding-bottom: 0px;
    
}

a {
    color: floralwhite;
    line-height: 2.5em;
    text-shadow: 2px 2px black;
}

a:hover {
        color: lightcyan;
    }

.neon-text {
    color: #E0FFFF;
    text-shadow: 0 0 5px #E0FFFF, 0 0 5px #E0FFFF, 0 0 5px #E0FFFF, 0 0 5px #E0FFFF, 0 0 5px #E0FFFF;
    animation: glow 1.5s infinite alternate;
}

@keyframes glow {
    0% {
        text-shadow: 0 0 3px #E0FFFF, 0 0 3px #E0FFFF, 0 0 3px #E0FFFF, 0 0 3px #E0FFFF, 0 0 3px #E0FFFF;
    }

    100% {
        text-shadow: 0 0 3px #E0FFFF, 0 0 3px #E0FFFF, 0 0 3px #E0FFFF, 0 0 3px #E0FFFF, 0 0 3px #E0FFFF;
    }
}



.Box1 {
    background: rgba(255, 255, 255, 0.26);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    width: 20%;
    border: 5px solid LightCyan;
    padding: 50px;
    margin: 20px;
    height: 638px;
    text-align: center;
    font-family: "Lexend Bold";
    
}



.Box2 
{
    background: rgba(255, 255, 255, 0.26);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);

    width: 80%;
    border: 5px solid LightCyan;
    padding: 50px;
    margin: 20px;
    height: 67.433vh;
    overflow-y: auto; 
    
}

.Box3
{
    background: rgba(255, 255, 255, 0.26);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    width: 1737px;
    border: 5px solid LightCyan;
    padding: 55px;
    margin-top: 20px;
    margin: auto;
}




body {
    background-image: url(Pics/Background.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    font-family: "Lexend Regular";
}

@font-face 
{
    font-family: "Lexend Bold";
    src: url("Pics/Lexend-Black.ttf")
}

@font-face 
{
    font-family: "Lexend Regular";
    src: url("Pics/Lexend-Regular.ttf")
}