/* hossein shrafi */

:root {
    --primary: #FF85A2;
    --primary-light: #FFB8D0;
    --primary-soft: #FFE4EC;
    --primary-background: #ffb7cda4;
    --glass-bg: rgba(255, 255, 255, 0.315);
    --glass-border: rgba(255, 255, 255, 0.5);
    --text: #5A3D4D;
    --text-light: #8B6B7A;
    --accent: #D65A78;
    --accent-dark: #B84868;
}

.dropdown {
       z-index: 999 !important;
}
.dropdown-menu {
       z-index: 999 !important;
}
.navbar  {
       z-index: 999 !important;
}
/* start Setting */
@font-face {
    font-family: yekanbakh-bold;
    src: url('/freamwork/fonts/YekanBakh-Heavy.ttf') format('truetype');
}

@font-face {
    font-family: minecraft;
    src: url('/freamwork/fonts/MinecraftTen-VGORe.ttf') format('truetype');
}

body {
    font-family: minecraft, yekanbakh-bold;
    white-space: normal;
    word-wrap: break-word;
    transition-duration: 1s;
    transition-timing-function: ease-out;
    transition-property: all;
    font-weight: bolder;
    margin: 0%;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    color: #dfdfdf;
    text-shadow: #000000 1px 2px 20px;
    letter-spacing: 3px;
}

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: #161b22;
    border-radius: 5px;

}

::-webkit-scrollbar-thumb {
    background-color: #ff9100;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #965500;
}

::-webkit-scrollbar-thumb:active {
    background: #965500;
}

/* end Setting */


/* start animation */
@keyframes open-menu {
    0% {
        height: 0px;


    }

    1% {
        height: 0px;
    }

    100% {
        height: 100lvh;
    }
}

@keyframes close-menu {
    100% {
        height: 100lvh;

    }

    1% {
        height: 100lvh;
    }

    100% {
        height: 0px;
    }
}

@keyframes float {
    0% {
        transform: translatey(0);
    }

    50% {
        transform: translatey(-30px);
    }

    100% {
        transform: translatey(0);
    }
}

.float-div {
    animation: float 4s ease-in-out infinite;
}

/* end animation */


/* start header and footer */
/*header*/
.website-top {
    position: sticky;
    top: 0%;
    width: 100%;
    z-index: 6;
}

.header {
    background-color: rgb(38, 36, 35);
    padding-top: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #000;
    box-shadow: 0 4px 0 0 rgba(0, 0, 0, .25);
}

.header ul {
    margin: 0%;
    padding: 0%;
    display: inline;
}

.header div {
    display: inline;
}

.header-menu {
    margin-right: 7px;
}

.header-logo {
    display: inline;
    margin-left: 7px;
}



/*start menu*/
.menu {
    transition-duration: 1s;
    transition-property: all;
    animation-iteration-count: 1;
    animation-name: open-menu;
    animation-timing-function: ease;
    animation-duration: 0.2s;
    background-color: rgb(133, 133, 133);
    height: 110lvh;
    background-image: url('/img/background/dirt.jpg');
    overflow-y: scroll;
    position: fixed;
    top: 0;
    z-index: 6;
    width: 100%;



}



.menu-grid-background {
    padding: 3%;
    background-color: rgba(0, 0, 0, 0.342);
    margin: 9%;
    margin-bottom: 140px;

}



.menu-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-auto-flow: row;
    gap: 20px;
    justify-items: center;
    margin: 0%;


}

.menu-close {
    animation-iteration-count: 1;
    animation-name: close-menu;
    animation-timing-function: ease;
    animation-duration: 0.2s;
}

.menu-button {
    transition: transform 0.3s ease-in-out;
    color: rgb(226, 226, 226);
    margin: 0%;
    line-height: unset;
}

.menu-option {
    background-color: transparent;
    height: 300px;
    width: 250px;
    position: relative;
    transition: transform 0.6s ease-in-out;
}

.menu-option img {
    border-radius: 10px;
}

.menu-option:hover {
    transform: scale(1.05);
    cursor: pointer;

}

.menu-option div {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 0%;
    color: rgb(211, 211, 211);
    text-align: center;
font-size: 40px;
}

/*end menu*/

/*footer*/

.footer-content {
    background-color: #111;
    padding: 10px;
    padding-top: 30px;
    padding-bottom: 40px;
    margin: 0%;
    color: rgb(242, 255, 59);

}

