@font-face {
    font-family: 'ChakraPetchLight';
    src: url('fonts/ChakraPetch-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ChakraPetchSemiBold';
    src: url('fonts/ChakraPetch-SemiBold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ChakraPetchRegular';
    src: url('fonts/ChakraPetch-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ChakraPetchBold';
    src: url('fonts/ChakraPetch-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

:root {

    --fontFaimly_default: 'ChakraPetchRegular', sans-serif;
    --fontFaimly_text: 'ChakraPetchRegular', sans-serif;
    --fontFaimly_header: 'ChakraPetchLight', sans-serif;
    --fontFaimly_button: 'ChakraPetchBold', sans-serif;
    --fontFaimly_semi: 'ChakraPetchSemiBold', sans-serif;
    --clip_menu_standardbox:  polygon(0 10px, 10px 0, calc(100% - 10px) 0, 100% 10px, calc(100%) calc(100% - 180px), calc(100% - 5px) calc(100% - 180px + 5px), calc(100% - 5px) calc(100% - 10px),  calc(100% - 15px) calc(100%),  calc(5px + 10px) 100%,  calc(5px) calc(100% - 10px), 5px calc(46% + 5px), 0 46%);
}


@keyframes highlited{
    0%{
        opacity:0.5;
    }
    70%{
        opacity:1;
    }
    100%{
        opacity:0.5;
    }
}


@keyframes blink{
    0%{
        opacity:1;
    }
    33%{
        opacity:0.4;
    }
    66%{
        opacity:1;
    }
    100%{
        opacity:0.3;
    }
}

@keyframes crt{
    0%{
        opacity:1;
    }

    27.2%{
        opacity:1;
    }
    27.5%{
        opacity:0.95;
    }
    27.7%{
        opacity:1;
    }

    28.2%{
        opacity:1;
    }
    28.5%{
        opacity:0.95;
    }
    28.7%{
        opacity:1;
    }

    29.2%{
        opacity:1;
    }
    29.5%{
        opacity:0.95;
    }
    29.7%{
        opacity:1;
    }

    77.2%{
        opacity:1;
    }
    77.5%{
        opacity:0.8;
    }
    77.9%{
        opacity:1;
    }
    78.0%{
        opacity:0.9;
    }
    78.3%{
        opacity:1;
    }
    97%{
        opacity:1;
    }
    97.2%{
        opacity:0.79;
    }
    97.5%{
        opacity:1;
    }
    98%{
        opacity:.95;
    }
    98.2%{
        opacity:.85;
    }
    100%{
        opacity:1;
    }
}

@keyframes shadowing{
    0% {
        text-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);
    }
    15% {
        text-shadow:  0px 0px 0 rgba(255,131,64,.3), 0px 0px 0 rgba(126, 250, 255, .2);
    }
    85% {
        text-shadow:  0px 0px 0 rgba(255,131,64,.3), 0px 0px 0 rgba(126, 250, 255, .2);
    }
    100% {
        text-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);
    }
}

@keyframes showBox{
    0%{
        opacity:0;
        transform: perspective( 500px ) rotateY( 55deg );
        transform-origin: 0% 0%;
    }
    100%{
        opacity:1;
        transform: perspective( 500px ) rotateY( 0deg );
    }
}


@keyframes hash{
    0.000% {
        bottom: -100%
    }

    2.000% {
        bottom: -100%
    }
    2.001% {
        bottom: -98%
    }

    4.000% {
        bottom: -98%
    }
    4.001% {
        bottom: -96%
    }

    6.000% {
        bottom: -96%
    }
    6.001% {
        bottom: -94%
    }

    8.000% {
        bottom: -94%
    }
    8.001% {
        bottom: -92%
    }

    10.000% {
        bottom: -92%
    }
    10.001% {
        bottom: -90%
    }



    12.000% {
        bottom: -90%
    }
    12.001% {
        bottom: -88%
    }

    14.000% {
        bottom: -88%
    }
    14.001% {
        bottom: -84%
    }

    16.000% {
        bottom: -84%
    }
    16.001% {
        bottom: -84%
    }

    18.000% {
        bottom: -84%
    }
    18.001% {
        bottom: -82%
    }

    20.000% {
        bottom: -82%
    }
    20.001% {
        bottom: -80%
    }



    22.000% {
        bottom: -80%
    }
    22.001% {
        bottom: -78%
    }

    24.000% {
        bottom: -78%
    }
    24.001% {
        bottom: -76%
    }

    26.000% {
        bottom: -76%
    }
    26.001% {
        bottom: -74%
    }

    28.000% {
        bottom: -74%
    }
    28.001% {
        bottom: -72%
    }

    30.000% {
        bottom: -72%
    }
    30.001% {
        bottom: -70%
    }



    32.000% {
        bottom: -70%
    }
    32.001% {
        bottom: -68%
    }

    34.000% {
        bottom: -68%
    }
    34.001% {
        bottom: -66%
    }

    36.000% {
        bottom: -66%
    }
    36.001% {
        bottom: -64%
    }

    38.000% {
        bottom: -64%
    }
    38.001% {
        bottom: -62%
    }

    40.000% {
        bottom: -62%
    }
    40.001% {
        bottom: -60%
    }



    42.000% {
        bottom: -60%
    }
    42.001% {
        bottom: -58%
    }

    44.000% {
        bottom: -58%
    }
    44.001% {
        bottom: -56%
    }

    46.000% {
        bottom: -56%
    }
    46.001% {
        bottom: -54%
    }

    48.000% {
        bottom: -54%
    }
    48.001% {
        bottom: -52%
    }

    50.000% {
        bottom: -52%
    }
    50.001% {
        bottom: -50%
    }



    52.000% {
        bottom: -50%
    }
    52.001% {
        bottom: -48%
    }

    54.000% {
        bottom: -48%
    }
    54.001% {
        bottom: -44%
    }

    56.000% {
        bottom: -44%
    }
    56.001% {
        bottom: -44%
    }

    58.000% {
        bottom: -44%
    }
    58.001% {
        bottom: -42%
    }

    60.000% {
        bottom: -42%
    }
    60.001% {
        bottom: -40%
    }


    62.000% {
        bottom: -40%
    }
    62.001% {
        bottom: -38%
    }

    64.000% {
        bottom: -38%
    }
    64.001% {
        bottom: -36%
    }

    66.000% {
        bottom: -36%
    }
    66.001% {
        bottom: -34%
    }

    68.000% {
        bottom: -34%
    }
    68.001% {
        bottom: -32%
    }

    70.000% {
        bottom: -32%
    }
    70.001% {
        bottom: -30%
    }


    72.000% {
        bottom: -30%
    }
    72.001% {
        bottom: -28%
    }

    74.000% {
        bottom: -28%
    }
    74.001% {
        bottom: -26%
    }

    76.000% {
        bottom: -26%
    }
    76.001% {
        bottom: -22%
    }

    78.000% {
        bottom: -22%
    }
    78.001% {
        bottom: -22%
    }

    80.000% {
        bottom: -22%
    }
    80.001% {
        bottom: -20%
    }


    82.000% {
        bottom: -20%
    }
    82.001% {
        bottom: -18%
    }

    84.000% {
        bottom: -18%
    }
    84.001% {
        bottom: -16%
    }

    86.000% {
        bottom: -16%
    }
    86.001% {
        bottom: -14%
    }

    88.000% {
        bottom: -14%
    }
    88.001% {
        bottom: -12%
    }

    90.000% {
        bottom: -12%
    }
    90.001% {
        bottom: -10%
    }




    92.000% {
        bottom: -10%
    }
    92.001% {
        bottom:  -8%
    }

    94.000% {
        bottom:  -8%
    }
    94.001% {
        bottom:  -6%
    }

    96.000% {
        bottom:  -6%
    }
    96.001% {
        bottom:  -4%
    }

    98.000% {
        bottom:  -4%
    }
    98.001% {
        bottom:  -2%
    }

    99.001% {
        bottom:  -2%
    }
    100.000% {
        bottom:  -0%
    }

}



@keyframes hash10 {
    0.000% {
        bottom:  0px
    }

    10.000% {
        bottom: 0px
    }
    10.001% {
        bottom: -40px
    }

    20.000% {
        bottom: -40px
    }
    20.001% {
        bottom: -80px
    }

    30.000% {
        bottom: -80px
    }
    30.001% {
        bottom: -100px
    }

    50.000% {
        bottom: -100px
    }
    50.001% {
        bottom: -130px
    }

    70.000% {
        bottom: -130px
    }
    70.001% {
        bottom: -150px
    }

    90.000% {
        bottom: -150px
    }
    90.001% {
        bottom: -180px
    }

    99.001% {
        bottom:  -180px
    }
    100.000% {
        bottom:  -200px
    }
}


@keyframes slowMovingRightZoomin {
    0.000% {
        background-position:  left;
        background-size: 130%;
    }

    100.000% {
        background-position:  right;
        background-size: 150%;
    }
}

@keyframes slowMovingLeftZoomin {
    0% {
        background-position:  right;
        background-size: 130%;
    }

    100% {
        background-position:  left;
        background-size: 150%;
    }
}

@keyframes slowMovingRightZoomout {
    0% {
        background-position:  left;
        background-size: 150%;
    }

    100% {
        background-position:  right;
        background-size: 130%;
    }
}

@keyframes slowMovingLeftZoomout {
    0% {
        background-position:  right;
        background-size: 150%;
    }

    100% {
        background-position:  left;
        background-size: 130%;
    }
}
@keyframes blink {
    0% {
        opacity: 1;
    }
    33% {
        opacity: 0.4;
    }
    66% {
        opacity: 1;
    }
    100% {
        opacity: 0.3;
    }
}
@keyframes glitch{
    0%{
        opacity:1;
    }
    80%{
        opacity:0.5;
    }
    100%{
        opacity:0;
        height: 0%;
    }
}

.crt {
    animation: crt 10000ms linear infinite;
}

._glitch_effect {
    display: block !important;
    position: absolute !important;
    min-height: 60px !important;
    background:rgba(0,0,0,0) url(./effects/glitch1.gif) center left no-repeat !important;
    background-size: cover !important;
    animation:glitch 50ms linear 1 !important;
    animation-fill-mode: forwards !important;

}
._glitch_effect:before,
._glitch_effect:after {
    display:none !important;
}

#warning-message {
    display: none;
}
@media only screen and (orientation:portrait){
    #wrapper {
        display:none;
    }
    #warning-message {
        display:block;
    }
}
@media only screen and (orientation:landscape){
    #warning-message {
        display:none;
    }
}


