#input_btn_forDesktop {
    display: none;
}

#ax {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

#ax::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.75);
}

#div_body {
    position: fixed;
    width: 100%;
    height: 100%;
    overflow: auto;
}

#content {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#companyName_box {
    position: relative;
    height: 25%;
    text-align: center;
    padding-top: 13.5vh;
}

#companyName {
    display: inline-block;
    height: 7.02vw;
    position: relative;
    font: 10vw parmis;
    line-height: 5.74vw;
    color: #ffd800;
    overflow: hidden;
}

#effectBox {
    position: absolute;
    top: -50vw;
    right: -150vw;
    width: 40vw;
    height: 100vw;
    background: rgba(0, 0, 0, 0.6);
    /*background: rgb(90, 90, 1);*/
    transform: rotate(-25deg);
    animation: companyNameEffect 2700ms linear infinite;
}

@keyframes companyNameEffect {
    from {
        right: -150vw;
    }
    to {
        right: 200vw;
    }
}

#smartHome_box {
    height: 20%;
    text-align: center;
    padding-top: 4vh;
}

#smartHome_box > div {
    position: relative;
    display: inline;
    height: 8vw;
    font: 10vw E-vahid2;
    color: #ffffff;
}

#myForm {
    position: relative;
    height: 24%;
}

.inputs_box {
    position: relative;
    height: 50%;
}

.inputs_centerBox {
    height: 12vw;
    text-align: center;
}

.inputs_box_content {
    display: inline-block;
    position: relative;
}

.Inputs {
    width: 75vw;
    height: 12vw;
    padding: 0 10%;
    font: 5vw Vahid1;
    line-height: 13vw;
    text-align: center;
    color: #fff;
    border: 1px solid #ffd800;
    border-radius: 7vw;
    background: rgba(125, 125, 125, 0.01);
    transition: all 500ms ease;
    letter-spacing: 0.8vw;
}

.Inputs::placeholder {
    color: white;
    text-align: center;
    font: 6vw E-vahid8;
    line-height: 13vw;
    letter-spacing: normal;
}

.Inputs.error {
    border: none;
    box-shadow: 0 0 20px rgba(255, 0, 0, 0.7);
}

.Inputs:focus {
    width: 85vw;
    height: 14vw;
    font-size: 6vw;
    border: none;
    box-shadow: 0 0 20px rgba(255, 255, 255, .7);
}

.Inputs:focus::placeholder {
    font-size: 7vw;
}

#eye_box {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 1%;
    margin: auto;
    width: 12vw;
    height: 12vw;
    cursor: pointer;
}

#eye {
    width: 55%;
    height: auto;
}

#checkBox_box {
    position: relative;
    height: 6%;
}

#checkBox_centerBox {
    height: 50%;
    text-align: center;
}

#checkBox_box_content {
    display: inline-block;
    cursor: pointer;
}

#checkbox_icon {
    display: inline-block;
    width: 5vw;
    height: auto;
    vertical-align: middle;
}

#checkBox_text {
    display: inline-block;
    height: 100%;
    color: white;
    font: 3vw Vahid1;
    margin-right: 1vw;
}

#forget_box {
    position: relative;
    height: 10%;
}

#forget_box > span {
    font: 3vw vahid1;
    height: 6vw;
    text-align: center;
}

#iotRegisteringText {
    display: none;
    position: relative;
    font-size: 3.5vw;
    color: #ffd800;
    margin-right: 2vw;
}

#iotRegisteringText_touchBox {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

#forget_box > span > a {
    color: #d9d9d9;
}

#btn_box {
    position: relative;
    height: 10%;
}

#btn {
    width: 75vw;
    height: 12vw;
    font: 7vw E-vahid6;
    line-height: 12vw;
    text-align: center;
    color: white;
    background: rgba(255, 216, 0, 0.30);
    border-radius: 7vw;
    cursor: pointer;
}

#btn.active {
    width: 78vw;
    height: 16vw;
    font-size: 8.5vw;
    line-height: 16vw;
    box-shadow: 0 0 10vw rgba(255, 255, 255, 0.8);
}

