﻿

 

@font-face {
    font-family: 'Montserrat';
    src: url('Montserrat.ttf') format('truetype');
}

 @font-face {
    font-family: 'Montserrat-Bold';
    src: url('Montserrat-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Poster-Sans';
    src: url('Poster-Sans.ttf') format('truetype');
}



body {
    font-family: 'Montserrat', sans,serif;
    background-image: url('');
    background-attachment: fixed;
    background-size: cover;
}


table {
    border: 1px solid #fff;
    font-size: 0.8em;
    width: 100%;
    margin: 0 0 20px 0;
    border-collapse: collapse;
    box-sizing: border-box;
}

thead td {
    background: #000;
    text-align: left;
    border: none;
    padding: 5px;
    font-size: 0.75em;
}

tbody tr {
    background: #e3e3e3;
    color: #000;
}

tbody td {
    border: 1px solid #fff;
    padding: 5px;
}

tbody tr:nth-child(odd) {
    background: #d9d9d9;
}

input.paidbtn, input.upaidbtn {
    padding: 5px;
    border: none;
    font-size: 0.8em;
    font-weight: normal;
    color: #fff;
    line-height: normal;
    cursor: pointer;
    transition: all 0.3s ease;
    width: 100%;
    margin: 0;
    text-transform: uppercase;
    font-family: 'Montserrat-bold';
}

input.paidbtn {
    background: #56b41e;
}

input.upaidbtn {
    background: #fa4617;
} 
 

//* GLOBAL *//

@loadcirc: 6px solid rgba(255,255,255,0.2);
@loadmover: 6px solid #FA4617;

@bodybg: #000;
 
@linkcol: #fff;
@linkhovcol: #e94c26;
@linkrevcol: red;
@linkrevhovcol: cyan;

@maintxcol: #fff;
@maintxsize: 0.9em;

@h1sz: 1.6em;
@h2sz: 1.4em;
@h3sz: 1.1em;
@h4sz: 1em;
@h1col: #fff;
@h2col: #fff;
@h3col: #fff;
@h4col: #fa4617;
@h1pd: 10px;
@h2pd: 10px;
@h3pd: 10px;
@h4pd: 20px 10px 0 10px;
@h1wht: 700;
@h2wht: 700;
@h3wht: 700;
@h4wht: 700;
@h1case:uppercase;
@h2case: uppercase;
@h3case: uppercase;
@h4case: uppercase;
@hfont: Montserrat-bold, sans-serif;
        

@genrad:0;


//* HEADER *//

@hdrbg: #000;
@hdpad: 10px 20px;
@hdrH: 80px;

@logotp: 10px;
@logoW: 120px;

@hnbtncol: #000;
@hnbtnbor: #000;
@hnbtntcol: #fff;
@hnbtntsz: 0.7em;
@hnbtnpd: 5px;

@hnbtncolhv: none;
@hnbtnborhv: #fff;
@hnbtntxhv: #fff;



//* PROGRESS *//

@progpad:100px 20px 20px 20px;
@progbar: 1px solid transparent;
@progbarcol: white;
@progbdr:#fff;
@progW: 76%;
@dotH: 30px;
@dotW: 30px;
@dotabg: #000;
@dotbbg: #FA4617;
@progtxsz: 0.9em;
@proglbsz: 0.6em;



//* ITEM & ACTIVITY BOXES *//

@bxbg:none;
@bxbdr: none;
@bxshad: 0 10px 10px 3px rgba(0,0,0,0);
@bx50pd: 15px;
@bx100pd: 15px;
@bxhpd:0 20px 20px 20px;
@bxhbpd: 10px;
@bxtxcol:cyan;
@bxtxsize:0.9em;
@bxtxpd:0;

@bbxpd:15px;

@acthdwht:bold;
@actxcol:#fff;
@actxsz:1.2em;

@actspwht: bold;
@actspcol: #fff;
@actspsz: 1.2em;

@actbxpd: 10px 20px;
@actbxmg: 10px 0;
@actbxlncol: rgba(255,255,255,0.4);
@actbxlnW: 50%;
@actbxlnH:1px;


@gbxbg:none;
@gbxmg:0 0 20px 0;
@gbxpd: 10px 0 0 0;
@gbxbdr:none;
@gicohvbg: rgba(255,255,255,0.1);
@gthdcol: #fff;
@gthdsz: 0.9em;
@gthdwht: normal;
@gthdH: 50px;

@gtxH:40px;
@gbtxcol: #fff;
@gtxsz:;
@gtxwht:;

@actbtnselbg:#FA4617;
@actbtntxcol:white;
@actbtntxwht:bold;
@actbtnfont: 'Montserrat-bold';
@actselpd:5px 10px;
@actselmg:10px;
@actselsz:0.9em;

 
@cnbxbdr:1px solid #cdcdcd;
@cnbxpd:10px 50px 10px 0;
@cnbxtcol: #fff;
@cnbxrpd: 10px 0;



@borders: none;



@btncol: #fa4617;
@btnbor: #fa4617;
@btntx: #fff;
@btncolhv: none;
@btnborhv: #fa4617;
@btntxhv: #fa4617;

@btnselcol: #E94C26;
@btnselbor: #E94C26;
@btnseltx: #F5F6F8;
@btnselcolhv: #e94c26;
@btnselborhv: #E94C26;
@btnseltxhv: #F5F6F8;

@btncolrev: #E94C26;
@btnborrev: #fff;
@btntxrev: #1A1714;
@btncolrevhv: #e94c26;
@btnborrevhv: #F5F6F8;
@btntxrevhv: #1A1714;

@btntry: #1A1714;
@btntrybor: cyan;

@subheads: #fff;


@mesnegtx: red;
@mespostx: #5aa016;
@mespostx: #5aa016;

//* BTNS & FORMS *//
@globtnpd:7px 10px;
@globtnsz:1.1em;
@globtnwht:bold;
@globtncase:uppercase;

@dobtncol: #FA4617;
@dobtnbor: 1px solid #FA4617;
@dobtntx: #fff;
@dobtncolhv: #242424;
@dobtnborhv: 1px solid #000;
@dobtntxhv: #fff;

@dobtnbcol: #4379A3;
@dobtnbbor: 1px solid #4379A3;
@dobtnbtx: #fff;
@dobtnbcolhv: #1c1c1c;
@dobtnbborhv: 1px solid #1c1c1c;
@dobtnbtxhv: #fff;

@bkbtncol:#000;
@bkbtnbdr:1px solid #000;
@bkbtntx:#fff;

@bkbtnhvcol:none;
@bkbtnhvbdr:1px solid white;
@bkbtnhvtx:white;

@frmtbdr: 1px solid #fff;
@frmtbg: #fff;
@frmtpd:7px 10px;
@frmtsz: 1.2em;
@frmtcol: #000;
@frmtwgt: normal;

@frmsbdr:white;
@frmsbg:white;
@frmspd: 15px 10px;
@frmstsz: 0.9em;
@frmstcol:black;
@frmswht: bold;


@rembtncol:red;
@rembtnbor:1px solid red;
@rembtntcol: white;
@rembtnpd:2px 5px;
@rembtnsz:1em;
@rembtnhvcol:none;
@rembtnhvbdr: 1px solid red;
@rembtnthvcol:red;

@plholdcol: #121212;

@outdrpd:0;

@optoutbg: #fff;
@optoutbdr: 1px solid #fff;
@optoutpd: 0 20px 0 5px;

@optbg:#fff;
@optpd:5px;
@opttsz:1.2em;
@opttwgt:bold;
@optx: #000;


@plmbg:#fff;
@plmbdr:none;
@plmpd:5px 10px;
@plmtcol:black;
@plmtwgt:bold;
@plmtsz:2.4em;
@plmW:40px;
@hvplmbg:silver;
@hvplmtcol:white;

@qtybg:#000;
@qtybdr: 1px solid #000;
@qtytcol: #fff;
@qtytsz: 2em;
@qytwgt: bold;
//* BK SUMS *//
@bksumbdr: none;
@bksumpd: 20px 0 10px 0;
@bksumlh: 1.8em;
@bkitemcase: normal;
@bkitemsz: 1em;
@bkitemcol: #fff;
@bkitemwht: bold;
@bkspancase: none;
@bkspancol: #cdcdcd;
@bkitespanmwht: normal;


@tprsz: 1.6em;
@tprwht: bold;
@tpcol: #fff;
@tppd: 5px 0 20px 0;
@tpbdr: 2px solid #fff;
//* SLIDER *//
@sldbarbg: rgba(255,255,255,0.8);
@sldbarh: 5px;
@sldtmh:40px;
@sldtmw:40px;
@sldtmrad:50%;
@sldtmbdr: 2px solid #fff;
@sldtmbg: #fa4617;


@sldmin: 1.1em;
@sldminwht:bold;
@sldcst: 0.9em;



@import "../layout.less";



.ftlg {
    padding: 10px 0;
    font-size: 0.7em;
    font-weight: normal;
    font-family: Arial, sans-serif;
}



    /*-- EDIT STAGE  --*/

    .edbxst { padding:5px 0; font-size:0.8em; }
    .editrow  { display:flex; flex-direction:row; margin:0; justify-content:space-between; border-bottom:1px solid rgba(255,255,255,0.5); padding:10px 0 5px 0;  line-height:1.6em; }
 
    .editstack   { border-bottom:1px solid rgba(255,255,255,0.5); padding:10px 0 5px 0;  line-height:1.6em; text-align:left; }
 
    .editstktot   { padding:20px 0 10px 0;  line-height:1.6em; text-align:left; }


    .editlft { font-weight:bold; margin:0; text-align:left; }
    .editrt { margin:auto 0 0 0; }
    .editlsub { font-weight:normal; }

 

    body { background-image: url('gfx/apf-bg.png');
           background-repeat: no-repeat;
           background-attachment: fixed;
         }


       input.terbtn, input.qrtbtn, input.qinbtn {
                padding:7px 10px; 
                font-size:1.1em; 
                line-height: normal;
                cursor: pointer;
                transition: all 0.3s ease;
                width:100%;
                margin:10px auto;
            }
 


            input.terbtn { display: block;
                           width: 100%;
                            background:#000;
                            border:2px solid white;
                            color:white;
                            white-space: normal;
                            text-align:center;
                            text-transform:uppercase;
                        }

                input.terbtn:hover { cursor: pointer;
                                    background:#000;
                                    border:2px solid white;
                                    color:white;
                                  }



            input.qrtbtn { display: block;
                          width: 100%;
                          background:#000;
                          border:none;
                          color:#fff;
                          white-space: normal;
                            text-transform:uppercase;
                        }

                input.qrtbtn:hover { cursor: pointer;
                                     background:#000;
                                     border:none;
                                     color:#fff;
                                   }



            input.qinbtn { display: block;
                          width: 100%;
                          background:none;
                          border:none;
                          color:#fff;
                          white-space: normal;
                          font-weight:normal !important;
                          text-decoration:underline;
                          font-family:'montserrat';
                          
                        }

                input.qinbtn:hover { cursor: pointer;
                                      background:#000;
                                      border:none;
                                      color:#fff;
                                  }



            .textDiv_Minutes {
                color: #fff !important;
            }

            .textDiv_Seconds {
                color: #fff !important;
            }


            .mainslhd {
                background: url(gfx/orangebg.png) center center no-repeat;
                background-size: contain;
                padding: 7px 15px 11px 15px;
                margin: 0;
                color: #fff;
                width: 100%;
                font-size: 3.4em;
                line-height: 1.2em;
                text-align: center;
                text-transform: uppercase;
                font-family: 'Poster-Sans';
                font-weight:400;
                letter-spacing:2px;
            }


            .subslhd { background: url(gfx/blugbg.png) center center no-repeat; background-size:contain; padding:28px 30px 22px 30px; color:#fff; width:100%; font-size:1.1em; font-weight:bold; text-align:center; text-transform:uppercase; font-family: 'Montserrat-Bold';  }

            .minslhd { background: url(gfx/orangebg.png) center center no-repeat;
                        background-size: contain;
                        padding: 14px 15px 20px 15px;
                        margin: 0;
                        color: #fff;
                        width: 100%;
                        font-size: 0.9em;
                        line-height:0.8em;
                        font-weight:bold;
                        text-align: center;
                        text-transform: uppercase;
                        width:100%;
           
                    }


            .orh {  display: grid;
                    width: 100%;
                    align-items: center;
                    text-align: center;
                    grid-template-columns: minmax(20px, 1fr) auto minmax(20px, 1fr);
                    grid-gap: 20px;
                    font-size:0.8em;
                    padding:10px 0;
                }
 
            .orh:before,
            .orh:after {
                content: '';
                border-top: 1px solid;
            }



 

            .gicott { text-transform:uppercase; } 


              .gico img, .gicob img, .activsico { border:2px solid #fff; } 

 

            input.pcodebtn { display: block;
                              width: 100%;
                              background: @dobtncol;
                              color: @dobtntx;
                              white-space: normal;
                              padding: 15px 10px;
                              border:none;
                              font-family:Montserrat-Bold;
                            }


         

                .subline { padding:35px 0 15px 0;
                  line-height: 0.5;
                  text-align: center;
                }
                .subline span {
                  display: inline-block;
                  position: relative;  
                }
                .subline span:before,
                .subline span:after {
                  content: "";
                  position: absolute;
                  height: 3px;
                  border-bottom: 1px solid white;
                  top: 0;
                  width:100%;
                }
                .subline span:before {
                  right: 100%;
                  margin-right: 15px;
                }
                .subline span:after {
                  left: 100%;
                  margin-left: 15px;
                }


 
                             
 
    @media screen and (max-width:700px) {

            .subslhd { margin-top:-10px; font-size:1em;  }


            }