html {



    margin: 0px;
    padding: 0px;
    background-size: cover;
    background-position: top right;
    min-height: 100%;
    background-repeat: no-repeat;
}

body {
    font-family:var(--fontFaimly_default);
    font-size:11px;
    padding: 0px;
    margin: 0px;
    background-size: cover;
    background-position: top right;
    background-color: black;
    background-repeat: no-repeat;
    color: white;
    text-align: center;
}

#dropin-container {
    width: 400px;
    margin: 20px auto;

}

#submit-button {
    width: 120px;
    margin: 20px auto;
    display: block;
}


.hashbox {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 200px;
    overflow: hidden;
}

.hashbox .hash {
    position: absolute;
    text-align: left;

    text-transform: uppercase;
    color: rgba(255,255,255,0.05);
    letter-spacing: 2px;

    
    font-size: 10px;
    animation: hash10 3000ms cubic-bezier(0.05, 1.03, 0.65, 0.61) infinite;

    line-height: 16px;
    z-index: -10000;
}

#wrapper {

    padding: 0px;
    margin: 0px;
    height: 100%;
}

#warning-message {
    position: absolute;
    top: calc(50% - 85px);
    left: 10%;
    color: black;
    text-align: center;
    height: 100px;
    right: 10%;
    background-color: white;
    box-sizing: border-box;
    padding: 15px 15px 120px;
    
    font-size: 20px;
    background-size: 50px;
    background-image: url('turn.png');
    background-position: center 65px;
    background-repeat: no-repeat;
    line-height: 15px;
}
a {
    text-decoration: none;
}

