Soru SATIN ALMA TUŞUNU NASIL ÇEKEBİLİRİM BİRAZ DAHA SOLA

[sdff]

 

[BK07]

butonun olduğu css koda gir margin-right:"%15"; ver. %'yi test ederek kendine göre ayarlarsın

 

[sdff]

tamamdır gral saolasın

butonun olduğu css koda gir margin-right:"%15"; ver. %'yi test ederek kendine göre ayarlarsın

 

[sdff]

butonun olduğu css koda gir margin-right:"%15"; ver. %'yi test ederek kendine göre ayarlarsın

knk butonu bulamadım

 

[sdff]

knk butonu bulamadım

@import url(

Linkleri,görmek için Giriş yap veya üye ol.

@import url(

Linkleri,görmek için Giriş yap veya üye ol.

#main-app-container, #root, body {
height: 100vh;
max-height: 100vh;
min-height: 100vh;
width: 100vw;
max-width: 100vw;
min-width: 100vw;
margin: 0!important;
padding: 0!important;
border: 0!important;
outline: 0!important;
overflow: hidden;
position: relative
}

.hidden {
display: none;
visibility: hidden;
opacity: 0;
pointer-events: none
}

.full-box {
width: 100%;
height: 100%
}

.flex-centered {
justify-content: center;
width: 100%
}

.flex-centered, .flex-row {
display: flex;
align-items: center
}

.flex-row {
flex-direction: row;
justify-content: flex-start
}

.flex-space-between {
justify-content: space-between!important
}

.flex-space-around {
justify-content: space-around!important
}

.flex-vertical-center {
align-items: center
}

.flex-container-center {
display: flex;
justify-content: center;
align-items: center
}

.flex-column {
flex-direction: column
}

.flex {
flex: 1 1
}

.text-align-center {
text-align: center
}

.text-align-right {
width: 100%;
text-align: right
}

.text-clip {
text-overflow: clip;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical
}

.cursor-pointer {
cursor: pointer
}

textarea {
background: rgba(1, 1, 1, 0);
border: 0;
color: #fff;
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
border-bottom: 1px solid #fff;
resize: none;
width: 100%
}

textarea:focus {
outline: 0
}

div:focus {
outline: 0!important
}

.text-orange {
color: #ff9800
}

.text-green {
color: #66bb6a
}

.text-gray {
color: #9e9e9e
}

.text-opaque {
color: rgba(1, 1, 1, .3)
}

::-webkit-scrollbar, ::-webkit-scrollbar-track {
display: none
}

::-webkit-scrollbar-thumb {
display: none
}

.pulse {
-webkit-animation: pulsate;
animation: pulsate;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite
}

@-webkit-keyframes pulsate {
0% {
opacity: 0;
transform: scale(.5)
}
to {
opacity: 1;
transform: scale(1)
}
}

@keyframes pulsate {
0% {
opacity: 0;
transform: scale(.5)
}
to {
opacity: 1;
transform: scale(1)
}
}

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

.lds-spinner {
color: official;
display: inline-block;
position: relative;
width: 80px;
height: 80px
}

.lds-spinner div {
transform-origin: 40px 40px;
-webkit-animation: lds-spinner 1.2s linear infinite;
animation: lds-spinner 1.2s linear infinite
}

.lds-spinner div:after {
content: " ";
display: block;
position: absolute;
top: 3px;
left: 37px;
width: 6px;
height: 18px;
border-radius: 20%;
background: #fff
}

.lds-spinner div:first-child {
transform: rotate(0deg);
-webkit-animation-delay: -1.1s;
animation-delay: -1.1s
}

.lds-spinner div:nth-child(2) {
transform: rotate(30deg);
-webkit-animation-delay: -1s;
animation-delay: -1s
}

.lds-spinner div:nth-child(3) {
transform: rotate(60deg);
-webkit-animation-delay: -.9s;
animation-delay: -.9s
}

.lds-spinner div:nth-child(4) {
transform: rotate(90deg);
-webkit-animation-delay: -.8s;
animation-delay: -.8s
}

.lds-spinner div:nth-child(5) {
transform: rotate(120deg);
-webkit-animation-delay: -.7s;
animation-delay: -.7s
}

.lds-spinner div:nth-child(6) {
transform: rotate(150deg);
-webkit-animation-delay: -.6s;
animation-delay: -.6s
}

.lds-spinner div:nth-child(7) {
transform: rotate(180deg);
-webkit-animation-delay: -.5s;
animation-delay: -.5s
}

.lds-spinner div:nth-child(8) {
transform: rotate(210deg);
-webkit-animation-delay: -.4s;
animation-delay: -.4s
}

.lds-spinner div:nth-child(9) {
transform: rotate(240deg);
-webkit-animation-delay: -.3s;
animation-delay: -.3s
}

.lds-spinner div:nth-child(10) {
transform: rotate(270deg);
-webkit-animation-delay: -.2s;
animation-delay: -.2s
}

.lds-spinner div:nth-child(11) {
transform: rotate(300deg);
-webkit-animation-delay: -.1s;
animation-delay: -.1s
}

.lds-spinner div:nth-child(12) {
transform: rotate(330deg);
-webkit-animation-delay: 0s;
animation-delay: 0s
}

@-webkit-keyframes lds-spinner {
0% {
opacity: 1
}
to {
opacity: 0
}
}

@keyframes lds-spinner {
0% {
opacity: 1
}
to {
opacity: 0
}
}

.badge-app-wrapper {
width: 100vw;
height: 100vh;
display: flex;
justify-content: flex-start;
align-items: center;
padding-left: 32px
}

.badge-app-wrapper .exterior-wrapper {
border-radius: 10px;
padding: 6px;
width: 500px;
height: 350px
}

.badge-app-wrapper .exterior-wrapper-ff {
transform: rotate(180deg)
}

.badge-app-wrapper .interior-wrapper {
border: 2px dashed #3f3f3f;
border-radius: 10px;
height: calc(100% - 6px)
}

.badge-app-wrapper .row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 100%;
height: 100%
}

.badge-app-wrapper .column {
display: flex;
flex-direction: column;
flex-basis: 100%;
flex: 1 1
}

.badge-app-wrapper .left-column {
height: 100%;
box-shadow: inset -7px 0 5px 0 rgba(85, 85, 85, .35);
display: flex;
align-items: center;
justify-content: center
}

.badge-app-wrapper .right-column {
height: 100%;
box-shadow: inset 7px 0 5px 0 rgba(85, 85, 85, .35)
}

.badge-app-wrapper .information-wrapper {
margin: 6px;
height: 90%;
width: 85%;
background-color: #fff;
border-radius: 6px;
border: 1px solid #ccc;
box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, .75);
overflow: hidden
}

.badge-app-wrapper .badge-wrapper {
margin: 6px;
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: center
}

.badge-app-wrapper .badge {
width: 75%
}

.badge-app-wrapper .information {
display: flex;
flex-direction: column;
background-color: #d3d3d3;
width: 100%;
height: 100%
}

.badge-app-wrapper .information .profile-image-holder {
height: 40%;
display: flex;
justify-content: center;
align-items: center;
padding: 8px
}

.badge-app-wrapper .information .profile-image-holder img {
border: 4px solid #fff;
max-height: 105px;
max-width: 80%
}

.badge-app-wrapper .information .name-info {
height: 60%;
background-color: #d3d3d3;
display: flex;
flex-direction: column
}

.badge-app-wrapper .information .name-info .banner {
width: "100%";
height: 30px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center
}

.badge-app-wrapper .information .name-info .callsign h6, .badge-app-wrapper .information .name-info .callsign p, .badge-app-wrapper .information .name-info .callsign span, .badge-app-wrapper .information .name-info .name-info-wrap h6, .badge-app-wrapper .information .name-info .name-info-wrap p, .badge-app-wrapper .information .name-info .name-info-wrap span {
color: #000!important;
font-family: Arial, Helvetica, sans-serif!important;
letter-spacing: .7!important;
font-weight: 600!important;
text-decoration: none!important;
font-style: normal!important;
font-feature-settings: "c2sc"!important;
font-variant: small-caps!important;
text-transform: none!important;
width: 100%!important;
text-align: center
}

.badge-app-wrapper .information .name-info .name-info-wrap {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
flex: 1 1
}

.badge-app-wrapper .information .name-info .callsign {
height: 40px
}

.component-checkmark .checkmark__circle {
stroke-dasharray: 166;
stroke-dashoffset: 166;
stroke-width: 2;
stroke-miterlimit: 10;
stroke: #009688;
fill: none;
-webkit-animation: stroke .6s cubic-bezier(.65, 0, .45, 1) forwards;
animation: stroke .6s cubic-bezier(.65, 0, .45, 1) forwards
}

.component-checkmark .checkmark {
width: 56px;
height: 56px;
border-radius: 50%;
display: block;
stroke-width: 2;
stroke: #fff;
stroke-miterlimit: 10;
margin: 10% auto;
box-shadow: inset 0 0 0 #009688;
-webkit-animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both
}

.component-checkmark .checkmark__check {
transform-origin: 50% 50%;
stroke-dasharray: 48;
stroke-dashoffset: 48;
-webkit-animation: stroke .3s cubic-bezier(.65, 0, .45, 1) .8s forwards;
animation: stroke .3s cubic-bezier(.65, 0, .45, 1) .8s forwards
}

@-webkit-keyframes stroke {
to {
stroke-dashoffset: 0
}
}

@keyframes stroke {
to {
stroke-dashoffset: 0
}
}

@-webkit-keyframes scale {
0%, to {
transform: none
}
50% {
transform: scale3d(1.1, 1.1, 1)
}
}

@keyframes scale {
0%, to {
transform: none
}
50% {
transform: scale3d(1.1, 1.1, 1)
}
}

@-webkit-keyframes fill {
to {
box-shadow: inset 0 0 0 30px #009688
}
}

@keyframes fill {
to {
box-shadow: inset 0 0 0 30px #009688
}
}

.component-simple-form {
width: 100%
}

.component-simple-form .input-wrapper {
flex: 1 1;
width: 100%
}

.component-simple-form>div {
display: flex;
width: 100%;
margin-top: 4px
}

.component-simple-form>.buttons {
display: flex;
justify-content: space-between;
margin-bottom: 0;
margin-top: 16px
}

.component-simple-form>.validation-messages {
text-align: left;
color: #fff;
display: flex;
flex-direction: column
}

.component-simple-form>.validation-messages>.message {
display: flex;
align-items: center;
margin-top: 8px;
color: #ffa726
}

.component-simple-form>.validation-messages>.message p {
margin-left: 8px;
font-size: .8rem
}

.component-paper {
width: 100%;
margin-bottom: 8px;
background-color: #30475e;
border-bottom: 1px solid #c8c6ca;
border-radius: 4px;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
padding: 8px;
color: #e0e0e0;
position: relative;
}

.component-paper>.notification {
width: 8px;
height: 8px;
position: absolute;
border-radius: 100%;
right: 8px;
top: 8px
}

.component-paper>.main-container {
display: flex;
width: 100%
}

.component-paper>.main-container>.image {
margin-right: 8px
}

.component-paper>.main-container .details, .component-paper>.main-container>.details {
display: flex;
flex-direction: column;
align-content: space-between;
position: relative;
justify-content: space-between;
flex: 1 1;
overflow: hidden
}

.component-paper>.main-container .details>.title>p, .component-paper>.main-container>.details>.title>p {
text-overflow: clip;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical
}

.component-paper>.main-container>.details-aux {
display: flex;
align-items: center
}

.component-paper>.main-container>.actions {
border-radius: 4px;
justify-content: flex-end;
align-items: center;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: rgba(1, 1, 1, .75);
display: none;
z-index: 1
}

.component-paper>.main-container>.actions-show {
display: flex;
justify-content: center;
align-items: center
}

