*{
    margin: 0;
    padding: 0;
}
body{
    overflow: hidden;
}
.custom{
    background-color:  rgb(205, 250, 235);
    height: 100%;
    width: 100%;
    margin: 50 auto;
    box-sizing: border-box;
    background-size: cover;
    padding: 0 ;
}
body{
    height: 500px;
    width: 1200px;
    background-color: rgb(205, 250, 235);
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}
h1{
    position: relative;
    top: 57vh;
    left: 3vh;
    font-size: 5em;
    color: rgb(5, 19, 180);
}
h2{
    position: relative;
    left: 11vh;
    top: 7vh;
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: 10px;
    font-size: 1.5em;
    color: rgb(5, 19, 180);
}
.pic{
    size: 5px;
    position: relative;
    left: 66.9em;
    bottom: 11.8em;
    height: 1.5em;
    width: 6em;
}
.pic2{
    float: right;
    height: 70%;
    width: 38%;
    position: relative;
    bottom: 21vh;
   right: 5vh;
}
.pic3{
    height: 22vh;
    width: 30vh;
    padding: 25px;
}
.p3{
    background-color: rgb(214, 210, 210);
    height: 30vh;
    width: 38vh;
    border: 3px solid black;
    align-items: center;
    position: relative;
    left: 72.1%;
    top: 19%;
    justify-content: center;
}
.halfcircle{
    height:25vh ;
    width: 52vh;
    float: right;
    position: relative;
    bottom: 19.3em;
    left: 10em;
    z-index: 1;
}
.cursor{
    width: 20vh;
    height: 24vh;
    float: right;
    position: relative;
    left: 47.5em;
    bottom: 12em;
}
.design{
    height:15vh ;
    width: 15vh;
    background-color: rgb(214, 210, 210) ;
    float: right;
    z-index: 2;
    align-items: center;
    justify-content: center;
}
.des{
    
    height:15vh ;
    width: 23vh;
    background-color: rgb(214, 210, 210) ;
    float: right;
    float: top;
    position: relative;
    left: 55em;
   
    bottom: 61.9vh;
    justify-content: center;
   align-items: center;
   padding: 20px;
   text-align: center;
   border: 2px solid black;
   color: rgb(8, 107, 8);
   
   text-align: center;
   
}

.ele{
    height: 3em;
    width: 3em;
    position: relative;
    bottom: 24.4em;
    right: 12.2em;
}
.fill{

    height: 3.6em;
    width: 3.6em;
    background-color: rgb(214, 210, 210) ;
    align-items: center;
    justify-content: center;
    display: flex;
    position: relative;
    left: 47.4em;
    bottom: 10.75em;
    border: 1px solid black;
    border-top-right-radius: 30%;
    border-bottom-right-radius: 30%;
}
.square{
    height: 2.5em;
    width: 2.5em;

}
.glob{
    height: 2.5em;
    width: 2.5em;
}

.globe{
    height: 3.6em;
    width: 3.6em;
    background-color: rgb(214, 210, 210) ;
    align-items: center;
    justify-content: center;
    display: flex;
    position: relative;
    left: 43.7em;
    bottom: 14.4em;
    border-left: 1px solid black;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    border-right: 2px solid black;
    border-top-left-radius: 30%;
    border-bottom-left-radius: 30%;
}

.smallsquare{
    height: 1.7em;
    width: 1.7em;
    position: relative;
    left: 54.2em;
    bottom: 16.3em;
}
.span{
    font-size: xx-large;
    background-color:rgb(214, 210, 210) ;
    padding: 51px;
    text-align: center;
    border: 2px solid black;
    color: rgb(8, 107, 8);
    position: relative;
    left: 31.8em;
    bottom: 58vh;
}
