@charset "UTF-8";

* {
    box-sizing: border-box;
}

html { /* to give a baize effect */
    box-sizing: border-box;
    background-color: darkgreen;
}

img { /* std position for all images */
    margin: -8px 0 0 -8px;
}

hr {
    clear: left;
}

/* p tag styling section */
p {
    background-color: antiquewhite;
    padding: 2px 2px 0 2px;
    border: 1px solid red;
    border-radius: 3px;
}
p.nostyle {
    background: none;
    border: none;
}
p.message {
    text-align: center;
}
p.setupcredit {
    width: 130px;
    width: fit-content;
    margin: 3rem auto 2rem;
}
.erstbet {
    width: 135px;
    width: fit-content;
    margin: 1rem auto 2rem;
}
p.enterbet {
    width: 145px;
    width: fit-content;
    margin: 3rem auto 2rem;
}
p.noinbet {
    width: 325px;
    width: fit-content;
    margin: 0 auto 2rem;
}
p.firstbetmsg {
    margin-top: 64px;
}
p.eightop {
    margin: -8px 0 0 0;
}
p.noneleft {
    margin-left: 0;
}
p.bust {
    width: 42px;
    margin-left: -8px;
    padding-top: 1px;
}
p.bustline {
    display: inline;
}
p.dbust { /* edited 17/08 */
    width: 122px;
    width: fit-content;
    margin-top: 4px;
}
p.pontoon {
    width: 65px;
    width: fit-content;
    margin-bottom: -1px;
}
p.pontoonbtm {
    width: 171px;
    width: fit-content;
    margin: 2px 0 14px -8px;
}
p.twentyone {
    width: 180px; /* > the width of the div */
    width: fit-content;
    margin-left: -8px;
}
p.twentyonescore {
    width: 28px;
/*    margin-left: -8px; problem in p3-p4.py CHECK OTHERS! */
}
p.twentyonescorebtm {
    width: 28px;
    margin-left: -8px;
}
p.fivecard {
    width: 106px;
    width: fit-content;
    margin-left: -8px;
}
p.fivecardbtm {
    width: 106px;
    width: fit-content;
    margin: 2px 0 14px -8px;
}
p.fvcdtwo {
    margin: 2px 0 14px -8px;
}
p.dlrwinpontmid {
    margin: 2px 0 0 -8px;
}
p.fivecardpaypont {
    width: 122px;
    width: fit-content;
    margin-left: -8px;
}
p.score {
    text-align: center;
}
p.scoposta { /* used for player ace & stick score */
    margin-bottom: 3px;
}
p.dlrscoposta { /* used for dealer score post ace */
    width: 145px; /* can't use width: fit-content here! */
    margin-bottom: 3px;
}
p.finscore {
    width: 103px;
    text-align: center;
    margin: 15px 0 0 -8px;
}
p.win {
    max-width: 54%;
    text-align: center;
    margin: 16px 0 16px 14%;
}
p.dwin {
    width: 90px;
    width: fit-content;
    text-align: center;
    margin: 3px 0 0 -8px;
    padding-right: 2px;
}
p.dwinposta { /* used dealer btm, normal & after ace for win */
    margin: 3px 0 14px 20px;
}
p.dwind {
    max-width: 50%;
    text-align: center;
    margin-left: -8px;
}
p.betmess {
    width: 178px; /* for Firefox, extra to allow for 4 digits */
    width: fit-content;
    padding: 2px 2px 0 3px;
    margin-top: 12px ;
}
p.svdpotmess {
    width: 158px; /* for Firefox, extra to allow for 4 digits */
    width: fit-content;
    padding: 2px 2px 0 3px;
    margin-top: 12px ;
}
p.savepotmess {
    width: 158px; /* for save_pot.py */
    width: fit-content;
    padding: 2px 2px 0 3px;
    margin: 1rem auto;
}
p.svdpotrecog {
    width: 154px; /* for save_pot.py */
    width: fit-content;
    margin: 1rem auto 2rem;
}
p.botbetmess {
    width: 135px;
    width: fit-content;
    margin: 4px 0 0 -8px;
}
p.ttyonebotbetmess {
    width: 118px;
    width: fit-content;
    margin: -12px 0 0 -8px;
}
p.acebetmess { /* for player iframes */
    width: 132px;
    width: fit-content;
    margin-top: 7px; /* works in firefox */
}
p.acebetmess6 { /* for player's 6th iframe */
    width: 132px;
    width: fit-content;
    margin-top: -8px;
}
p.endbetmess {
    width: 135px;
    width: fit-content;
    margin: -12px 0 0 -8px;
}
p.bustmessp3buy { /* bet message after bust in buy frame */
    width: 118px;
    width: fit-content;
    margin: -11px 0 0 -8px;
}
p.betenter {
    width: 135px;
    width: fit-content;
    margin: 1rem auto 2rem;
    padding-bottom: 2px; /* check firefox! */
}
p.betreq {
    width: 542px;
    width: fit-content;
    margin-left: -8px;
}
p.entuname {/* used in savepot.html */
    width: 542px;
    width: fit-content;
    margin: 2rem auto;
}
p.entusrnm {/* used in usrname.html */
    width: 542px;
    width: fit-content;
    margin: 3rem auto 2rem;
}
p.usrname {/* used in savepot.html & usrname.html */
    width: 120px;
    width: fit-content;
    margin: 1rem auto 2rem;
}
p.frmbetreq {
    width: 150px;
    width: fit-content;
    margin-left: -8px;
}
p.aceval {
    width: 155px;
    margin: -4px 0 0 -8px; /* top margin ok in firefox */
    padding-bottom: 1px;
    font-size: 15px;
}
p.byepot {
    margin: 12px auto 0;
}