.component-paper>.main-container>.actions>div {
color: #e0e0e0;
margin: 8px 8px 0
}

.component-paper>.main-container>.actions>div:active {
-webkit-filter: brightness(85%);
filter: brightness(85%)
}

.component-paper>.drawer {
display: flex;
flex-direction: column;
padding: 8px 12px 0;
color: #c8c6ca
}

.component-paper>.drawer>.item {
padding: 4px 0;
display: flex;
align-items: center;
margin-bottom: 8px;
border-bottom: 1px solid #c8c6ca;
text-shadow: 1px 1px #000
}

.component-paper>.drawer>.item>.icon {
margin-right: 8px;
stroke: #000;
stroke-width: 4
}

.component-image-container {
width: 100%;
min-height: 120px;
position: relative;
margin-top: 16px;
pointer-events: all
}

.component-image-container>.container {
width: 100%;
border-radius: 4px;
min-height: 120px;
overflow: hidden;
margin-top: 8px;
padding: 8px 0;
position: relative;
display: flex;
flex-wrap: wrap;
justify-content: space-around
}

.component-image-container>.container-max-height {
max-height: 160px
}

.component-image-container>.container>.spacer {
flex: 1 1;
min-width: 218px
}

.component-image-container>.container>.image {
width: 100%;
min-width: 218px;
max-width: 218px;
min-height: 140px;
background-size: contain;
background-repeat: no-repeat;
background-position: 50%;
display: flex;
align-items: center;
justify-content: center;
position: relative
}

.component-image-container>.container>.image:last-child {
border: none
}

.component-image-container>.container>.image-with-blur {
-webkit-filter: blur(2rem);
filter: blur(2rem)
}

.component-image-container>.container>.image>video {
max-width: 100%;
max-height: 100%;
object-fit: cover
}

.component-image-container>.container>.blocker {
min-height: 120px;
cursor: pointer;
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
z-index: 2;
border: 1px solid #fff;
border-radius: 4px;
text-shadow: -1px 1px 0 #37474f, 1px 1px 0 #37474f, 1px -1px 0 #37474f, -1px -1px 0 #37474f
}

.inner-phone-app-container-multi-pager {
width: 100%;
height: 100%;
position: relative
}

.inner-phone-app-container-multi-pager>.page {
height: 100%;
width: 100%;
transition: all .4s ease;
position: absolute;
top: 0;
left: 0;
will-change: left
}

.inner-phone-app-container-multi-pager>.page-hide {
visibility: hidden;
pointer-events: none
}

.inner-phone-app-container-multi-pager>.page-hide-left {
left: -100%
}

.inner-phone-app-container-multi-pager>.page-hide-right {
left: 100%
}

.inner-phone-app-container-multi-pager-landscape .page {
height: 100%;
width: 100%;
min-width: 100%;
max-width: 100%;
transition: all .4s ease
}

.inner-phone-app-container-multi-pager-landscape .page-landscape-left {
width: 30%;
min-width: 30%;
max-width: 30%
}

.inner-phone-app-container-multi-pager-landscape .page-landscape-right {
left: 30%;
width: 70%;
min-width: 70%;
max-width: 70%
}

.inner-phone-app-container-multi-pager-landscape .page-landscape-right-hidden {
left: 100%;
opacity: 0
}

.inner-phone-app-container-multi-pager-landscape .page-landscape-right .inner-container-with-options-landscape {
max-height: none
}

.cmdlet-wrapper {
width: 100%;
padding: 8px;
pointer-events: all;
display: flex;
justify-content: center
}

.cmdlet-wrapper>input {
width: 40%;
font-size: 2em
}

.debug-logs-wrapper {
display: flex;
flex-direction: column;
width: 100vw
}

.debug-logs-wrapper>.inner {
pointer-events: all;
width: 340px;
max-height: 100vh;
overflow-y: scroll
}

.debug-log-wrapper {
pointer-events: all;
background-color: #fff;
padding: 2px;
width: 300px;
border: 1px solid #000;
margin: 2px;
border-radius: 4px;
position: relative;
background-color: #aaa
}

.debug-log-wrapper-red {
background-color: red;
color: #fff;
-webkit-animation: rightherepalred;
animation: rightherepalred;
-webkit-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}

.debug-log-wrapper>.arrow {
position: absolute;
right: -100px;
z-index: 1000;
color: red;
opacity: 0;
-webkit-animation: rightherepal;
animation: rightherepal;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-delay: 2s;
animation-delay: 2s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
transform: scale(1) rotateX(45deg) rotateY(45deg)
}

.debug-log-json-wrapper {
background-color: #222831;
color: #fff;
max-height: 400px;
overflow-y: auto
}

.debug-log-json-wrapper>textarea {
background-color: #222831;
color: #fff;
height: 100%;
max-height: 400px;
width: 100%;
border: 0!important;
padding: 4px
}

@-webkit-keyframes rightherepal {
0% {
transform: scale(1) rotateX(45deg) rotateY(45deg);
opacity: 1
}
50% {
transform: scale(3) rotateX(-45deg) rotateY(45deg);
opacity: .5
}
to {
transform: scale(1) rotateX(45deg) rotateY(45deg);
opacity: 1
}
}

@keyframes rightherepal {
0% {
transform: scale(1) rotateX(45deg) rotateY(45deg);
opacity: 1
}
50% {
transform: scale(3) rotateX(-45deg) rotateY(45deg);
opacity: .5
}
to {
transform: scale(1) rotateX(45deg) rotateY(45deg);
opacity: 1
}
}

@-webkit-keyframes rightherepalred {
0% {
background-color: transparent;
color: #000
}
50% {
background-color: transparent;
color: #000
}
to {
background-color: red;
color: #fff
}
}

@keyframes rightherepalred {
0% {
background-color: transparent;
color: #000
}
50% {
background-color: transparent;
color: #000
}
to {
background-color: red;
color: #fff
}
}

#dispatch-map-container .map-icon-ping {
color: #000
}

#dispatch-map-container .map-icon-call, #dispatch-map-container .map-icon-unit {
color: #000
}

#dispatch-map-container .map-icon-ems {
color: #ff6f00
}

#dispatch-map-container .map-tooltip {
background-color: unset;
border: unset;
opacity: 1;
box-shadow: unset;
font-size: 1.2rem;
color: #fff!important;
font-family: Arial, Helvetica, sans-serif!important;
letter-spacing: .7px;
font-weight: 600!important;
text-decoration: none!important;
font-style: normal!important;
text-transform: uppercase!important;
width: 100%!important;
text-shadow: -1px 1px 0 #37474f, 1px 1px 0 #37474f, 1px -1px 0 #37474f, -1px -1px 0 #37474f
}

#dispatch-map-container .map-tooltip:before {
border: unset
}

.component-markdown-editor ul {
list-style: disc!important
}

.newspaper-wrapper {
color: #fff;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 100vw;
height: 100vh;
position: relative
}

.newspaper-wrapper>.newspaper {
pointer-events: all;
position: relative;
-webkit-animation-name: spinning;
animation-name: spinning;
-webkit-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-timing-function: ease;
animation-timing-function: ease;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
-webkit-animation-direction: normal;
animation-direction: normal;
transform: rotate(-2.5deg);
width: 1260px;
height: 720px;
border-radius: 4px;
font-family: "Droid Serif", serif;
font-size: 14px;
color: #2f2f2f;
background-color: #f9f7f1
}

.newspaper-wrapper>.newspaper>.content {
width: 100%;
height: 100%;
background-color: #f9f7f1;
border-radius: 4px;
box-shadow: 0 0 10px rgba(0, 0, 0, .3);
padding: 16px;
display: flex;
flex-direction: column;
background-image: url(data:image/png;base64,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)
}

.newspaper-wrapper>.newspaper>.content>.header {
display: flex;
flex-direction: row;
align-items: center
}

.newspaper-wrapper>.newspaper>.content>.header>.alert-box {
position: relative;
width: 30%;
border: 3px double #2f2f2f;
padding: 4px 8px;
line-height: 20px
}

.newspaper-wrapper>.newspaper>.content>.header>.title {
font-family: "Playfair Display", serif;
font-weight: 900;
font-size: 80px;
text-transform: uppercase;
line-height: 72px;
margin-bottom: 20px;
text-align: center;
flex: 1 1
}

.newspaper-wrapper>.newspaper>.content>.subhead {
margin: 8px 0;
text-transform: uppercase;
border-bottom: 2px solid #2f2f2f;
border-top: 2px solid #2f2f2f;
padding: 12px 0;
text-align: center;
display: flex;
flex-direction: row;
justify-content: space-between
}

.newspaper-wrapper>.newspaper>.content>.subhead>.taxes {
max-height: 14px;
height: 14px;
overflow: hidden;
text-align: left
}

.newspaper-wrapper>.newspaper>.content>.subhead>.taxes>span {
font-size: 85%;
padding: 0 8px;
border-right: 1px solid #2f2f2f
}

.newspaper-wrapper>.newspaper>.content>.subhead>.taxes>span:last-child {
border: 0
}

.newspaper-wrapper>.newspaper>.content>.columns {
display: flex;
flex: 1 1
}

.newspaper-wrapper>.newspaper>.content>.columns>.column-dbl {
display: flex;
justify-content: space-between;
flex-direction: column
}

.newspaper-wrapper>.newspaper>.content>.columns>.column {
font-size: 14px;
line-height: 20px;
padding: 0 16px;
border-right: 1px solid #2f2f2f;
flex: 1 1;
margin: 8px 0;
height: 100%;
max-height: 480px;
overflow-y: auto
}

.newspaper-wrapper>.newspaper>.content>.columns>.column:last-child {
border-right: 0
}

.newspaper-wrapper>.newspaper>.content>.columns>.column>.column-content .lockup, .newspaper-wrapper>.newspaper>.content>.columns>.column>.column-content>.election {
border-bottom: 1px solid #2f2f2f;
padding-bottom: 8px;
margin-bottom: 8px
}

.newspaper-wrapper>.newspaper>.content>.columns>.column>.column-content .lockup>span, .newspaper-wrapper>.newspaper>.content>.columns>.column>.column-content>.election>span {
font-weight: 700
}

.newspaper-wrapper>.newspaper>.content>.columns>.column>.column-content>.election {
display: flex;
flex-direction: column
}

.newspaper-wrapper>.newspaper>.content>.columns>.column>.column-content>.election>span:last-child {
font-weight: 400
}

.newspaper-wrapper>.newspaper>.content>.columns>.column .dbl>.headline, .newspaper-wrapper>.newspaper>.content>.columns>.column>.headline {
text-align: center;
line-height: normal;
font-family: "Playfair Display", serif;
display: block;
margin: 0 auto;
font-weight: 400;
font-size: 42px;
text-transform: uppercase;
font-style: italic;
box-sizing: border-box;
padding: 10px 0
}

.newspaper-wrapper>.newspaper>.content>.columns>.column .dbl>.subheadline, .newspaper-wrapper>.newspaper>.content>.columns>.column>.subheadline {
font-weight: 400;
font-size: 18px;
box-sizing: border-box;
padding: 10px 0;
text-align: center
}

.newspaper-wrapper>.newspaper>.content>.columns>.column .dbl>.subheadline:before, .newspaper-wrapper>.newspaper>.content>.columns>.column>.subheadline:before {
border-top: 1px solid #2f2f2f;
content: "";
width: 100px;
height: 7px;
display: block;
margin: 0 auto
}

.newspaper-wrapper>.newspaper>.content>.columns>.column .dbl>.subheadline:after, .newspaper-wrapper>.newspaper>.content>.columns>.column>.subheadline:after {
border-bottom: 1px solid #2f2f2f;
content: "";
width: 100px;
height: 10px;
display: block;
margin: 0 auto
}

