misc.css

.flex{
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
            justify-content: center;
    -webkit-box-align: center;
            align-items: flex-start;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                    flex-direction: column;
                    flex-wrap: row wrap;
            
}
@media(min-width:700px){
.flex{
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
            justify-content: center;
    -webkit-box-align: center;
            align-items: center;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
                    flex-direction: row;
            margin-top: 90px;
            margin-bottom: 50px;
            
}
}
@media(min-width:1024px){
    .flex{
        margin-left: 175px;
        margin-right: 175px;
    }
}
p{
    font-family: 'Raleway', sans-serif;
    font-weight: 300;
    font-size: 20px;
    margin: 0%;
   
}
a.leftbutton{
    font-size: 25px;
    color: black;
    font-family: 'Raleway', sans-serif;
    font-weight: 300;
    border: black 2px solid;
    padding: 10px;
    text-decoration: none;

}
a.leftbutton:hover{
    text-decoration: none;
    color: white;
    border: #1d9c9f 2px solid;
    background-color: #1d9c9f;
    -webkit-transition: ease-in .75s;
    transition: ease-in .75s;
}
h1{
    margin:0%;
    font-family: 'Abril Fatface', cursive;
  
}
.right{
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
        flex-direction: column;
        margin: 30px;
        
       
}
.gif{
    max-width: 500px;
    max-height: 400px;
    padding:10px;
}
.box{
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
            justify-content: center;
    -webkit-box-align: center;
            align-items: center;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                    flex-direction: column; 
}

@media(min-width:700px){
    .box{
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: center;
                justify-content: center;
        -webkit-box-align: center;
                align-items: center;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                        flex-direction: row; 
                        flex-flow: row wrap;
    }
    .right{
       margin-left: 4em;
        
    }
}
@media(max-width:425px){
    .gif{
        max-width: 250px;
        max-height: 150px;
    }
    a{
        font-size: 15px !important;
    }
    h1{
        font-size: 20px;
    }
    p{
        font-size: 15px;
    }
    iframe{
       width: 250px;
       height: 150px;
    }
}

.buttonwrapper{
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: start;
            justify-content: flex-start;
}

.leftbutton{
    margin-left: 20px;
}