/* a tag styling section */
a:link {
    color: blue;
    text-decoration: none; 
}
a:visited {
    color: blue;
}
a:hover {
    color: red;
}
a:active {
    color: blue;
}

/* general text styling section */
.welcome {
    text-align: center;
    color: antiquewhite;
}
.in {
    display: inline;
}
.welcomesetup {
    margin-top: 21px;
    text-align: center;
    color: antiquewhite;
}
.playsetup {
    margin-top: 21px;
}
.namerecog {
    margin-top: 2rem;
}
.welcomeback {
    margin-top: 3rem;
    text-align: center;
    color: antiquewhite;
}
.potsavereq {
    display: inline;
    margin-left: 7.5%;
}
.topcent {
    margin-top: 100px;
}
.topmarg {
    margin-top: -20px;
}
.byepagetop {
    margin-top: 112px;
}
.gotosite {
    margin-top: 3rem;
}

details > summary {
    width: 630px;
    width: fit-content;
    font-size: 1.5rem;
    text-align: center;
    color: antiquewhite;
    padding: 2px;
    cursor: pointer;
    margin: 24px auto;
}
details > p {
    font-size: 1rem;
    text-align: justify;
    color: antiquewhite;
    margin-top: 16px;
    background: none;
    border: none;
}

/* button & input styling section */
button {
    font-size: 0.8rem;
    color: blue;
    padding: 0 2px;
    border: 1px solid red;
    border-radius: 5px;
    background-color: aqua;
    display: inline-block;
    cursor: pointer;
}

.yes {
    font-size: 1rem;
    margin: 0 0 0 12px;
    padding: 2px 4px;
}
.no {
    display: inline;
    font-size: 1rem;
    margin-left: 12px;
    padding: 2px 7px;
}

.start {
    display: block;
    text-align: center;
    margin: 1.5rem auto 1rem;
    font-size: 1.5rem;
    padding: 0.1rem 0.75rem 0.25rem;
    border: 2px solid red;
    border-radius: 8px;
}

.play {
    display: block;
    text-align: center;
    margin: 1rem auto 0;
    font-size: 1rem; 
}

.play1 {
    display: block;
    text-align: center;
    margin: 3rem auto 0;
    font-size: 1rem; 
}

.first {
    visibility: hidden; 
    text-align: center;
    margin: 6px 3.3rem 4px;
}