.newspaper-wrapper .newspaper:after, .newspaper-wrapper>.newspaper:before {
content: "";
border-radius: 4px;
height: 98%;
position: absolute;
width: 100%;
z-index: -1;
background-color: #f9f7f1;
background-image: url(data:image/png;base64,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)
}

.newspaper-wrapper>.newspaper:before {
box-shadow: 0 0 8px rgba(0, 0, 0, .2);
right: -16px;
top: -2px;
transform: rotate(2deg)
}

.newspaper-wrapper>.newspaper:after {
box-shadow: 0 0 3px rgba(0, 0, 0, .2);
right: -8px;
top: 0;
transform: rotate(1deg)
}

@-webkit-keyframes spinning {
0% {
transform: scale(0) rotate(0deg)
}
to {
transform: scale(1) rotate(1437.5deg)
}
}

@keyframes spinning {
0% {
transform: scale(0) rotate(0deg)
}
to {
transform: scale(1) rotate(1437.5deg)
}
}

.top-notifications-wrapper {
width: 100%;
min-height: 60px;
position: absolute;
left: 0;
display: flex;
justify-content: center;
flex-direction: column-reverse;
align-items: center;
z-index: 200;
padding-top: 4px;
opacity: 1;
top: 24px;
transition: max-height .5s ease
}

.top-notifications-wrapper-not-mounted {
pointer-events: none
}

.top-notifications-wrapper-mounted {
pointer-events: all
}

.top-notifications-wrapper>.notification-container {
background-color: rgba(53, 49, 52, .95);
width: calc(100% - 32px);
height: 100%;
min-height: 60px;
padding: 6px 8px;
border-radius: 8px;
color: #c8c6ca;
max-width: 400px;
cursor: pointer;
margin-bottom: 8px;
opacity: 1;
-webkit-animation: cometopapa;
animation: cometopapa;
-webkit-animation-duration: .5s;
animation-duration: .5s;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
transform: translateY(0)
}

.top-notifications-wrapper>.notification-container-fade-out {
opacity: 0;
-webkit-animation: gotomommy;
animation: gotomommy;
-webkit-animation-duration: .5s;
animation-duration: .5s;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
height: 0;
min-height: 0;
max-height: 0;
padding: 0 8px;
margin: 0
}

.top-notifications-wrapper>.notification-container>.app-bar {
display: flex;
align-items: center
}

.top-notifications-wrapper>.notification-container>.app-bar>.icon {
border-radius: 4px;
padding: 4px 2px;
margin-right: 8px
}

.top-notifications-wrapper>.notification-container>.app-bar>.icon>svg {
stroke: #000;
stroke-width: 8
}

.top-notifications-wrapper>.notification-container>.app-bar>.name {
flex: 1 1;
text-transform: uppercase;
overflow: hidden
}

.top-notifications-wrapper>.notification-container>.app-bar>.name>p {
font-size: .8rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-right: 8px
}

.top-notifications-wrapper>.notification-container>.app-bar>p {
font-size: .7rem
}

.top-notifications-wrapper>.notification-container>.content {
margin-top: 4px;
display: flex;
color: #e0e0e0
}

.top-notifications-wrapper>.notification-container>.content>.text {
flex: 1 1;
padding-right: 8px
}

.top-notifications-wrapper>.notification-container>.content>.text>p {
font-size: .75rem;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden
}

.top-notifications-wrapper>.notification-container>.content>.actions {
display: flex;
align-items: center
}

.top-notifications-wrapper>.notification-container>.content>.actions>.action {
margin: 0 2px
}

.top-notifications-wrapper>.notification-container>.content>.actions>.action-accept {
color: #aed581
}

.top-notifications-wrapper>.notification-container>.content>.actions>.action-reject {
color: #ffa726
}

@-webkit-keyframes cometopapa {
0% {
opacity: 0;
transform: translateY(-100px)
}
to {
opacity: 1;
transform: translateY(0)
}
}

@keyframes cometopapa {
0% {
opacity: 0;
transform: translateY(-100px)
}
to {
opacity: 1;
transform: translateY(0)
}
}

@-webkit-keyframes gotomommy {
0% {
opacity: 1;
transform: translateY(0);
height: 60px;
max-height: 60px
}
to {
opacity: 0;
transform: translateY(-100px);
height: 0;
max-height: 0
}
}

@keyframes gotomommy {
0% {
opacity: 1;
transform: translateY(0);
height: 60px;
max-height: 60px
}
to {
opacity: 0;
transform: translateY(-100px);
height: 0;
max-height: 0
}
}

.abdultaxi-container {
height: 100%;
width: 100%;
display: flex;
background-color: #222831;
font-family: "Roboto", sans-serif
}

.abdultaxi-container .abdultaxi-driverslist {
padding-top: 2rem;
display: flex;
height: 100%;
width: 100%;
align-items: center;
flex-direction: column
}

.abdultaxi-container .abdultaxi-driverslist .logo {
width: 50px;
height: 100px
}

.abdultaxi-container .abdultaxi-driverslist .banner {
color: #fff;
font-size: 16px;
padding: 10px;
width: 100%;
display: flex;
font-weight: 700;
align-items: center;
justify-content: center;
background-color: #30475e
}

.abdultaxi-container .abdultaxi-driverslist .drivers {
flex: auto;
width: 100%;
padding: 0 1.3rem;
overflow: scroll;
margin-top: 2rem;
max-height: 300px
}

.abdultaxi-container .abdultaxi-driverslist .drivers .driver {
width: 100%;
padding: .5rem;
justify-content: space-between;
display: flex;
align-items: center
}

.abdultaxi-container .abdultaxi-driverslist .drivers .driver h1, .abdultaxi-container .abdultaxi-driverslist .drivers .driver span {
margin: 0;
padding: 0
}

.abdultaxi-container .abdultaxi-driverslist .drivers .driver .name {
color: #fff;
font-size: 13px;
flex: 1 1;
word-break: break-word
}

.abdultaxi-container .abdultaxi-driverslist .drivers .driver .status {
flex: 1 1;
color: #fff;
font-size: 13px;
text-align: right
}

.abdultaxi-container .abdultaxi-driverslist .drivers .driver .Available {
color: #39ff88
}

.abdultaxi-container .abdultaxi-driverslist .drivers .driver .Busy {
color: #ff5e1a
}

.abdultaxi-container .abdultaxi-driverslist .employee-btns {
flex: 0.3 1;
display: flex;
flex-direction: column
}

.abdultaxi-container .abdultaxi-driverslist .employee-btns .rect-btn {
border: none;
color: #fff;
flex-basis: 33.3%;
padding: 7px 15px;
border-radius: 2px;
margin-bottom: .5rem
}

.abdultaxi-container .abdultaxi-driverslist .employee-btns .red {
background-color: #d55252
}

.abdultaxi-container .abdultaxi-driverslist .employee-btns .green {
background-color: #2c9e4d
}

.browser-wrapper, .browser-wrapper>iframe {
width: 100%;
height: 100%
}

.calculator-container {
height: 670px;
display: flex;
align-items: center;
justify-content: center;
font: 100 14px "Roboto";
background: #000
}

.calculator-container .calculator {
width: 100%;
height: 475px;
background: #000;
display: flex;
flex-direction: column
}

.calculator-container .calculator .calculator-display {
color: #fff;
background: #1c191c;
line-height: 130px;
font-size: 6em;
flex: 1 1
}

.calculator-container .calculator .calculator-display .auto-scaling-text {
display: inline-block;
padding: 0 30px;
position: absolute;
right: 0;
transform-origin: right
}

.calculator-container .calculator .calculator-keypad {
display: flex
}

.calculator-container .calculator .calculator-keypad .calculator-key {
display: block;
background: none;
padding: 0;
font-family: inherit;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: pointer;
outline: none;
width: 33.333%;
height: 70px;
border: none;
border-top: 1px solid #777;
border-right: 1px solid #666;
text-align: center;
line-height: 70px
}

.calculator-container .calculator .calculator-keypad .calculator-key:active {
box-shadow: inset 0 0 80px 0 rgba(0, 0, 0, .25)
}

.calculator-container .calculator .calculator-keypad .input-keys {
width: 75%
}

.calculator-container .calculator .calculator-keypad .input-keys .digit-keys {
background: #e0e0e7;
display: flex;
flex-direction: row;
flex-wrap: wrap-reverse
}

.calculator-container .calculator .calculator-keypad .input-keys .digit-keys .calculator-key {
font-size: 2.25em
}

.calculator-container .calculator .calculator-keypad .input-keys .digit-keys .key-0 {
width: 66.6666%;
text-align: left;
padding-left: 27px
}

.calculator-container .calculator .calculator-keypad .input-keys .digit-keys .key-dot {
padding-top: 1em;
font-size: .75em
}

