@charset "utf-8";

body{
    width: 100%;
	height: 100vh;
    background: linear-gradient(
    to top,
    #CFC4B7 0%,
    #CFC4B7 70%,
    #F4D3D3 100%,
    #F4D3D3 100%
  );
} 

img{
float: left;
margin: 1%;
padding: 1%;
}

h1{
font-family: "Literata", serif;
font-optical-sizing: auto;
font-weight: 800;
font-style: italic;
text-align: right;
font-size: 50px;
}

h2{
text-align: right;
font-size: 45px;
font-family: "Love Ya Like A Sister", cursive;
font-weight: 400;
font-style: normal;
}

h3{
font-family: "Rubik", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: italic;
font-size: 20px;
}

.size1 {
text-align: left;
float: left;
font-size: 27px;
}

.popup {
    text-align: left;
    float: left;
    position: relative;
    cursor: pointer;
    clip: rect(auto,auto,auto,100);
    right: 300px;
    
}

.popup .popuptext {
  visibility: hidden;
  width: 160px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px ;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -80px;
}

.popup .popuptext::after {
  content: "";
  position: absolute;
  display: flex;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.position1{
width: 35%;
height: 70%;
padding-left: 2%;
text-align:inherit;

}

.column1{
min-width: 30%;
min-height: 300px;
padding: 5%;
box-sizing: border-box;
border-radius: 15px;
background: #D9D9D9;
}

img2{
float: left;
margin: 1%;
padding: 1%;
}

.size2{
position: absolute;
top: 300px;
right: 650px;
}

.size3{
text-align: right;
float: right;
font-size: 20px;
position:relative;
right: -10px;
top: 50px;

}

.popup2 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 right: 475px;
 top: 275px;
    
}

.popup2 .popuptext2 {
  visibility: hidden;
  width: 160px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px ;
  position: absolute;
  z-index: 1;
  right: 10px;
  top: -10px;
}

.popup2 .popuptext2::after {
  content: "";
  position: absolute;
  display: flex;
  top: 53px;
  right: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup2 .show2 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.position2{
text-align:inherit;

}

.column2{
width: 47%;
height: 45%;
padding: 2%;
padding-top: 1%;
position: absolute;
box-sizing: border-box;
border-radius: 15px;
background: #D9D9D9;
right:50px;
top:370px;
}

.head{
font-size: 20px;
}

.small1{
font-size:14px;
position: absolute;
top: -210px;
right: -18px;
}

.popup3 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 right: 475px;
 top: 275px;
    
}

.popup3 .popuptext3 {
    visibility: hidden;
    width: 500px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    left: -250px;
    top: -400px;
}

.popup3 .popuptext3::after {
  content: "";
  position: absolute;
  display: flex;
  top: 182px;
  left: 200px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup3 .show3 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.small2{
font-size:14px;
position: absolute;
top: -130px;
right: 18px;
}

.popup4 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 right: 475px;
 top: 275px;
    
}

.popup4 .popuptext4 {
    visibility: hidden;
    width: 500px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    left: -250px;
    top: -280px;
}

.popup4 .popuptext4::after {
  content: "";
  position: absolute;
  display: flex;
  top: 145px;
  left: 200px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup4 .show4 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.small3{
font-size:14px;
position: absolute;
top: -45px;
right: 25px;
}

.popup5 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 right: 475px;
 top: 275px;
    
}

.popup5 .popuptext5 {
    visibility: hidden;
    width: 500px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    left: -250px;
    top: -185px;
}

.popup5 .popuptext5::after {
  content: "";
  position: absolute;
  display: flex;
  top: 145px;
  left: 200px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup5 .show5 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}


.size4 {
position: absolute;
right: 650px;
top: 700px;
}

.last {
position:absolute;
right: 80px;
top: 440px;
}

.size5{
position:relative;
top:450px;
right: 50px;
font-size: 20px;
}

.popup6 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 right: 535px;
 top: 670px;
    
}

.popup6 .popuptext6 {
  visibility: hidden;
  width: 160px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px ;
  position: absolute;
  z-index: 1;
  right: -25px;
  top: -10px;
}

