* {
    margin: 0px;
    padding: 0;
    box-sizing: border-box;
    text-align: center;
}

html{
    scroll-behavior: smooth;
}

body{
    background-color:aliceblue; 
    transition-timing-function: cubic-bezier(0.1, 2, 2, 0.1);
    transition-duration: 0.1s;
    -webkit-transition-duration: 0.1s;
}

section {
  vertical-align: middle;
  display: -webkit-flex;
  display: flex;
}

footer {
  background-color: white;
  text-align: center;
  color:0;
}

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

.foot{  
    font-family: 'Lato', sans-serif;
    font-size: 16px;
    padding-top: 10px;
    padding-bottom: 0;
    text-align: center;
    color:0;
    text-decoration-color: 0;
    margin:0;
    float:left;
    width:33.33%
}

.parallax { 
    background-image: url(natia-rukhadze-8cQazCNuzVA-unsplash.jpg);
    height: 500px; 
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.button{
    padding-top: 1%;
    padding-bottom: 1%;
}

.button:hover {
    cursor: pointer;
    border-bottom-color: #61728c;
    border-bottom: 4px solid;
    transition-timing-function: cubic-bezier(0.1, 2, 2, 0.2);
    transition-duration: 0.15s;
    -webkit-transition-duration: 0.15s;
}

article{
    padding-top: 100px;
    padding-bottom: 100px;
    background-color: white
}

.contact{
    padding-left: 5%;
    padding-right: 5%;
    color: white;
    text-align: center
}

.navbar{
    width: 100%;
    background-color: white;
    color: black;
    position: fixed;
    padding-top: 2%;
    padding-bottom: 2%;
}

.icon{
    width:32px;
    height:32px;
    float: left;
    margin-top:-5px;
    padding-bottom: 5px;
}

 a{
     text-decoration-color: black;
     color: black;
     text-decoration: none;
     font-family: 'Open Sans', sans-serif;
     margin: 10px;
}

.full{
    width: 100%;
    height:auto;
}

    
.about-div{
      background-color: white; 
      padding-top: 20px; 
      padding-bottom: 50px; 
      padding-left: 20px;
 }

.about-article{
    background-image: url(alesia-kazantceva-9-dHYri9BOE-unsplash.jpg); 
    background-size: cover; 
    background-repeat: no-repeat; 
    background-position: right;
    width: 100%;
    height: auto;
}

/* Mobile Styles */
@media only screen and (max-width: 500px) {
    h1{
        font-family: 'Open Sans', sans-serif;
        font-size:32px;  
        margin:0; 
    }
    
    h2{
        font-family: 'Open Sans', sans-serif;
        font-size: 24px;
        margin: 20px;
        text-align: center;
    }
    
    p{
        font-family: 'Lato', sans-serif;
        font-size: 16px;
        padding-left: 15%; 
        padding-right: 15%;
        padding-top: 5px;
        padding-bottom: 5px;
        text-align: center;
    }
    
    section{
        -webkit-flex-direction: column;
        flex-direction: column;
    }
    
    .parallax { 
        background-image: url(natia-rukhadze-8cQazCNuzVA-unsplash.jpg);
        height: 250px; 
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    
    a{
        font-size:14px;  
    }
    
    .button{
    padding-top: 2%;
    padding-bottom: 2%;
    }

    
    .navbar{
    width: 100%;
    background-color: white;
    color: black;
    position: fixed;
    padding-top: 2%;
    padding-bottom: 2%;    
    }
    
    .about-div{
        width: 100%;
    }
    
    
    .about-article{
        background-position: left;
    }
    
    .foot{
        float:center;
        width:100%;
    }
    
    .icon{
        float: center;
        width:100%;
    }
}

@media only screen and (max-device-width: 1366px) {
  .parallax {
    background-attachment: scroll;
  }
}

/* Tablet Styles */
@media only screen and (min-width: 501px) and (max-width: 960px) {
    h1{
        font-family: 'Open Sans', sans-serif;
        font-size:40px;  
        margin:0; 
    }
 
    h2{
        font-family: 'Open Sans', sans-serif;
        font-size: 36px;
        margin: 20px;
        text-align: center;
    }
    
    p{
        font-family: 'Lato', sans-serif;
        font-size: 18px;
        padding-left: 20px; 
        padding-right: 20px; 
        padding-top: 7px;
        padding-bottom: 7px;
        text-align: justify;
        text-justify: inter-word;
    }
    
    a{
        font-size:24px;  
    }
    
    .about-div{
        width:100%;
    }
}

/* Desktop Styles */
@media only screen and (min-width: 961px) {
    h1{
        font-family: 'Open Sans', sans-serif;
        font-size:48px;  
        margin:0; 
    }
    
    h2{
        font-family: 'Open Sans', sans-serif;
        font-size: 38px;
        margin: 20px;
        padding-left: 20%; 
        text-align: left;
    }   
    
    p{
        font-family: 'Lato', sans-serif;
        font-size: 24px;
        padding-left: 15%; 
        padding-right: 15%; 
        padding-top: 10px;
        padding-bottom: 10px;
        text-align: left;
    }
    
    a{
        font-size:24px;  
    }
    
    .about-div{
        width:60%;
    }
}