.calculator-container .calculator .calculator-keypad .input-keys .function-keys {
display: flex;
background: linear-gradient(180deg, #cacacc 0, #c4c2cc)
}

.calculator-container .calculator .calculator-keypad .input-keys .function-keys .calculator-key {
font-size: 2em
}

.calculator-container .calculator .calculator-keypad .input-keys .function-keys .key-multiply {
line-height: 50px
}

.calculator-container .calculator .calculator-keypad .operator-keys {
flex: 1 1;
background: linear-gradient(180deg, #fc9c17 0, #f77e1b)
}

.calculator-container .calculator .calculator-keypad .operator-keys .calculator-key {
width: 100%;
color: #fff;
border-right: 0;
font-size: 3em
}

.messages-landscape-container {
display: flex;
width: 100%
}

.messages-landscape-container>div {
flex: 1 1
}

.messages-landscape-container>.contact-info {
display: flex;
align-items: center;
padding: 4px 16px;
height: 48px;
width: 100%
}

.messages-landscape-container>.contact-info>.icon {
margin-right: 8px
}

.messages-container {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
position: relative
}

.messages-container>.contact-info {
display: flex;
align-items: center;
position: absolute;
top: 0;
left: 0;
width: 100%
}

.messages-container>.contact-info>.icon {
margin-right: 8px
}

.messages-container>.send-message {
position: absolute;
bottom: 0;
height: 48px;
width: 100%
}

.messages-container>.messages {
margin: 48px 0 60px;
height: 100%;
max-height: 100%;
overflow: hidden;
overflow-y: auto;
display: flex;
flex-direction: column-reverse
}

.messages-container>.messages>.message {
width: 100%;
display: flex;
flex-direction: column;
align-items: flex-start
}

.messages-container>.messages>.message-out {
align-items: flex-end
}

.messages-container>.messages>.message>.timestamp {
display: flex;
margin-top: 2px;
padding: 0 4px
}

.messages-container>.messages>.message>.timestamp p {
color: #9e9e9e;
text-align: right;
font-size: .75rem
}

.messages-container>.messages>.message>.inner {
max-width: 90%;
border-radius: 12px;
padding: 8px;
margin: 8px 0 0
}

.messages-container>.messages>.message>.inner-in {
background-color: #37474f
}

.messages-container>.messages>.message>.inner-out {
background-color: #147efb;
text-align: right
}

.messages-container>.messages>.message>.inner>p {
overflow-wrap: anywhere
}

.messages-container-landscape>.messages {
margin-top: 0
}

.documents-signatures-container>.signatures {
height: 100%;
width: 100%;
display: flex;
justify-content: center;
align-items: center
}

.documents-signatures-container>.signatures>.wrapper {
width: 100%;
display: flex;
flex-direction: column
}

.documents-signatures-container>.signatures>.wrapper>.sign-me {
display: flex;
justify-content: center;
margin-bottom: 16px
}

.documents-signatures-container>.signatures>.wrapper>.signature {
display: flex;
margin: 8px 0;
padding: 8px 0;
align-items: center;
border-bottom: 1px solid #fff
}

.documents-signatures-container>.signatures>.wrapper>.signature>.dot, .documents-signatures-container>.signatures>.wrapper>.signature>.signee {
display: flex;
align-items: center;
justify-content: center;
height: 40px
}

.documents-signatures-container>.signatures>.wrapper>.signature>.signee {
display: flex;
flex-direction: column;
align-items: flex-start;
text-transform: capitalize;
font-style: italic
}

.documents-signatures-container>.signatures>.wrapper>.signature>.dot {
height: 60px;
width: 60px;
background-color: #30475e;
border-radius: 100%;
padding: 8px;
margin-right: 16px
}

.jobs-container .activity-container {
height: 100%;
width: 100%;
opacity: 1;
-webkit-animation: fadeinpls;
animation: fadeinpls;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
position: relative;
color: #fff
}

.jobs-container .activity-container>.activity-title {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 0;
margin: 0 0 8px;
border-bottom: 1px solid #fff
}

.jobs-container .activity-container>.activity-title>.timer {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-end
}

.jobs-container .activity-container>.task-list {
max-height: calc(100% - 90px);
overflow-y: scroll
}

.jobs-container .activity-container .activity-task-paper-wrapper {
width: 100%!important
}

.jobs-container .activity-container .activity-task-paper-wrapper .activity-task-wrapper {
display: flex;
flex-direction: column;
width: 100%!important;
position: relative
}

.jobs-container .activity-container .activity-task-paper-wrapper .activity-task-wrapper>.checkmark-wrapper {
position: absolute;
z-index: 5;
top: 0;
right: 0;
height: 100%;
opacity: 0;
pointer-events: none;
-webkit-animation: fadeoutpls;
animation: fadeoutpls;
-webkit-animation-duration: 5s;
animation-duration: 5s;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}

.jobs-container .activity-container .activity-task-paper-wrapper .activity-task-wrapper .task-name {
flex: 1 1
}

.jobs-container .activity-container .activity-task-paper-wrapper .activity-task-wrapper .progress, .jobs-container .activity-container .activity-task-paper-wrapper .activity-task-wrapper .task-name {
display: flex;
align-items: center
}

.jobs-container .activity-container .activity-task-paper-wrapper .activity-task-wrapper .progress {
justify-content: flex-end
}

.jobs-container .activity-container .activity-task-paper-wrapper .activity-task-wrapper p.completed {
text-decoration: line-through
}

.jobs-container .activity-container .activity-tracked-item>.bottom, .jobs-container .activity-container .activity-tracked-item>.top {
display: flex;
justify-content: space-between;
margin: 8px 0
}

.jobs-container .activity-container .MuiTimelineItem-root:before {
flex: none!important;
content: none!important
}

.jobs-container .activity-container .MuiTimeline-root {
padding: 0!important
}

.jobs-container .activity-container .MuiTimelineContent-root {
padding-right: 0!important
}

.jobs-container .job-groups {
height: 100%;
opacity: 1;
-webkit-animation: fadeinpls;
animation: fadeinpls;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}

.jobs-container .job-groups, .jobs-container .job-groups>.group-list {
width: 100%;
display: flex;
flex-direction: column;
align-items: center
}

.jobs-container .job-groups>.group-list>.text-wrapper {
width: 100%;
margin-bottom: 8px
}

.jobs-container .job-groups>.group-list>.text-wrapper>p {
margin: 8px 0
}

.jobs-container .job-groups>.group-list .job-description-info {
height: 100%;
display: flex;
justify-content: space-between
}

.jobs-container .job-groups>.group-list .job-description-info>.request-to-join {
flex: 1 1;
display: flex;
align-items: center
}

.jobs-container .job-groups>.group-list .job-description-info>.group-desc {
flex: 1 1;
display: flex;
justify-content: flex-end;
align-items: center
}

.jobs-container .job-groups>.group-list .job-description-info>.group-desc>div {
display: flex;
align-items: center;
margin-right: 8px
}

.jobs-container .job-groups>.group-list .job-description-info>.group-desc>div p {
margin-left: 8px
}

.jobs-container .job-group-members {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
opacity: 1;
-webkit-animation: fadeinpls;
animation: fadeinpls;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}

.jobs-container .job-group-members>.waiting-for-activity {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px solid #fff
}

.jobs-container .job-group-members .mygroup-action {
display: flex;
justify-content: space-between;
margin: 8px 0
}

.jobs-container .job-group-members>.member-list-cont {
width: 100%;
flex: 1 1
}

.jobs-container .job-group-members>.member-list-cont>.member-list {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
flex: 1 1
}

.jobs-container .job-group-members>.member-list-cont>.member-list>.text-wrapper {
width: 100%;
margin-bottom: 8px
}

.jobs-container .job-group-members>.member-list-cont>.member-list .job-description-info {
height: 100%;
display: flex;
justify-content: space-between
}

.jobs-container .job-group-members>.member-list-cont>.member-list .job-description-info>.request-to-join {
flex: 1 1;
display: flex;
align-items: center
}

.jobs-container .job-group-members>.member-list-cont>.member-list .job-description-info>.group-desc {
flex: 1 1;
display: flex;
justify-content: flex-end;
align-items: center
}

.jobs-container .job-group-members>.member-list-cont>.member-list .job-description-info>.group-desc>div {
display: flex;
align-items: center;
margin-right: 8px
}

.jobs-container .job-group-members>.member-list-cont>.member-list .job-description-info>.group-desc>div p {
margin-left: 8px
}

.component-ripple-effect .lds-ripple {
display: inline-block;
position: relative;
width: 80px;
height: 80px
}

.component-ripple-effect .lds-ripple div {
position: absolute;
border: 4px solid #cef;
opacity: 1;
border-radius: 50%;
-webkit-animation: lds-ripple 1.5s cubic-bezier(0, .2, .8, 1) infinite;
animation: lds-ripple 1.5s cubic-bezier(0, .2, .8, 1) infinite
}

.component-ripple-effect .lds-ripple div:nth-child(2) {
-webkit-animation-delay: -.75s;
animation-delay: -.75s
}

@-webkit-keyframes lds-ripple {
0% {
top: 36px;
left: 36px;
width: 0;
height: 0;
opacity: 1
}
to {
top: 0;
left: 0;
width: 72px;
height: 72px;
opacity: 0
}
}

@keyframes lds-ripple {
0% {
top: 36px;
left: 36px;
width: 0;
height: 0;
opacity: 1
}
to {
top: 0;
left: 0;
width: 72px;
height: 72px;
opacity: 0
}
}

.jobs-container {
align-items: center;
justify-content: center;
opacity: 1;
-webkit-animation: fadeinpls;
animation: fadeinpls;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}

.jobs-container, .jobs-container-inner {
height: 100%;
width: 100%;
display: flex;
flex-direction: column
}

.jobs-container-inner {
max-height: 100%
}

.jobs-container-inner>div {
margin-bottom: 32px
}

.jobs-container-inner .job-description-paygrade {
display: flex
}

.jobs-container-inner .job-description-info {
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between
}

.jobs-container-inner .job-description-info>div {
display: flex;
align-items: center
}

.jobs-container-inner .job-description-info>div p {
margin-right: 4px
}

.editor-image {
width: 100%;
min-width: 218px;
max-width: 100%;
min-height: 140px;
background-size: contain;
background-repeat: no-repeat;
background-position: 50%;
display: flex;
align-items: center;
justify-content: center;
position: relative
}

.editor-image:last-child {
border: none
}

.editor-image>video {
max-width: 100%;
max-height: 100%;
object-fit: cover
}

.title-race-event-name>p {
-webkit-line-clamp: 2!important
}

.aux-race-length {
align-items: flex-end!important
}

.radio-container {
height: 100vh;
width: 100vw;
pointer-events: none;
display: flex;
align-items: flex-end;
justify-content: flex-end;
position: relative
}

.radio-container .radio-image-container {
pointer-events: all;
position: absolute;
transition: all .4s ease;
bottom: -1000px;
right: 16px
}

.radio-container .radio-image-container>.on-off-wrapper {
position: absolute;
right: 28px;
bottom: 284px;
height: 50px;
width: 40px;
background-color: transparent
}

.radio-container .radio-image-container>.vol-up-wrapper {
width: 36px;
height: 54px;
position: absolute;
left: 4px;
bottom: 210px
}

.radio-container .radio-image-container>.vol-down-wrapper {
width: 36px;
height: 48px;
position: absolute;
left: 4px;
bottom: 150px
}

.radio-container .radio-image-container>.nopixel-tag {
position: absolute;
left: 66px;
bottom: 250px;
width: 40px;
text-align: center;
color: #fff;
background-color: #000
}

.radio-container .radio-image-container>.nopixel-tag>p {
font-size: .4rem
}

.radio-container .radio-image-container>.other-tag {
position: absolute;
left: 64px;
bottom: 268px;
border-radius: 50%;
height: 10px;
width: 40px;
text-align: center;
color: #fff;
background-color: #5b636e
}

.radio-container .radio-image-container>.other-tag>p {
font-size: .4rem
}

.radio-container .radio-image-container>.text-wrapper {
position: absolute;
height: 94px;
width: 94px;
bottom: 155px;
left: 38px;
background-color: #222831;
border-radius: 6px;
display: flex;
justify-content: center;
align-items: center
}

.radio-container .radio-image-container>.text-wrapper>.text-input-wrapper {
position: relative;
width: 90px;
height: 100%;
display: flex;
justify-content: center;
align-items: center
}

.radio-container .radio-image-container>.text-wrapper>.text-input-wrapper>input {
max-width: 100%;
background-color: transparent;
border: 0!important;
text-align: center;
color: #e0e0e0;
font-size: 1.5rem;
outline: none!important
}

.showroom-wrapper {
width: 100vw;
height: 100vh;
pointer-events: all;
font-family: nfs;
color: #fff;
display: flex;
flex-direction: column;
position: relative
}

.showroom-wrapper>.spinner-container {
position: absolute;
top: 0;
left: 0;
width: 100vw;
height: 20vh;
display: flex;
justify-content: center;
align-items: center;
margin: 0;
padding: 0
}

.showroom-wrapper>.start-container {
height: 100vh;
width: 100vw;
position: absolute;
left: 0;
top: 0;
z-index: 10
}

@-webkit-keyframes rtl {
0% {
left: 100vw
}
20% {
left: 0
}
80% {
left: 0
}
to {
left: -100vw
}
}

@keyframes rtl {
0% {
left: 100vw
}
20% {
left: 0
}
80% {
left: 0
}
to {
left: -100vw
}
}

@-webkit-keyframes ltr {
0% {
right: 100vw
}
20% {
right: 0
}
80% {
right: 0
}
to {
right: -100vw
}
}

@keyframes ltr {
0% {
right: 100vw
}
20% {
right: 0
}
80% {
right: 0
}
to {
right: -100vw
}
}

.showroom-wrapper>.start-container>.ltr, .showroom-wrapper>.start-container>.rtl {
width: 100vw;
height: 50vh;
position: absolute;
display: flex;
justify-content: center;
align-items: center
}

.showroom-wrapper>.start-container>.rtl {
top: 0;
left: 0;
-webkit-animation: rtl;
animation: rtl;
-webkit-animation-duration: 4s;
animation-duration: 4s;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1
}

.showroom-wrapper>.start-container>.ltr {
top: 50vh;
right: 0;
-webkit-animation: ltr;
animation: ltr;
-webkit-animation-duration: 4s;
animation-duration: 4s;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
position: relative
}

.showroom-wrapper>.start-container>.ltr>.watermark {
position: absolute;
width: 100%;
bottom: 8px
}

.showroom-wrapper>.start-container>.ltr>.watermark>p {
text-align: center
}

.showroom-wrapper>.main {
flex: 1 1;
display: flex;
padding: 64px 64px 16px
}

.showroom-wrapper>.main>.stats {
background-color: rgba(0, 0, 0, .5);
width: 300px;
height: 380px;
border-top: 2px solid #e43f5a;
padding: 16px 32px;
display: flex;
flex-direction: column
}

.showroom-wrapper>.main>.stats>.make-model {
display: flex;
font-size: 1.5em
}

.showroom-wrapper>.main>.stats>.make-model>.brand-container {
width: 100%;
position: relative
}

.showroom-wrapper>.main>.stats>.make-model>.brand-container>.veh-class {
color: #f2a612;
position: absolute;
top: -16px;
left: -18px;
font-size: 3.5rem
}

.showroom-wrapper>.main>.stats>.make-model>.brand-container>.brand {
text-align: right;
width: 100%;
font-weight: 700;
text-transform: uppercase;
color: #fff;
margin-bottom: 4px
}

.showroom-wrapper>.main>.stats>.make-model>.brand-container>.name {
text-align: right;
color: #c8c6ca
}

.showroom-wrapper>.main>.stats>.spacer {
flex: 1 1
}

.showroom-wrapper>.main>.stats>.personalization {
border-top: 2px solid #e43f5a;
border-bottom: 0!important
}

.showroom-wrapper>.main>.stats>.breakdowns {
margin-top: 8px;
padding-bottom: 16px
}

.showroom-wrapper>.main>.stats>.breakdowns>.breakdown {
margin-top: 16px
}

.showroom-wrapper>.main>.stats>.breakdowns>.breakdown>.name {
text-transform: uppercase;
text-shadow: 2px 2px #000
}

.showroom-wrapper>.main>.stats>.breakdowns>.breakdown>.value {
margin-top: 8px;
display: flex;
align-items: center
}

.showroom-wrapper>.main>.stats>.breakdowns>.breakdown>.value>.bg {
flex: 1 1;
background-color: #292b2a;
height: 18px;
border: 1px solid #000
}

.showroom-wrapper>.main>.stats>.breakdowns>.breakdown>.value>.bg>.fill {
height: 100%;
background-color: #c8c6ca;
transition: width .8s ease
}

.showroom-wrapper>.main>.stats>.breakdowns>.breakdown>.value>.actual {
background-color: #c8c6ca;
color: #000;
padding: 4px 8px;
width: 38px;
text-align: center;
border: 1px solid #000
}

.showroom-wrapper>.main>.stats>.features {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex: 1 1
}

.showroom-wrapper>.main>.stats>.features>.feature {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
min-width: 68px;
max-width: 68px;
margin: 16px 8px 0
}

.showroom-wrapper>.main>.stats>.features>.feature:first-child, .showroom-wrapper>.main>.stats>.features>.feature:nth-child(4) {
margin-left: 0
}

.showroom-wrapper>.main>.stats>.features>.feature:nth-child(3) {
margin-right: 0
}

.showroom-wrapper>.main>.stats>.features>.feature>.value {
padding: 16px 0;
background-color: #c8c6ca;
color: #000;
width: 100%;
font-size: 2em;
text-align: center
}

.showroom-wrapper>.main>.stats>.features>.feature>.title {
color: #c8c6ca;
background-color: #000;
text-align: center;
padding: 4px;
width: 100%
}

.showroom-wrapper>.main>.selector-container {
display: flex;
flex-direction: column;
flex: 1 1;
margin-left: 32px;
color: #c8c6ca;
text-shadow: 2px 2px #000
}

.showroom-wrapper>.main>.selector-container>.class-selector {
display: flex;
justify-content: space-between
}

.showroom-wrapper>.main>.selector-container>.class-selector>.available-classes {
display: flex;
font-size: 2rem
}

.showroom-wrapper>.main>.selector-container>.class-selector>.available-classes>.veh-class {
cursor: pointer;
margin-right: 32px
}

.showroom-wrapper>.main>.selector-container>.class-selector>.available-classes>.veh-class-selected {
color: #f2a612
}

.showroom-wrapper>.main>.selector-container>.class-selector>.price {
font-size: 3em;
color: #f2a612;
text-align: right
}

.showroom-wrapper>.main>.selector-container>.selector-spacer {
flex: 1 1
}

#purchase{
position: relative;
}

.showroom-wrapper>.main>.selector-container>.selector {
width: 100%;
font-size: 1.25em;
display: flex;
flex-direction: column;
padding: 16px
}

.showroom-wrapper>.main>.selector-container>.selector>div {
flex: 1 1;
padding: 0 8px;
margin-bottom: 16px
}

.showroom-wrapper>.main>.selector-container>.selector>div:last-child {
margin-bottom: 0
}

.showroom-wrapper>.main>.selector-container>.selector>.position-container {
font-size: 1.3em
}

.showroom-wrapper>.main>.selector-container>.selector>.mclass-selector {
display: flex
}

.showroom-wrapper>.main>.selector-container>.selector>.mclass-selector>.mclass {
margin: 0 16px;
padding: 4px 8px;
color: #c8c6ca;
text-shadow: 2px 2px #000;
cursor: pointer
}

.showroom-wrapper>.main>.selector-container>.selector>.mclass-selector>.mclass:first-child {
margin-left: 0;
padding-left: 0
}

.showroom-wrapper>.main>.selector-container>.selector>.mclass-selector>.mclass-selected {
color: #f2a612
}

.showroom-wrapper>.showcase {
width: 100%;
padding: 4px 64px;
display: flex;
align-items: center;
position: relative;
height: 148px;
min-height: 152px
}

.showroom-wrapper>.showcase>.car-container {
height: 140px;
min-width: 252px;
background-color: #000;
margin-right: 32px;
padding: 8px 16px;
font-size: 1.25em;
border-bottom: 4px solid #c8c6ca;
display: flex;
flex-direction: column;
position: absolute;
transition: all .4s ease;
background-size: 75%;
background-position: 50%;
background-repeat: no-repeat
}

.showroom-wrapper>.showcase>.car-container>.top {
text-align: right;
color: #c8c6ca;
position: relative
}

.showroom-wrapper>.showcase>.car-container>.top>.limited {
width: 252px;
height: 140px;
position: absolute;
left: -16px;
top: -8px;
background-color: rgba(0, 0, 0, .75);
display: flex;
align-items: center;
justify-content: center;
color: #5d5d5d
}

.showroom-wrapper>.showcase>.car-container>.middle {
flex: 1 1;
display: flex;
align-items: center;
justify-content: center
}

.showroom-wrapper>.showcase>.car-container>.bottom {
display: flex;
justify-content: space-between;
color: #c8c6ca
}

.showroom-wrapper>.showcase>.car-container-selected {
border-bottom: 4px solid #f2a612;
box-shadow: none
}

.showroom-wrapper>.showcase>.car-container-selected>.top {
color: #f2a612
}

.showroom-wrapper>.actions {
height: 64px;
display: flex;
justify-content: center;
align-items: center
}

.showroom-wrapper>.actions>.btn {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
color: #c8c6ca;
padding: 8px;
margin: 0 8px;
width: 120px;
font-size: 1.2em;
text-align: center;
text-transform: uppercase;
text-shadow: 2px 2px #000;
cursor: pointer
}


@-webkit-keyframes glow {
0%, to {
box-shadow: 0 0 .5787vh #fff, 0 -.69444vh 3.47222vh #00e7ff, -.69444vh .69444vh 3.47222vh #ff00e7, .69444vh .69444vh 3.47222vh #e7ff00
}
33% {
box-shadow: 0 0 .5787vh #fff, 0 -.69444vh 3.47222vh #ff00e7, -.69444vh .69444vh 3.47222vh #e7ff00, .69444vh .69444vh 3.47222vh #00e7ff
}
66% {
box-shadow: 0 0 .5787vh #fff, 0 -.69444vh 3.47222vh #e7ff00, -.69444vh .69444vh 3.47222vh #00e7ff, .69444vh .69444vh 3.47222vh #ff00e7
}
}

@keyframes glow {
0%, to {
box-shadow: 0 0 .5787vh #fff, 0 -.69444vh 3.47222vh #00e7ff, -.69444vh .69444vh 3.47222vh #ff00e7, .69444vh .69444vh 3.47222vh #e7ff00
}
33% {
box-shadow: 0 0 .5787vh #fff, 0 -.69444vh 3.47222vh #ff00e7, -.69444vh .69444vh 3.47222vh #e7ff00, .69444vh .69444vh 3.47222vh #00e7ff
}
66% {
box-shadow: 0 0 .5787vh #fff, 0 -.69444vh 3.47222vh #e7ff00, -.69444vh .69444vh 3.47222vh #00e7ff, .69444vh .69444vh 3.47222vh #ff00e7
}
}

@-webkit-keyframes flip-over {
0% {
transform: rotateY(0deg)
}
to {
transform: rotateY(-1turn)
}
}

@keyframes flip-over {
0% {
transform: rotateY(0deg)
}
to {
transform: rotateY(-1turn)
}
}

.card-sleeve {
line-height: 0;
perspective: 55.55556vh;
perspective-origin: 50%
}

.card-sleeve:hover {
z-index: 1
}

.card-sleeve--fade {
pointer-events: none
}

.card-sleeve--fade .card {
opacity: .25;
-webkit-filter: saturate(.25) blur(.27778vh);
filter: saturate(.25) blur(.27778vh)
}

.card-sleeve--fade .card-sleeve__new {
opacity: 0
}

.card-sleeve--graded {
padding: 6.25vh .83333vh 1.66667vh
}

.card-sleeve__count, .card-sleeve__new {
z-index: 1;
pointer-events: none;
text-align: center;
border-radius: 1.11111vh;
position: absolute
}

.card-sleeve__new {
border: .13889vh dashed #ff4081;
border-top-width: 0;
border-radius: .20833vh .20833vh .48611vh .48611vh;
inset: .48611vh .69444vh .34722vh .69444vh
}

.card-sleeve__count {
top: -.41667vh;
right: -.20833vh;
padding: .34722vh;
min-width: 1.66667vh;
min-height: 1.66667vh;
font-family: Arial, sans-serif;
font-size: .97222vh;
font-weight: 700;
line-height: .97222vh;
background-color: #222831;
color: #aed581
}

.card {
position: relative;
perspective: 55.55556vh;
perspective-origin: 50%;
width: 16.66667vh;
height: 23.05556vh;
margin: 0 2.22222vh;
transition: .25s;
font-size: 0;
line-height: 0
}

.card__back, .card__front, .card__front-burnt {
pointer-events: none;
z-index: -1;
transition: .25s;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
content: "";
display: block;
background-repeat: no-repeat;
background-size: 141% auto;
background-position: top;
-webkit-backface-visibility: hidden;
backface-visibility: hidden
}

.card__back img {
width: 100%;
height: auto
}

.card__front, .card__front-burnt {
transform: rotateY(180deg)
}

.card__front-burnt img, .card__front img {
width: 100%;
height: auto
}

.card--common .card__front-burnt .card__front-wrapper:before, .card--common .card__front:before, .card--promo .card__front-burnt .card__front-wrapper:before, .card--promo .card__front:before, .card--rare .card__front-burnt .card__front-wrapper:before, .card--rare .card__front:before, .card--secret .card__front-burnt .card__front-wrapper:before, .card--secret .card__front:before, .card--uncommon .card__front-burnt .card__front-wrapper:before, .card--uncommon .card__front:before {
position: absolute;
content: "#" attr(data-number);
z-index: 1;
bottom: 1.52778vh;
right: 2.22222vh;
font-size: .76389vh;
font-family: Arial, sans-serif;
font-weight: 700
}

.card--common .card__front-burnt .card__front-wrapper:after, .card--common .card__front:after, .card--promo .card__front-burnt .card__front-wrapper:after, .card--promo .card__front:after, .card--rare .card__front-burnt .card__front-wrapper:after, .card--rare .card__front:after, .card--secret .card__front-burnt .card__front-wrapper:after, .card--secret .card__front:after, .card--uncommon .card__front-burnt .card__front-wrapper:after, .card--uncommon .card__front:after {
content: "";
z-index: 1;
display: block;
width: .69444vh;
height: .69444vh;
position: absolute;
bottom: 1.18056vh;
right: 1.18056vh;
background-repeat: no-repeat;
background-size: contain
}

.card--common.no-number .card__front-burnt .card__front-wrapper:before, .card--common.no-number .card__front:before, .card--common.no-rarity .card__front-burnt .card__front-wrapper:after, .card--common.no-rarity .card__front:after, .card--promo.no-number .card__front-burnt .card__front-wrapper:before, .card--promo.no-number .card__front:before, .card--promo.no-rarity .card__front-burnt .card__front-wrapper:after, .card--promo.no-rarity .card__front:after, .card--rare.no-number .card__front-burnt .card__front-wrapper:before, .card--rare.no-number .card__front:before, .card--rare.no-rarity .card__front-burnt .card__front-wrapper:after, .card--rare.no-rarity .card__front:after, .card--secret.no-number .card__front-burnt .card__front-wrapper:before, .card--secret.no-number .card__front:before, .card--secret.no-rarity .card__front-burnt .card__front-wrapper:after, .card--secret.no-rarity .card__front:after, .card--uncommon.no-number .card__front-burnt .card__front-wrapper:before, .card--uncommon.no-number .card__front:before, .card--uncommon.no-rarity .card__front-burnt .card__front-wrapper:after, .card--uncommon.no-rarity .card__front:after {
display: none
}

.card--common.card--alt-white .card__front-burnt .card__front-wrapper:after, .card--common.card--alt-white .card__front-burnt .card__front-wrapper:before, .card--common.card--alt-white .card__front:after, .card--common.card--alt-white .card__front:before, .card--common.card--corleone-steaks .card__front-burnt .card__front-wrapper:after, .card--common.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--common.card--corleone-steaks .card__front:after, .card--common.card--corleone-steaks .card__front:before, .card--common.card--white .card__front-burnt .card__front-wrapper:after, .card--common.card--white .card__front-burnt .card__front-wrapper:before, .card--common.card--white .card__front:after, .card--common.card--white .card__front:before, .card--promo.card--alt-white .card__front-burnt .card__front-wrapper:after, .card--promo.card--alt-white .card__front-burnt .card__front-wrapper:before, .card--promo.card--alt-white .card__front:after, .card--promo.card--alt-white .card__front:before, .card--promo.card--corleone-steaks .card__front-burnt .card__front-wrapper:after, .card--promo.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--promo.card--corleone-steaks .card__front:after, .card--promo.card--corleone-steaks .card__front:before, .card--promo.card--white .card__front-burnt .card__front-wrapper:after, .card--promo.card--white .card__front-burnt .card__front-wrapper:before, .card--promo.card--white .card__front:after, .card--promo.card--white .card__front:before, .card--rare.card--alt-white .card__front-burnt .card__front-wrapper:after, .card--rare.card--alt-white .card__front-burnt .card__front-wrapper:before, .card--rare.card--alt-white .card__front:after, .card--rare.card--alt-white .card__front:before, .card--rare.card--corleone-steaks .card__front-burnt .card__front-wrapper:after, .card--rare.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--rare.card--corleone-steaks .card__front:after, .card--rare.card--corleone-steaks .card__front:before, .card--rare.card--white .card__front-burnt .card__front-wrapper:after, .card--rare.card--white .card__front-burnt .card__front-wrapper:before, .card--rare.card--white .card__front:after, .card--rare.card--white .card__front:before, .card--secret.card--alt-white .card__front-burnt .card__front-wrapper:after, .card--secret.card--alt-white .card__front-burnt .card__front-wrapper:before, .card--secret.card--alt-white .card__front:after, .card--secret.card--alt-white .card__front:before, .card--secret.card--corleone-steaks .card__front-burnt .card__front-wrapper:after, .card--secret.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--secret.card--corleone-steaks .card__front:after, .card--secret.card--corleone-steaks .card__front:before, .card--secret.card--white .card__front-burnt .card__front-wrapper:after, .card--secret.card--white .card__front-burnt .card__front-wrapper:before, .card--secret.card--white .card__front:after, .card--secret.card--white .card__front:before, .card--uncommon.card--alt-white .card__front-burnt .card__front-wrapper:after, .card--uncommon.card--alt-white .card__front-burnt .card__front-wrapper:before, .card--uncommon.card--alt-white .card__front:after, .card--uncommon.card--alt-white .card__front:before, .card--uncommon.card--corleone-steaks .card__front-burnt .card__front-wrapper:after, .card--uncommon.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--uncommon.card--corleone-steaks .card__front:after, .card--uncommon.card--corleone-steaks .card__front:before, .card--uncommon.card--white .card__front-burnt .card__front-wrapper:after, .card--uncommon.card--white .card__front-burnt .card__front-wrapper:before, .card--uncommon.card--white .card__front:after, .card--uncommon.card--white .card__front:before {
-webkit-filter: invert(1);
filter: invert(1)
}

.card--common.card--alt-white .card__front-burnt .card__front-wrapper:before, .card--common.card--alt-white .card__front:before, .card--common.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--common.card--corleone-steaks .card__front:before, .card--common.card--mayor-june-2021 .card__front-burnt .card__front-wrapper:before, .card--common.card--mayor-june-2021 .card__front:before, .card--promo.card--alt-white .card__front-burnt .card__front-wrapper:before, .card--promo.card--alt-white .card__front:before, .card--promo.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--promo.card--corleone-steaks .card__front:before, .card--promo.card--mayor-june-2021 .card__front-burnt .card__front-wrapper:before, .card--promo.card--mayor-june-2021 .card__front:before, .card--rare.card--alt-white .card__front-burnt .card__front-wrapper:before, .card--rare.card--alt-white .card__front:before, .card--rare.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--rare.card--corleone-steaks .card__front:before, .card--rare.card--mayor-june-2021 .card__front-burnt .card__front-wrapper:before, .card--rare.card--mayor-june-2021 .card__front:before, .card--secret.card--alt-white .card__front-burnt .card__front-wrapper:before, .card--secret.card--alt-white .card__front:before, .card--secret.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--secret.card--corleone-steaks .card__front:before, .card--secret.card--mayor-june-2021 .card__front-burnt .card__front-wrapper:before, .card--secret.card--mayor-june-2021 .card__front:before, .card--uncommon.card--alt-white .card__front-burnt .card__front-wrapper:before, .card--uncommon.card--alt-white .card__front:before, .card--uncommon.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--uncommon.card--corleone-steaks .card__front:before, .card--uncommon.card--mayor-june-2021 .card__front-burnt .card__front-wrapper:before, .card--uncommon.card--mayor-june-2021 .card__front:before {
top: 1.59722vh;
right: 1.38889vh;
bottom: auto
}

.card--common.card--alt-white .card__front-burnt .card__front-wrapper:after, .card--common.card--alt-white .card__front:after, .card--common.card--corleone-steaks .card__front-burnt .card__front-wrapper:after, .card--common.card--corleone-steaks .card__front:after, .card--common.card--mayor-june-2021 .card__front-burnt .card__front-wrapper:after, .card--common.card--mayor-june-2021 .card__front:after, .card--promo.card--alt-white .card__front-burnt .card__front-wrapper:after, .card--promo.card--alt-white .card__front:after, .card--promo.card--corleone-steaks .card__front-burnt .card__front-wrapper:after, .card--promo.card--corleone-steaks .card__front:after, .card--promo.card--mayor-june-2021 .card__front-burnt .card__front-wrapper:after, .card--promo.card--mayor-june-2021 .card__front:after, .card--rare.card--alt-white .card__front-burnt .card__front-wrapper:after, .card--rare.card--alt-white .card__front:after, .card--rare.card--corleone-steaks .card__front-burnt .card__front-wrapper:after, .card--rare.card--corleone-steaks .card__front:after, .card--rare.card--mayor-june-2021 .card__front-burnt .card__front-wrapper:after, .card--rare.card--mayor-june-2021 .card__front:after, .card--secret.card--alt-white .card__front-burnt .card__front-wrapper:after, .card--secret.card--alt-white .card__front:after, .card--secret.card--corleone-steaks .card__front-burnt .card__front-wrapper:after, .card--secret.card--corleone-steaks .card__front:after, .card--secret.card--mayor-june-2021 .card__front-burnt .card__front-wrapper:after, .card--secret.card--mayor-june-2021 .card__front:after, .card--uncommon.card--alt-white .card__front-burnt .card__front-wrapper:after, .card--uncommon.card--alt-white .card__front:after, .card--uncommon.card--corleone-steaks .card__front-burnt .card__front-wrapper:after, .card--uncommon.card--corleone-steaks .card__front:after, .card--uncommon.card--mayor-june-2021 .card__front-burnt .card__front-wrapper:after, .card--uncommon.card--mayor-june-2021 .card__front:after {
right: 3.33333vh;
bottom: .97222vh
}

.card--common.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--common.card--corleone-steaks .card__front:before, .card--promo.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--promo.card--corleone-steaks .card__front:before, .card--rare.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--rare.card--corleone-steaks .card__front:before, .card--secret.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--secret.card--corleone-steaks .card__front:before, .card--uncommon.card--corleone-steaks .card__front-burnt .card__front-wrapper:before, .card--uncommon.card--corleone-steaks .card__front:before {
top: 1.52778vh;
right: 2.63889vh
}

.card--common.card--vlc .card__front-burnt .card__front-wrapper:before, .card--common.card--vlc .card__front:before, .card--promo.card--vlc .card__front-burnt .card__front-wrapper:before, .card--promo.card--vlc .card__front:before, .card--rare.card--vlc .card__front-burnt .card__front-wrapper:before, .card--rare.card--vlc .card__front:before, .card--secret.card--vlc .card__front-burnt .card__front-wrapper:before, .card--secret.card--vlc .card__front:before, .card--uncommon.card--vlc .card__front-burnt .card__front-wrapper:before, .card--uncommon.card--vlc .card__front:before {
top: 1.59722vh;
right: 1.80556vh;
bottom: auto;
color: #fff
}

.card--common.card--vlc .card__front-burnt .card__front-wrapper:after, .card--common.card--vlc .card__front:after, .card--promo.card--vlc .card__front-burnt .card__front-wrapper:after, .card--promo.card--vlc .card__front:after, .card--rare.card--vlc .card__front-burnt .card__front-wrapper:after, .card--rare.card--vlc .card__front:after, .card--secret.card--vlc .card__front-burnt .card__front-wrapper:after, .card--secret.card--vlc .card__front:after, .card--uncommon.card--vlc .card__front-burnt .card__front-wrapper:after, .card--uncommon.card--vlc .card__front:after {
right: 1.94444vh;
bottom: 1.18056vh;
-webkit-filter: invert(1);
filter: invert(1)
}

.card--common .card__front-burnt .card__front-wrapper:after, .card--common .card__front:after {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

)
}