a img {
    border: 0px;
}
/*
#telo{
position: absolute;
top: 0px;
left: 0px;
bottom: 0px;
right: 0px;
}
*/
#telo_gl{
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    overflow: hidden;
}

#telo_gl canvas{
    background-color: black;
    position: absolute;
    top: 0px;
    left: 0px;
}



.header {
    position: relative;
    height: 80px;
    background: linear-gradient(180deg, #0000004a, #00000000);
    z-index: 9999999;
    min-width: 375px;
}

.header .hcontainer {
    position: relative;
    margin: 0px auto 0px auto;
    width: calc(100% - 40px);
}

.container {
    width: 490px;
    margin: auto;
    padding: 30px 25px 50px;
    min-height: 300px;
    position: relative;
    z-index: 10000000;
}
.container:before {
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-color: rgb(6 5 12 / 95%);
    -webkit-clip-path: var(--clip_menu_standardbox);
    clip-path: var(--clip_menu_standardbox);
    z-index: -1;
}


.container.confirmation h1 {
    color: rgba(255,255,255,1);
    text-transform: uppercase;
    font-size: 22px;
    padding: 0px;
    margin: 10px 0px 0px;
    font-family: var(--fontFaimly_header);
}

.container.confirmation h2 {
    color: #ffbc00;
    text-transform: uppercase;
    font-size: 30px;
    padding: 0px;
    margin: 20px 0px 0px;
}

.container.confirmation p {
    text-align: center;
    font-size: 16px;
    padding: 20px 30px;
}

.container.confirmation p a {
    text-decoration: underline;
    color: white;
}


.container.confirmation .confirm-payment-table {
    border-spacing: 0px;
    border-collapse: separate;
    font-size: 12px;
}

.container.confirmation .confirm-payment-table th {
    font-weight: normal;
    text-align: right;
    padding: 5px;
    width: 40%;
    vertical-align: top;
    color: #b6b6b6;
}

.container.confirmation .confirm-payment-table td {
    padding: 5px 5px 5px 10px;
    text-align: left;
    font-size: 14px;
    vertical-align: top;
}

.container.confirmation .confirm-payment-table td small {
    color: rgba(255,255,255,0.5);
    font-size: 12px;
    line-height: 16px;
    display: block;
    padding-left: 8px;
    position: relative;
    margin: 3px 0px 0px 2px;
}

.container.confirmation .confirm-payment-table td small:before {
    content: '*';
    position: absolute;
    top: 4px;
    left: 0px;
    font-size: 14px;
}

.container.confirmation .table-header {
    color: rgb(164 164 164);
    text-transform: uppercase;
    font-size: 16px;
    padding: 0px;
    margin: 60px 0px 15px;
    font-family: var(--fontFaimly_header);
}


.container .buy-info {
    margin-top: 15px;
    font-size: 40px;
    
    color: #ffbc00;
    font-weight: bold;
    line-height: 40px;
    text-align: center;
    text-shadow: 2px 2px 0 #000;
}

.container .buy-info small {
    display: block;
    text-align: center;
    font-size: 22px;
    
    color: white;
    font-weight: normal;
    line-height: 35px;
}

.container .actions {
    text-align: center;
    margin-top: 15px;
}


.container .ybutton {
    display: inline-block;
    font-size: 16px;
    position:relative;
    color: #f1cf6d;
    background-color: transparent;
    font-weight: bold;
    line-height: 35px;
    height: 35px;
    text-align: center;
    font-family: var(--fontFaimly_button);
    cursor: pointer;
    text-transform: uppercase;
    padding: 0px 20px;
    margin: 0px auto;
}

.container .ybutton:before {
    content: '';
    position: absolute;
    left: 3px;
    right: 3px;
    top: 3px;
    bottom: 3px;
    background-color: #bf850966;
    z-index: -1;
    
}

.container .ybutton:hover:before {
    box-shadow: 0px 0px 15px #ffbc00 inset !important;
    animation: blink 100ms linear 2 alternate;
}

.container .ybutton:after {
    content: '';
    display: block;
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background-image: linear-gradient(0deg, #ffbc00 0%, #ffbc00 100%), linear-gradient(0deg, #ffbc00 0%, #ffbc00 100%), linear-gradient(0deg, #ffbc00 0%, #ffbc00 100%), linear-gradient(0deg, #ffbc00 0%, #ffbc00 100%), linear-gradient(0deg, #ffbc00 0%, #ffbc00 100%), linear-gradient(0deg, #ffbc00 0%, #ffbc00 100%), linear-gradient(0deg, #ffbc00 0%, #ffbc00 100%), linear-gradient(0deg, #ffbc00 0%, #ffbc00 100%), linear-gradient(0deg, #ffbc00 0%, #ffbc00 100%);
    background-repeat: no-repeat;
    background-size: calc(100% - 4px) 1px, 1px calc(20% - 2px), 1px calc(60% - 4px), 1px calc(20% - 2px), 1px calc(20% - 2px), 1px calc(60% - 4px), 1px calc(20% - 2px), 36% 3px, calc(100% - 4px) 1px;
    background-position: top 1px center, top 2px left 1px, center left 1px, bottom 2px left 1px, top 2px right 1px, center right 1px, bottom 2px right 1px, bottom center, bottom 1px center;
}




.container .info {
    margin: 20px auto;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.8);
    font-weight: normal;
    text-align: center;
    text-transform: uppercase;
    /* line-height: 13px; */
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
    left: 20px;
    right: 20px;
}

.container .warning {
    margin: 20px auto;
    font-size: 12px;
    
    color: rgba(255,255,255,0.5);
    font-weight: normal;
    text-align: center;
    text-transform: uppercase;
    line-height: 13px;
}

.container .warning a,
.container .info a {
    color: rgba(255,255,255,0.5);
    text-decoration: underline;
}

.container .warning a:hover,
.container .info a:hover {
    animation: blink 100ms linear 2;
    text-decoration: none;
}

.container .footer-logos img {

    margin: 5px;
}

.footerinfo {

    position: relative;
    padding: 10px calc(50% - 350px);
    
}

.footerinfo p {
text-align: center;
    padding: 1px 0px;
    margin: 0px;
    line-height: 18px;
    color: #dddddd;
    font-size: 12px;
    
}


.footerinfo a {
    color: #dddddd; 
    text-decoration: underline;
}
.header .hcontainer .logo {

    position: absolute;
    left: 10px;
    top: 20px;
    animation: crt 10000ms linear infinite;
}



@media (max-width: 520px) {
    .header .hcontainer .logo {
        display: none;
    }
}


.header .hcontainer .logo a img {
    width: 170px;
}





.header .hcontainer .menu {
    position: absolute;
    right: 0px;
    top: 0px;
    height: 60px;
    z-index: 99999;
}


.header .hcontainer .menu ul {
    list-style: none;
    list-style-image: none;
    margin: 0;
    padding: 0;
}

.header .hcontainer  .menu ul li {
    display: block;
    float: left;
    text-transform: uppercase;
    padding: 0px;
    margin: 0px;
    position: relative;
    color: rgba(255,255,255,0.5);
}

.header .hcontainer  .menu ul li a {
    display: block;
    text-decoration: none;
    color: rgba(255,255,255,.9);
    font-size: 12px;
    /* letter-spacing: 4px; */
    /* text-transform: none; */
    transition: text-shadow 1s ease;
    height: 60px;
    padding: 0px 10px 0px 5px;
    line-height: 60px;
    margin: 0px;
    text-align: center;
    
    opacity: 0.9;
    cursor: pointer;
}

.header .hcontainer  .menu ul li a:hover,.header .hcontainer  .menu ul li a:hover:focus {
    color: rgba(255,255,255,1);
    animation: blink 100ms linear 2;
    text-shadow: -5px 0px 0 rgba(255,131,64,.3), 5px 0px 0 rgba(126, 250, 255, .2);
}

.header .hcontainer  .menu ul li.socials a  {
    padding-left: 15px;
}


.header .hcontainer  .menu ul li.socials a img {
    margin-top: 0px;
    padding-top: 20px;
    width: 17px;
    height: 17px;
}


.header .hcontainer  .menu ul li ul {
    display: none;
    position: absolute;
    top: 50px;
    right: 0px;
    background-color: rgba(0,0,0,0.65);
    padding: 10px 10px;
}


@media (max-width: 520px) {
    .header .hcontainer  .menu ul li ul {
        top: 40px;
        padding: 0px 0px;
    }
}

.dottedbckg {
    background-color: white;
    background-image: linear-gradient(45deg, black 25%, transparent 25%, transparent 75%, black 75%, black), linear-gradient(45deg, black 25%, transparent 25%, transparent 75%, black 75%, black);
    background-size: 2px 2px;
    background-position: 0 0, 30px 30px;
}



.header .hcontainer  .menu ul li:hover ul,
.header .hcontainer  .menu ul li:focus ul {
    display: block;

}




.header .hcontainer  .menu ul li ul li {
    display: block;
}



.header .hcontainer  .menu ul li ul li a:before {
    content: "";
    border-bottom: 5px solid transparent;
    border-top: 5px solid transparent;
    border-left: 5px solid rgba(255,255,255,0.2);
    position: absolute;
    right: 11px;
    top: 14px;
}

.header .hcontainer  .menu ul li ul li a {
    position: relative;
    display: block;
    height: 35px;
    text-align: right;
    line-height: 35px;
    font-weight: normal;
    color: white;
    padding: 0px 5px;
    padding: 0px 27px 0px 15px;
    overflow: hidden;
    width: 150px;
    font-size: 17px;
    letter-spacing: 2px;
}





.header .hcontainer  .menu ul li ul li a:hover:before {
    border-left: 5px solid rgba(255,255,255,0.6);
}





.menu_header {
    padding: 25px 125px;
}

.menu_header ul {
    display: block;
    float: left;
    padding: 0px;
    margin: 0px;
    list-style-type: none;
    width: 33%;
}

.menu_header ul li {
    display: block;
    padding: 0px;
    margin: 0px;
    list-style-type: none;
}

.menu_header a {
    color: white;
    text-decoration: underline;
}

.menu_header a:hover {
    color: white;
    text-decoration: none;
}









.cleaner {
    clear: both;
    font-size: 1px;
    line-height: 0px;
    margin: 0px;
    padding: 0px;
    border: 0px;
}


.footer {
    position: fixed;
    bottom: 0px;
    right: 0px;
    left: 0px;
}

.footer .footerlinks {
    position: absolute;
    right: 40px;
    text-align: right;
    font-size: 10px;
    line-height: 13px;
    color: rgba(255,255,255,0.3);
    bottom: 5px;
    text-transform: uppercase;
}

.footer .footerlogo {
    position: absolute;
    right: 9px;
    bottom: 9px;
    width: 21px;
    height: 33px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: .5;
    transition: opacity 1s;
}

.footer .footerage {
    position: absolute;
    right: 26px;
    bottom: 11px;
    width: 41px;
    height: 23px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: .5;
    transition: opacity 1s;
    background-image: url('18.png');
}

.footer .footerlogo:hover {
    opacity: 1;
}

.subscriptor {
    font-size: 21px;
    margin: 0px auto;
    font-weight: normal;
    text-align: center;

}


.field {
    font-size: 16px;
    display: block;
    position: relative;
    max-width: 400px;
    padding: 20px 20px 20px 20px;
    background-color: rgba(0,0,0,0.65);
    box-sizing: border-box;
    width: 90%;
    text-align: center;
    margin: 0px auto 100px;

}

.field.centered {
    margin-top: calc(30% - 30px);

}

.field.infospan {
    margin-top: 200px;
}

.field:before {
    content:'';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}
.field:after {
    content:'';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}



.field .text {
    font-size: 27px;
    
    margin: 0px;
    padding:  0px;
    font-weight: normal;
    color: rgba(255,255,255,0.9);


}
.field .text .lighted {
    color: rgba(255,255,255,0.9);

    text-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);
    animation: shadowing 10000ms linear infinite;

}
.field .text .myfleet {
    font-size: 24px;
    position: relative;
    margin: 0px;
    padding: 5px 0px;
    font-weight: normal;
    color: rgb(0,255,255);
    text-shadow: 0px 0px 40px rgb(0,255,255);
    text-decoration: none;
}



