/* this is a css reset that makes sure the browser won't add any unexpected margins or padding to your page */
body, html{
  margin:0;
  padding:0;
  box-sizing: border-box;
}


/* call an element from your html and style it here! */
/* for example... */
body{
    background-color: rgb(255, 224, 228);
    margin: 30px;
}

h2{
    font-size: 80px;
    color: darkblue;
    font-family: Oswald;
    margin-top:0px;
    margin-bottom: 0px;
}

h3{
    font-size: 80px;
    color: magenta;
    font-family: League Script;
    margin-top: 2px;
    margin-bottom: 12px;
}

h4{
  font-size: 22px;
  color: darkblue;
  font-family: Oswald;
}

p{
  font-size: 18px;
  color: black;
  font-family: Raleway;
}

.ifstatement{
    color: blue;
}

.thenstatement{
    color:magenta;
}

.container-flex{
    display: flex;
    gap: 20px;
}

.textside{
    flex: 1 30%;
}

.iframeside{
    flex: 1;
}

.iframeside iframe{
    width: 100%;
    height: 100%;
}

a{
    font-size: 14px;
    color:darkmagenta;
    font-family: Raleway;
    margin-top: 30px;
}

@media (max-width: 768px) {
  .textside{
    flex: 1 30%;
  }
}

@media (max-width: 425px) {
    iframe {
        display: none;
    }
}