.card--uncommon .card__front-burnt .card__front-wrapper:after, .card--uncommon .card__front:after {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

)
}

.card--rare .card__front-burnt .card__front-wrapper:after, .card--rare .card__front:after {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

)
}

.card--promo .card__front-burnt .card__front-wrapper:after, .card--promo .card__front:after, .card--secret .card__front-burnt .card__front-wrapper:after, .card--secret .card__front:after {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

)
}

.card--boe-promo .card__front-burnt .card__front-wrapper:before, .card--boe-promo .card__front:before {
color: #000;
bottom: 1.38889vh;
right: 1.66667vh;
z-index: 2;
content: attr(data-number);
width: 1.66667vh;
height: 1.66667vh;
line-height: 1.52778vh;
text-align: center
}

.card--boe-promo .card__front-burnt .card__front-wrapper:after, .card--boe-promo .card__front:after {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

bottom: 1.38889vh;
right: 1.66667vh;
width: 1.66667vh;
height: 1.66667vh
}

.card--holo:not(.active):before {
content: "";
z-index: -1;
position: absolute;
top: 1.11111vh;
right: 1.11111vh;
bottom: 1.11111vh;
left: 1.11111vh;
transition: .25s;
-webkit-animation: glow 2s linear infinite;
animation: glow 2s linear infinite;
opacity: 0
}