.field .text small {
    font-size: 20px;
    text-transform: uppercase;
    color: rgb(232,250,17);
    display: block;
    padding-top: 8px;
}

.field .text small a {
    color: white;
}

.field  .text small a:hover {
    text-decoration: none;
}

.field .text small a {
    display: inline-block;
    color: black;
    text-decoration: none;
    cursor: pointer;
    background-color: white;
    padding: 5px 14px;
    font-size: 20px;
    
    font-weight: normal;
    margin: 15px auto 5px;
}


.field .text small a::first-letter {
    color: rgb(4,193,193);
}

.field  .text small a:hover {
    color: black;
    background-color: rgb(232,250,17);
    animation: blink 100ms linear 2;
}




.field .text small.pos {
    color: white;

}


.field .small_info {
    color: rgba(255,255,255,.3);
    line-height: 15px;
    display: block;
    font-size: 12px;
}

.field .rightinputstable {
    margin: 5px auto;
}



.field .newslerr {
    font-size: 16px;
    font-weight: bold;
    color: rgb(200,0,0);
}

.field .newslgreen {
    font-size: 16px;
    font-weight: bold;
    color: rgb(0,200,0);
}




.subscriptor .avatar {
    display: block;
    text-decoration: none;
    background-size: cover;
    background-repeat: no-repeat;
    height: 200px;
    width: 200px;
    margin: 20px auto 0px auto;
    position: relative;
}