.first1 {
    visibility: hidden; 
    text-align: center;
    margin: 6px 3.3rem 4px;
}

.firstBet {
    width: 120px;
    width: fit-content;
    margin: 0 auto 2rem;
    padding: 0 3px;
}
.newFirstbet {
    display: inline;
    font-size: 1rem;
    padding: 2px 4px;
    margin-left: 8px;
}

.buyer {
    visibility: hidden;
    position: absolute;
    margin: 4px 0 0 0;
}

.twister {
    visibility: hidden;
    position: absolute;
    margin: 4px 0 0 40px;
}

.twister1 { /* do I still need this? */
    visibility: hidden;
    position: absolute;
    margin: 4px 30px 0 24px;
}

.sticker {
    visibility: hidden;
    position: relative;
    margin: 4px 0 0 88px;
}

.sticker1 { /* do I still need this? */
    visibility: hidden;
    position: relative;
    margin: 4px 0 0 88px;
}

.dealer {
    visibility: hidden;
    position: absolute;
    margin: 6px 0 0 -8px;
}
.dlrpbuybust {
    visibility: visible;
    margin: -18px 0 0 42px;
}
.dlrppont { /* dealer button after pontoon middle for player */
    visibility: visible;
    margin: -17px 0 0 68px;
}
.dlrdpontbot { /* dealer button after pontoon bottom for dealer */
    visibility: visible;
    margin: -8px 0 0 -8px;
}
.dlrdpontmid { /* dealer button after pontoon/5CT middle for dealer */
    visibility: visible;
    margin-left: -8px;
}
.dlrpfinscor { /* dealer button after final score message bottom for player */
    visibility: visible;
    margin: -19px 0 0 98px;    
}
.dlrpttyone { /* dealer button after 21 score at bottom for player */
    visibility: visible;
    margin: -35px 0 0 24px;
}
.dlrpfivecd { /* dealer button after 5CT at bottom for player */
    visibility: visible;
    margin: -35px 0 0 102px;
}
.dlrdfvcdbot { /* dealer button after 5CT at bottom for dealer */
    visibility: visible;
    margin: -8px 0 0 -6px;
}
.dlrp6fivecd { /* dealer button in frame 6 after 5CT at middle for player */
    visibility: visible;
    margin: -35px 0 0 98px;
}
.dlrpsixbet { /* dealer button in frame 6 after ace at middle for player */
    visibility: visible;
    margin: -4px 0 0 44px;
}
.dlrpttyoneposta { /* dealer button after 21 score for player middle after ace */
    visibility: visible;
    margin: -35px 0 0 32px;
}
.dlrttyone { /* dealer button after 21 score at bottom for dealer */
    visibility: visible;
    margin: -35px 0 0 24px;
}
.dlrpstkscr { /* dealer button when player sticks */
    visibility: visible;
    margin: 8px 0 0 0;
}

.quit {
    display: block; 
}
.qtpbust {
    margin: 6px 0 0 -8px;
}
.qtdppontbot { /* quit button at bottom for dealer when player wins with pontoon */
    margin: -8px 0 0 68px;
}
.qtdfvcdbot { /* quit button at bottom when dealer wins with 5CT */
    margin: -8px 0 0 80px;
}
.qtdlrwin { /* quit button when dealer wins */
    margin: -8px 0 0 86px;
}
.qtdlrbust { /* quit button when dealer busts */
    margin: -10px 0 0 90px;
}
.quitbuy3 {
    margin: -18px 0 0 116px;
}
.qtdlrwinfive { /* quit button when dealer wins with 5CT after ace */
    margin: 6px 0 0 66px;
}

.bustnwgm {
    visibility: visible;
    margin: -10px 0;
}
.nwgmpbust { /* new game button when player busts */
    visibility: visible;
    display: inline-block;
    margin: 0 0 0 8px;
}

.nwgmbuy3 {/* newgame button buy3.py [& others?] bust */
    visibility: visible;
    margin: 0 0 0 8px;
}
.nwgmdlrwin {
    visibility: visible;
    margin: -8px 0 0 12px;
}
.nwgmdlrwinmid {/* replaces dealer & nwgmdlrwin in d4-d5/d5-d6.py */
    visibility: visible;
    position: absolute;
    margin: 6px 0 0 -8px;
}