.footer-content a {
    color: rgb(242, 255, 59);
}

.footer-copyright {
    background-color: #313131;
    padding: 10px;
    text-align: center;
}

.footer-copyright a {
    color: rgb(224, 224, 224);

}

.footer h3 {
    margin-left: 10px;
    padding-bottom: 4px;
    border-bottom: rgb(82, 82, 82) 2px solid;
}

.footer-box {
    margin-left: 20px;
}

.footer-box h4 {
    margin-top: 15px;
}

/* end header and footer */
/*start global class*/

.hide {
    display: none;
}

.rotate {
    transform: rotate(-90deg);
}

.red {
    color: red;
}

.blue {
    color: blue;
}

.green {
    color: green;
}

.black {
    color: black;
}

.white {
    color: white;
}

.cantclick {
    touch-action: none;
    pointer-events: none;
}

.minecraft-btn {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMQAAAAPCAAAAACe4j/AAAAEuElEQVRIx1WWS5Ibuw5EtddrdRRJJE4iSKrb4c2/AUuy30iK+jEBHCTwAICMCgAKiGhKVQUwKzJHQo4mQGBy7AIvk1E2AQKhFt6bUGD1gILy0DkD4dmzACkGyzCScgFgQmLZr4LpQpC56QB2wgSYE8i1fd6xd1yPHIAKwAs14Undx2LIHK0X6vdFbzTa6CNBLQE8Y5rapn7oAl3KSDKC6cLfL6sLnIVG7ffnyUgvQ6rwLjUZdIVqWz0iEXXCZ+TJsV8feUdoPHDk+a/IeAbq0ldLT59jtHweHwmKS6gFSUYCqKcVsPami1pEnqolkCMBiAS87FXTICp03geYUr8TV8un3KuyC0BfTUzihOCdwjUya1bkT9VWe+AaFOoJzHdtERXRe/eulyEDhC6pjYwr+JQuIDU9/0wQBnJEAkd+9i6IRTJrV7YWnGfwLA6ESphkBoCu88M0YH1CTTOiRUpDdwpGkkP5yL9phhwn+QVxDarAXq513y9bLKgxBGR/CjDyMl4ECd6lO82CaMLbEHGHp1R8ePDERj392ssaCOigNjJ+dXXl6OLUFfVx6dA1BFJLlHpkUHPam095C3QJLIjn6OLIOB3xe0JS85Zd+govg1/z/UhtG3RdVW98yxNp5I0Vtf/U+6y/dJ/yHtSK4q7G9ARscC3/Df/kXTwiT3d6ovjEISLJIVEvBwWeCXlALZTbpy85xqWuf3sNiBBUmYjI+BqN6aNQqDWpipSYf3W1nOV/WALoykjIiCPreSn97UigsjZdPA5s3AmCDIxaVO0Fa1fV/qkaiijPPz/bEeRyLSBDI8K8j37TO8aH7vmOqUUQ1DboYhvqd+FlFGEo+2T75MbLGnjvPeu7Pl521Ap14dcR3h7p75qv4xieqnNDoyCPLt/yKkf5gOUXl+6S3d9Syq/982fz+fhpsm28C5EhJcxsWWQke6KoPMA7tqm7kKcrn6FLhWcoqCNCxDPyQ8wEKR73nIlEX8GpARSJX7/rzeNtWPD/Dl2IwtOYMwV7osGsHYJanzeU7KqIZVCTcrT0IEbyD4d1e1dkBtW2qLhLXK7a1ogDqsjI1DR4PY7nHEqfF9tn8HUJL+eQ/lGOXdwI1++57CqgmDaReM9CZYLAk4D4ymqti4KZI9Htz9OnrcuOhCQEqJfXaxHPAFG/l/ee1GFJPXmPryYUiUGPutnRGXkagmnjHk5RNpm7xxiclm6CjJEQ4+MD4xPmuT9Ef4b3YT3B51a7d4Np76PF0cavuC+SoaH6PlilipEakoJBJETWT3k7Hf+1REPj2fIx95t5ct6u9S5v3KM2fv2Ve29ax9yC98zT2IZot61MHyYtdPF92nguZ29xfcVxSu9Nj5Gl8G3wcVoW8n1Q/f6BHFEAyy5R2aRIdYH8XfV4453vHKcnqarXPD6mdrD0rlVV5xBPF2xuJM5Oo0SdaaqGMjJva7ii6bYv74IzPMo5pGebpu72ghypwTR+WWDuhQOkFijGyAzF3GXh11lEH0hkPINZivpTqLEtVm2j1hVcn/S0//q0es5dbyxOErxKivQ+bHotvzcT3/XztPf20XqG6fJZMePT2X6ts+nlm9LoSYHMiHuJjGXniB7v2fo/5qT4nuxYg6AAAAAASUVORK5CYII=);
    border-color: #AAA #565656 #565656 #AAA;
    text-shadow: 3px 3px #4C4C4C;
    outline: 2px solid #000;
    padding: 7px;
    color: #fff;
    font-family: minecraft;

}