.subscriptor .avatar:before {
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    border: 1px solid rgba(255,255,255,0.1);
}



.subscriptor .avatar span {
    display: block;
    position: absolute;
    top: 85px;
    left: 0px;
    right: 0px;
    box-sizing: border-box;
    opacity: 0;
    cursor: pointer;
    background-color: rgb(232,250,17);
    padding: 0px 10px;
    transition: opacity 0.2s linear;
    color: black;
    
    text-transform: uppercase;
    font-size: 20px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    font-weight: normal;
    text-decoration: none;
    text-align: center;

}




.members .add {
    display: block;
    float: left;
    margin: 7px;
    cursor: pointer;
    padding: 0px;
    width: 120px;
    height: 190px;
    text-align: center;
    box-sizing: border-box;
    text-transform: uppercase;
    transition: opacity 0.2s linear;
    color: black;
    font-weight: normal;
    
    text-decoration: none;
    font-size: 32px;
    line-height: 190px;
    position: relative;
    background-color: white;
    background-image: linear-gradient(45deg, black 25%, transparent 25%, transparent 75%, black 75%, black), linear-gradient(45deg, black 25%, transparent 25%, transparent 75%, black 75%, black);
    background-size: 2px 2px;
    background-position: 0 0, 0px 0px;

}





.members .add:hover {

    background: white;

}

.members .user {
    background: rgba(0,0,0,0.4) url('stations_plus.png') center no-repeat;
    padding: 10px;
    width: 84px;
    height: 84px;
    text-align: center;
    color: rgba(255,255,255,0.4);
    padding: 0px;
    font-size: 13px;
    background-size: cover;
    position: relative;

}

.members .user:after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    border: 3px solid rgba(0,255,255,1);
    filter: blur(3px);

}



.members .addtable .user .namebox {
    position: absolute;
    bottom: -33px;
    color: gold;
    font-size: 12px;
    height: 27px;
    line-height: 12px;
    padding: 0px;
    width: 100%;
    text-transform: uppercase;
    opacity: 0.8;
    font-weight: normal;
    text-align: center;
}

.members .addtable .user .namebox span.mail {

    color: white;
    font-size: 8px;

}

.members .addtable .user:hover .namebox {
    opacity: 1;
}

.members h5 {
    position: relative;
    color: yellow;
    padding: 15px 5px;
    box-sizing: border-box;
    text-transform: uppercase;
    
    text-decoration: none;
    text-transform: none;
    font-size: 34px;
    font-weight: normal;
    text-align: center;
    clear: both;
    margin: 0px;
    text-transform: uppercase;
}

.subscriptor .title .small {
    font-size: 14px;
    color: silver;
}

.reward {
    height: 400px;
    margin: 0px auto;
    width: 322px;
}

.loginbox {
    position: absolute;
    top: 60px;
    right: 110px;
    width: 322px;
    padding: 20px 10px 20px 10px !important;
    background-color: rgba(0,0,0,0.65);
}

.loginbox .title {
    
    opacity: 0.9;
    color: white;
    padding: 5px 0px;
}

.loginbox input {
    color: black;
    height: 27px;
}

.loginbox input[type="text"], .loginbox input[type="password"] {
    width: 113px;
}

