* {
  margin: 0;
  padding: 0;
  
 /* Fonts definitions */ 
 font-family: 'Work Sans', sans-serif;
 
}


p {text-align: center;  word-wrap: break-word; color:black}

.pr p {text-align: left; color:black; font-size: 16px;}

.pr .ph {font-size: 50px;}

.p1{margin-top: 5%;}

.pr .p2{font-size: 24px;}

.video {width: 50%;}

.circle-1{left: 50%; top: 5%; margin-left: -60px;}
.circle-2{left: 37%; top: 20%; margin-left: -60px;}
.circle-3{left: 37%; top: 52%; margin-left: -60px;}
.circle-4{left: 50%; top: 67%; margin-left: -60px;}
.circle-5{left: 63%; top: 52%; margin-left: -60px;}
.circle-6{left: 63%; top: 20%; margin-left: -60px;}



.folha-1{position: absolute; left: 42.5%; top: 20%;}
.folha-2{position: absolute; left: 37%; top: 44.9%;}
.folha-3{position: absolute; left: 42.8%; top: 70%;}
.folha-4{position: absolute; left: 56.5%; top: 70%;}
.folha-5{position: absolute; left: 63%; top: 45%;}
.folha-6{position: absolute; left: 56.5%; top: 20%;}


.circle-1, .circle-2, .circle-3, .circle-4, .circle-5, .circle-6,
.circle-11, .circle-21, .circle-31, .circle-41, .circle-51, .circle-61 
 {
    background-color: #AFC0A9;
    position: absolute;
    display: table;
    width:150px;
    height:150px;
    opacity: 0.6;
    border-color: white;
    border-style: solid;
    border-radius:50%
}

.circle-1:hover, .circle-2:hover, .circle-3:hover, .circle-4:hover, .circle-5:hover, .circle-6:hover,
.circle-11:hover, .circle-21:hover, .circle-31:hover, .circle-41:hover, .circle-51:hover, .circle-61:hover 
{
    opacity: 1;
}

/*
.circle-11{left: 10%; top: 20%; margin-left: -60px;}
.circle-21{left: 25%; top: 20%; margin-left: -60px;}
.circle-31{left: 40%; top: 20%; margin-left: -60px;}
.circle-41{left: 55%; top: 20%; margin-left: -60px;}
.circle-51{left: 70%; top: 20%; margin-left: -60px;}
.circle-61{left: 85%; top: 20%; margin-left: -60px;}
*/

.circle-11{left: 7%; top: 20%;}
.circle-21{left: 22%; top: 20%;}
.circle-31{left: 37%; top: 20%;}
.circle-41{left: 52%; top: 20%;}
.circle-51{left: 67%; top: 20%;}
.circle-61{left: 82%; top: 20%;}



.idiom {position: relative; }

.idiom .idiom-1 {position: absolute; top: 5px; right: 10px; }

        
