*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    font-size: 14px;
}

body{
    background-color: white;
    width: 100vw;
}

body h1{
    font-weight: 600;
    font-size: 40px;
    text-align: center;
}

.hd{
    background-color: white;
    color: #6a0388;
    padding: 10px;
}

.name{
    color:#6a0388;
    font-size: 60px;
}

.bnr{
    background-image: url('../images/bg1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

.overlap{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    color: #6a0388;
    font-weight: 900;
    text-align: center;
    border-radius: 0px 40px 0px 40px;
}

.overlap-box1, .overlap-box2, .overlap-box3, overlap-box4{
    border-right: 2px solid black;
}

#maina h2{
    font-weight: 600;
    font-size: 80px;
    padding: 50px 50px 5px 50px;
}

#maina p{
    font-size: 25px;
    padding: 5px 50px;
}

#mainb{
    padding: 50px;
}

#mainb h2{
    font-weight: 900;
    font-size: 100px;
    text-align: center;
}

#img1{
    transform: rotate(20deg);
}

.mainc{
    padding: 50px;
    /*background-image: url('../images/iphone3.png');*/
    background-size: contain;
    background-repeat: no-repeat;
}

.main2b h2{
    font-size: 40px;
    font-weight: 900;
    text-align: center;
}

#main2a {
    background-image: url('../images/tranparent1.png');
}

.main2b p{
    font-size: 20px;
}


.prd{
    padding: 100px 0px;
}
.product{
    border-radius: 40px 40px 0px 0px;
    background-color: white;
    color: black;
    border-top: 15px solid black;
    border-right: 15px solid black;
    border-left: 15px solid black;
    height: 100%;
}
.product:hover, .innerTop{
    box-shadow: 5px 5px 8px black;
    background-color:#6a0388;
    color: white;
    font-weight: 600;
    border-top: 15px solid lightgrey;
    border-right: 15px solid lightgrey;
    border-left: 15px solid lightgrey;
    transform: scale(1.1);
    transition: transform 2s;
}
.highlight{
    color:rgb(225, 181, 225);
    font-weight: 600;
    font-size: 25px;
}

.options{
    font-size: 13px;
    color: #ffffff;
    text-align: center;
}

.boxshd{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.box1, .box2, .box3, .box4{
    border-radius: 30px;
    padding: 0px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    font-weight: 600;
    height: 350px;
    overflow: hidden;
    color: #6a0388;
    background-color: #ffffff;
}

.box1:hover{
    background-color: #6a0388;
    color: #dac9df;
}

.box2:hover{
    background-color: #6a0388;
    color: #dac9df;
    font-weight: 600;
}

.box3:hover{
    background-color: #6a0388;
    color: #dac9df;
    font-weight: 600;
}

.box4:hover{
    background-color: #6a0388;
    color: #dac9df;
    font-weight: 600;
}

.benefits h2{
    color: black;
    font-weight: 600;
    font-size: 60px;
}
div#ftop{
    background-color: black; 
    width: 1350px;
    padding: 20px;
    background-size: contain;
}
.footer-col a:link, .footer-col a:visited{
    color: rgb(232, 200, 216);
}

.footer-col li{
    line-height: 35px;
}

.footer-btm{
    color: lightgrey;
}

.footer-btm a:link{
    color: lightgrey;
}

.testimony{
    background-color:#6a0388;
    color:  white;
    font-size: 30px;
    display: flex;
    text-align: center;
    align-items: center;
}


.testimony-top h2{
    font-size: 60px;
    font-weight: 600;
    color: #6a0388;
    padding: 20px;
    text-align: center;
}
.testimony p{
    font-size: 20px;
}

.account{
    background-color: #6a0388;
    background-image: url('../images/bg1.png');
    background-size: cover;
}

.account-col h2{
    font-size: 60px;
    font-weight: 600;
    color: black;
    padding: 50px;
    text-align: center;
}

.phone-account-display{
    border-radius: 40px 40px 0px 0px;
    background-color: white;
    color: black;
    border-top: 10px solid black;
    border-right: 10px solid black;
    border-left: 10px solid black;
    border-bottom: 2px solid black;
    height: 100%;
}

.balance{
    border-radius: 20px;
    background-color:blueviolet;
}

/* Client Area */
.bx{
    width:              200px;
    height:             200px;
    background-color: white;
    font-size:          15px;
    border-radius:      30px;
    box-shadow:         0 4px 8px 0 rgba(175, 173, 173, 0.3), 0 6px 20px 0 rgba(175, 173, 173,0.3);
    margin:             20px;
}

.bx:hover{
    width:              200px;
    height:             200px;
    background-color: grey;
    color:            white;
    border-radius:      30px;
    cursor:             pointer;
    margin:             20px;
}

.boxshadow{
    box-shadow: 0 4px 8px 0 rgba(175, 173, 173, 0.3), 0 6px 20px 0 rgba(175, 173, 173,0.3);
}

.about{
    font-size: 22px;
}

div.about h2{
    color:rgb(230, 184, 222);
    font-size: 40px;
    font-weight: 600;
}


.pixlink{
    color: black;
    text-decoration: none;
}

.pixlink:hover{
    color: white;
    text-decoration: none;
}

@media screen and (max-width: 600px){

    .bnr{
        background-image: url('../images/bg1.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        text-align: center;
        align-items: center;
        font-size: 40px;
    }
    
}
    