.loginbox input[type="submit"] {
    cursor: pointer;
}

input {
    font-size: 16px;
    padding: 0px 5px;

    font-weight: bold;
    color: rgba(255,255,255,.8);
    text-align: center;




    border: none;
    box-sizing: border-box;


}

select {
    font-size: 16px;
    padding: 0px 5px;
    font-weight: normal;
    color: rgb(0,255,200);
    text-align: center;
    background-color: rgba(0,50,50,1);
    
    text-decoration: none;
    text-transform: uppercase;
    font-size: 17px;
    padding: 7px;
}

input.file {
    padding: 0px;
    height: initial;
    text-align: left;
    border: 0px;
    border-radius: 0px;
    background-color: transparent;
    width: 252px;
    
    font-size: 15px;
    font-weight: normal;
    color: rgba(255,255,255,0.9);
    text-shadow: 0px 0px 40px rgba(255,255,255,1);
}


input[type="text"],input[type="password"],input[type="email"] {

}

textarea {
    text-decoration: none;
    width: 100%;
    min-height: 120px;
    padding: 5px;
    max-width: 100%;
    font-size: 16px;
    
    font-weight: bold;
    color: black;
    text-align: center;
    background-color: white;
    background-image: linear-gradient(45deg, black 25%, transparent 25%, transparent 75%, black 75%, black), linear-gradient(45deg, black 25%, transparent 25%, transparent 75%, black 75%, black);
    background-size: 2px 2px;
    background-position: 0 0, 30px 30px;
    border: none;
    box-sizing: border-box;

}

input[type="submit"],button {

    position: relative;
    text-align: center;
    border: 0px;
    background-color: white;
    cursor: pointer;
    text-decoration: none;
    color: black;
    padding: 0px 10px;
    font-size: 20px;
    
    font-weight: normal;
    line-height: 30px;
    text-transform: none;
    height: 30px;
    box-sizing: border-box;
    box-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);

}

button:hover{
    animation:blink 100ms linear 2 alternate;
    color: black;
    background-color: rgb(232,250,17);
    box-shadow: none;
}





.highlited {
    animation:highlited 500ms linear infinite;
}


input[type="submit"]:hover, button:hover {
    animation: blink 100ms linear 2 alternate;
}

input[type="submit"].gray,button.gray {
    color:  rgb(200,200,200);
    background-color: rgba(55,55,55,1);
}



.links {
    display: block;
    position: relative;
    margin: 0px;
    padding: 0px;
    text-align: left;
    height: 35px;
    border-top: 3px solid rgb(0,255,255);
}

.links li {
    display: inline-block;
    position: relative;
    height: 35px;
    line-height: 35px;
    margin: 0px;
    padding: 0px 15px;
    color: rgb(0,255,255);
    transition: text-shadow 0.3s linear, color 0.3s linear, background 0.3s linear;
    font-size: 14px;
    cursor: pointer;
    background-color: rgba(0,255,255,0.2);
    text-transform: uppercase;
}

.links li:hover {
    color: rgb(0,255,255);
    text-shadow: 0px 0px 20px rgb(0,255,255);
    background-color: rgba(0,255,255,0.5);
}

.text {
    color: white;
    font-size: 14px;
}

.text h4 {
    font-size: 16px;
    text-transform: uppercase;
    color: rgb(0,255,255);
    text-shadow: 0px 0px 40px rgb(0,255,255);
    font-weight: normal;
    
    padding-bottom: 0px;
    margin-bottom: 0px;
    padding-left: 20px;
}

.text p {
    font-size: 14px;
    color: rgb(255,255,255);
    font-weight: normal;
    padding-top: 0px;
    margin-top: 0px;
    padding-left: 20px;
}



.loginhint {
    display: block;
    position: absolute;
    top: 39px;
    left: calc(50% + 150px);
    outline: none;
    text-decoration: none;
    text-align: left;
    font-size: 18px;
    vertical-align: baseline;
    line-height: 14px;
    z-index: 1000;
    padding: 10px;
    width: 95px;
    color: black;
    
    background-color: rgb(232,250,17);
    text-transform: uppercase;
    text-shadow: none;
    font-weight: normal;

}

@media (max-width: 520px) {
    .loginhint {
        left: calc(100% - 110px);
    }
}

.addhint {
    display: block;
    position: absolute;
    top: 12px;
    left: calc(100% - 70px);
    outline: none;
    text-decoration: none;
    text-align: left;
    font-size: 18px;
    vertical-align: baseline;
    line-height: 14px;
    z-index: 1000;
    padding: 10px;
    width: 95px;
    color: black;
    
    background-color: rgb(232,250,17);
    text-transform: uppercase;
    text-shadow: none;
    font-weight: normal;

}


.loginhint:before,
.addhint:before {
    content: "";
    border-bottom: 10px solid transparent;
    border-top: 10px solid transparent;
    border-right: 10px solid rgb(232,250,17);
    position: absolute;
    top: 0px;
    left: -10px;
}


.title{
    position: absolute;
    height: 45px;
    width: 100%;
    top: 0px;
    left: 0px;
    color: white;
    padding-left: 10px;
    box-sizing: border-box;
    overflow: hidden;
    line-height: 45px;
    text-transform: uppercase;
    text-shadow: 0px 0px 3px rgba(255,255,255,0.7);
    text-decoration: none;
    text-align: center;
    font-size: 35px;
    text-align: center;
    
    font-weight: normal;
    text-shadow: -3px 0px 0 rgba(255,131,64,.3), 3px 0px 0 rgba(126, 250, 255, .2);
}
.title small {
    font-size: 17px;
}

.close{
    display: block;
    position: absolute;
    width: 16px;
    height: 16px;
    cursor: pointer;
    top: 14px;
    right: 14px;
    opacity: 0.5;
    z-index: 99;
    background:url('ico/close-window-16.png') center no-repeat;
}

