:root{
    --title:"GSMAZE";
    --signIn:"Daxil ol";
    --signUp:"Qeydiyyat";
    --setting:"Ayarlar";
    --prices:"Tariflər";
    --rules:"Qaydalar";
    --support:"Əlaqə";
    --signOut:"Çıxış";
    --cret:"© 2025";
    --maxwith:1200px;
}
a{
    text-decoration: none;
}
body{
    background: #e9e9e9;
    margin: auto;
    font-family: sans-serif;
    max-width: 100%;
}
header{
    background: rgb(16, 88, 140);
    border-bottom: 1px solid white;
    color:white;
    min-height: 60px;
    align-content: center;
    position: fixed;
    width: 100%;
    z-index: 1;
}
.header{
    margin: auto;
    max-width: var(--maxwith);
}
span.mtext::before {
    content: "IMEI CHECK SERVICE";
    display: block;
    position: absolute;
    font-size: 10px;
    color: white;
    margin-left: 7px;
    margin-top: -7px;
}
footer {
	border-top:1px solid white;
    background: rgb(16, 88, 140);
    color: white;
    min-height: 38px;
    align-content: center;
    position: fixed;
    bottom: 0;
    width: var(--maxwith);
    left: 50%;
    transform: translateX(-50%);
    margin: auto;
    font-size: 14px;

}
.freespace{
    padding: 30px;
}
input.inp {
    font-size: 0.9em;
    width: 100%;
    padding: 5px 5px;
    min-height: 30px;
    margin: 10px -5px;
    outline: none;
    border: solid 1px rgb(180 192 201);
    border-radius: 5px;
}
.body_menu{
    background-color: #fbfbfb;
    background-image: url(img/bg.png);
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
    max-width: var(--maxwith);
    align-content: center;
    height: 100vh;
}
h2 {
    padding-left: 10px;
    color: #505050;
}
.body_menu.r{
    align-content: unset;
    position: relative;
    padding-top: 1px;
}
.right_panel{
    float:right;
    position: relative;
    right: 5px;
}
span.text{
    text-transform: uppercase;
    font-size: 1.3em;
    color: white;
    position: relative;
    bottom: 7px;
}
span.text.title:before{
    content:var(--title);
}
span.text.cret:before{
    content:var(--cret);
    float: right;
    position: relative;
    right: 5px;
}

span.right{
    margin-right: 5px;
    background-color: rgb(14, 66, 104);
    border: 1px solid #ffffff4d;
    padding: 10px;
    border-radius: 4px;
    font-size: 0.9em;
    text-transform: uppercase;
    color:white;
    cursor:pointer;
}
span.right:hover{
    background-color: rgb(9, 53, 83);
}
span.right.signIn:before{
    content:var(--signIn);
}
span.right.signUp:before{
    content:var(--signUp);
}
span.right.setting:before{
    content:var(--setting);
}
span.right.prices:before{
    content:var(--prices);
}
span.right.rules:before{
    content:var(--rules);
}
span.right.support:before{
    content:var(--support);
}
span.right.signOut:before{
    content:var(--signOut);
}
span.text.signUp:before:hover{
    background-color: red;
}
/**/
span.icon.tg{
    background-image: url(img/telegram.png);
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    width: 16px;
    height: 16px;
}
span.text.min {
    font-size: 14px;
    margin-left: 5px;
    bottom: unset;

}
.blocks.grid {
    display: flex;
    gap: 15px;
    justify-content: center;
    text-align: center;
    place-items: center;
    position: relative;
    bottom: 100px;
}
span.no {
    background: #4ccb4c;
    color: white;
    padding: 3px;
    font-size: 13px;
    position: relative;
    bottom: 2px;
}
span.yes {
    background: #cb4c4c;
    color: white;
    padding: 3px;
    font-size: 13px;
    position: relative;
    bottom: 2px;
}

.block {
    background: rgb(16, 88, 140);
    font-size: 1.5em;
    color: white;
    align-content: center;
    width: 300px;
    height: 250px;
    margin: 5px;
}  
.cetext{
    padding: 10px;
    border-radius: 2px;
    font-size: 1.3em;
    text-transform: uppercase;
    color: white;
    cursor: pointer;
}
.cetext:hover{
    background-color: rgb(9, 53, 83);
    box-shadow: 1px 1px 20px 1px rgb(9 60 97);
}
.cetext.imei:before{
    content:"IMEI Yoxla";
    position: relative;
    top: 50px;
}
.cetext.whole:before{
    content:"Toplu IMEI Yoxla";
    position: relative;
    top: 50px;
}
.cetext.imeicreate:before{
    content:"IMEI Kalkulyator";
    position: relative;
    top: 50px;
}

