html{
    background-color:#477148;
    background-image:linear-gradient(#477148 0%,#416941 100%);
    font-size:1vw
}
@media screen and (aspect-ratio>=95/100){
    html{
        font-size:.95vh
    }
}
body{
    margin:0;
    padding:0;
    font-family:Avenir-Book,Avenir,sans-serif;
    overflow:hidden
}
div#buttons{
    text-transform:none;
    background-color:#aaa;
    flex-direction:row;
    place-content:center;
    align-items:stretch;
    display:flex;
    position:absolute;
    bottom:50;
    left:0;
    right:0;
    overflow:visible
}
@supports (padding-top:env(safe-area-inset-top)){
    div#buttons{
        padding-bottom:20px;
        bottom:calc(0px - env(safe-area-inset-top))
    }
}
div#buttons button{
    background-color:#FCEEE9;
    border:none;
    flex-grow:1;
    flex-basis:0;
    max-width:30vh;
    height:5vh;
    margin:0 1px;
    padding:0;
    font-family:inherit;
    font-size:2.5vh
    color:#8B314C;
}
#tableHolder{
    position:absolute;
    inset:0 0 5vh
}
@supports (padding-top:env(safe-area-inset-top)){
    #tableHolder{
        left:env(safe-area-inset-left);
        right:env(safe-area-inset-right);
        top:env(safe-area-inset-top);
        bottom:calc(5vh + env(safe-area-inset-bottom) - env(safe-area-inset-top))
    }
}
.cardTable{
    position:absolute;
    inset:0;
    overflow:hidden
}
.gameScore{
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    padding:.5vh;
    font-size:2vh;
    display:block;
    position:absolute;
    bottom:0;
    right:0
}
.pile{
    transition-property:left,top,right,bottom,filter,background-color;
    transition-duration:.25s,.25s,.25s,.25s,.1s,.1s;
    transition-timing-function:ease-in-out;
    position:absolute
}
.pile.showFrame{
    background-position:50%;
    background-repeat:no-repeat;
    background-size:100% 100%
}
.pile.dropPreview{
    filter:drop-shadow(0 0 .4rem #000);
    background-color:#0003;
    border-radius:.5rem;
    transition-property:none
}
.card{
    perspective:200rem;
    transition-property:left,top,right,bottom,filter,transform,opacity;
    transition-duration:.25s,.25s,.25s,.25s,.1s,.25s,.25s;
    transition-timing-function:ease-in-out;
    position:absolute
}
.card.dragging{
    filter:drop-shadow(0 0 .4rem #00000080);
    transition-property:filter;
    transition-duration:.1s
}
.card.dropPreview{
    filter:invert()hue-rotate(180deg)drop-shadow(0 0 .4rem #000);
    transition-property:none
}
.card .cardRotation{
    transform-style:preserve-3d;
    width:100%;
    height:100%;
    transition:transform .25s ease-in-out;
    position:absolute
}
.card.won{
    opacity:0;
    transition-property:left,top,right,bottom,filter,transform,opacity;
    transition-duration:2s;
    transition-timing-function:ease-in,ease-in,ease-in,ease-in,ease-in,cubic-bezier(.755,.05,.855,.06),ease-in;
    transform:scale(0)
}
.card.faceUp .cardRotation{
    transform:rotateY(180deg)
}
.cardBack,.cardFront{
    -webkit-backface-visibility:hidden;
    -moz-backface-visibility:hidden;
    backface-visibility:hidden;
    -ms-backface-visibility:hidden;
    -o-backface-visibility:hidden;
    transform-style:preserve-3d;
    image-rendering:optimizequality;
    background-position:50%;
    background-repeat:no-repeat;
    background-size:100% 100%;
    width:100%;
    height:100%;
    position:absolute
}
.card .cardFront{
    transform:rotateY(180deg)
}
.pile.showFrame{
    background-image:url(00.602c530d.svg)
}
.card .cardBack{
    background-image:url(1B.48053963.svg)
}
.card.s1c1r1 .cardFront{
    background-image:url(AS.fa853d82.svg)
}
.card.s1c1r2 .cardFront{
    background-image:url(2S.02a7f2ca.svg)
}
.card.s1c1r3 .cardFront{
    background-image:url(3S.fea5258c.svg)
}
.card.s1c1r4 .cardFront{
    background-image:url(4S.148741d5.svg)
}
.card.s1c1r5 .cardFront{
    background-image:url(5S.0dfdd1dd.svg)
}
.card.s1c1r6 .cardFront{
    background-image:url(6S.fb478f14.svg)
}
.card.s1c1r7 .cardFront{
    background-image:url(7S.e8063907.svg)
}
.card.s1c1r8 .cardFront{
    background-image:url(8S.05191f01.svg)
}
.card.s1c1r9 .cardFront{
    background-image:url(9S.75335c53.svg)
}
.card.s1c1r10 .cardFront{
    background-image:url(TS.28595528.svg)
}
.card.s1c1r100 .cardFront{
    background-image:url(JS.173de8a4.svg)
}
.card.s1c1r101 .cardFront{
    background-image:url(QS.6ac994d3.svg)
}
.card.s1c1r102 .cardFront{
    background-image:url(KS.cb31e89f.svg)
}
.card.s1c2r1 .cardFront{
    background-image:url(AS.fa853d82.svg)
}
.card.s1c2r2 .cardFront{
    background-image:url(2S.02a7f2ca.svg)
}
.card.s1c2r3 .cardFront{
    background-image:url(3S.fea5258c.svg)
}
.card.s1c2r4 .cardFront{
    background-image:url(4S.148741d5.svg)
}
.card.s1c2r5 .cardFront{
    background-image:url(5S.0dfdd1dd.svg)
}
.card.s1c2r6 .cardFront{
    background-image:url(6S.fb478f14.svg)
}
.card.s1c2r7 .cardFront{
    background-image:url(7S.e8063907.svg)
}
.card.s1c2r8 .cardFront{
    background-image:url(8S.05191f01.svg)
}
.card.s1c2r9 .cardFront{
    background-image:url(9S.75335c53.svg)
}
.card.s1c2r10 .cardFront{
    background-image:url(TS.28595528.svg)
}
.card.s1c2r100 .cardFront{
    background-image:url(JS.173de8a4.svg)
}
.card.s1c2r101 .cardFront{
    background-image:url(QS.6ac994d3.svg)
}
.card.s1c2r102 .cardFront{
    background-image:url(KS.cb31e89f.svg)
}
.card.s2c1r1 .cardFront{
    background-image:url(AH.8964fc73.svg)
}
.card.s2c1r2 .cardFront{
    background-image:url(2H.560c9049.svg)
}
.card.s2c1r3 .cardFront{
    background-image:url(3H.f9f20cca.svg)
}
.card.s2c1r4 .cardFront{
    background-image:url(4H.36f907e0.svg)
}
.card.s2c1r5 .cardFront{
    background-image:url(5H.f88c7862.svg)
}
.card.s2c1r6 .cardFront{
    background-image:url(6H.b8239fc6.svg)
}
.card.s2c1r7 .cardFront{
    background-image:url(7H.c7c243a5.svg)
}
.card.s2c1r8 .cardFront{
    background-image:url(8H.6a556be2.svg)
}
.card.s2c1r9 .cardFront{
    background-image:url(9H.4ab424c0.svg)
}
.card.s2c1r10 .cardFront{
    background-image:url(TH.b03f3feb.svg)
}
.card.s2c1r100 .cardFront{
    background-image:url(JH.4126eccb.svg)
}
.card.s2c1r101 .cardFront{
    background-image:url(QH.536752d3.svg)
}
.card.s2c1r102 .cardFront{
    background-image:url(KH.8865f607.svg)
}
.card.s2c2r1 .cardFront{
    background-image:url(AH.8964fc73.svg)
}
.card.s2c2r2 .cardFront{
    background-image:url(2H.560c9049.svg)
}
.card.s2c2r3 .cardFront{
    background-image:url(3H.f9f20cca.svg)
}
.card.s2c2r4 .cardFront{
    background-image:url(4H.36f907e0.svg)
}
.card.s2c2r5 .cardFront{
    background-image:url(5H.f88c7862.svg)
}
.card.s2c2r6 .cardFront{
    background-image:url(6H.b8239fc6.svg)
}
.card.s2c2r7 .cardFront{
    background-image:url(7H.c7c243a5.svg)
}
.card.s2c2r8 .cardFront{
    background-image:url(8H.6a556be2.svg)
}
.card.s2c2r9 .cardFront{
    background-image:url(9H.4ab424c0.svg)
}
.card.s2c2r10 .cardFront{
    background-image:url(TH.b03f3feb.svg)
}
.card.s2c2r100 .cardFront{
    background-image:url(JH.4126eccb.svg)
}
.card.s2c2r101 .cardFront{
    background-image:url(QH.536752d3.svg)
}
.card.s2c2r102 .cardFront{
    background-image:url(KH.8865f607.svg)
}
.card.s3c1r1 .cardFront{
    background-image:url(AD.cfbdf5f1.svg)
}
.card.s3c1r2 .cardFront{
    background-image:url(2D.cafcff7a.svg)
}
.card.s3c1r3 .cardFront{
    background-image:url(3D.434dda0c.svg)
}
.card.s3c1r4 .cardFront{
    background-image:url(4D.7358cfbc.svg)
}
.card.s3c1r5 .cardFront{
    background-image:url(5D.fec2372c.svg)
}
.card.s3c1r6 .cardFront{
    background-image:url(6D.c200913f.svg)
}
.card.s3c1r7 .cardFront{
    background-image:url(7D.07b2a92b.svg)
}
.card.s3c1r8 .cardFront{
    background-image:url(8D.13c9a7e6.svg)
}
.card.s3c1r9 .cardFront{
    background-image:url(9D.30ff8ca9.svg)
}
.card.s3c1r10 .cardFront{
    background-image:url(TD.d9ddd31b.svg)
}
.card.s3c1r100 .cardFront{
    background-image:url(JD.814643b4.svg)
}
.card.s3c1r101 .cardFront{
    background-image:url(QD.7ffbca2f.svg)
}
.card.s3c1r102 .cardFront{
    background-image:url(KD.642d057c.svg)
}
.card.s3c2r1 .cardFront{
    background-image:url(AD.cfbdf5f1.svg)
}
.card.s3c2r2 .cardFront{
    background-image:url(2D.cafcff7a.svg)
}
.card.s3c2r3 .cardFront{
    background-image:url(3D.434dda0c.svg)
}
.card.s3c2r4 .cardFront{
    background-image:url(4D.7358cfbc.svg)
}
.card.s3c2r5 .cardFront{
    background-image:url(5D.fec2372c.svg)
}
.card.s3c2r6 .cardFront{
    background-image:url(6D.c200913f.svg)
}
.card.s3c2r7 .cardFront{
    background-image:url(7D.07b2a92b.svg)
}
.card.s3c2r8 .cardFront{
    background-image:url(8D.13c9a7e6.svg)
}
.card.s3c2r9 .cardFront{
    background-image:url(9D.30ff8ca9.svg)
}
.card.s3c2r10 .cardFront{
    background-image:url(TD.d9ddd31b.svg)
}
.card.s3c2r100 .cardFront{
    background-image:url(JD.814643b4.svg)
}
.card.s3c2r101 .cardFront{
    background-image:url(QD.7ffbca2f.svg)
}
.card.s3c2r102 .cardFront{
    background-image:url(KD.642d057c.svg)
}
.card.s4c1r1 .cardFront{
    background-image:url(AC.48781e19.svg)
}
.card.s4c1r2 .cardFront{
    background-image:url(2C.938616ff.svg)
}
.card.s4c1r3 .cardFront{
    background-image:url(3C.240b9cb3.svg)
}
.card.s4c1r4 .cardFront{
    background-image:url(4C.c62abf33.svg)
}
.card.s4c1r5 .cardFront{
    background-image:url(5C.855f8ddb.svg)
}
.card.s4c1r6 .cardFront{
    background-image:url(6C.5cc1ad5d.svg)
}
.card.s4c1r7 .cardFront{
    background-image:url(7C.e4403dfb.svg)
}
.card.s4c1r8 .cardFront{
    background-image:url(8C.00365769.svg)
}
.card.s4c1r9 .cardFront{
    background-image:url(9C.17339c1e.svg)
}
.card.s4c1r10 .cardFront{
    background-image:url(TC.76a90f8c.svg)
}
.card.s4c1r100 .cardFront{
    background-image:url(JC.6721c80b.svg)
}
.card.s4c1r101 .cardFront{
    background-image:url(QC.a294a15b.svg)
}
.card.s4c1r102 .cardFront{
    background-image:url(KC.c00ef00d.svg)
}
.card.s4c2r1 .cardFront{
    background-image:url(AC.48781e19.svg)
}
.card.s4c2r2 .cardFront{
    background-image:url(2C.938616ff.svg)
}
.card.s4c2r3 .cardFront{
    background-image:url(3C.240b9cb3.svg)
}
.card.s4c2r4 .cardFront{
    background-image:url(4C.c62abf33.svg)
}
.card.s4c2r5 .cardFront{
    background-image:url(5C.855f8ddb.svg)
}
.card.s4c2r6 .cardFront{
    background-image:url(6C.5cc1ad5d.svg)
}
.card.s4c2r7 .cardFront{
    background-image:url(7C.e4403dfb.svg)
}
.card.s4c2r8 .cardFront{
    background-image:url(8C.00365769.svg)
}
.card.s4c2r9 .cardFront{
    background-image:url(9C.17339c1e.svg)
}
.card.s4c2r10 .cardFront{
    background-image:url(TC.76a90f8c.svg)
}
.card.s4c2r100 .cardFront{
    background-image:url(JC.6721c80b.svg)
}
.card.s4c2r101 .cardFront{
    background-image:url(QC.a294a15b.svg)
}
.card.s4c2r102 .cardFront{
    background-image:url(KC.c00ef00d.svg)
}
@media screen and (width<=600px),screen and (height<=600px){
    .pile.showFrame{
        background-image:url(00.602c530d.svg)
    }
    .card .cardBack{
        background-image:url(1B.48053963.svg)
    }
    .card.s1c1r1 .cardFront{
        background-image:url(AS.d6dd9931.svg)
    }
    .card.s1c1r2 .cardFront{
        background-image:url(2S.ab3fb1d4.svg)
    }
    .card.s1c1r3 .cardFront{
        background-image:url(3S.4dd92668.svg)
    }
    .card.s1c1r4 .cardFront{
        background-image:url(4S.c387f125.svg)
    }
    .card.s1c1r5 .cardFront{
        background-image:url(5S.35ac5abd.svg)
    }
    .card.s1c1r6 .cardFront{
        background-image:url(6S.832ae14d.svg)
    }
    .card.s1c1r7 .cardFront{
        background-image:url(7S.6b8e4e8a.svg)
    }
    .card.s1c1r8 .cardFront{
        background-image:url(8S.2c1eba2e.svg)
    }
    .card.s1c1r9 .cardFront{
        background-image:url(9S.471f6a80.svg)
    }
    .card.s1c1r10 .cardFront{
        background-image:url(TS.ea4c12ae.svg)
    }
    .card.s1c1r100 .cardFront{
        background-image:url(JS.8532c183.svg)
    }
    .card.s1c1r101 .cardFront{
        background-image:url(QS.6c1435e8.svg)
    }
    .card.s1c1r102 .cardFront{
        background-image:url(KS.76f8f96b.svg)
    }
    .card.s1c2r1 .cardFront{
        background-image:url(AS.d6dd9931.svg)
    }
    .card.s1c2r2 .cardFront{
        background-image:url(2S.ab3fb1d4.svg)
    }
    .card.s1c2r3 .cardFront{
        background-image:url(3S.4dd92668.svg)
    }
    .card.s1c2r4 .cardFront{
        background-image:url(4S.c387f125.svg)
    }
    .card.s1c2r5 .cardFront{
        background-image:url(5S.35ac5abd.svg)
    }
    .card.s1c2r6 .cardFront{
        background-image:url(6S.832ae14d.svg)
    }
    .card.s1c2r7 .cardFront{
        background-image:url(7S.6b8e4e8a.svg)
    }
    .card.s1c2r8 .cardFront{
        background-image:url(8S.2c1eba2e.svg)
    }
    .card.s1c2r9 .cardFront{
        background-image:url(9S.471f6a80.svg)
    }
    .card.s1c2r10 .cardFront{
        background-image:url(TS.ea4c12ae.svg)
    }
    .card.s1c2r100 .cardFront{
        background-image:url(JS.8532c183.svg)
    }
    .card.s1c2r101 .cardFront{
        background-image:url(QS.6c1435e8.svg)
    }
    .card.s1c2r102 .cardFront{
        background-image:url(KS.76f8f96b.svg)
    }
    .card.s2c1r1 .cardFront{
        background-image:url(AH.93a677cc.svg)
    }
    .card.s2c1r2 .cardFront{
        background-image:url(2H.7ebee7ae.svg)
    }
    .card.s2c1r3 .cardFront{
        background-image:url(3H.303a5481.svg)
    }
    .card.s2c1r4 .cardFront{
        background-image:url(4H.b7a8140f.svg)
    }
    .card.s2c1r5 .cardFront{
        background-image:url(5H.c250dafd.svg)
    }
    .card.s2c1r6 .cardFront{
        background-image:url(6H.149a673e.svg)
    }
    .card.s2c1r7 .cardFront{
        background-image:url(7H.6a111736.svg)
    }
    .card.s2c1r8 .cardFront{
        background-image:url(8H.3caece38.svg)
    }
    .card.s2c1r9 .cardFront{
        background-image:url(9H.ae33e32a.svg)
    }
    .card.s2c1r10 .cardFront{
        background-image:url(TH.fc8b49f1.svg)
    }
    .card.s2c1r100 .cardFront{
        background-image:url(JH.db9f3619.svg)
    }
    .card.s2c1r101 .cardFront{
        background-image:url(QH.59caff50.svg)
    }
    .card.s2c1r102 .cardFront{
        background-image:url(KH.6bd18db9.svg)
    }
    .card.s2c2r1 .cardFront{
        background-image:url(AH.93a677cc.svg)
    }
    .card.s2c2r2 .cardFront{
        background-image:url(2H.7ebee7ae.svg)
    }
    .card.s2c2r3 .cardFront{
        background-image:url(3H.303a5481.svg)
    }
    .card.s2c2r4 .cardFront{
        background-image:url(4H.b7a8140f.svg)
    }
    .card.s2c2r5 .cardFront{
        background-image:url(5H.c250dafd.svg)
    }
    .card.s2c2r6 .cardFront{
        background-image:url(6H.149a673e.svg)
    }
    .card.s2c2r7 .cardFront{
        background-image:url(7H.6a111736.svg)
    }
    .card.s2c2r8 .cardFront{
        background-image:url(8H.3caece38.svg)
    }
    .card.s2c2r9 .cardFront{
        background-image:url(9H.ae33e32a.svg)
    }
    .card.s2c2r10 .cardFront{
        background-image:url(TH.fc8b49f1.svg)
    }
    .card.s2c2r100 .cardFront{
        background-image:url(JH.db9f3619.svg)
    }
    .card.s2c2r101 .cardFront{
        background-image:url(QH.59caff50.svg)
    }
    .card.s2c2r102 .cardFront{
        background-image:url(KH.6bd18db9.svg)
    }
    .card.s3c1r1 .cardFront{
        background-image:url(AD.f6f72ac5.svg)
    }
    .card.s3c1r2 .cardFront{
        background-image:url(2D.c73060c1.svg)
    }
    .card.s3c1r3 .cardFront{
        background-image:url(3D.58bd1149.svg)
    }
    .card.s3c1r4 .cardFront{
        background-image:url(4D.93871d77.svg)
    }
    .card.s3c1r5 .cardFront{
        background-image:url(5D.08655bc8.svg)
    }
    .card.s3c1r6 .cardFront{
        background-image:url(6D.b8885705.svg)
    }
    .card.s3c1r7 .cardFront{
        background-image:url(7D.b170556a.svg)
    }
    .card.s3c1r8 .cardFront{
        background-image:url(8D.c42bd0f1.svg)
    }
    .card.s3c1r9 .cardFront{
        background-image:url(9D.b779c891.svg)
    }
    .card.s3c1r10 .cardFront{
        background-image:url(TD.294ec61b.svg)
    }
    .card.s3c1r100 .cardFront{
        background-image:url(JD.117d8c68.svg)
    }
    .card.s3c1r101 .cardFront{
        background-image:url(QD.05b63409.svg)
    }
    .card.s3c1r102 .cardFront{
        background-image:url(KD.60f9d40d.svg)
    }
    .card.s3c2r1 .cardFront{
        background-image:url(AD.f6f72ac5.svg)
    }
    .card.s3c2r2 .cardFront{
        background-image:url(2D.c73060c1.svg)
    }
    .card.s3c2r3 .cardFront{
        background-image:url(3D.58bd1149.svg)
    }
    .card.s3c2r4 .cardFront{
        background-image:url(4D.93871d77.svg)
    }
    .card.s3c2r5 .cardFront{
        background-image:url(5D.08655bc8.svg)
    }
    .card.s3c2r6 .cardFront{
        background-image:url(6D.b8885705.svg)
    }
    .card.s3c2r7 .cardFront{
        background-image:url(7D.b170556a.svg)
    }
    .card.s3c2r8 .cardFront{
        background-image:url(8D.c42bd0f1.svg)
    }
    .card.s3c2r9 .cardFront{
        background-image:url(9D.b779c891.svg)
    }
    .card.s3c2r10 .cardFront{
        background-image:url(TD.294ec61b.svg)
    }
    .card.s3c2r100 .cardFront{
        background-image:url(JD.117d8c68.svg)
    }
    .card.s3c2r101 .cardFront{
        background-image:url(QD.05b63409.svg)
    }
    .card.s3c2r102 .cardFront{
        background-image:url(KD.60f9d40d.svg)
    }
    .card.s4c1r1 .cardFront{
        background-image:url(AC.d6b96678.svg)
    }
    .card.s4c1r2 .cardFront{
        background-image:url(2C.395958bc.svg)
    }
    .card.s4c1r3 .cardFront{
        background-image:url(3C.afbb02d2.svg)
    }
    .card.s4c1r4 .cardFront{
        background-image:url(4C.518d58ea.svg)
    }
    .card.s4c1r5 .cardFront{
        background-image:url(5C.1cb69123.svg)
    }
    .card.s4c1r6 .cardFront{
        background-image:url(6C.f3477758.svg)
    }
    .card.s4c1r7 .cardFront{
        background-image:url(7C.67bbd436.svg)
    }
    .card.s4c1r8 .cardFront{
        background-image:url(8C.713b94fc.svg)
    }
    .card.s4c1r9 .cardFront{
        background-image:url(9C.0d6fc016.svg)
    }
    .card.s4c1r10 .cardFront{
        background-image:url(TC.518e8d27.svg)
    }
    .card.s4c1r100 .cardFront{
        background-image:url(JC.6b11b0bd.svg)
    }
    .card.s4c1r101 .cardFront{
        background-image:url(QC.d57b9706.svg)
    }
    .card.s4c1r102 .cardFront{
        background-image:url(KC.f47caa2e.svg)
    }
    .card.s4c2r1 .cardFront{
        background-image:url(AC.d6b96678.svg)
    }
    .card.s4c2r2 .cardFront{
        background-image:url(2C.395958bc.svg)
    }
    .card.s4c2r3 .cardFront{
        background-image:url(3C.afbb02d2.svg)
    }
    .card.s4c2r4 .cardFront{
        background-image:url(4C.518d58ea.svg)
    }
    .card.s4c2r5 .cardFront{
        background-image:url(5C.1cb69123.svg)
    }
    .card.s4c2r6 .cardFront{
        background-image:url(6C.f3477758.svg)
    }
    .card.s4c2r7 .cardFront{
        background-image:url(7C.67bbd436.svg)
    }
    .card.s4c2r8 .cardFront{
        background-image:url(8C.713b94fc.svg)
    }
    .card.s4c2r9 .cardFront{
        background-image:url(9C.0d6fc016.svg)
    }
    .card.s4c2r10 .cardFront{
        background-image:url(TC.518e8d27.svg)
    }
    .card.s4c2r100 .cardFront{
        background-image:url(JC.6b11b0bd.svg)
    }
    .card.s4c2r101 .cardFront{
        background-image:url(QC.d57b9706.svg)
    }
    .card.s4c2r102 .cardFront{
        background-image:url(KC.f47caa2e.svg)
    }
}