.close:hover{
    opacity:1;
}
.scroll {
    overflow-y: scroll;
    overflow-x: hidden;
    position: absolute;
    top: 0px;
    bottom: 0px;
    right: 0px;
    left: 0px;
}





.switch{
    position:absolute;
    top: 41px;
    left: 7px;
    height:35px;
    color:white;
    text-align:left;
}
.switch .switcher{
    display: inline-block;
    position: relative;
    text-align: center;
    padding: 0px 0px;
    margin: 5px;
    background-color: rgba(0,0,0,0);
    cursor: pointer;
    height: 28px;
    min-width: 28px;
    opacity: 0.6;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: 0px center;
    line-height: 28px;
    padding-left: 29px;
    padding-right: 5px;
    font-size: 10px;
    text-transform: uppercase;
}
.switch .switcher:hover{
    opacity: 1;
}

.switch .switcher.table {
    background-image: url('/img/ico/ico_list_128.png');

}

.switch .switcher.graph {
    background-image: url('/img/ico/ico_graph_128.png');

}

.switch .switcher.catalog {
    background-image: url('/img/ico/ico_boxes_128.png');

}

@media (max-width: 520px) {
    .switch .switcher.catalog {
        display: none;

    }
    .switch .switcher.table {

    }
}

.switch .switcher.neworg {
    background-image: url('/img/ico/add-128.png');

}

.switch .switcher.myorg {
    background-image: url('/img/ico/corp-128.png');

}






.owl-controls {
    text-align: center;

}
.owl-controls .owl-nav [class*=owl-] {
    color: #fff;
    font-size: 14px;
    margin: 5px;
    padding: 4px 7px;
    background: rgba(255,255,255,0.3);
    display: inline-block;
    cursor: pointer;

}
.owl-controls .owl-nav [class*=owl-]:hover {
    background: #869791;
    color: #fff;
    text-decoration: none
}
.owl-controls .owl-nav .disabled {
    opacity: .5;
    cursor: default
}
.owl-dots .owl-dot {
    display: inline-block;
}
.owl-dots .owl-dot span {
    width: 5px;
    height: 20px;
    margin: 5px 4px;
    background: rgba(255,255,255,0.3);
    display: block;
}
.owl-dots .owl-dot.active span {
    background: rgba(255,255,255,1);
    box-shadow: inset 0px 0px 25px rgba(255,255,255,1), 0px 0px 25px rgba(255,255,255,1);
    animation:highlited 500ms linear infinite;
}

.owl-dots .owl-dot:hover span {
    background: rgba(255,255,255,1);
    animation:blink 100ms linear 2 alternate;

}

.header .hcontainer .menu{
    position: absolute;
    right: 18px;
    top: 18px;
    height: 60px;
}
.header .hcontainer .menu ul{
    list-style:none;
    list-style-image:none;
    margin:0;
    padding:0;
}
.header .hcontainer  .menu ul li{
    display:block;
    float:left;
    text-transform:uppercase;
    padding:0px;
    margin:0px;
    position:relative;
    color:rgba(255,255,255,0.5);
}
.header .hcontainer  .menu ul li a{
    display: block;
    text-decoration: none;
    color: white;
    font-size: 20px;
    transition: color 0.2s linear;
    height: 60px;
    padding: 0px 10px;
    line-height: 60px;
    margin: 0px;
    text-align: center;
    
    opacity: 0.8;
    cursor: pointer;
}
.header .hcontainer  .menu ul.subcategory li{
    display:block;
    float:none;
    text-transform:uppercase;
    padding:0px;
    margin:0px;
    position:relative;
    color:rgba(255,255,255,0.5);
}
.header .hcontainer  .menu ul li ul{
    display:none;
    position:absolute;
    top:60px;
    right:0px;
    border-top:1px solid rgb(255,255,255);
    background:linear-gradient(to bottom,rgba(0,0,0,0.1) 0%,rgba(0,50,75,0.3) 10%,rgba(0,50,75,0.5) 60%,rgba(0,50,75,0.3) 90%,rgba(0,0,0,0.1) 100%);
}
.header .hcontainer  .menu ul li ul:before{
    content:"";
    border-left:10px solid transparent;
    border-right:10px solid transparent;
    border-bottom:10px solid rgb(255,255,255);
    position:absolute;
    top:-10px;
    right: calc(50% - 10px);
}
.header .hcontainer  .menu ul li a:hover{
    animation: blink 100ms linear 2 alternate;

}
.header .hcontainer  .menu ul li:hover ul{
    display:block;
}
.header .hcontainer  .menu ul li ul li{
    display:block;
}
.header .hcontainer  .menu ul li ul li a:before{
    content:"";
    position:absolute;
    right:11px;
    top:10px;
}
.header .hcontainer  .menu ul li ul li a{
    position:relative;
    display:block;
    height:30px;
    text-align:left;
    line-height:30px;
    font-weight:normal;
    color:rgb(255,255,255);
    text-transform:none;
    padding:0px 10px 0px 10px;
    overflow:hidden;
    font-size:12px;
    min-width:30px;
}
.header .hcontainer  .menu ul li ul li a:hover:before{
    border-left:5px solid rgba(255,255,255,1);
}
.header .hcontainer  .menu ul li.ico a{
    display: block !important;
    height: 35px !important;
    width: 35px !important;
    background-position: center;
    background-repeat: no-repeat !important;
    cursor: pointer;
    box-sizing: border-box;
    margin: 2px 2px;
    background-color: rgba(255,255,255,0.05);
    background-size: 22px;
    border: 1px solid rgba(255,255,255,0.2);
}