.minecraft-btn:hover {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMQAAAAPCAMAAACMV5AuAAAAVFBMVEVtd7ZteLZverdwerdwe7hxfLhyfbl0frl1f7p2gLt4grx6hLx7hb18hr5+iL+AisCBi8GCjMGEjsKGkMOHkcSIksSKk8WLlMWLlcaMlcaNlsePmMdwBHmVAAAEjElEQVRIx1WW27YbKw5F3Ul2GYTWFAJX+pyd///PfgDsTg0/mSqQ1k08AEAeDkAA7kXyDAeyu2QCWREgCGSvAAbIE/D9U2m8Ji4Drw0CEhP7EMiqBFxmDMBEkHvd5AziDsjoCKQXddUl1nuZgMZrf0PMdj1kgNY+Ay+CJPg8kj1rR3X/GS9kxaoJVFaB6QkxIX5TBX65mpAZGQH3HaoCFMj6/GxuYgDyTsyup1hfxwxVN+F08ANGANyf8jqAPaBpranJvhxV+VV08JGPVScmcL8W4EIuAFWFHMZrUkUfNC3WtIsEaFogMWJRl839MES61w1cjMUsI1fb7GKaoENMOdFNykzXPz2mlwekkXjV4ioO9b15rZWZd4AaCL9cxdSutl8buIOUkd8JTgAy01IKoFoFPhAZr65SbDHgxFIGKi5IpLaKdlafAHxaVWDt2SSZ24LQhEx6aLGyj7RtELDLiA7EiD72ehBiQJo5oPq1nOQMYGAIYoY2AwIrImaA+25P8vZRa0KgqrjnQIaACiom/1G9Sla3GUHVLl/mMl/mxeUPGT0T5seAeeAQtF9WV2F7cX4niJ4DYmBd12oh7jymyRkBuq6M81mQuExHVv313beo9VH3ojfM2zZ8AkTG8X7EeDs6OZw+mrY7E5l/gqQJmZx+YySQAi1/dqQZy0as4FL1d7nrcfd1kjWTX1ZIYESTUCnuPZE7+anrqcxlz3diUX2HowHCf15S3AvxrnhRxeMwtQACGYGKZ7wGjNl7vH73MHdP8s/vSXM0FiRqMnPowfbjRsfe6n7nZ/FGIyfgF6+A/t1XTrcWB3Q42AxkMOfMfuJotRPgqGqFMfB8KO6eN+BEpO8F2eLZ18YO0GUdmEDcXMcNey+XuOfvP5P35guSVxAzWRYUpIoSuZiJrJ/p4zPouw0pwX+6XwpIcyNWEcJ/uf5Svuyx+ncTfhmotEhIBPe/8f961F/jI5aQfSs3WFOwChnZZxPk+HQjZu/WBuDFVwobZnoLISBOdkmNLFPE9iadiImsgTcdTDKA8dj1qBT518Xcg6+6L0Yl/nqCLeH+b46InkCSETTBzEQBRoPEwS9lKVUkpEx426M3oIMHYQLhK/B6jHvgXw6if4+YM4mlJdWDpLw4MhHgjwBZgIt+ZJdAVENOEkiv6mY4yy5nFPjnQmGfGVy0IqP+cmbsWF7Se/rT+5ZBzHPdKfajHW2ouWldPJaoTDJ3GUYTNMV/IyaiPYqQuX0VPXK+ra3Mc8c5Wlkp4D/e5S5htjXU3HnPPJsBXraRM/rSpOMX99zMoVradRl9AMxJdVPIYgf8Rhu0DvLM739A5rmjJ51QcW9SFXjcvR85oYOhSKTsd65pqdKWIV59ZO/7kKTDJLbvYw9XVRIyTXKJdfm4rOjE18yT8IHM/euZa0Z0fLvBSIh7h925QLoXR80WNfnqOHHP7Qk5aj+dTLX4E3hhIkafoGd15/IDT/lPTVSVr233dy6OkJtiLm0yBu+byeE2Yc59pVrDdKyPjxgD4h6r6vcFwpYNHMxVBaE2ApmfyTTjf5jQnWRymG7iAAAAAElFTkSuQmCC);
    border-color: #BDC6FF #59639A #59639A #BDC6FF;
}