.card--holo:not(.active):hover:before {
opacity: 1
}

.card.active .card__back {
transform: rotateY(-180deg)
}

.card.active .card__front, .card.active .card__front-burnt {
transform: rotateY(0deg)
}

.card__holo {
position: absolute;
left: 0;
right: 0;
bottom: 0;
top: 0;
opacity: .5;
background-image: linear-gradient(115deg, transparent, #00e7ff 20%, #ff00e7 40%, transparent 50%, #00e7ff 60%, #ff00e7 80%, transparent);
background-size: 200% 200%;
mix-blend-mode: color-dodge
}

.card__holo--holo {
left: 2.08333vh;
right: 2.08333vh;
bottom: 8.75vh;
top: 3.05556vh;
background-size: 275% 275%
}

.card--full-art .card__holo--holo {
top: 0;
right: 0;
bottom: -.06944vh;
left: 0;
overflow: hidden;
border-radius: .90278vh
}

.card--alt-white .card__holo--holo, .card--corleone-steaks .card__holo--holo, .card--mayor-june-2021 .card__holo--holo, .card--vlc .card__holo--holo {
top: .10417vh;
right: .10417vh;
bottom: .10417vh;
left: .10417vh;
overflow: hidden;
border-radius: .69444vh
}

.card__holo--holo .card--boe-promo {
top: .10417vh;
right: .10417vh;
bottom: .10417vh;
left: .10417vh;
overflow: hidden;
border-radius: .55556vh
}

.card__holo--reverse {
left: -.06944vh;
border-radius: .83333vh;
overflow: hidden;
-webkit-clip-path: polygon(6.2% 4%, 6.2% 96%, 11.2% 96%, 11.2% 11.6%, 89.2% 11.6%, 89.2% 63.6%, 11.2% 63.6%, 11.2% 96%, 94% 96%, 94.1% 4%);
clip-path: polygon(6.2% 4%, 6.2% 96%, 11.2% 96%, 11.2% 11.6%, 89.2% 11.6%, 89.2% 63.6%, 11.2% 63.6%, 11.2% 96%, 94% 96%, 94.1% 4%)
}

.card__holo:before {
content: "";
position: absolute;
inset: 0;
opacity: .75;
background-color: #000;
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

background-position: 50%;
background-size: 180%;
mix-blend-mode: color-dodge
}

.binder--no-sparkles .card__holo:before {
background-image: none
}

.card__corners, .card__edge, .card__surface {
position: absolute;
inset: 0;
background-size: contain;
background-position: top;
background-repeat: no-repeat
}

.card__surface--1 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__surface--2 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__surface--3 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__surface--4 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__surface--5 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .9
}