.cetext.declaration:before{
    content:"Bəyannamə Yoxla";
    position: relative;
    top: 50px;
}
.cetext.imeinfo:before{
    content:"IMEI Info";
    position: relative;
    top: 50px;
}
.cetext.users:before{
    content:"İstifadəçilər";
    position: relative;
    top: 50px;
}
.cetext.package:before{
    content:"Paketlər";
    position: relative;
    top: 50px;
}
.cetext.rules_set:before{
    content:"Qaydalar";
    position: relative;
    top: 50px;
}
.cetext.admin_set:before{
    content:"Ayarlar";
    position: relative;
    top: 50px;
}
.block.cetext.imei,.block.cetext.whole,.block.cetext.declaration,.block.cetext.imeinfo,.block.cetext.imeicreate {
    background-image: url(img/imei2.png);
    background-repeat: no-repeat;
    background-position: center 60px;
    background-size: 90px;
    position: relative;
}
.block.cetext.whole {
    background-image: url(img/imei3.png);
}
.block.cetext.imeinfo {
    background-image: url(img/imei_info.png);
}
.block.cetext.declaration {
    background-image: url(img/declaration.png);
}
.block.cetext.imeicreate {
    background-image: url(img/clone.png);
}
.block.cetext.users {
    background-image: url(img/users.png);
    background-repeat: no-repeat;
    background-size: 70px;
    background-position: center 90px;
    position: relative;
}
.block.cetext.package {
    background-image: url(img/package.png);
    background-repeat: no-repeat;
    background-size: 70px;
    background-position: center 90px;
    position: relative;
}
.block.cetext.admin_set {
    background-image: url(img/sets.png);
    background-repeat: no-repeat;
    background-size: 70px; 
    background-position: center 90px;
    position: relative;
}
.block.cetext.rules_set {
    background-image: url(img/rules.png);
    background-repeat: no-repeat;
    background-size: 70px; 
    background-position: center 90px;
    position: relative;
}
.swal2-textarea {
    height: 200px !important;
    resize: none;
}
.ruless {
    display: grid;
}
a.rli {
    position: relative;
    left: 7px;
    color: white;
    margin-right: 5px;
    background-color: rgb(14, 66, 104);
    border: 1px solid #ffffff4d;
    padding: 5px;
    border-radius: 4px;
    font-size: 0.8em;
    text-transform: uppercase;
    color: white;
    cursor: pointer;
}
.r_st {
    padding: 7px;
    border: solid 1px #efefef;
    background: white;
    border-radius: 7px;
    display: inline-block;
    margin: 7px;
    text-align: left;
}
span.coun {
    background: rgb(16, 88, 140);
    color: white;
    display: inline-block;
    align-content: center;
    text-align: center;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    margin: 2px;
}
td {
    text-align: left;
}
th {
    text-align: center;
}
th, td {
    padding: 5px;
    border: 1px solid #ddd;
}
.pricing {
    display: grid;
    grid-template-columns: 33% 33% 33%;
    padding: 5px;
    justify-items: center;
} 
.packname {
    font-size: 1.3em;
    margin-bottom: 14px;
    position: relative;
    top: 5px;
}
.pack {
    background: rgb(16, 88, 140);
    border-radius: 5px;
    width: 250px;
    color: white;
    height: auto;
    margin: 5px;
    align-content: center;
    cursor: pointer;
}
.pack:hover {
    background: #003d6a; 
}
.packS {
    margin-bottom: 20px;
}
.packS.fr {
    margin-top: 20px;
}
span.icon.check {
    background-image: url(img/check.png);
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    position: absolute;
    margin-left: 4px;
    width: 16px;
    height: 16px;
}
span.icon.azn {
    background-image: url(img/azn.png?r1);
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    position: absolute;
    margin-left: 4px;
    margin-top: 1px;
    width: 16px;
    height: 16px;
}
span.icon.packi {
    background-image: url(img/shoping.png?r1);
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    position: relative;
    top: 4px;
    left: -3px;
    margin-top: 0px;
    width: 26px;
    height: 26px;
}
a.cco {
    color: #10588C;
    text-decoration: none;
}
span.icon.telegram {
    background-image: url(img/telegram.png?r1);
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    position: relative;
    top: 4px;
    left: -3px;
    margin-top: 0px;
    width: 25px;
    height: 25px;
}
span.icon.telegram.email {
    background-image: url(img/email.png?r1);
}
span.icon.telegram.phone {
    background-image: url(img/phone.png?r1);
}
.contm {
    padding: 10px;
    margin: 1px;
}
.packprice {
    padding: 5px 0;
}
hr.shops2 {
    margin-top: 4px;
    margin-bottom: 6px;
    border-bottom: 1px solid #dfdfdf;
    border-top-style: none;
    border-top-width: 0;
    border-right-style: none;
    border-right-width: 0;
    border-left-style: none;
    border-left-width: 0;
}
hr.contmt {
    margin: 0 -20px;
    margin-bottom: 6px;
    border-bottom: 1px solid #dfdfdf;
    border-top-style: none;
    border-top-width: 0;
    border-right-style: none;
    border-right-width: 0;
    border-left-style: none;
    border-left-width: 0;
}
th.users_td {
    background: #dfdfdf;
    padding: 10px;
}
table.users_adm {
    background: white;
    width: 100%;
    text-align-last: center;
}
span.icon.up {
    background-image: url(img/up.png);
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    width: 16px;
    height: 16px;
    cursor: pointer;
    position: relative;
    right: 5px;
}
span.icon.add {
    background-image: url(img/add.png?c=1);
    right: 25px;
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    width: 16px;
    height: 16px;
    cursor: pointer;
    position: relative;
}
span.icon.del {
    background-image: url(img/del.png?c=1);
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    width: 16px;
    height: 16px;
    cursor: pointer;
    position: relative;
    left: 15px;
}
.vt.text {
    text-align: left;
}
.page {
    text-align: center;
    padding: 10px;
}
span.sil {
    font-size: 17px;
    color: white;
    background: rgb(88, 88, 88);
    padding: 7px;
    border-radius: 2px;
    margin: 3px;
}
span.blue {
    background: #10588C;
    padding: 7px;
    font-size: 17px;
    border-radius: 2px;
    color: white;
    margin: 3px;
}
.headeradmin {
    background-color: #10588C;
    padding: 10px;
    color: white;
    font-size: 1.2em;
}
span.right.adm {
    font-size: 14px;
    position: relative;
    margin-bottom: -10px;
    float: right;
    top: -8px;
}
span.mypack {
    position: absolute;
    margin-left: -17px;
    margin-top: -15px;
    background: red;
    padding: 3px;
    font-size: 9px;
    border-radius: 4px;
}
.body_menu.usersp {
    align-content: unset;
}
.bl.adm{
    width:90%;
}
b.packn {
    background: red;
    color: white;
    padding: 4px;
    font-size: 14px;
    border-radius: 3px;
}
.toast {
    display: none;
    position: fixed;
    bottom: 70px;
    z-index: 9899;
    background: #10588ccf;
    border: solid 1px white;
    color: #ffffff;
    padding: 6px 70px;
    font-size: 13px;
    left: 50%;
    border-radius: 4px;
    transform: translateX(-50%);
}
span.copy {
    background-image: url(img/copy.png);
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    width: 20px;
    height: 20px;
    cursor: pointer;
    position: relative;
    left: 6px;
}
span.copy:hover {
    background-image: url(img/copy2.png);
}
.radio-container {
    display: grid;
    grid-template-columns: 50% 50%;
    margin: 0 auto;
    gap: 10px;
    justify-content: center;
    width: 100%;
}
.radio-item {
    width: 90%;
    margin-top: 10px;
}
.radio-container label {
    cursor: pointer;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 100%;
    display: block;
}
.radio-container input[type="radio"]:checked + label {
    background-color: white;
    color: #10588C;
    border-color: #10588C;
}
@media (max-width: 768px) {
    .body_menu.r{
        height: 110vh;
    }
    .block{
        width: 90%;
    }
    .pack {
        width: 100%;
    }
    span.right{
        margin-right: 2px;
        padding: 8px;
    }
    .pricing {
        grid-template-columns: 100%;
    }
    .blocks.grid {
        display: block;
        bottom: 0;
        padding-bottom: 40px;
    }
    .body_menu{
        background-size: 100%;
    }
    span.text {
        margin-left: 5px;
    }
    footer {
        left: unset;
        transform: unset;
        margin: auto;
        width: 100%;
    }
    .mpage_area {
        padding: 20px;
    }
    span.right.rules:before {
        background-image: url(img/rulesm.png?v=2);
        background-repeat: no-repeat;
        position: relative;
        top: 2px;
        background-size: cover;
        background-position: center;
        display: inline-block;
        width: 16px;
        height: 16px;
        content: " ";
    }
    span.right.support:before {
        background-image: url(img/support.png?v=2);
        background-repeat: no-repeat;
        position: relative;
        top: 2px;
        background-size: 20px;
        background-position: center;
        display: inline-block;
        width: 16px;
        height: 16px;
        content: " ";
    }

    span.right.prices:before {
        background-image: url(img/shop.png?4);
        background-repeat: no-repeat;
        position: relative;
        top: 2px;
        background-size: 20px;
        background-position: center;
        display: inline-block;
        width: 16px;
        height: 16px;
        content: " ";
    }
    span.right.setting:before {
        background-image: url(img/sett.png?4);
        background-repeat: no-repeat;
        position: relative;
        top: 2px;
        background-size: 20px;
        background-position: center;
        display: inline-block;
        width: 16px;
        height: 16px;
        content: " ";
    }
    span.right.signOut:before {
        background-image: url(img/exit.png?4);
        background-repeat: no-repeat;
        position: relative;
        top: 2px;
        background-size: 20px;
        background-position: center;
        display: inline-block;
        width: 16px;
        height: 16px;
        content: " ";
    }
    #eemail{
        display: none;
    }
}