#btn.inLogin {
    animation: inLogin 1300ms linear infinite;
}

@keyframes inLogin {
    0% {
        width: 85vw;
    }

    50% {
        width: 55vw;
    }

    100% {
        width: 85vw;
    }
}

#android_dark {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.13);
}

#android_box, #iot_panel_circleBox {
    position: absolute;
    top: 23%;
    width: 48vw;
    height: 16vw;
    background: rgba(0, 0, 0, .6);
    overflow: hidden;
}

#android_box {
    right: -32vw;
    border-radius: 9vw 0 0 9vw;
}

#iot_panel_circleBox {
    left: -32vw;
    border-radius: 0 9vw 9vw 0;
}

#android_icon {
    width: 13vw;
    height: 13vw;
    margin: 1.5vw;
    float: left;
    border-radius: 100%;
    transition: all 700ms linear;
    border: 1px solid #ffd800;
    cursor: pointer;
}

#android_text {
    float: left;
    width: 32vw;
    height: 14vw;
}

#android_text > a {
    display: block;
    height: 100%;
    font: 4.5vw E-vahid8;
    text-align: center;
    line-height: 16vw;
    color: greenyellow;
}

#iot_panel_circleBox #circle_box {
    position: relative;
    width: 13vw;
    height: 13vw;
    margin: 1.5vw;
    float: right;
    border-radius: 100%;
    transition: all 700ms linear;
    border: 1px solid #ffd800;
    cursor: pointer;
    font: 8vw E-vahid1;
    color: white;
    line-height: 13vw;
    text-align: center;
}

#change_Iot_panel_textBox {
    float: right;
    width: 32vw;
    height: 100%;
    font: 6vw E-vahid8;
    text-align: center;
    color: greenyellow;
    line-height: 16vw;
    cursor: pointer;
}

/*-----------------------------------------------------------*/

.grecaptcha-badge {
    bottom: -20px !important;
    right: -74px !important;
}

.grecaptcha-badge {
    transform: scale(0.4);
    transform-origin: 100% 0;
}

/*-----------------------------------------*/

#selectSite_box_dark {
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.6);
}

#selectSite_box {
    display: none;
    width: 98%;
    height: 33vw;
    position: absolute;
    background: rgba(255, 255, 255, 0.99);
    border-radius: 8vw;
}

#path_btn_box {
    width: 100%;
    height: 30%;
    position: absolute;
    left: 0;
    bottom: 10%;
    /*background: #4384f8;*/
}

#path_text {
    position: absolute;
    top: 20%;
    left: 0;
    width: 100%;
    height: 7vw;
    font: 4vw Vahid1;
    line-height: 7vw;
    text-align: right;
    padding-right: 10%;
    color: #333;
    /*background: #aaaaaa;*/
}

.path_btn {
    width: 49%;
    height: 100%;
    position: absolute;
    top: 0;
    font: 4vw Vahid1;
    font-weight: bold;
    color: #3e3eff;
    line-height: 12vw;
    text-align: center;
    cursor: pointer;
    /*background: red;*/
}

#loginToPanel_btn {
    right: 0;
}

#loginToIot_btn {
    left: 0;
}

#splitLine {
    width: 1px;
    height: 50%;
    position: absolute;
    top: 30%;
    left: 50%;
    background: #aaa;
}

/*-----------------------------------------------------*/
#registerBox_content {
    transform: scale(0);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    box-shadow: 0 0 5vw #eadd19c9 inset;
    transition: all 1200ms cubic-bezier(.19, 1, .22, 1);
}

#parmisTextBox {
    position: relative;
    height: 25%;
}

#parmisText {
    position: absolute;
    bottom: 20%;
    left: 0;
    width: 100%;
    height: 58px;
    font: 10vw parmis;
    text-align: center;
    color: #ffd800;
}

#registerTitleBox {
    position: relative;
    height: 20%;
}

#registerTitleText {
    width: 100%;
    height: 17vw;
    font: 12vw E-vahid2;
    text-align: center;
    color: white;
}