.card__surface--6 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .8
}

.card__surface--7 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .7
}

.card__surface--8 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .6
}

.card__surface--9 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .5
}

.card__edge--1 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__edge--2 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__edge--3 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__edge--4 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__edge--5 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .9
}

.card__edge--6 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .8
}

.card__edge--7 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .7
}

.card__edge--8 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .6
}

.card__edge--9 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .5
}

.card__corners--1 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__corners--2 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__corners--3 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__corners--4 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: 1
}

.card__corners--5 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .9
}

.card__corners--6 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .8
}

.card__corners--7 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .7
}

.card__corners--8 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .6
}

.card__corners--9 {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .5
}

.card__centering {
position: absolute;
right: .97222vh;
left: .97222vh;
bottom: .90278vh;
top: .90278vh;
border: 0 solid #fff13c
}

.card__centering--1 {
border-width: .27778vh 0 0 .34722vh
}

.card__centering--2 {
border-width: 0 .27778vh .27778vh 0
}

.card__centering--3 {
border-width: 0 0 .20833vh .27778vh
}

.card__centering--4 {
border-width: 0 .20833vh .20833vh 0
}

.card__centering--5 {
border-width: .13889vh .20833vh 0 0
}

.card__centering--6 {
border-width: .13889vh 0 0 .13889vh
}

.card__centering--7 {
border-width: .06944vh .13889vh 0 0
}

.card__centering--8 {
border-width: 0 .06944vh .06944vh 0
}

.card__centering--9 {
border-width: 0 0 0 .06944vh
}

.card__centering--10 {
opacity: 0
}

.card__marked-for-sale {
position: absolute;
bottom: -15px;
left: calc(50% - 15px);
z-index: 5;
width: 30px;
height: 30px;
border-radius: 30px;
background-color: #30475e;
color: #95ef77;
line-height: 32px;
font-size: 18px;
text-align: center
}

.card__case {
transition: .25s;
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

background-repeat: no-repeat;
background-size: contain;
background-position: 50%;
position: absolute;
inset: -7.84722vh -1.45833vh -1.66667vh;
z-index: 4;
pointer-events: none
}

.card__case-details {
font-family: Arial, sans-serif;
font-size: .97222vh;
line-height: 1.1;
position: absolute;
top: 1.875vh;
white-space: nowrap
}

.card__case-details.left {
left: 1.73611vh;
width: calc(75% - 1.73611vh);
text-align: left
}

.card__case-details.right {
right: 1.73611vh;
width: calc(57.5% - 1.73611vh);
text-align: right
}

.card__case--perfect {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

)
}

.card__case--perfect .card__case-details {
color: #fff
}

.card--burnt-1 .card__burn {
-webkit-mask-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

-webkit-mask-size: contain
}

.card--burnt-1 .card__burn:after {
content: "";
position: absolute;
inset: 0;
mix-blend-mode: multiply;
opacity: .9;
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

background-size: contain
}

.card--burnt-2 .card__burn {
-webkit-mask-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

-webkit-mask-size: contain
}

.card--burnt-2 .card__burn:after {
content: "";
position: absolute;
inset: 0;
mix-blend-mode: multiply;
opacity: .9;
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

background-size: contain
}

.card--burnt-3 .card__burn {
-webkit-mask-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

-webkit-mask-size: contain
}

.card--burnt-3 .card__burn:after {
content: "";
position: absolute;
inset: 0;
mix-blend-mode: multiply;
opacity: .9;
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

background-size: contain
}

.card--burnt-4 .card__burn {
-webkit-mask-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

-webkit-mask-size: contain
}

.card--burnt-4 .card__burn:after {
content: "";
position: absolute;
inset: 0;
mix-blend-mode: multiply;
opacity: .9;
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

background-size: contain
}

.card--burn .card__front {
-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
-webkit-animation: burn-hide 5s linear forwards;
animation: burn-hide 5s linear forwards;
-webkit-animation-delay: 1.9s;
animation-delay: 1.9s
}

.fire {
pointer-events: none
}

.fire video {
position: absolute;
width: 202%;
height: 202%;
left: -51.25%;
bottom: -17.75%
}

@-webkit-keyframes burn-hide {
0% {
-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)
}
to {
-webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 -10%);
clip-path: polygon(0 0, 100% 0, 100% 0, 0 -10%)
}
}

@keyframes burn-hide {
0% {
-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)
}
to {
-webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 -10%);
clip-path: polygon(0 0, 100% 0, 100% 0, 0 -10%)
}
}

.card-spread {
width: 100%;
max-height: 100%
}

.card-spread__wrapper {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-end;
max-width: 85%;
padding-top: 16.66667vh;
padding-bottom: 16.66667vh;
margin-right: auto;
margin-left: auto
}

.tutorial {
position: fixed;
z-index: 100000;
top: 0;
right: calc((100vw - 177.77778vh)/2);
bottom: 0;
left: calc((100vw - 177.77778vh)/2);
background-color: rgba(34, 40, 49, .75)
}

.tutorial__bubble {
position: absolute;
background-color: #30475e;
color: #e0e0e0;
padding: 1.66667vh 2.5vh;
border-radius: .41667vh
}

.tutorial button, .tutorial p {
font-family: Arial, sans-serif
}

.tutorial p {
font-size: 1.66667vh;
margin-bottom: 1.11111vh
}

.tutorial button {
display: block;
margin-left: auto;
background: transparent;
border: none;
font-size: 1.11111vh;
padding: 0;
color: #e0e0e0;
text-decoration: underline
}

.binder-hider {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 12.5vh
}

.binder-hider:hover+.binder {
opacity: .1
}

.binder {
position: fixed;
z-index: 999;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
width: 138.66667vh;
height: 80vh;
border-radius: 1.11111vh;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
transition: .25s;
box-shadow: 0 0 .34722vh rgba(12, 12, 12, .95), 0 0 .69444vh rgba(12, 12, 12, .95);
background-color: #28140a;
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

background-size: cover;
background-position: 50%
}

.binder:after, .binder:before {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
border-radius: 1.11111vh;
pointer-events: none
}

.binder:before {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

opacity: .25
}

.binder:after {
box-shadow: inset 0 0 .34722vh rgba(12, 12, 12, .95), inset 0 0 1.04167vh rgba(12, 12, 12, .95), inset 0 0 2.43056vh rgba(12, 12, 12, .95);
z-index: 100
}

.binder h4 {
margin-bottom: 2.22222vh
}

.binder__name {
font-size: 3.33333vh;
transform: translateX(-50%) translateY(-50%) rotate(90deg) translateY(-50%) translateY(1px);
color: #c8c6ca;
background-image: linear-gradient(90deg, #aed581, #4dd0e1 33.333%, #ff4081 66.666%, #ffa726);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent
}

.binder__id, .binder__name {
font-family: "PT Mono", monospace;
line-height: 1;
position: absolute;
top: 50%;
left: 50%;
padding: .27778vh .41667vh
}

.binder__id {
font-size: 1.11111vh;
transform: translateX(-50%) translateY(-50%) rotate(90deg) translateY(50%) translateY(-13px);
color: hsla(0, 0%, 87.8%, .5)
}

.binder__tabs {
display: flex;
flex-direction: column;
text-align: center;
margin-right: auto;
margin-left: auto;
font-family: Arial, sans-serif;
font-size: 1.66667vh;
text-transform: capitalize;
position: absolute;
top: 3.33333vh;
bottom: 3.33333vh;
left: calc(100% - 1px)
}

.binder__tab {
position: relative;
padding: .83333vh;
background-color: #222831;
color: #c8c6ca;
border-radius: 0 .83333vh .83333vh 0;
margin-top: .83333vh;
margin-bottom: .83333vh;
transition: .25s;
box-shadow: inset -1px 0 3px #222831
}

.binder__tab[data-tooltip]:after {
content: attr(data-tooltip);
background-color: #e0e0e0;
color: #222831;
position: absolute;
top: -.55556vh;
left: 75%;
border-radius: .41667vh;
padding: .27778vh .55556vh;
font-size: .97222vh;
font-weight: 700;
opacity: 0;
transition: .25s
}

.binder__tab[data-tooltip]:hover:after {
opacity: 1
}

.binder__tab.active {
background-color: #e0e0e0;
color: #222831
}

.binder__tab.active[data-tooltip]:after {
background-color: #222831;
color: #c8c6ca
}

.binder__filter {
position: absolute;
top: 100%;
right: 0;
left: 0;
display: flex;
justify-content: center
}

.binder .filter {
margin-right: 6.66667vh
}

.binder .filter__tab {
display: inline-block;
position: relative;
padding: .83333vh;
background-color: #222831;
color: #c8c6ca;
border-radius: 0 0 .83333vh .83333vh;
margin-right: .83333vh;
margin-left: .83333vh;
transition: .25s;
box-shadow: inset 0 -1px 3px #222831;
font-family: Arial, sans-serif;
font-size: 1.11111vh
}

.binder .filter__tab .input-wrapper, .binder .filter__tab i {
vertical-align: middle
}

.binder .filter__tab .input-wrapper {
display: inline-block
}

.binder .filter__tab[data-tooltip]:after {
content: attr(data-tooltip);
background-color: #e0e0e0;
color: #222831;
position: absolute;
bottom: -1.11111vh;
left: 50%;
transform: translateX(-50%);
border-radius: .41667vh;
padding: .27778vh .55556vh;
font-size: .97222vh;
font-weight: 700;
opacity: 0;
transition: .25s;
z-index: 10
}

.binder .filter__tab[data-tooltip]:hover:after {
opacity: 1
}

.binder .filter__tab.active {
background-color: #e0e0e0;
color: #222831
}

.binder .filter__tab.active[data-tooltip]:after {
background-color: #222831;
color: #c8c6ca
}

.binder .filter--search .filter__tab {
padding-top: 0;
padding-bottom: .41667vh
}

.binder__wrapper {
width: 100%
}

.binder__spread {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 10;
background: rgba(34, 40, 49, .9);
border-radius: 1.11111vh;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
overflow: scroll;
box-sizing: border-box;
-webkit-animation: fade-in .5s;
animation: fade-in .5s
}

.binder__info {
position: fixed;
padding: 1.11111vh 1.66667vh;
bottom: 0;
right: 0;
background: rgba(34, 40, 49, .85);
font-family: Arial, serif;
font-size: 1.25vh;
line-height: 1;
color: #e0e0e0;
text-align: left;
border-radius: 1.11111vh 0 1.11111vh 0
}

.binder__info svg {
height: 2.5vh;
margin-right: .55556vh;
vertical-align: middle
}

.binder__info-control:notlast-child) {
margin-bottom: .83333vh
}