.row {
    margin: 0;
}


/*end global class*/
/* start home page body */
.homepage-container {
    background-color: #1616169c;


}

.homepage-aboutus {
    margin: 0%;
    margin-bottom: 10%;
    background-image: url('/img/background/minecraftd.webp') !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-top: gold 3px solid;
    border-bottom: gold 3px solid;
}

.homepage-aboutus-content {
    background-color: #020202cc;
    height: 100%;
    padding-top: 10%;
    padding-bottom: 10%;
}

.homepage-body {
    background-image: url('/img/background/stone.jpg');

}

.slide {
    height: fit-content;
}

/* end home page body */
/* start Owl Carousel*/

.owl-carousel-base {
    position: relative;
}

.item {
    color: white;
    text-align: center;
    padding: 3px;
    margin: 10%;

}

.item img {
    width: 10%;
}

.nav-button {
    background-color: rgba(160, 160, 160, 0.733);
    color: white;
    border: solid 1px gray;
    border-radius: 10px;
    cursor: pointer;
    z-index: 5;
    position: absolute;
    top: 45%;
    font-size: x-large;
    padding: 0.6%;
    transition: all 0.5s ease;
}

.nav-button:hover {
    transform: scale(0.9);
}

.nav-button-left {

    left: 1%;
}

.nav-button-right {

    right: 1%;
}

.nav-button:hover {
    color: #424242;
}

.owl-carousel .item {
    transition: all 0.5s ease;
}

.owl-carousel .item:hover {
    transform: scale(1.05);
    box-shadow: 0 0 21px rgba(255, 255, 255, 0.5);

}





.owl-carousel .owl-stage-outer {
    position: relative;

}








/* end Owl Carousel */
/* start join now */
.join-now-body {
    width: 100%;
    height: 100%;
    background-image: url('/img/background/Minecraft2.png') !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-top: gold 3px solid;
    border-bottom: gold 3px solid;

}

.join-now-body h4 {
    margin-top: 5%;
    text-align: center;

}

.join-now-body h2 {
    margin-top: 0%;



}

.join-now-content {
    background-color: #020202cc;
    height: 100%;
}

.join-now-text {

    padding: 5%;

}


.join-now-button button {
    background-color: #00d111;
    border-color: #00ff6a;
    padding: 10px;
    border-radius: 10px;
    margin-top: 10px;


}

.join-now-button button {
    color: #d3d3d3 !important;
    text-shadow: black 1px 1px 0px;

}



/* end join now */





/* start panel  */


/* start signup page  */
.signup-body {
    background-image: url('/img/background/minecraft.jpg') !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;

}

.signup-body p {
    margin-top: 7px;
    color: #e4e4e4;
    font-size: medium;
    margin-bottom: 3px;

}

.signup-body form {
    margin-top: 0px;


}

.signup-body input {
    font-family: yekanbakh-bold;
    color: #000000;
    width: 100%;
    text-shadow: none;
}

.signup-body form ::placeholder {
    color: #313131;
    opacity: 1;
    text-shadow: none;
}

.signup-body h1 {
    color: #ffffff;
    margin-top: 5px;

}

.signup-body input[type=button] {
    font-family: minecraft;
    width: 45%;
    margin-top: 10px;

}

.signup-body input[type=checkbox] {
    width: unset !important;
}

.signup-body label {
    color: #dddddd;
    font-family: yekanbakh-bold !important;
    margin: 10px;
}

.signup-body button {
    font-family: minecraft;
    width: 45%;
    margin-top: 10px;

}

.checkbox-wrapper-46 {
    text-align: left;
    margin-left: 10px;
}

.checkbox-wrapper-46 input[type="checkbox"] {
    display: none;
    visibility: hidden;
}

.checkbox-wrapper-46 .cbx {
    margin: auto;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
}

.checkbox-wrapper-46 .cbx span {
    display: inline-block;
    vertical-align: middle;
    transform: translate3d(0, 0, 0);
}

