/* Universal */

*{
    padding: 0;
    margin: 0;
}

html, body{
    height: 100%;
    width: 100%;
    scroll-behavior: smooth;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}


/* End Universal */


/* Section 1 */ 

#section1{
    height: 500px;
    justify-content: center;
    align-items: center;
    display: flex;
    align-items: flex-end;
}

/* Logo/Text */

.amlogo{
    width: 150px;
}

.amtext{
    color: #fbfbfb;
    font-size: 2.4em;

}

#amlt{
    margin-bottom: 10px;
    text-align: center;
}

a{
    text-decoration: none;
    color: #3498db;
}

a:hover{
    text-decoration: underline;
}

/* End Logo/Text */

/* Arrow */

.bottom {
    display: inline-block;
    width: 1.7em;
    height: 1.7em;
    border: 0.2em solid #fbfbfb;
    border-radius: 50%;
}
  
.bottom:after {
    content: '';
    display: inline-block;
    margin-top: 0.4em;
    width: 0.5em;
    height: 0.5em;
    border-top: 0.2em solid #fbfbfb;
    border-right: 0.2em solid #fbfbfb;
    -moz-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}
  
.arrow_bottom{
    text-align: center;
    margin-top: 100px;
}

.bottom:hover{
    border: 0.2em solid #246c9c;
    transition: 0.5s;
}

/* End Arrow */

/* End Section 1 */ 


/* Section 2 */

#section2{
  background: #FBFBFB;
  height: 350px; 
  justify-content: center;
  align-items: center;
  display: flex;
  border-bottom: 1px solid #dcd9d9;

}

#description{
  color: #333;
  text-align: center;
  float: right;
  width: 50%;
}

.aboutme{
  position: relative;
  display: inline-block;
  font-size: 2em;
  font-weight: 300;
  margin: 0 0 30px 0;
}

.aboutme:after{
  position: absolute;
  content: '';
  top: 100%;
  height: 1px;
  width: 50px;
  left: 0;
  right: 0;
  margin: 0 auto;
  background: #3498db;
}


/* End Section 2 */


/* Section 3 */

#section3{
    background: #F2F2F5;
    border-bottom: 1px solid #dcd9d9;
}

#timehead{
    text-align: center;
    padding-top: 50px;
}

.exp{
    font-style: italic;
    font-size: 0.9em;
}

/* End Section 3 */

/* Section 4 */

#section4{
    background: #FBFBFB;
    height: 550px;
    border-bottom: 1px solid #dcd9d9;
}

#educationbox{
    background-color: #fbfbfb;
    margin: auto;
    display: block;
    width: 70%;
    border: 1px solid #dcd9d9;
    padding: 10px;
    color: #374054;
}


/* End Section 4 */

/* Section 5 */

#section5{
    background: #F2F2F5;
    height: 400px;
}

#skills {
    padding: 50px 15px;
    text-align: center;
    margin: auto;
}

#skills li {
    display: inline-block;
    margin: 7px;
    padding: 5px 10px;
    color: #374054;
    background: #e4e4ea;
    list-style: none;
    cursor: default;
    font-size: 1.2em;
}

@media only screen and (max-width: 1000px) {

    #section5{
        height: 600px;
    }

    #section4{
        height: 600px;
    }

}



@media only screen and (max-width: 800px) {

    #section5{
        height: 600px;
    }

    #section4{
        height: 650px;
    }


}

@media only screen and (max-width: 550px) {

    #section5{
        height: 750px;
    }

    #section4{
        height: 750px;
    }


}

@media only screen and (max-width: 450px) {

    #section5{
        height: 850px;
    }

    #section4{
        height: 850px;
    }


}

@media only screen and (max-width: 400px) {

    #section5{
        height: 950px;
    }

    #section4{
        height: 950px;
    }


}
/* End Section 5 */

/* Section 6 */

#section6{
    background: #3498db;
    height: 400px;
}

.contacthead{
    color: #fbfbfb;
    text-align: center;
    padding: 20px 0 0 0;
    font-size: 1.9em;
}


#contactmeform{
    padding-top: 20px;
    text-align: center;
    margin: auto;
}

.emailblock{
    display: block;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}

.msgblock{
    display: block;
}

input{
    border: none;
    padding: 10px;
    color: #ffffff;
    border-radius: 4px;
    margin-bottom: 10px;
    background: #246c9c;
    border: 1px solid #246c9c;
}

.submit{
    margin-top: 10px;
    width: 52%;
    height: 35px;
    background-color: #ffffff;
    color: #246c9c;
    font-weight: bold;
    border-radius: 7px;
    font-size: 0.9em;
    transition: .6s ease all;
    cursor: pointer;
}

.submit:hover{
    box-shadow: 0 8px 6px -6px #333;
}

input::-webkit-input-placeholder{
    color: white;
}

textarea::-webkit-input-placeholder{
    color: white;
}

#contactmeform textarea{
    height: 150px;
    width: 50%;
    resize: none;
    background: #246c9c;
    border: 1px solid #246c9c;
    padding: 10px;
    border-radius: 4px;
    color: white;
}




/* End Section 6 */

/* Section 7 */
#section7{
    background: #fbfbfb;
    height: 150px;
}


/* Arrow */

.up {
    display: inline-block;
    width: 1.7em;
    height: 1.7em;
    border: 0.2em solid #3498db;
    border-radius: 50%;
    
}
  
.up:after {
    content: '';
    display: inline-block;
    margin-top: 0.6em;
    width: 0.5em;
    height: 0.5em;
    border-top: 0.2em solid #3498db;
    border-right: 0.2em solid #3498db;
    -moz-transform: rotate(315deg);
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
}
  
#arrow_up{
    text-align: center;
}

.up:hover{
    border: 0.2em solid #246c9c;
    transition: 0.5s;
}


/* End Arrow */

#copyright{
    float: left;
    padding-top: 60px;
    width: 40%;
    padding-left: 20px;
    color: #636363;
}


#sizes{
    padding: 60px 0 0 0;
    display: inline-block;
    position: absolute;
}


#social{
    float: right;
    padding: 60px 0 0 0;
}

#social img{
    width: 20px;
    height: 20px;
    padding-right: 10px;
    filter: grayscale(100%);
}

#social img:hover{
    filter: grayscale(0%);
    transition: 0.3s;
}

#socloc{
    padding-right: 20px;    
}


@media only screen and (max-width: 450px) {

    #social{
        width: 30%;
    }

}



/* End Section 7 */