.binder__page {
width: 134.22222vh;
max-height: 80vh;
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
overflow: auto;
margin-right: auto;
margin-left: auto;
padding-top: 1.66667vh;
padding-bottom: 1.66667vh
}

.binder__page .card-sleeve {
padding: 1.11111vh;
box-sizing: border-box
}

.binder__page .card-sleeve:after, .binder__page .card-sleeve:before {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
background-repeat: no-repeat;
background-size: contain;
background-position: bottom
}

.binder__page .card-sleeve:before {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

)
}

.binder__page .card-sleeve:after {
background-image: url(

Linkleri,görmek için Giriş yap veya üye ol.

)
}

.binder__page .card-sleeve:nth-child(6n+3) {
margin-right: auto
}

.binder__page .card-sleeve:nth-child(6n+4) {
margin-left: auto
}

.binder__page .card-sleeve:hover .card {
transform: translateY(-1.04167vh)
}

.binder__page--settings {
color: #fff
}

.binder__page--settings hr {
border: none;
border-bottom: 2px solid #30475e
}

.binder__page--settings>div {
display: flex;
justify-content: space-around;
width: 100%
}

.binder__page--settings>div>div {
width: 45%;
padding-right: 2.22222vh;
padding-left: 2.22222vh
}

.binder .card-sleeve {
margin: .97222vh
}

.binder .card-sleeve:not(.card-sleeve--fade) .card {
-webkit-filter: none;
filter: none
}

.binder .card {
margin: 0;
transition: 125ms
}

.binder--spread .binder__page .card-sleeve {
-webkit-filter: blur(.27778vh);
filter: blur(.27778vh)
}

.tcg-card {
display: flex;
align-items: center;
width: 100vw;
height: 100vh
}

.tcg-card--display-case {
justify-content: center
}

.tcg-card--show {
justify-content: flex-start;
transform: scale(1.5);
transform-origin: left center
}

.tcg-card__headline {
top: 25vh;
color: #95ef77;
text-shadow: 0 .13889vh .27778vh #222831;
font-weight: 600;
font-size: 3.33333vh
}

.tcg-card__headline, .tcg-card__tip {
position: fixed;
font-family: Arial, sans-serif
}

.tcg-card__tip {
bottom: 25vh;
background: #95ef77;
color: #222831;
display: inline-block;
margin-left: auto;
margin-right: auto;
padding: .27778vh .41667vh;
border-radius: .27778vh;
font-size: 1.11111vh;
font-weight: 700
}

.tcg-packopening-wrapper {
position: fixed;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
min-width: 126.59722vh;
height: 23.05556vh;
display: flex;
justify-content: center;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}

.tcg-packopening-wrapper .card-sleeve:first-child, .tcg-packopening-wrapper .card-sleeve:nth-child(2), .tcg-packopening-wrapper .card-sleeve:nth-child(3) {
transform-origin: bottom left
}

.tcg-packopening-wrapper .card-sleeve:nth-child(4), .tcg-packopening-wrapper .card-sleeve:nth-child(5), .tcg-packopening-wrapper .card-sleeve:nth-child(6), .tcg-packopening-wrapper .card-sleeve:nth-child(7) {
transform-origin: bottom right
}

.tcg-packopening-wrapper .card-sleeve:first-child {
transform: translateY(50vh) translateY(150%) translateX(300%) rotate(-25deg);
-webkit-animation: fly-in-1 .5s linear forwards;
animation: fly-in-1 .5s linear forwards;
-webkit-animation-delay: 50ms;
animation-delay: 50ms
}

.tcg-packopening-wrapper .card-sleeve:nth-child(2) {
transform: translateY(50vh) translateY(150%) translateX(175%) rotate(-25deg);
-webkit-animation: fly-in-2 .5s linear forwards;
animation: fly-in-2 .5s linear forwards;
-webkit-animation-delay: 25ms;
animation-delay: 25ms
}

.tcg-packopening-wrapper .card-sleeve:nth-child(3) {
transform: translateY(50vh) translateY(150%) translateX(50%) rotate(-15deg);
-webkit-animation: fly-in-3 .5s linear forwards;
animation: fly-in-3 .5s linear forwards
}

.tcg-packopening-wrapper .card-sleeve:nth-child(4) {
transform: translateY(50vh) translateY(150%) translateX(-50%) rotate(15deg);
-webkit-animation: fly-in-4 .5s linear forwards;
animation: fly-in-4 .5s linear forwards
}

.tcg-packopening-wrapper .card-sleeve:nth-child(5) {
transform: translateY(50vh) translateY(150%) translateX(-175%) rotate(25deg);
-webkit-animation: fly-in-5 .5s linear forwards;
animation: fly-in-5 .5s linear forwards;
-webkit-animation-delay: 25ms;
animation-delay: 25ms
}

.tcg-packopening-wrapper .card-sleeve:nth-child(6) {
transform: translateY(50vh) translateY(150%) translateX(-300%) rotate(25deg);
-webkit-animation: fly-in-6 .5s linear forwards;
animation: fly-in-6 .5s linear forwards;
-webkit-animation-delay: 50ms;
animation-delay: 50ms
}

.tcg-packopening-wrapper .card-sleeve:nth-child(7) {
transform: translateY(50vh) translateY(150%) translateX(-300%) rotate(25deg);
-webkit-animation: fly-in-6 1s linear forwards;
animation: fly-in-6 1s linear forwards;
-webkit-animation-delay: 1s;
animation-delay: 1s
}

.tcg-packopening-wrapper .card:hover {
transform: scale(1.1)
}

.tcg-pack-headline {
font-size: 2.22222vh
}

.tcg-pack-actions {
position: absolute;
top: calc(100% + 15vh);
left: 0;
right: 0;
text-align: center;
-webkit-animation: fade-in .5s;
animation: fade-in .5s
}

.tcg-pack-actions button {
transition: .25s;
border: none;
background-color: #222831;
color: #e0e0e0;
margin: .83333vh;
padding: .55556vh .83333vh;
border-radius: .27778vh;
font-size: 1.11111vh;
font-weight: 700;
opacity: .75
}

.tcg-pack-actions button:hover {
background-color: #30475e;
opacity: 1;
transform: scale(1.1)
}

.tcg-pack-actions__tip {
background: #f2a365;
color: #222831;
font-family: Arial, sans-serif;
display: inline-block;
margin-left: auto;
margin-right: auto;
padding: .27778vh .41667vh;
border-radius: .27778vh;
font-size: 1.11111vh;
font-weight: 700
}

@-webkit-keyframes fade-in {
0% {
opacity: 0
}
to {
opacity: 1
}
}

@keyframes fade-in {
0% {
opacity: 0
}
to {
opacity: 1
}
}

@-webkit-keyframes fly-in-1 {
0% {
transform: translateY(50vh) translateY(150%) translateX(300%) rotate(-25deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(250%) rotate(-12.5deg)
}
to {
transform: none
}
}

@keyframes fly-in-1 {
0% {
transform: translateY(50vh) translateY(150%) translateX(300%) rotate(-25deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(250%) rotate(-12.5deg)
}
to {
transform: none
}
}

@-webkit-keyframes fly-in-2 {
0% {
transform: translateY(50vh) translateY(150%) translateX(175%) rotate(-25deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(125%) rotate(-12.5deg)
}
to {
transform: none
}
}

@keyframes fly-in-2 {
0% {
transform: translateY(50vh) translateY(150%) translateX(175%) rotate(-25deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(125%) rotate(-12.5deg)
}
to {
transform: none
}
}

@-webkit-keyframes fly-in-3 {
0% {
transform: translateY(50vh) translateY(150%) translateX(50%) rotate(-15deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(35%) rotate(-7.5deg)
}
to {
transform: none
}
}

@keyframes fly-in-3 {
0% {
transform: translateY(50vh) translateY(150%) translateX(50%) rotate(-15deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(35%) rotate(-7.5deg)
}
to {
transform: none
}
}

@-webkit-keyframes fly-in-4 {
0% {
transform: translateY(50vh) translateY(150%) translateX(-50%) rotate(15deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(-35%) rotate(7.5deg)
}
to {
transform: none
}
}

@keyframes fly-in-4 {
0% {
transform: translateY(50vh) translateY(150%) translateX(-50%) rotate(15deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(-35%) rotate(7.5deg)
}
to {
transform: none
}
}

@-webkit-keyframes fly-in-5 {
0% {
transform: translateY(50vh) translateY(150%) translateX(-175%) rotate(25deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(-125%) rotate(12.5deg)
}
to {
transform: none
}
}

@keyframes fly-in-5 {
0% {
transform: translateY(50vh) translateY(150%) translateX(-175%) rotate(25deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(-125%) rotate(12.5deg)
}
to {
transform: none
}
}

@-webkit-keyframes fly-in-6 {
0% {
transform: translateY(50vh) translateY(150%) translateX(-300%) rotate(25deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(-250%) rotate(12.5deg)
}
to {
transform: none
}
}

@keyframes fly-in-6 {
0% {
transform: translateY(50vh) translateY(150%) translateX(-300%) rotate(25deg)
}
50% {
transform: translateY(25vh) translateY(75%) translateX(-250%) rotate(12.5deg)
}
to {
transform: none
}
}

@font-face {
font-family: pricedown;
src: url(

Linkleri,görmek için Giriş yap veya üye ol.

)
}

@font-face {
font-family: nfs;
src: url(

Linkleri,görmek için Giriş yap veya üye ol.

)
}

body {
margin: 0;
padding: 0;
border: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}

code {
font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace
}

* {
box-sizing: border-box
}

.MuiFormControl-root, hr {
width: 100%
}

a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block
}

body {
line-height: 1
}

ol, ul {
list-style: none
}

blockquote, q {
quotes: none
}

blockquote:after, blockquote:before, q:after, q:before {
content: "";
content: none
}

table {
border-collapse: collapse;
border-spacing: 0
}

 

[SleekAssassin35]

Merhaba,

Konu Katagorisi Tarafımca Değiştirilmiştir.

İyi Forumlar Dilerim .

 

[BK07]

discord verirsen yardımcı olmaya çalışırım