/*Font*/
@font-face{
    font-family:'GothamCondensed';
    src: url('font/GothamCondensed-Medium.woff2') format('woff2'),
        url('font/GothamCondensed-Medium.woff') format('woff');
}

/*Colors*/
.C0l{color:#efefef}
.C0fll{fill:#efefef}
.C0bkl{background-color:#efefef}
.C0stl{stroke:#efefef}
.C0d{color:#3b3b3b}
.C0fld{fill:#3b3b3b}
.C0bkd{background-color:#3b3b3b}
.C0std{stroke:#3b3b3b}
.C1{color:#f06923}
.C1fl{fill:#f06923}
.C1fl_hov:hover{fill:#f06923!important}
.C1bk{background-color:#f06923}
.C1flim{fill:#f06923!important}
.C1br{border-color:rgba(240,105,35,0.7)!important}
.C1st{stroke:#f06923}
.C2{color:#818181}
.C2fl{fill:#818181}
.C2br,.C2br_hov:hover{border-color:#818181}
.C2bk,.C2bk_hov:hover{background-color:#818181}
.C2st{stroke:#818181}
.C3l{color:#454545}
.C3fll{fill:#454545}
.FLDl:-webkit-autofill{-webkit-text-fill-color:#454545}
.C3d{color:#b3b3b3}
.C3fld{fill:#b3b3b3}
.FLDd:-webkit-autofill{-webkit-text-fill-color:#b3b3b3}
.C4{color:rgba(203,10,10,.9) !important}
.C4br{border-color:rgba(203,10,10,.9) !important}
.C4bk{background-color:rgba(203,10,10,.9)}
.C4fl{fill:rgba(203,10,10,.9)}
.C4st{stroke:rgba(203,10,10,.9)}
.C5{color:rgba(95,155,45,.9)}
.C5bk{background-color:rgba(95,155,45,.9)}
.C5fl{fill:rgba(95,155,45,.9)}

@keyframes flickAni{0%{opacity:.8}50%{opacity:.2}100%{opacity:.8}}
@-moz-keyframes flickAni{0%{opacity:.8}50%{opacity:.2}100%{opacity:.8}}
@-webkit-keyframes flickAni{0%{opacity:.8}50%{opacity:.2}100%{opacity:.8}}
.Loader svg .L1{-webkit-animation:flickAni .75s infinite;-moz-animation:flickAni .75s infinite;animation:flickAni .75s infinite}
.Loader svg .L2{-webkit-animation:flickAni 1.25s infinite;-moz-animation:flickAni 1.25s infinite;animation:flickAni 1.25s infinite}
.Loader svg .L3{-webkit-animation:flickAni 2.25s infinite;-moz-animation:flickAni 2.25s infinite;animation:flickAni 2.25s infinite}
.Loader svg .L4{-webkit-animation:flickAni 1s infinite;-moz-animation:flickAni 1s infinite;animation:flickAni 1s infinite}

#HeadLogo{position:absolute;width:128px;margin-left:10px;height:30px;top:10px;cursor:pointer}
#LogoMark{position:absolute;width:27px;height:33px;left:68px;top:-2px;z-index:2}

/*--------------------------------------*/
/*-----End of Customization Section------- (You can customize the rest, but shouldn't need to) */
/*--------------------------------------*/

/*Reset*/
html,body{width:100%;height:100%;min-height:100%;margin:0;padding:0;border:0}
body{overflow-y:auto;-webkit-overflow-scrolling:touch}
p{margin:0;padding:0;padding-top:10px}
a:focus{outline:0}
b,.bold{font-weight:bold}
table{border-collapse:collapse;border-spacing:0;width:100%;empty-cells:show}
td{text-align:left}
svg{width:100%;height:100%}
*{-webkit-tap-highlight-color:transparent} 
header,section,footer{margin:0;padding:0}

/*Common Layout*/
.LR50{position:relative;width:50%;left:25%}
.LR80{position:relative;width:80%;left:10%}
.LR85{position:relative;width:85%;left:7.5%}

.shim4{margin:4px 0;}
.shim10,.shimtop10{margin-top:10px}
.shim10{margin-bottom:10px}
.shim20,.shimtop20{margin-top:20px}
.shim20{margin-bottom:20px}

.ROW0{background-color:transparent}
.ROW1{background-color:rgba(5,5,5,0.05)}
.ROW0:hover,.ROW1:hover{background-color:rgba(5,5,5,0.1)}

.WingPanel{position:relative;width:calc(100% - 50px);margin-left:25px}
.WingPanel table td{padding:5px 4px;white-space:nowrap}
#WorkerSortName,#WorkerSortRate,.WingBtnL,.WingBtnR,.WingLblL{position:absolute;width:24px;height:24px;left:0;margin-left:-29px;top:3px;border-radius:50%;padding:4px;box-sizing:border-box}
#WorkerSortRate,.WingBtnR{left:100%;margin-left:5px}
#WorkerSortRate .preload{width:100%;height:100%}
#WorkerSortName{margin-left:-19px;}
#WorkerSortRate{margin-left:-5px}

.o3{opacity:.3}
.o5{opacity:.5}
.o7{opacity:.7}
.o8{opacity:.8}

.rot90{-ms-transform:rotate(90deg);-webkit-transform:rotate(90deg);transform:rotate(90deg)}
.rot180{-ms-transform:rotate(180deg);-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.rot270{-ms-transform:rotate(270deg);-webkit-transform:rotate(270deg);transform:rotate(270deg)}

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

.condte{width:80px;padding-left:7px}
.consmall,.continy{width:95px;text-align:center}
.continy{width:75px}

.TDPadS td{padding:3px}
.hide{display:none !important}
.clear{clear:both}
.SplitL,.SplitR,.BoxL,.BoxR{display:inline-block;width:50%;box-sizing:border-box;padding:0 3px}

/*Text*/
.txtbig,.txtmed{font-family:'GothamCondensed',san-serif;font-size:28px}
.txtmed{font-size:20px}
.txt,.txttny,.txtsmall{font-family:Tahoma,Helvetica,sans-serif;font-size:14px;line-height:18px}
.txtsmall{font-size:13px;line-height:16px}
.txttny{font-size:10px;line-height:12px}

/*Forms*/
input:focus,select:focus{outline-color:transparent;outline-style:none}
input:-moz-focusring,select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}

#MinerCalcFld,#MinerCalcUnit,#MinerCalcHsh{border:0;padding:2px 1px;height:18px;margin:0 1px}

.FLDl,.FLDd{width:calc(100% - 4px);display:inline-block;border:0;padding:8px 5px 7px 5px;background-color:#efefef}
.FLDd{background-color:#3b3b3b}
.FLDl:-webkit-autofill,.FLDl:-webkit-autofill:hover,.FLDl:-webkit-autofill:focus,.FLDl:-webkit-autofill:active{-webkit-box-shadow: 0 0 0 30px #efefef inset !important}
.FLDd:-webkit-autofill,.FLDd:-webkit-autofill:hover,.FLDd:-webkit-autofill:focus,.FLDd:-webkit-autofill:active{-webkit-box-shadow: 0 0 0 30px #3b3b3b inset !important}

.select-point{position:absolute;width:10px;height:10px;top:11px;right:-3px}
select,.select-point{cursor:pointer}
#AddrRecent select,#HeadMenu select{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;outline:none}

/*Buttons*/
.nav,.hov,.C2br_hov,.C2bk_hov,.PagBtn{cursor:pointer}
.btnback,#DashPayBtn,#Timer,#TogMode{background-color:rgba(19,19,19,.03);-webkit-box-shadow:inset 0px -2px 5px 0px rgba(0,0,0,.06);-moz-box-shadow:inset 0px -2px 5px 0px rgba(0,0,0,.06);box-shadow:inset 0px -2px 5px 0px rgba(0,0,0,.06)}
.nopoint{cursor:default !important}

.BtnElem,.noselect{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.BtnElem,.FrmElem,.BtnDisc{position:relative;display:inline-block;border:0;box-sizing:border-box;text-align:center;padding:5px 3px}
.BtnDisc{border-radius:50%}
.BtnElem,.FrmElem{border-radius:5px}
.BtnElem.DiscMde{padding-left:18px}
.BtnElem .DiscIcon{position:absolute;z-index:2;width:22px;height:22px;left:5px;top:5px;padding:4px;box-sizing:border-box;border-radius:50%}

.Btn16Corner,.Btn24Corner,.Btn32Corner{position:absolute;z-index:3;left:100%;margin-left:-18px;top:2px}
.Btn24Corner{margin-left:-28px;top:4px}
.Btn32Corner{margin-left:-34px;top:4px}
.Btn16,.Btn24,.Btn32{display:inline-block;cursor:pointer;box-sizing:border-box;padding:4px}
.Btn16{width:16px;height:16px;padding:1px}
.Btn24{width:24px;height:24px;padding:2px}
.Btn32{width:32px;height:32px}
.Btn16:hover,.Btn24:hover,.Btn32:hover,.nav:hover,.hov:hover,.PagBtn:hover{opacity:.5}

/*Loading Animations*/
.LoadCon{position:absolute;width:30px;height:30px;left:50%;margin-left:-15px;top:50%;margin-top:-15px}
.preload{-webkit-animation:spin 1s linear infinite;-moz-animation:spin 1s linear infinite;animation:spin 1s linear infinite}
@-moz-keyframes spin{100%{-moz-transform:rotate(360deg)}}
@-webkit-keyframes spin{100%{-webkit-transform:rotate(360deg)}}
@keyframes spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}

/*Elements*/
.hbar,.pbar{position:relative;height:1px;background:rgba(0,0,0,.2);background:linear-gradient(90deg, rgba(0,0,0,.01) 0, rgba(0,0,0,.25) 15%, rgba(0,0,0,.35) 50%, rgba(0,0,0,.25) 85%, rgba(0,0,0,.01) 100%)}
.pbar{width:80%;left:10%;margin-top:2px;margin-bottom:2px;opacity:.6}
#TblPagBox{position:relative;top:-3px;width:18px;margin:0 5px}

/*Graphing*/
.chart .line{stroke-width:.7}
.chart .mineravgline{stroke-width:1;stroke-dasharray:4}
.ToolTip{cursor:pointer}
.Tip_TmeBx,.Tip_ValBx{stroke-width:.5;}
#MinerGraph .ToolTip{fill:transparent;cursor:default}

.GAlert,#GPop{position:absolute;z-index:9999;top:50%;border-radius:5px;border-width:1px;border-style:solid;box-sizing:border-box}
.GAlert{width:450px;left:50%;margin-left:-225px;margin-top:-23px;padding:4px}

#NetGraph{position:relative;height:120px;margin-left:-2px}
#NetGraph.short{height:40px;margin-top:10px}
#GPop{width:40%;height:53px;left:5%;margin-top:-27px;padding:4px}
#GPop.pright{left:55%}
#GPop table td{width:33%;text-align:center}
#NetGraph .blockgroup{cursor:pointer}

#MinerGraph{position:relative;height:150px}
#MinerGraph .MinerMsg{padding-top:25px;text-align:center}

/*Header*/
header{height:44px}

#HeadMenu,#TogMode,#Timer,#TimerRefresh,#TimerLoader{position:absolute;width:32px;height:32px;left:100%;top:9px;box-sizing:border-box;padding:5px}
#HeadMenu{width:85px;margin-left:-180px;top:9px;border:0;overflow:hidden;text-align:right}
#HeadMenu select{padding:0 14px 0 5px;box-sizing:border-box}

#TogMode,#Timer,#TimerRefresh,#TimerLoader,#TimerPie,#TimerDisc{border-radius:50%}
#TogMode{margin-left:-85px}
#Timer{margin-left:-44px;padding:3px}
#TimerPie{position:relative;height:100%}
#TimerDisc,#TimerText{position:absolute;width:88%;height:88%;top:6%;left:6%}
#TimerText{z-index:1;text-align:center;line-height:20px;padding-top:1px}
#TimerText .C4fl{padding-bottom:1px}
#TimerRefresh,#TimerLoader{left:0;top:0;z-index:9}
#TimerLoader{z-index:10}

#Addr{margin:19px 0}
#Addr td{padding:3px;text-align:center}
#Addr .SplitL{width:calc(100% - 245px)}
#Addr .SplitR{width:240px}
#AddrRecent{position:relative;width:60px}
#AddrRecent select{width:100%;padding:1px 11px 1px 3px}
#AddrRecent .select-point{width:8px;height:8px;top:5px;right:0}
#AddrFieldCell{position:relative;height:34px}

#DashPending,#DashPaid{min-width:97px}
#DashPayBtn{position:relative;width:45px;height:45px;border-radius:50%;padding:8px;display:inline-block;box-sizing:border-box}
#DashPayBtn .Loader,#DashPayBtn .Closer,#TimerText div{padding:3px;box-sizing:border-box}

#Stage{position:relative;opacity:0;min-height:calc(100% - 312px);-webkit-transition:opacity .4s ease-in;-moz-transition:opacity .4s ease-in;-ms-transition:opacity .4s ease-in;-o-transition:opacity .4s ease-in;transition:opacity .4s ease-in}
#Stage.short{min-height:calc(100% - 140px)}
.StageFade{opacity:1 !important}

#News{background:linear-gradient(0deg, rgba(19,19,19,0.05) 0%, rgba(19,19,19,0) 50%)}
#NewsCard,#NewsBody{box-sizing:border-box}
#NewsCard{min-height:40px;border-radius:5px 5px 0 0;padding:9px 38px 0 10px;border:1px solid rgba(0,0,0,.3);border-bottom:0}
#NewsTime{float:right;padding-top:4px}
#NewsBody{padding:10px 0 15px 0}

#MinerDash{margin-bottom:10px}
#MinerDash .Spl{display:inline-block;width:50%;text-align:center}

#MinerPayments{position:relative;height:0;border-bottom:1px solid rgba(0,0,0,.25);transition:height 300ms;overflow:hidden}
#MinerPayments.Opened{height:180px}
#MinerPayments.OpenedBig{height:375px}
#MinerPayments .LR85{height:calc(100% - 1px)}

#MinerPaymentsStage{position:relative;height:calc(100% - 1px)}

#AutoPayBtn{width:calc(50% - 9px);margin-left:9px;height:32px}
#InstaPayBtn,#PaymentHistoryBtn,#PaymentHistoryBtnClose{width:100%;height:32px}
#PaymentHistoryBtn.EmailTog{width:calc(100% - 158px)}
#EmailToggleBtn{width:140px;height:32px;margin-left:18px}
#AutoPayFld{width:calc(50% - 9px);height:32px;border-width:1px;border-style:solid;padding:5px}
#InstaPayBtn .preload,#AutoPayBtn .preload{display:inline-block;height:22px;width:22px}

#MinerPaymentsTable{min-height:100px}
#MinerPaymentsStage table{height:100%;border-style:solid;border-width:0 1px;border-color:rgba(0,0,0,.1);padding:3px}

#WorkerList{min-height:100px}
.WorkerWrap{float:left;position:relative;width:20%;height:65px;padding:5px 4px;box-sizing:border-box}
.Worker{position:relative;height:100%}
.Worker,#WorkerPop{border-radius:3px;border-width:1px;border-style:solid}
.Worker .LblL,.Worker .LblR{display:inline-block;width:50%;height:30px;text-align:left;padding:2px 3px 4px 3px;box-sizing:border-box}
.Worker .LblL{width:calc(100% - 75px)}
.Worker .LblR{width:75px;text-align:right}
.WorkerChart{position:relative;height:26px}
#WorkerPop{position:absolute;z-index:2;width:calc(100% + 10px);height:95px;left:0;margin-left:-5px;top:100%;margin-top:-1px;border-radius:4px;padding:6px 1px;box-sizing:border-box}
.WBlockFewGrid{width:50% !important}

#PageTopL,#PageTopR{position:relative;display:inline-block;width:calc(100% - 180px);height:50px;padding:14px 0 10px 0;box-sizing:border-box}
#PageTopR{width:180px}
#PageBot{min-height:200px}
.helpgroup{margin-top:20px;padding-left:25px;padding-bottom:10px}

.helptitle{position:relative;display:inline-block;color:#f06923;fill:#f06923;cursor:pointer}
.helptitle:hover{color:#818181;fill:#818181}
.helptitle .btnback{position:absolute;z-index:2;width:26px;height:26px;border-radius:50%;margin-left:-33px;top:-2px;padding:3px;box-sizing:border-box}
.helpteaser,.helpcontent{margin-top:5px}

/*Footer*/
footer{height:42px}
#FootL,#FootR{display:inline-block;box-sizing:border-box;padding-top:4px}
#FootL{width:250px;padding-left:10px;padding-top:6px}
#FootR{width:calc(100% - 255px);padding-right:9px}
#FootR .nav{text-transform:uppercase}

footer,#MinerGraph,#MinerPayments{-webkit-box-shadow:inset 0px 25px 16px -22px rgba(0,0,0,.06);-moz-box-shadow:inset 0px 25px 16px -22px rgba(0,0,0,.06);box-shadow:inset 0px 25px 16px -22px rgba(0,0,0,.06)}
#MinerGraph .chart,.Worker,#MinerPayments{background:rgba(0,0,0,.03);background:linear-gradient(90deg, rgba(0,0,0,.04) 0,rgba(0,0,0,.02) 20%,rgba(0,0,0,.01) 80%,rgba(0,0,0,.03) 100%)}

@media all and (max-width:1300px){
	.WorkerWrap{width:25%}
}
@media all and (max-width:1100px){
	.LR80{width:82%;left:9%}
	#AutoPayFld{padding:6px}
	.txt{font-size:14px}
}
@media all and (max-width:900px){
	.txtbig{font-size:24px}
	.txtmed{font-size:18px}
	#InstaPayBtn,#AutoPayBtn,#PaymentHistory{padding:6px}
	#HeadMenu{width:75px;margin-left:-165px}
	.txtsmall{font-size:12px;line-height:15px}
	#MinerPaymentsStage{width:80%;left:10%}
	.condte{width:75px}
	.consmall,.continy{width:90px}
	.continy{width:70px}
	.WorkerWrap{width:33.33%}
	#MinerGraph{height:175px}
	#DashPending,#DashPaid{width:80px}
	#GPop{width:50%}
	#GPop.pright{left:45%}
	.LR50{width:60%;left:20%}
	.LR80{width:84%;left:8%}
	.LR85{width:87%;left:6.5%}
}
@media all and (max-width:750px){
	.helpcontent{width:100%}
	.WorkerWrap{width:50%}
	#MinerGraph{height:150px}
	#GPop{width:60%}
	#GPop.pright{left:35%}
	.LR80{width:86%;left:7%}
	.LR85{width:89%;left:5.5%}
	.SplitL,.SplitR{width:100%!important;padding:6px 0}
	#Addr{margin:19px 0 14px 0}
	#Stage{min-height:calc(100% - 380px);
}
@media all and (max-width:600px){
	#HeadLogo span{font-size:33px;letter-spacing:-1px}
	.txtsmall{font-size:11px;line-height:14px}
	#MinerPaymentsStage{width:90%;left:5%}
	.condte{width:70px}
	.consmall,.continy{width:85px}
	.continy{width:65px}
	.WBlockFewGrid{width:100%!important}
	.LR50{width:80%;left:10%}
	.LR80{width:88%;left:6%}
	.LR85{width:91%;left:4.5%}
}
@media all and (max-width:500px){
	#HeadLogo span{font-size:33px;letter-spacing:-1px}
	#GPop{width:70%}
	#GPop.pright{left:25%}
	.WorkerWrap{width:100%}
	.LR80{width:92%;left:4%}
	.LR85{width:95%;left:2.5%}
}

/*Fix svg text classes*/
svg .txtmed{font-size:20px}