#registerUsername_Box, #registerPassword_Box {
    position: relative;
    height: 12%;
}

.regInputs {
    width: 75vw;
    height: 12vw;
    /*background: rgba(255,255,255,0.2);*/
    border-radius: 12vw;
    outline: none;
    border: 1px solid #ffd800;
    text-align: center;
    direction: ltr;
    background: rgba(125, 125, 125, 0.01);
    color: #fff;
    padding: 0 10%;
    font-size: 5vw;
    letter-spacing: 0.8vw;
    transition: all 500ms ease;
}

.regInputs::placeholder {
    color: white;
    text-align: center;
    font: 6vw E-vahid8;
    letter-spacing: normal;
}

.regInputs::placeholder {
    color: white;
    text-align: center;
    font: 6vw E-vahid8;
    line-height: 13vw;
    letter-spacing: normal;
}

.regInputs.error {
    border: none;
    box-shadow: 0 0 20px rgba(255, 0, 0, 0.7);
}

.regInputs:focus {
    width: 85vw;
    height: 14vw;
    font-size: 6vw;
    border: none;
    box-shadow: 0 0 20px rgba(255, 255, 255, .7);
}

.regInputs:focus::placeholder {
    font-size: 7vw;
}

#guideLink_box {
    position: relative;
    height: 14%;
}

#guideLink_box_verticalCenter {
    height: 10vw;
    text-align: center;
}

#guideLink_box_horizontalCenter {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

#guideLink {
    display: inline;
    font: 3.5vw Vahid1;
    color: white;
}

#guideLing_img {
    display: inline;
    width: 8vw;
    height: auto;
    vertical-align: middle;
    margin-right: 2vw;
}

#registerBtn_box {
    position: relative;
    height: 17%;
}

#registerBtn {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 40%;
    margin: 0 auto;
    width: 75%;
    height: 12vw;
    background: rgba(255, 216, 0, 0.38);
    border-radius: 20px;
    font: 7vw E-vahid2;
    box-shadow: 0 2px 3px rgba(0, 0, 0, .3);
    cursor: pointer;
    color: white;
    text-align: center;
    line-height: 12vw;
}

#closeRegisterBox {
    position: absolute;
    top: 6vw;
    right: 6vw;
    width: 6vw;
    height: auto;
    cursor: pointer;
}

/*------------------------*/
#register_msgBox_box {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
}

#register_msgBox {
    position: relative;
    transform: translate(-50%, -50%);
    left: 40%;
    top: 50%;
    width: 90%;
    box-shadow: 0 0 10vw rgba(255, 255, 255, 0.5);
    background: radial-gradient(circle, rgba(63, 94, 251, 0.5) 0%, rgba(252, 70, 107, 0.3) 100%);
    max-height: 94%;
    overflow: hidden;
    border-radius: 0 15vw;
}

#register_msgBox_title {
    position: relative;
    height: 20vh;
    font: 8vw E-vahid8;
    color: #3bdaf4;
    text-align: center;
    line-height: 20vh;
}

#register_msgBox_closeImg {
    position: absolute;
    width: 12%;
    height: auto;
    top: 5vw;
    left: 5vw;
    border: 1px dotted #fff;
    border-radius: 50%;
    padding: 1vw;
    cursor: pointer;
}

#register_msgBox_content {
    position: relative;
    overflow: auto;
    padding: 0 5vw 5vw 5vw;
    max-height: 74vh;
}

#register_msgBox_content > p {
    text-align: right;
    direction: rtl;
    font: 4vw Vahid1;
    color: white;
    padding: 0.5vw 0;
}

#register_msgBox_content p:first-child {
    margin-top: 0;
}

/*------------------------------------------------------*/
/*@media screen and (min-width: 370px) and (min-height: 720px) {*/
/*    .input_btn_size {*/
/*        height: 50px;*/
/*        line-height: 50px;*/
/*        border-radius: 25px;*/
/*    }*/

/*    #android_box, #iot_panel_circleBox {*/
/*        width: 210px;*/
/*        height: 60px;*/
/*        bottom: 71%;*/
/*    }*/

