/*
COLOR PALETTE
https://coolors.co/f7fff7-343434-2f3061-ffe66d-a1c6d7
#F7FFF7 - almost white
#343434 - dark gray - almost black
#2F3061 - blue dark
#FFE66D - yellow
#A1C6D7 - blue light
*/

/* Global styles
------------------------------------*/
html {
  box-sizing: border-box;
}

*,*:before,*::after {
  box-sizing: inherit;
}

body {
    color: #343434;
    margin: 0;
    padding: 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    line-height: 1.5;
  }
  img {
    width: 300px;
  }
  a {
    color: #FFE66D;
  }
  a:hover {
    text-decoration: none;
  }

  h1,h2 {
    font-family: 'Caveat', cursive;
    font-weight: 400;
    margin: 0;
    line-height: 1.2;
  }

  

  h1 {
    font-size: 80px;
    line-height: 1;
  }

  h2 {
    font-size: 45px;
  }
  .wrap {
    max-width: 800px;
    width: 85%;
    margin: 0 auto;
    padding: 60px 0;
  }

  .item-details h3 + p {
    font-style: italic;
  }

  h3 {
    margin-bottom: 5px;
  }

  .item-details h3 ~ p {
    margin: 0;
  }

  .divider > section{
    border-bottom: 1px dashed #2F3061;
  }

  .divider > section:last-of-type {
    border-bottom: none;
  }


  
  
  
  /* Profile
  ------------------------------------*/
  header {
    background: #2F3061;
    color: #F7FFF7;
  }
  
  
  /* Projects
  ------------------------------------*/
  .projects {
    background: #F7FFF7;
  }
  .projects a {
    color: #2F3061;
  }
  .projects .btn {
    color: #F7FFF7;
    background: #2F3061;
    text-decoration: none;
    padding: 8px;
    border-radius: 4px;
    display: inline-block;
  }
  .projects .btn:hover {
    background: rgba(47, 48, 97, 80%);
  }

  .project-item {
    overflow: hidden;
    padding-bottom: 25px;
    margin-bottom: 20px;
  }

  .project-item img {
    border-radius: 9px;
  }

  .project-item h3 {
    margin: 0;
  }

  
  
  /* Work Experience
  ------------------------------------*/
  .experience {
    background: #A1C6D7;
    /* background-image: url(/images/sharon-mccutcheon-unsplash.jpg);
    background-size: cover; */
  }

  /* .experience > section {
    width: 80%;
  } */

  .job-item {
    display: block;
  }

  .job-summary p {
    margin: 0;
  }

  .job-summary p:first-child {
    margin-top: 20px;
    font-weight: 600;
  }

  .job-summary ul::before {
    content: attr(aria-label);
    font-weight: 600;
  }
  
  
  /* Education
  ------------------------------------*/
  .education {
    background-image: url(/images/joanna-kosinska-unsplash.jpg);
    background-size: cover;
    background-position: top right;

  }

  .education p {
    width: 60%;
  }
  
  
  /* Contact Info
  ------------------------------------*/
  footer {
    background: #343434;
    color: #F7FFF7;
  }

  .contact-list {
    list-style-type: none ;
    padding: 0;
  }
  
  .contact-list a {
    padding: 5px;
    display: inline-block;
  }


/* Responsive
------------------------------------*/

@media screen and (min-width : 750px){
  .project-item img {
    float: left;
    margin-right: 10px;
    border-radius: 9px;
  }
}

@media screen and (min-width : 700px){
  .job-item {
    display: grid;
    grid-template-columns: 1fr 2fr;
    column-gap: 20px;
  }

  header , footer {
    text-align: center;
  }

  .contact-list {
    list-style-type: none ;
    padding: 0;
    display: flex;
    justify-content: center;
  }
  
  .contact-list a {
    padding: 15px;
    display: inline-block;
  }
}

@media screen and (max-width : 749px){
  h1 {
    font-size: 60px;
  }
}