html body{
    background-color: #fff;
}

.labelvm{
    margin-bottom: 2vh !important;
}
.rowvm{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.codnumcel{
    width: 18%;
}
.numcel{
    width: 80%;
}
.btnsubvm{
    background-color: #005DC4;
    color: #fff;
    padding: 2vh;
    border: none;
    border-radius: 10px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    margin-top: 2vh;
    cursor: pointer;
}
.btnsubvm i{
    margin-right: 1vh;
}

.container_startpage{
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.content_startpage{
    width: 40%;
    padding: 2vh;
    border-radius: 10px;
    background-color: #f7f7f7;
}

.content_logo_startpage{
    width: 100%;
    text-align: center;
}

#form_startpage{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.input_startpage{
    height: 60px !important;
}

.container_btnsub_startpage{
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

/* HTML: <div class="loader"></div> */
.loader {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: 
      radial-gradient(farthest-side,#005DC4 94%,#0000) top/8px 8px no-repeat,
      conic-gradient(#0000 30%,#005DC4);
    -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 8px),#000 0);
    animation: l13 1s infinite linear;
  }
  @keyframes l13{ 
    100%{transform: rotate(1turn)}
  }

.alertloading{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.alertloading div{
    margin-right: 1vh;
}

.inputconvm{
    margin-top: 2vh;
}

.boxcateg{
    padding: 1.5vh;
    border-radius: 10px;
    background-color: #ccc;
    width: fit-content;
    margin-top: 2vh;
    margin-right: 2vh;
    text-transform: capitalize;
    cursor: pointer;
    transition: 0.6s;
}

.boxcategselected{
    background-color: #005DC4;
    color: #fff;
}

.containersearchcateg{
    width: 50%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.btnremovecateg{
    background-color: transparent;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    color: red;
    cursor: pointer;
}

.boxcategjaselected{
    padding: 1.5vh;
    border-radius: 10px;
    background-color: #005DC4;
    width: fit-content;
    margin-top: 2vh;
    margin-right: 2vh;
    text-transform: capitalize;
    cursor: pointer;
    transition: 0.6s;
    color: #fff;

    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.boxcategjaselected >i {
    margin-left: 1.5vh;
}

#categselecttext{
    display: none;
    flex-direction: row;
}

.container_infolojapage{
    margin-top: 2vh;
}

.content_infolojapage{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

#descloja{
    height: 150px;
}

.containercategselected{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}

.containercategselected > div{
    margin-right: 1.5vh;
}

.container_planospage{
    margin-top: 2vh;
}

.content_planospage{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.boxplanos{
    width: 30%;
    padding: 2vh;
    border-radius: 10px;
    background-color: #f7f7f7;
}

.boxrecursosplan1{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.boxrecursosplan i{
    color: green;
}

.priceplan{
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    color: green;
    font-weight: 600;
}

.priceplan b{
    font-size: 18px;
    margin-left: 1vh;
    color: #333;
    font-weight: 500;
}

.titlecardpag{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}

.rowplanpag{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}

.checkpag{
    width: 25%;
}

.radiovm{
    width: 30px !important;
    height: 30px !important;
    background-color: #ccc !important;
}

.titlecardpag i{
    margin-right: 1vh;
}

.cardpagplan{
    width: 49% !important;
    margin-top: 2vh;
}

.rowpagplan{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

#tagetconpag{
    display: none;
}

.container_btnsub_planopage{
    display: none;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-top: 4vh;
    margin-bottom: 4vh;
}

#textconpag{
    display: none;
}

.formadepagplan{
    text-transform: capitalize;
}

.content_verificationpage{
    width: 40%;
    padding: 2vh;
    border-radius: 10px;
    background-color: #f7f7f7;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2vh;
}

.content_confirmpage{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.boxconfimpageinfo{
    padding: 2vh;
    border-radius: 10px;
    background-color: #f7f7f7;
}
.boxpayment{
    width: fit-content;
}
.rowconfirm b{
    text-transform: capitalize;
    margin-bottom: 2vh !important;
}

.container_btnsub_confirmpage{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4vh !important;
}

.btnbackvm{
    background-color: #ccc;
    color: #333;
    padding: 2vh;
    border: none;
    border-radius: 10px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    margin-top: 2vh;
    cursor: pointer;
}

.btnbackvm i{
    margin-right: 1vh;
}

.bacmodalvm{
    width: 100%;
    height: 100vh;
    background-color: rgba(000,000,000, 0.8);
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 9999999;
    display: none;
}

.contentpayment{
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.contentmodalvmconfirm{
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    padding: 2vh;
    background-color: #fff;
    border-radius: 10px;
    position: absolute;
    top: 50%; /* Move para 50% da altura da tela */
    left: 50%; /* Move para 50% da largura da tela */
    transform: translate(-50%, -50%); /* Ajusta para o centro */
    z-index: 99999999999;
    display: none;
    max-height: 85vh;
    overflow-y: auto;
}

.container_infoloja{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.container_infolojaleft{
    width: 70%;
}

.container_infolojaright{
    width: 25%;
}

.headercardlojainfo{
   width: 100%;
   border: 1px solid #0C63E4;
   border-radius: 5px;
   padding: 1vh; 
}

.textheadercadloja{
    width: 80%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-weight: bold;
}

.conformcheckheaderloja{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.btncheckheaderloja{
    border: none;
    background-color: transparent;
    transition: 0.6s;
}
.btncheckheaderloja:hover{
    background-color: #0C63E4;
    cursor: pointer;
    border-radius: 5px;
    color: #fff;
}
.contentcardlojainfo{
    -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.20);
    -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.20);
    box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.20);
    margin-top: 1vh;
    border-radius: 5px;
    width: 100%;
    padding: 1vh;
}

#contentcardlojalogo{
    display: none;
}

.cardconlojainfo{
    margin-top: 2vh;
}

.pricecardservadc{
    color: #09c109;
}

.cardservicesselected{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    background-color: #f1f1f1;
    width: fit-content;
    margin-top: 1vh;
    padding: 1vh;
    border-radius: 5px;
    margin-right: 1vh;
}
.cardservicesselected i{
    margin-right: 1vh;
}
.listtotal li{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background-color: #f1f1f1;
    padding: 1vh;
    margin-top: 1vh;
    border-radius: 5px;
}

.listtotal p{
    margin: 0px !important;
    margin-right: 2vh !important;
}

.backmodalcard{
    display: none;
    position: fixed;
    width: 100%;
    height: 100vh;
    top: 0px;
    left: 0px;
    background-color: rgba(000,000,000, 0.8);
}
.modalcontainercard{
    display: none;
    width: 100%;
    position: fixed;
    bottom: 0px;
    left: 0px;
    background-color: #fff;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    padding: 2vh;
}
.modalcontainercard input{
    height: 60px !important;
}
.rowcard1{
    width: 60%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}
.rowcard2{
    width: 60%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2vh;
}

.rowcard3{
    width: 60%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2vh;
    margin-bottom: 2vh;
}
.connumbercard{
    width: 75%;
}
.convalidadecard{
    width: 20%;
}

.connomecard{
    width: 75%;
}

.concvvcard{
    width: 20%;
}

.concpfcard{
    width: 40%;
}

.conbtnsave{
    width: 40%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}

.closemodalcard{
    border: none;
    background-color: transparent;
    color: red;
    cursor: pointer;
    float: right;
    margin-right: 4vh;
}

.closemodalcard i{
    font-size: 30px;
}

.rowconfirmpay{
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}
.rowconfirmpay b{
    margin-left: 2vh;
}

.createlojastate_pay{
    display: none;
}
.categsresumo{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.containercopiaecola{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
#pixcopiaecola{
    width: 85%;
    height: 55px;
    padding: 1vh;
    font-size: 16px;
}
.btnpixcopiaecola{
    width: 10%;
    background-color: #f1f1f1;
    border:none;
    padding: 1vh;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.rowbtnac{
    display: none;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin-top: 1.5vh;
    padding: 1vh;
}
.btnrefreshpix{
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F1F1F1;
    border:none;
    cursor: pointer;
    transition: 0.6s;
}
.btnrefreshpix:hover{
    width: 57px;
    height: 57px;
}
.btnirparapainel{
    height: 50px;
    padding: 1vh;
    border-radius: 10px;
    background-color: #f1f1f1;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    border: none;
    margin-left: 2vh;
    font-size: 15px;
}
.btnirparapainel i{
    margin-right: 1.5vh;
}
.containersearchdominio{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.inputsearchdominio{
    width: 65%;
    height: 55px;
    border: none;
    padding: 1vh;
    border: 2px solid #f1f1f1;
    border-radius: 5px;
    font-size: 16px;
}
.btnsearchdominio{
    width: 55px;
    height: 55px;
    border:none;
    background-color: #f1f1f1;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    cursor: pointer;
}
.rowresultdominio{
    width: 100%;
    margin-top: 1vh;
}
.selectdomain{
    height: 55px;
    border: 2px solid #f1f1f1;
}
.rowservices{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 2vh;
} 
.rowservices > p{
    margin-right: 2vh;
}
.cardservicesselected p{
    margin: 0px;
}
.rowloadingstep3{
    display: none;
}
@media (max-width: 600px) {
    .content_startpage{
        width: 95%;
    }
    .container_btnsub_startpage{
        justify-content: center;
    }

    .btnsubvm{
        width: 80%;
        justify-content: center;
    }

    .codnumcel{
        width: 40%;
    }

    .numcel{
        width: 58%;
    }
}