input {
    font-size: 0.8rem;
    padding: 0 2px;
    color: blue;
    background-color: aqua;
    border: 2px solid red;
    border-radius: 5px;
}
input[type=number] { /* only for bets */
    max-width: 35%;
    padding-right: 0;
    margin-right: 10px;
}
input.acequant {
    width: 37px;
    font-size: 0.75rem;
    margin-right: 0; /* ok in firefox */
}
input[type=submit] {
    max-width: 50%;
}

/* div styling section */
.visitbuts {
    margin: 0 auto;
    width: 130px;
    padding: 12px 8px;
}
.playbut {
    margin: 0 auto;
    width: 75px; /* better for firefox? */
    width: fit-content;
}
.retry {
    margin: 0 auto;
    width: 86px; /* better for firefox? */
    width: fit-content;
}
.intro {
    margin: 0 auto 24px;
    width: 80%;
}
#play {
    width: 75px;
    margin: 0 auto;
}
.yespginitbet {
    margin: 0 auto;
    width: 333px;
    width: fit-content;
}
.firstBetcont {
    width: 120px;
    width: fit-content;
    margin: 0 auto;
}
.contstopot {
    width: 418px;
    width: fit-content;
    margin: 0 auto;
}
.mkinitbet {
    width: 333px;
    width: fit-content;
    margin: 2rem auto;
}

.iframe0 {/* div */
    float: left;
    width: 155px;
    height: 239px; /* + 8px for Firefox + 9px for test0? */
    padding: 0;
    margin: 0 6px 0 24px;
}
.iframe00 {/* div */
    float: left;
    visibility: hidden; /* cardback: initially hidden before deal */
    width: 155px;
    height: 239px; /* + 8px for Firefox + 9px for test0? */
    padding: 0;
    margin: 0 6px 0 24px;
}
.iframe {/* subsequent divs */
    float: left;
    width: 155px;
    height: 239px;
    padding: 0;
    margin: 0 0 4px 24px;
}
.iframe1 {/* subsequent divs */
    float: left;
    width: 155px;
    height: 239px;
    padding: 0;
    margin: 0 0 4px 24px;
}

.test0 { /* player & dealer button div */
    height: 30px; 
}
.normbot { /* standard pos for test0? div edited 17/08 */
    margin-top: 3px;
}
.p2btm { /* div edited 17/08 */
    margin-top: 1px;
}
.d2btm { /* dealer bottom div for message: extra wide? div edited 17/08 */
    width: 162px;
    margin-top: 1px;
}
.acepick { /* player ace value selection div edited 17/08 */
    margin-top: 8px;
}
.byacepick { /* player [buy] & dealer ace value selection div */
    margin-top: 8px;
}
.pontbot { /* 21 score btm div edited 26/08 */
    margin-top: -12px;
}
.bustbot { /* div edited 17/08 */
    margin-top: 6px;
}
.test0bet {
    margin-top: -11px;
}
.finscor {
    margin-top: -11px;
}
.buycont {
    margin-top: 84px;
}
.aframe { /* post-ace score div */
    margin: 108px 0 0 -8px;
}
.unamenter {
    margin-top: 0;
}
.usrnmuname {
    margin-top: -28px;
}

.test1aframe { /* post-ace score & dealer outcome div */
    margin-top: 92px;
}

.bet1 { /* first bet div */
    margin-top: 0;
}

#potsave {
    width: 650px;
    margin: 24px auto 48px;
}

/* iframe styling section */
.card {/* iframe */
    display: block;
    position: relative;
    width: 155px; /* plus 8px for Firefox 155? */
    height: 246px; /* height to avoid scrollbar */
    margin: -8px 0 0 -8px;
    border: none;
}

.card1 {/* iframe */
    display: block;
    position: relative;
    width: 153px; /* plus 8px for Firefox 155? */
    height: 246px; /* height to avoid scrollbar */
    margin: 0 0 0 0;
    border: none;
}