.header .hcontainer  .menu ul li.ico a:hover{
    opacity: 1;
    filter: invert(100%);
    background-color: black;
    animation: blink 100ms linear 2 alternate;

}
.header .hcontainer  .menu .ico a.stocks{
    background-image:url('ico/os_stocks_40.png');
}
.header .hcontainer  .menu .ico a.stocks:hover{
    opacity:1;
}
.header .hcontainer  .menu .ico a.assets{
    background-image:url('ico/os_assets_40.png');
}
.header .hcontainer  .menu .ico a.assets:hover{
    opacity:1;
}
.header .hcontainer  .menu .ico a.setup{
    background-image:url('ico/os_setup_40.png');
}
.header .hcontainer  .menu .ico a.setup:hover{
    opacity:1;
}

.header .hcontainer  .menu .ico a.deck{
    background-image:url('ico/os_addcard_40.png');
}
.header .hcontainer  .menu .ico a.deck:hover{
    opacity:1;
}



.header .hcontainer  .menu .ico a.bases{
    background-image:url('ico/os_spacecrafts_40.png');
}
.header .hcontainer  .menu .ico a.bases:hover{
    opacity:1;
}

.header .hcontainer  .menu .ico a.store{
    background-image:url('ico/os_store_40.png');
}
.header .hcontainer  .menu .ico a.store:hover{
    opacity:1;
}

.header .hcontainer  .menu .ico a.score{
    background-image:url('ico/os_rank_40.png');
}
.header .hcontainer  .menu .ico a.score:hover{
    opacity:1;
}

.header .hcontainer  .menu .ico a.alliance{
    background-image:url('ico/os_alliance_40.png');
}
.header .hcontainer  .menu .ico a.alliance:hover{
    opacity:1;
}

.header .hcontainer  .menu .ico.rightodsazeni{
    margin-right: 20px;
}
.header .hcontainer  .menu .ico a.logout{
    background-image:url('ico/os_logout_40.png');
}
.header .hcontainer  .menu .ico a.logout:hover{
    opacity:1;
}

.header .hcontainer .logo{
    height: 55px;
    width: 180px;
    padding-top: 0px;
    background-image: url(osg_logo_150.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    left: calc(50% - 90px);
    top: 15px;
}


.header .user-name{
    position: absolute;
    left: 15px;
    top: 10px;
    height: 60px;
    width: 150px;
}

.header .user-name a{
    display: table-cell;
    width: 150px;
    height: 60px;
    color: rgba(255,255,255,0.8);
    text-decoration: none;
    
    vertical-align: middle;
    font-size: 12px;
    cursor: pointer;
    font-weight: bold;
    line-height: 18px;
}

.header .user-name a span{
    display: inline-block;
    padding: 5px 10px;
}

.header .user-name a span:hover{

    color: rgba(0,0,0,1);
    background-color: rgba(255,255,255,1);

}

.bigscreen {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}

.bigscreen .centerbox {
    position: absolute;
    top: calc(50% - 180px);
    left: calc(50% - 200px);
    width: 400px;
}

.bigscreen .logininfo {
    position: relative;


    background: rgba(0,0,0,.4);
    color: white;
    text-align: center;
    font-size: 12px;
    margin: 0px 0px 15px;
}

.bigscreen .logininfo h1 {
    
    font-size: 25px;
    padding: 5px 0px;
    margin: 0px;
    text-transform: uppercase;
}

.bigscreen .logininfo p {
    font-size: 13px;
    padding: 0px 15px 5px;
    margin: 0px;
}


.bigscreen .loginform {
    position: relative;
    height: 180px;
    background: rgba(0,0,0,0.8);
}
.bigscreen .loginform:before {
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-top: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}

.bigscreen .loginform:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    height: 10px;
    border-bottom: 1px solid white;
    border-left: 1px solid white;
    border-right: 1px solid white;
}

.bigscreen .loginform table  {
    position: absolute;
    width: 300px;
    top: 50px;
    left: calc( 50% - 150px );
}
.bigscreen .loginform .label  {
    color: white;
    text-align: right;
    white-space: nowrap;
    padding-right: 10px;
    font-size: 12px;
    width: 130px
}
.bigscreen .loginform .input  {
    width: 130px
}
.bigscreen .loginform .input input  {
    margin: 0px;
}
.bigscreen .loginform .loginsubmit  {
    text-align: right;
}

.bigscreen .cookies  {
    display: block;
    position: absolute;
    left: calc(50% - 400px);
    width: 800px;
    bottom: 50px;
}
.bigscreen .cookies h2  {
    display: block;
    color: rgba(255,255,255,0.3);
    font-size: 13px;
    text-align: center;
    padding: 0px 0px 5px;
    margin: 0px;
    font-weight: normal;
}
.bigscreen .cookies p  {
    display: block;
    color:  rgba(255,255,255,0.3);
    font-size: 11px;
    text-align: center;
    padding: 0px 10px 0px;
    margin: 0px;
}
.bigscreen .loginlogo {
    position: absolute;
    left: calc(50% - 400px);
    top: calc(50% - 400px);
    width: 800px;
}
.bigscreen .loginform .input input[type="text"],
.loginform .input input[type="password"]  {
    box-shadow: none;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 25px;
    font-weight: normal;
    border: 1px solid rgba(255,255,255,0.8);
    color: white;
    background-color: rgba(0,0,0,0.5);
    padding: 5px 10px;
    box-sizing: border-box;
    width: 100%;
    
    background-position: center;
    background-repeat: no-repeat;
    background-blend-mode: overlay;
    background-color: rgb(41,92,100);
}
.bigscreen .loginform .loginsubmit button{
    position: relative;
    display: inline-block;
    height: 27px;
    color: rgba(255,255,255,1);
    text-align: center;
    border-spacing: 0px;
    box-sizing: border-box;
    padding: 0px 10px;
    line-height: 27px;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: normal;
    cursor: pointer;
    border: 1px solid rgba(255,255,255,1);
    
    width: 100px;
    margin: 10px 0px ;
    background-color: rgba(0,0,0,.9);
}
.bigscreen .loginform .loginsubmit  button::first-letter {
    color: inherit;
}