.checkbox-wrapper-46 .cbx span:first-child {
    position: relative;
    width: 18px;
    height: 18px;
    border-radius: 3px;
    transform: scale(1);
    vertical-align: middle;
    border: 1px solid #9098A9;
    transition: all 0.2s ease;
}

.checkbox-wrapper-46 .cbx span:first-child svg {
    position: absolute;
    top: 3px;
    left: 2px;
    fill: none;
    stroke: #FFFFFF;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 16px;
    stroke-dashoffset: 16px;
    transition: all 0.3s ease;
    transition-delay: 0.1s;
    transform: translate3d(0, 0, 0);
}

.checkbox-wrapper-46 .cbx span:first-child:before {
    content: "";
    width: 100%;
    height: 100%;
    background: #506EEC;
    display: block;
    transform: scale(0);
    opacity: 1;
    border-radius: 50%;
}

.checkbox-wrapper-46 .cbx span:last-child {
    padding-left: 8px;
}

.checkbox-wrapper-46 .cbx:hover span:first-child {
    border-color: #506EEC;
}

.checkbox-wrapper-46 .inp-cbx:checked+.cbx span:first-child {
    background: #506EEC;
    border-color: #506EEC;
    animation: wave-46 0.4s ease;
}

.checkbox-wrapper-46 .inp-cbx:checked+.cbx span:first-child svg {
    stroke-dashoffset: 0;
}

.checkbox-wrapper-46 .inp-cbx:checked+.cbx span:first-child:before {
    transform: scale(3.5);
    opacity: 0;
    transition: all 0.6s ease;
}

@keyframes wave-46 {
    50% {
        transform: scale(0.9);
    }
}


/* end signup page  */


/* end panel  */


/* start store and post box*/
.post-base {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
    grid-auto-flow: row;
    gap: 20px;
    justify-items: center;

}

.post-box {
    width: 200px;
    height: 200px;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.5s ease;
    overflow: hidden;
    position: relative;
}

.post-box:hover {
    border-radius: 5px;

    img {
        box-shadow: 4px 4px 10px var(--primary);
        transform: scale(1.2);
        filter: blur(2px);
    }
}

.post-box img {
    width: 100%;
    transition: all 0.5s ease;
}

.post-title {
    font-family: yekanbakh-bold !important;
    text-align: center;
    color: #fff !important;
    position: absolute;
    bottom: 0%;
    width: 100%;
    height: 35%;
    background-color: var(--glass-bg);

    padding-top: 4px;

}

.post-title p {
    color: #fff !important;
    text-shadow: 0px 0px 10px #000000;
}

.post-date {
    font-family: yekanbakh-bold !important;
    margin: 0px 0px 0px 5px;
    position: absolute;
    left: 0%;
    bottom: 0%;
}



/* end store and post box*/
/* message box*/
@keyframes toast-bottom {
    0% {
        width: 0%;
        color: black;
    }

    100% {
        width: 100%;

    }
}

@keyframes toast {
    0% {
        transform: translatey(100px);
        opacity: 0;
    }

    5% {
        transform: translatey(0px);
        opacity: 1;

    }

    90% {
        transform: translatey(0px);
        opacity: 1;

    }

    100% {
        transform: translatey(-100px);
        opacity: 0;

    }
}


.toast {
    animation-name: toast;
    animation-timing-function: linear;
    animation-iteration-count: 1;
    animation-duration: 5.2s;
    position: fixed;
    top: 10px;
    right: 10px;
    color: #fff;
    transition-duration: 0.5s;
    transition-property: all;
    transition-timing-function: linear;
    border-radius: 5px 0px 5px 5px;
    display: none;
    min-width: 100px;
    text-align: center;
}

.toast:hover {
    opacity: 0.4;

    .toast-bottom {
        opacity: 0.4;
    }

}

.toast p {
    margin: 7px 10px;
    font-family: yekanbakh-bold !important;
}

.toast-bottom {
    animation-name: toast-bottom;
    animation-timing-function: linear;
    animation-iteration-count: 1;
    animation-duration: 5s;
    background-color: #fff;
    height: 3px;
    width: 1px;

}



/* bootstrap config*/
th,
td {
    color: #fff;
    font-size: larger;
}

.table-hover>tbody>tr:hover {

    th,
    td {
        color: #000;
    }
}





/* end message box*/

.item .post-box {
    width: unset !important;
    height: unset !important;

}