/*    #android_text > a, #change_Iot_panel_textBox {*/
/*        height: 60px;*/
/*        line-height: 60px;*/
/*        padding-left: 6px;*/
/*        font-size: 12px;*/
/*    }*/

/*    #android_icon {*/
/*        width: 50px;*/
/*    }*/

/*    #iot_panel_circleBox #circle_box {*/
/*        width: 50px;*/
/*        height: 50px;*/
/*    }*/
/*}*/

/*--------------------------------------------*/

/*body*/
/*{*/
/*    margin:0;*/
/*    padding:0;*/
/*    background:#262626;*/
/*}*/

.ringDark {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    top: 0;
    left: 0;
}

.ring {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 150px;
    height: 150px;
    background: transparent;
    border: 1px solid #3c3c3c;
    border-radius: 50%;
    text-align: center;
    line-height: 150px;
    font-family: sans-serif;
    font-size: 20px;
    color: #fff000;
    letter-spacing: 4px;
    text-transform: uppercase;
    text-shadow: 0 0 10px #fff000;
    box-shadow: 0 0 20px rgba(0, 0, 0, .5);
}

.ring:before {
    content: '';
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    border-top: 1px solid #fff000;
    border-right: 1px solid #fff000;
    border-radius: 50%;
    animation: animateC 1500ms linear infinite;
}

.ring_span {
    display: block;
    position: absolute;
    top: calc(50% - 2px);
    left: 50%;
    width: 50%;
    height: 4px;
    background: transparent;
    transform-origin: left;
    animation: animate 1500ms linear infinite;
}

.ring_span:before {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #fff000;
    top: -4px;
    right: -5px;
    box-shadow: 0 0 30px #fff000;
}

@keyframes animateC {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes animate {
    0% {
        transform: rotate(45deg);
    }
    100% {
        transform: rotate(405deg);
    }
}

/*---------------error box------------------*/
#errorBox_box {
    display: none;
    width: 86vw;
    height: 100vw;
    box-shadow: 0 0 12vw rgba(255, 0, 0, 0.5);
    border-radius: 0 20vw;
    background: rgba(0, 0, 0, 0.4);
}

#errorBox_row1 {
    position: relative;
    height: 40%;
}

#errorBox_row1 img {
    width: 20vw;
    height: auto;
}

#errorBox_row2 {
    position: relative;
    height: 60%;
}

#errorBox_title {
    height: 20%;
    margin: 0;
    font: 12vw E-vahid2;
    color: #ffd800;
    text-align: center;
    direction: ltr;
    padding-top: 14vw;
}

#errorBox_row2 p {
    height: 40%;
    padding: 3vw 10vw;
    font: 4vw Vahid2;
    color: #fff;
    text-align: center;
    line-height: 9vw;
    margin: 0;
}

#errorBox_btn_box {
    position: relative;
    height: 60%;
}

#errorBox_btn {
    width: 40vw;
    height: 14vw;
    border: 1px solid #ffd800;
    border-radius: 7vw;
    font: 7vw E-vahid8;
    line-height: 14vw;
    text-align: center;
    color: white;
    cursor: pointer;
    background: rgba(151, 136, 13, 0.3);
    transition: all 100ms ease;
}

#errorBox_btn.active {
    width: 45vw;
    height: 18vw;
    font-size: 9vw;
    line-height: 18vw;
    border-radius: 10vw;
    box-shadow: 0 0 8vw rgba(151, 136, 13, 0.8);
}

#errorBox_background {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.box {
    position: relative;
    height: 25%;
    transition: all 1200ms linear;
}

.odd {
    right: -100vw;
    background: linear-gradient(270deg, rgba(0, 0, 0, 0.882773092147015) 0%, rgba(255, 255, 255, 0.49901959074645486) 100%);
}

.even {
    left: -100vw;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.882773092147015) 0%, rgba(255, 255, 255, 0.49901959074645486) 100%);
}

.odd.active {
    right: 100vw;
}

.even.active {
    left: 100vw;
}