@import url('https://fonts.googleapis.com/css?family=Playfair+Display&display=swap');
@import url('https://fonts.googleapis.com/css?family=Oswald&display=swap');



/* boxes */
#blackmain {
    width:100%;
    height:100%;
    background-color: black;
    position: absolute;
    top:12%;
    left:5%;
    border-radius: 60px 0px 0px 0px;
    color:white;
}

#User {
    position: absolute;
    left:3em;
    top:1em;
    font-family: Playfair Display;
    font-style: normal;
    font-weight: normal;
    font-size: 32px;
    line-height: 43px;
    letter-spacing: 0.05em;
}

#bluesec {
    width:100%;
    height:100%;
    background: #001AFF;
    border-radius: 60px 0px 0px 0px;
    position:absolute;
    top:27%;
    left:10%;
}

#tempConv {
    height:35%;
    width:25%;
    background-color: white;
    padding-left: 2%;
    padding-top: 1%;
  position: absolute;
  top:0;
  left:20%;
  clip-path: polygon(0 0, 100% 0%, 100% 65%, 0% 100%);
  
    /* text */
    font-family: 'Oswald', sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 32px;
    line-height: 47px;
    letter-spacing: 0.05em;
}

#baseConv {
    height:25%;
    width:25%;
    color:black;
    background-color: white;
    padding-left: 2%;
    padding-top: 1%;
  position: absolute;
  top:45%;
  left:4%;
  clip-path: polygon(0 15%, 100% 0%, 100% 100%, 0% 100%);
  padding-bottom: 30%;

  font-family: Oswald;
font-style: normal;
font-weight: bold;
font-size: 32px;
/* line-height: 40px; */ 
display: flex;
align-items: flex-end;
text-align: left;
letter-spacing: 0.05em;
}

#githubExp {
    height:25%;
    width:30%;
    color:black;
    background-color: white;
    padding-left: 2%;
    padding-top: 1%;
  position: absolute;
  top:20%;
  left:53%;
  clip-path: polygon(0 0, 99% 20%, 100% 100%, 0% 100%);
  padding-bottom: 30%;

  font-family: Oswald;
font-style: normal;
font-weight: bold;
font-size: 32px;
line-height: 47px;
letter-spacing: 0.05em;
padding-top:10%;
padding-left: 3%;
}