.popup6 .popuptext6::after {
  content: "";
  position: absolute;
  display: flex;
  top: 53px;
  right: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup6 .show6 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.position3{
text-align:inherit;

}

.column3{
width: 47%;
height: 25%;
padding: 2%;
padding-top: 1%;
position: absolute;
box-sizing: border-box;
border-radius: 15px;
background: #D9D9D9;
right:50px;
top:759px;
}

.edu1{
font-size: 20px;
}

.edu2{
color:#818181;
position: absolute;
top: 70px;
}

.edu3{
position:absolute;
top: 20px;
right: 20px;
}

.size5{
position: absolute;
top: 950px;
right: 650px;
}

.size6{
font-size:20px;
position:relative;
top: 305px;
right: -118px
}

.popup7 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 right: 535px;
 top: 670px;
    
}

.popup7 .popuptext7 {
  visibility: hidden;
  width: 160px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px ;
  position: absolute;
  z-index: 1;
  right: -50px;
  top: 248px;
}

.popup7 .popuptext7::after {
  content: "";
  position: absolute;
  display: flex;
  top: 53px;
  right: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup7 .show7 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.position4{
text-align:inherit;
display: relative;
top: 400px;
right:20px;

}

.column4{
width: 47%;
height: 50%;
padding: 2%;
padding-top: 1%;
position: absolute;
box-sizing: border-box;
border-radius: 15px;
background: #D9D9D9;
right:50px;
top:1020px;
}

.list{
font-size:18px;
}

.small4{
font-size:14px;
position: absolute;
top: -220px;
right: -15px;
color:#696767;
}

.popup8 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 right: 475px;
 top: 275px;
    
}

.popup8 .popuptext8 {
    visibility: hidden;
    width: 500px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    right: -250px;
    top: -420px;
}

.popup8 .popuptext8::after {
  content: "";
  position: absolute;
  display: flex;
  top: 205px;
  right: 255px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup8 .show8 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.small5{
font-size:14px;
position: absolute;
top: -160px;
right: -34px;
color: #696767;
}

.popup9 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 right: 475px;
 top: 275px;
    
}

.popup9 .popuptext9 {
    visibility: hidden;
    width: 500px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    right: -250px;
    top: -400px;
}

.popup9 .popuptext9::after {
  content: "";
  position: absolute;
  display: flex;
  top: 247px;
  right: 255px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup9 .show9 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.small6{
font-size:14px;
position: absolute;
top: -95px;
right: -31px;
color: #696767;
}

.popup10 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 right: 475px;
 top: 275px;
    
}

.popup10 .popuptext10 {
    visibility: hidden;
    width: 500px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    right: -250px;
    top: -150px;
}

.popup10 .popuptext10::after {
  content: "";
  position: absolute;
  display: flex;
  top: 58px;
  right: 255px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup10 .show10 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.small7{
font-size:14px;
position: absolute;
top: -30px;
right: -104px;
color: #696767;
}

.popup11 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 right: 475px;
 top: 275px;
    
}

.popup11 .popuptext11 {
    visibility: hidden;
    width: 500px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px;
    position: absolute;
    z-index: 1;
    right: -250px;
    top: -100px;
}

