body{
min-width:750px;        /* Suppose you want minimum width of 1000px */
width: auto !important;  /* Firefox will set width as auto */
}

main {
    margin: 0 auto;
    line-height: 1em;
  }


 .Venn {
     display: none;     
     aspect-ratio: 1.2;

}
 .Venn>div {
     box-sizing: border-box;
     border: 1px dashed #b5e853;
    ;
     overflow: hidden;
}
 .Venn>.shape {
     border: initial;
     width: initial;
     margin: initial;
     padding: initial;
}
 .Venn>.circle {
     border-radius: 50%;
     width: initial;
     margin: initial;
     padding: initial;
}
/* Grid layout */
 .Venn {
     display: grid;
     grid-template-columns: repeat(5, 1fr);
     grid-template-rows: repeat(3, 28%);
}
 .Venn h1, .Venn h2, .Venn h3 {
     grid-column-start: 1;
     grid-column-end: 6;
     grid-row-start: 0;
     grid-row-end: 1;
}
 .Venn>.circle.one {
     grid-column-start: 1;
     grid-column-end: 4;
     grid-row-start: 1;
     grid-row-end: 3;
}
 .Venn>.circle.two {
     grid-column-start: 3;
     grid-column-end: 6;
     grid-row-start: 1;
     grid-row-end: 3;
}
 .Venn>.circle.three {
     grid-column-start: 2;
     grid-column-end: 5;
     grid-row-start: 2;
     grid-row-end: 4;
}
 .Venn>.shape.onetwo {
     grid-column-start: 3;
     grid-column-end: 4;
     grid-row-start: 1;
     grid-row-end: 2;
}
 .Venn>.shape.onethree {
     grid-column-start: 2;
     grid-column-end: 4;
     grid-row-start: 2;
     grid-row-end: 2;
}
 .Venn>.shape.twothree {
     grid-column-start: 3;
     grid-column-end: 5;
     grid-row-start: 2;
     grid-row-end: 2;
}
 .Venn>.shape.onetwothree {
     grid-column-start: 3;
     grid-column-end: 3;
     grid-row-start: 2;
     grid-row-end: 2;
}
/* Text wrap */
 .Venn .circle, .Venn .shape {
     text-align: center;
}
 .Venn .circle span, .Venn .shape span {
     box-sizing: border-box;
     float: right;
}
 .Venn .circle>span {
     height: 100%;
}
 .Venn .shape>span {
     height: 100%;
}
 .Venn .one>span {
     float: left;
     width: 32%;
     shape-margin: 0;
     shape-outside: polygon(100% 0%, 0% 0%, 0% 100%, 100% 100%, 100% 92%, 76% 88%, 44% 80%, 20% 70%, 10% 60%, 5% 50%, 10% 40%, 20% 30%, 41% 20%, 70% 10%, 100% 5%);
}
 .Venn .one>span+span {
     float: right;
     width: 66%;
     shape-outside: polygon(100% 0%, 40% 0%, 65% 15%, 53% 25%, 47% 35%, 44% 45%, 43% 50%, 31% 55%, 12% 65%, 5% 75%, 0% 85%, 0% 100%, 100% 100%);
}
 .Venn .two>span {
     float: left;
     width: 66%;
     shape-margin: 0;
     shape-outside: polygon(0% 0%, 60% 0%, 35% 15%, 47% 25%, 53% 35%, 56% 45%, 57% 50%, 69% 55%, 88% 65%, 95% 75%, 100% 85%, 100% 100%, 0% 100%);
}
 .Venn .two>span+span {
     float: right;
     width: 32%;
     shape-outside: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 92%, 24% 88%, 56% 80%, 80% 70%, 90% 60%, 95% 50%, 90% 40%, 80% 30%, 59% 20%, 30% 10%, 0% 5%);
}
 .Venn .three>span {
     float: left;
     width: 49%;
     shape-margin: 0;
     shape-outside: polygon(0% 0%, 100% 0%, 100% 40%, 75% 47%, 50% 50%, 2% 50%, 5% 60%, 13% 70%, 27% 80%, 52% 90%, 78% 95%, 100% 97%, 100% 100%, 0% 100%);
}
 .Venn .three>span+span {
     float: right;
     shape-outside: polygon(100% 0%, 0% 0%, 0% 40%, 25% 47%, 50% 50%, 98% 50%, 95% 60%, 87% 70%, 73% 80%, 48% 90%, 22% 95%, 0% 97%, 0% 100%, 100% 100%);
}
 .Venn .onetwo>span {
     float: left;
     width: 49%;
     shape-margin: 0;
     shape-outside: polygon(0% 0%, 100% 0%, 100% 30%, 72% 40%, 48% 50%, 20% 70%, 10% 85%, 0% 98%, 100% 98%, 100% 100%, 0% 100%);
}
 .Venn .onetwo>span+span {
     float: right;
     shape-outside: polygon(100% 0%, 0% 0%, 0% 30%, 28% 40%, 52% 50%, 80% 70%, 90% 85%, 100% 98%, 0% 98%, 0% 100%, 100% 100%);
}
 .Venn .onethree>span {
     float: left;
     width: 48%;
     shape-margin: 0;
     shape-outside: polygon(0% 0%, 100% 0%, 100% 5%, 70% 20%, 45% 35%, 26% 50%, 10% 75%, 5% 90%, 50% 98%, 100% 95%, 100% 100%, 0% 100%);
}
 .Venn .onethree>span+span {
     float: right;
     width: 51%;
     shape-outside: polygon(100% 0%, 0% 0%, 0% 25%, 9% 40%, 20% 55%, 40% 70%, 30% 80%, 0% 90%, 0% 100%, 100% 100%);
}
 .Venn .twothree>span {
     float: left;
     width: 51%;
     shape-margin: 0;
     shape-outside: polygon(0% 0%, 100% 0%, 100% 25%, 91% 40%, 80% 55%, 60% 70%, 70% 80%, 100% 90%, 100% 100%, 0% 100%);
}
 .Venn .twothree>span+span {
     float: right;
     width: 48%;
     shape-outside: polygon(100% 0%, 0% 0%, 0% 5%, 30% 20%, 55% 35%, 74% 50%, 90% 75%, 95% 90%, 50% 98%, 0% 95%, 0% 100%, 100% 100%);
}
 .Venn .onetwothree>span {
     float: left;
     width: 49%;
     shape-margin: 0;
     shape-outside: polygon(0% 0%, 10% 15%, 30% 35%, 50% 50%, 95% 70%, 100% 100%, 0% 100%);
}
 .Venn .onetwothree>span+span {
     float: right;
     shape-outside: polygon(100% 0%, 90% 15%, 70% 35%, 50% 50%, 5% 70%, 0% 100%, 100% 100%);
}
 .Venn .circle h1, .Venn .circle h2, .Venn .circle h3 {
     margin: 1em 0 0 0;
     text-align: center;
}

.Venn .shape h1, .Venn .shape h2, .Venn .shape h3 {
     clip-path: inset(100%);
     clip: rect(1px, 1px, 1px, 1px);
     height: 1px;
     width: 1px;
     overflow: hidden;
     position: absolute;
     white-space: nowrap;
}