.popup11 .popuptext11::after {
  content: "";
  position: absolute;
  display: flex;
  top: 79px;
  right: 255px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup11 .show11 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.side{
position:absolute;
top: 1070px;
right:80px;
}

.size7{
text-align: left;
float: left;
font-size: 20px;
position:relative;
left: 23px;
top: 20px;
}

.popup12 {
 text-align: left;
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 left: -10px;
 top: 550px;
    
}

.popup12 .popuptext12 {
    visibility: hidden;
    width: 150px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    left: 40px;
    top: -60px;
}

.popup12 .popuptext12::after {
  content: "";
  position: absolute;
  display: flex;
  top: 53px;
  left: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup12 .show12 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.img3{
position:absolute;
left:10px;
top: 50px;
width:35px;
height: 150px;	
}

.adobe{
position:absolute;
top: 55px;
left: 60px;
}

.position5{
text-align:inherit;
display: relative;
top: 200px;
left: 20px;

}

.column5{
width: 35%;
height: 93%;
padding: 2%;
padding-top: 1%;
position: absolute;
box-sizing: border-box;
border-radius: 15px;
background: #D9D9D9;
left:35px;
top:755px;
}

.size7{
text-align: left;
float: left;
font-size: 20px;
position:relative;
left: 30px;
top: -530px;
}

.progress1{
position:absolute;
width: 300px;
height: 25px;
left: 250px;
top: 170px;
}

.popup13 {
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 top: -98px;    
}

.popup13 .popuptext13 {
    visibility: hidden;
    width: 155px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    left: -5px;
    top: -80px;
}

.popup13 .popuptext13::after {
  content: "";
  position: absolute;
  display: flex;
  top: 71px;
  left: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup13 .show13 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.popup14 {
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 top: -63px;    
}

.popup14 .popuptext14 {
    visibility: hidden;
    width: 159px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    left: -5px;
    top: -80px;
}

.popup14 .popuptext14::after {
  content: "";
  position: absolute;
  display: flex;
  top: 71px;
  left: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup14 .show14 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.popup15 {
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 top: -30px;    
}

.popup15 .popuptext15 {
    visibility: hidden;
    width: 159px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    left: -5px;
    top: -80px;
}

.popup15 .popuptext15::after {
  content: "";
  position: absolute;
  display: flex;
  top: 71px;
  left: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup15 .show15 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.popup16 {
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 top: 8px;    
}

.popup16 .popuptext16 {
    visibility: hidden;
    width: 173px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    left: -5px;
    top: -75px;
}

.popup16 .popuptext16::after {
  content: "";
  position: absolute;
  display: flex;
  top: 71px;
  left: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup16 .show16 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.size8{
text-align: left;
float: left;
font-size: 20px;
position:relative;
left: -5px;
top: 230px;
}

.popup17 {
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 top: 8px;    
}

.popup17 .popuptext17 {
    visibility: hidden;
    width: 173px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    left: -2px;
    top: 170px;
}

.popup17 .popuptext17::after {
  content: "";
  position: absolute;
  display: flex;
  top: 53px;
  left: 73px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup17 .show17 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.personal{
position: absolute;
top: 270px;
left:10px; 
width: 35px;
height: 180px;	
}

.words{
position: absolute;
top:275px;
left: 60px;
}

.progress2{
position: absolute;
top: 350px;
left: 250px;
}

.popup18 {
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 top: -60px;    
}

.popup18 .popuptext18 {
    visibility: hidden;
    width: 150px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position: absolute;
    z-index: 1;
    left: -5px;
    top: -55px;
}

.popup18 .popuptext18::after {
  content: "";
  position: absolute;
  display: flex;
  top: 71px;
  left: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup18 .show18 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.popup19 {
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 top: -27px;    
}

.popup19 .popuptext19 {
    visibility: hidden;
    width: 150px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position:absolute;
    z-index: 1;
    left: -5px;
    top: -75px;
}

.popup19 .popuptext19::after {
  content: "";
  position: absolute;
  display: flex;
  top: 71px;
  left: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup19 .show19 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.popup20 {
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 top: 10px;    
}

.popup20 .popuptext20 {
    visibility: hidden;
    width: 150px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position:absolute;
    z-index: 1;
    left: -5px;
    top: -75px;
}

.popup20 .popuptext20::after {
  content: "";
  position: absolute;
  display: flex;
  top: 71px;
  left: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup20 .show20 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.popup21 {
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 top: 50px;    
}

.popup21 .popuptext21 {
    visibility: hidden;
    width: 190px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position:absolute;
    z-index: 1;
    left: -5px;
    top: -75px;
}

.popup21 .popuptext21::after {
  content: "";
  position: absolute;
  display: flex;
  top: 71px;
  left: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup21 .show21 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

.popup22 {
 position: absolute;
 cursor: pointer;
 clip: rect(auto,auto,auto,100);
 top: 80px;    
}

.popup22 .popuptext22 {
    visibility: hidden;
    width: 155px;
    background-color: #555;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px ;
    position:absolute;
    z-index: 1;
    left: -5px;
    top: -75px;
}

.popup22 .popuptext22::after {
  content: "";
  position: absolute;
  display: flex;
  top: 71px;
  left: 75px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.popup22 .show22 {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

@media only screen and (max-width:996px){
	html{
		scroll-behaviour: smooth;
		scroll-padding-top: 120px;
	}

	.popup19 {
  width: 100%;
}
	.size1{
width: 100%;
	}
	
	.progress1{
position: relative;
	}
		
		
		
		
		
		
		
		
		
		
	}