body{
    margin:0;
    padding:0;
    font-family:Verdana, Geneva, sans-serif;
    font-size:14px;
    background: 
        radial-gradient(black 15%,transparent 16%) 0 0,
        radial-gradient(black 15%,transparent 16%) 8px 8px,
        radial-gradient(rgba(255,255,255,.1) 15%,transparent 20%) 0 1px,
        radial-gradient(rgba(255,255,255,.1) 15%,transparent 20%) 8px 9px;
    background-color: #1d1d1d;
    background-size:16px 16px;
    color:#FFF;
}
a{
    color:#FFF;
    font-weight:bold;
    text-decoration:none;
}
a:hover{
    color:#F00
}
h1,h2,h3,h4,h5{
    padding:1%;
    margin:0;
    text-align:center;
}
h7{
    font-size:10px;
    color:rgba(255,255,255,0.5);
    display:none;
}
table{
    margin:0;
    padding:0;
    width:100%;
    border-collapse:collapse;
    border:1px #000 solid;
}
td{
    border:1px #000 solid;
}
.button{
	margin:0 2px;
	padding:0;
	width:auto;
	height:20px;
}


/*---------- Login */
.not-logged-in, .error, .success, .add-form-container, .lost-pw-container, .pick-week-container, .edit-profile-container{
    margin-top:10%;
    overflow:hidden;
    height:auto;
}
#user-login-form, #error-box, #success-box, #new-player-form, #lost-pw-form, #new-picks-week-form, #edit-profile-form{
    margin:0 auto;
    padding:20px;
    border: 1px #333 solid;
    background:rgba(50,50,50,.5);
    width:300px;
    min-height:300px;
    overflow:hidden;
}
#edit-profile-form td:first-child{
    font-weight:bold;
    line-height:16px;
    text-align:right;
    font-size:14px;
    padding:1%;
    margin:0 3%;
}
#edit-profile-form td{
    height:30px;
}
.form-label{
    font-weight:bold;
    line-height:16px;
    font-size:14px;
    padding:1%;
    margin:0 3%;
    width:92%;
}
.form-field{
    padding:1%;
    margin:0 3%;
    height:30px;
    width:92%;
    border:0;
    font-size:14px;
}
.form-select, .select-form{
    padding:2%;
    margin:0 3%;
    width:94%;
    border:0;
}
button, .form-submit, .continue-btn{
    margin:20px 10% 0;
    padding:0%;
    width:80%;
    height:30px;
    border:0px;
    cursor:pointer;
}
.remember-me{
    padding:1%;
    margin:0 3%;
    height:30px;
    width:92%;
    border:0;
    font-size:14px;
}
.remember-me .form-check{
    padding:0;
    margin:1%;
    width:20px;
    height:20px;
    vertical-align:middle;
}


/*---------- Header */
.menu-btn {
    display: inline-block;
    cursor: pointer;
    float:left;
    width:35px;
    height:30px;
    position:fixed;
    top:0;
    left:0;
    z-index:9;
}
.bar1, .bar2, .bar3 {
    width: 35px;
    height: 6px;
    background-color: #333;
    margin: 3px 0;
    transition: 0.4s;
}
.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 4px);
    transform: rotate(-45deg) translate(-9px, 4px);
    width:38px;
}
.change .bar2 {
    opacity: 0;
}
.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-9px, -4px);
    transform: rotate(45deg) translate(-9px, -4px);
    width:38px;
}

.header, .footer{
    margin:0 auto;
    padding:0;
    width:100%;
    height:30px;
    line-height:30px;
    background:#ccc;
    color:#000;
    position:fixed;
    left:50%;
    transform:translate(-50%,0);
    z-index:2;
}
.header{
    top:0;
}
.header a{
    color:#000;
}
.header-wrap{
    position:relative;
}
.header-user{
}
.header-logged-in{
    float:right;
    margin:0;
    padding:0 1%;
    width:calc(98% - 35px);
    height:30px;
    background:#333;
    color:#fff;
    text-align:right;
    line-height:30px;
}
.header-menu{
    list-style:none;
    float:left;
    margin:0;
    padding:0 1%;
    width:35%;
    overflow:hidden;
    background:#ccc;
    display:none;
    position:fixed;
    top:0;
    left:35px;
    z-index:10;
}
.header-menu li{
    text-align:center;
    margin:0 5px;
    padding:0 5px;
    width:auto;
    height:36px;
    line-height:36px;
}
.header-menu li:hover{
    background:#666;
}
.header-user{
}
.header-menu .list-separator{
    padding:2px 0;
    height:0;
    line-height:0;
    background:#666;
}


/*---------- Footer */
.footer{
    bottom:0;
    text-align:center;
}


/*---------- Main Page */
.page-container{
    margin:0 auto;
    padding:70px 0;
    width:100%;
    overflow:hidden;
}
.float-left{
    
}


/*---------- Homepage */
.home-page{
    margin:0 auto;
    padding:0;
    overflow:hidden;
}
.home-rank-wrap, .home-spreads-wrap, .pick-container{
    margin-top:10px;
    padding:2%;
    overflow:hidden;
    height:auto;
}
.home-rank-wrap{
    width:96%;
}
.home-spreads-wrap{
    width:96%;
}
.home-rank-table td{
    padding:0 1%;
    width:10%;
    height:25px;
    text-align:center;
}
.home-rank-table tr:nth-child(odd){
    background:rgba(75,75,75,.5);
}
.home-rank-table tr:nth-child(even){
    background:rgba(50,50,50,.5);
}
.home-rank-table td:nth-child(1){
    width:4%;
}
.home-rank-table td:nth-child(2){
    width:16%;
}
.home-spreads-table, #new-picks-form{
    border: 1px #333 solid;
    background:rgba(50,50,50,.5);
    min-height:300px;
    overflow:hidden;
}
.home-spreads-table{
    margin:0%;
    padding:0%;
    width:100%;
    font-size:12px;
}
.home-spreads-table td{
    padding:0 1%;
    width:28%;
    height:25px;
    text-align:center;
}
.home-spreads-table tr:nth-child(odd){
    background:rgba(75,75,75,.5);
}
.home-spreads-table tr:nth-child(even){
    background:rgba(50,50,50,.5);
}
.home-spreads-table td:nth-child(2){
    width:10%;
}
.home-page-logo{
    margin:0 auto;
    padding:1%;
    width:200px;
    height:200px;
    border:1px #000 solid;
}


/*---------- Pick Selection */
.pick-page{
    margin:0 auto;
    padding:0;
    max-width:1000px;
}
.pick-container{
    width:96%;
}
.single-pick-wrap{
    margin:0;
    padding:0;
    overflow:hidden;
    width:100%;
}
#new-picks-form{
    margin:0%;
    padding:3%;
    width:94%;
}
#new-picks-form .form-label{
    margin:5px 3%;
    padding:5px 0;
    width:28%;
    height:20px;
    line-height:20px;
    float:left;
    background:rgba(50,50,50,.5);
    font-size:12px;
    text-align:center;
}
#new-picks-form .form-select, #new-picks-form .select-form{
    margin:5px 3%;
    padding:5px 1%;
    width:58%;
    height:30px;
    float:right;
}
.pick-confirm-page{
    margin:0 auto;
    padding:1%;
    width:98%;
}
.pick-confirm-page table{
    border: 1px #333 solid;
    background:rgba(50,50,50,.5);
}
.pick-confirm-page td{
    padding:0 1%;
    width:38%;
    height:25px;
}
.pick-confirm-page td:nth-child(1){
    background:rgba(50,50,50,.5);
    text-align:right;
    font-weight:bold;
}
.pick-confirm-page td:nth-child(2){
    width:58%
}


/*---------- Player Picks */
.player-picks-page{
    margin:0;
    padding:0;
    overflow:auto;
}
.player-picks-menu-wrap{
    margin:0;
    padding:10px 1%;
    width:98%;
    height:20px;
    background:#333;
    position:fixed;
    top:30px;
    left:0;
    z-index:1;
}
.player-picks-menu{
    
}

.player-container{
    margin:0;
    padding:10px 1%;
    width:98%;
    position:relative;
    overflow:hidden;
}
.player-container td{
    text-align:center;
    border:1px #666 solid;
    line-height:24px;
    height:24px;
}
.player-container tr:last-child{
    background:rgba(50,50,50,0.5);
}
.player-info, .player-left, .player-right{
    float:left;
    margin:0;
    padding:0;
}
.player-info{
    padding:5px 1%;
    background:rgba(100,100,100,0.5);
    width:98%;
}
.player-info a{
    position:relative;
    top:-70px;
    left:0px
}
.player-left{
    width:100px;
}
.player-left td{
    
}
.player-right{
    width:calc(100% - 100px);
    overflow:auto;
}
.player-right table{
    width:3600px;
}
.player-right td:nth-child(even){
    width:32px;
}


/*---------- Teams */
.team-page, .team-btn{
    margin:0 auto;
    padding:0;
    overflow:auto;
}
.team-wrap{
    width:1000px;
}
.team-wrap td{
    text-align:center;
    border:1px #666 solid;
    line-height:24px;
    height:24px;
}
#team-graph, #team-picks{
    display:none;
}
.team-btn{
    
}
.team-btn button{
    width:80px;
}


/*---------- Results */
.results-page, .results-btn{
    margin:0 auto;
    padding:0;
    overflow:auto;
}
.results-table tr:first-child,.results-table tr:nth-child(2),.results-table tr:last-child{
    line-height:24px;
    height:24px;
}
.results-table td{
    text-align:center;
    border:1px #666 solid;
    line-height:24px;
}
#results-correct{
    display:none;
}
.results-btn button{
    width:80px;
}
.results-wrap{
    width:1000px;
}


/*---------- Knockout */
.knockout-page{
    margin:0 auto;
    padding:0;
    overflow:auto;
}
.knockout-table tr:first-child,.knockout-table tr:nth-child(2){
    line-height:24px;
    height:24px;
}
.knockout-wrap{
    width:1000px
}
.knockout-table{
}
.knockout-table td{
    text-align:center;
    border:1px #666 solid;
    line-height:24px;
    width:4%;
    font-size:12px;
}
.knockout-table td:first-child{
    width:10%;
    font-size:14px;
}


/*---------- Blog */
.blog-page{
    margin:0 auto;
    padding:0;
    max-width:1600px;
    overflow:hidden;
}
.blog-wrap{
    margin:0;
    padding:1%;
    width:98%;
    overflow:hidden;
}
.blog-post{
    margin:2%;
    padding:1%;
    width:94%;
    border:1px #666 solid;
    background:rgba(75,75,75,0.5);
    overflow:hidden;
}
.blog-title{
    margin:0;
    padding:10px 2%;
    width:96%;
    background:rgba(75,75,75,0.5);
    overflow:hidden;
}
.blog-title-main{
    margin:0;
    padding:5px;
    height:20px;
    font-size:16px;
    font-weight:bold;
    float:left;
}
.blog-last-update{
    margin:0;
    padding:5px;
    height:20px;
    float:right;
    text-align:right;
    font-style:italic;
}
.blog-body{
    margin:0;
    padding:10px 2%;
    width:96%;
    overflow:hidden;
}


/*---------- Admin */
.admin-page-top, .admin-page-bottom{
    margin:0 auto;
    padding:0;
    overflow:hidden;
}
.admin-page-top-left, .admin-page-top-right{
    width:100%;
    overflow:hidden;
}
.admin-page-top-left{
}
.admin-page-top-right{
}
.admin-page-top h3{
    margin-bottom:10px;
    padding:10px 2%;
    width:96%;
    background:rgba(75,75,75,0.5);
    text-align:center;
}
.admin-page-bottom h4{
    padding:5px 2%;
    width:96%;
    background:rgba(75,75,75,0.5);
    text-align:left;
}
.admin-page-bottom h5{
    margin-bottom:5px;
    padding:5px 2%;
    width:96%;
    text-align:left;
    font-style:italic;
}
.admin-page-top .form-label{
    margin:5px 0;
    height:20px;
    float:left;
    width:38%;
    text-align:right;
}
.admin-page-top .form-field{
    margin:5px 0;
    height:20px;
    float:left;
    width:58%;
}
.admin-page-top .select-form{
    margin:12px 0;
    height:30px;
    float:left;
    width:100%;
    text-align:center;
}
.admin-settings-wrap, .admin-options-wrap, .admin-spreads-wrap, .admin-blog-wrap, 
.admin-outcomes, .admin-deadlines, .admin-playoffs, .admin-knockouts{
    margin:1%;
    padding:1%;
    border:1px #666 solid;
    background:rgba(75,75,75,0.5);
    float:left;
    overflow:hidden;
}
.admin-settings-wrap{
    width:95%;
    min-height:440px;
}
.admin-options-wrap{
    width:95%;
    min-height:405px;
}
.admin-blog-wrap{
    width:95%;
    height:530px;
}
.admin-blog-wrap .form-label{
    width:98%;
    text-align:left;
}
.admin-blog-wrap .form-field{
    width:98%;
}
.admin-blog-wrap .form-textarea{
    padding:1%;
    width:98%;
    height:270px;
}
.admin-spreads-wrap{
    width:95%;
}
.admin-settings-wrap .form-submit{
    margin:10px 10%;
}
.admin-spreads-wrap table, .admin-spreads-wrap td{
    border:0;
}
.admin-spreads-wrap .spread-select{
    margin:2px 1%;
    padding:5px 2%;
    width:98%;
    height:30px;
}
.admin-spreads-wrap .form-check{
    margin:2px 1%;
    padding:0;
    width:20px;
    height:20px;
}
.admin-spreads-wrap .form-spread{
    margin:2px 1%;
    padding:5px 2%;
    width:94%;
    height:16px;
    text-align:center;
}
.admin-spreads-wrap .form-field{
    margin:2px 1%;
    padding:5px 2%;
    width:94%;
    height:20px;
}
.admin-spreads-wrap tr:first-child{
    text-align:center;
}
.admin-spreads-wrap tr:first-child td{
    padding:10px 0;
    font-weight:bold;
}
.admin-spreads-wrap td:nth-child(1), .admin-spreads-wrap td:nth-child(3){
    width:21%;
}
.admin-spreads-wrap td:nth-child(2), .admin-spreads-wrap td:nth-child(4){
    width:3%;
}
.admin-spreads-wrap tr:first-child td:nth-child(2), .admin-spreads-wrap tr:first-child td:nth-child(4){
    padding:0;
    transform:rotate(270deg);
    height:40px;
    vertical-align:top;
}
.admin-spreads-wrap td:nth-child(5){
    width:5%;
}
.admin-spreads-wrap td:nth-child(6){
    width:47%;
}
.admin-update-page{
    margin:0 auto;
    padding:0;
    max-width:1600px;
    overflow:hidden;
}
.admin-update-wrap{
    margin:1% auto;
    padding:1%;
    width:90%;
    border:1px #666 solid;
    background:rgba(75,75,75,0.5);
    overflow:hidden;
}
.admin-success button{
    margin:10px 40%;
    width:20%;
}
.admin-success td:nth-child(1){
    width:150px;
}
.admin-success td:nth-child(2){
    width:350px;
}


.admin-outcomes, .admin-deadlines, .admin-playoffs, .admin-knockouts{
    width:95%;
}
#outcome-wrap, #knockout-wrap{
    margin:0 auto;
    width:95%;
    display:none;
}
.admin-outcomes .outcome-col-first, .admin-knockouts .knockout-col-first{
    float:left;
    padding:0 1%;
    width:18%;
    text-align:right;
}
.admin-outcomes .outcome-form-wrap, .admin-knockouts .knockout-form-wrap{
    float:left;
    width:80%;
}
.admin-outcomes .outcome-col, .admin-knockouts .knockout-col{
    float:left;
}
.admin-outcomes .outcome-col-item, .admin-knockouts .knockout-col-item{
    height:20px;
}
.admin-outcomes .outcome-form-wrap .outcome-col, .admin-knockouts .knockout-form-wrap .knockout-col{
    width:5.55%;
}
.admin-outcomes .outcome-form-wrap .outcome-col-item, .admin-knockouts .knockout-form-wrap .knockout-col-item{
    margin:0 auto;
    width:20px;
}
.admin-outcomes .outcome-col-item .form-check, .admin-knockouts .knockout-col-item .form-check{
    padding:0;
    margin:0;
    width:16px;
    height:16px;
    vertical-align:midle;
}

#deadline-wrap{
    margin:0 auto;
    width:100%;
    display:none;
}
.admin-deadlines .deadline-col-first{
    float:left;
    padding:0 1%;
    width:8%;
    text-align:right;
}
.admin-deadlines .deadline-form-wrap{
    float:left;
    width:90%;
}
.admin-deadlines .deadline-form{
    overflow:auto;
    width:100%;
}
.admin-deadlines .deadline-col-wrap{
    overflow:auto;
    width:3200px;
    height:670px;
}
.admin-deadlines .deadline-col{
    float:left;
}
.admin-deadlines .deadline-col-item{
    height:20px;
}
.admin-deadlines .deadline-form-wrap .deadline-col{
    width:175px;
}
.admin-deadlines .deadline-col-item .form-field{
    margin:0;
    padding:0;
    height:20px;
}

#playoffs-wrap{
    margin:0 auto;
    width:100%;
    display:none;
}
.admin-playoffs .playoff-col-wrap{
    float:left;
    margin:0.5%;
    padding:0;
    width:32.33%;
    background:rgba(75,75,75,0.5);
}
.admin-playoffs .playoff-col-wrap .playoff-title{
    margin:1%;
    padding:1%;
    border:1px #666 solid;
    background:rgba(75,75,75,0.5);
    text-align:center;
}
.admin-playoffs .playoff-col-wrap .playoff-col-first{
    float:left;
    padding:0;
    width:50%;
}
.admin-playoffs .playoff-col-wrap .playoff-choices-deadline{
    float:left;
    padding:0;
    width:40%;
}
.admin-playoffs .playoff-col-wrap .playoff-form{
    float:left;
    padding:0;
    width:10%;
}
.admin-playoffs .playoff-col-wrap .playoff-form .form-check{
    padding:0;
    margin:0;
    width:16px;
    height:16px;
    vertical-align:midle;
}
.admin-playoffs .playoff-col-item{
    padding:0;
    margin:2px auto;
    height:20px;
}
.admin-playoffs .playoff-form .playoff-col-item{
    width:20px;
}
.admin-playoffs .form-field{
    margin:0 1%;
    padding:0;
    width:98%;
    height:20px;
}
.admin-playoffs .playoff-submit{
    margin:5px 5%;
    padding:0;
    width:90%;
}
.admin-update-rank-wrap{
    margin:1% auto;
    padding:1%;
    min-width:1200px;
    border:1px #666 solid;
    background:rgba(75,75,75,0.5);
    overflow:hidden;
}
.admin-update-rank-wrap .player-ranks{
    
}
.admin-update-rank-wrap .player-ranks td{
    text-align:center;
    width:4%;
}
.admin-update-rank-wrap .player-ranks td:first-child{
    width:15%;
}

.export td{
    text-align:center;
}

.edit-player-page{
    margin:0 auto;
    padding:0;
    max-width:1600px;
    
}
.edit-player-page .edit-players{
    width:1000px;
}
.edit-player-page .edit-players tr:first-child{
    text-align:center;
}
.edit-player-page .edit-players td{
    padding:0.5%;
    width:15%;
    font-size:12px;
}
.edit-player-page .edit-players td:first-child{
    width:2%;
    text-align:center;
}
.edit-player-page .edit-players td:nth-child(1n+6){
    width:5%;
}

.edit-player-page .edit-players td .form-field{
    height:20px;
}
.edit-player-page .edit-players td .form-check{
    margin:0;
    padding:0;
    width:20px;
    height:20px;
    position:relative;
    left:50%;
    transform:translate(-50%,0);
}
#edit-player-form{
    overflow:auto;
}
.toggleOnUpdate{
    background:#E0E700;
}
.toggleOnDelete{
    background:#FF0000;
}

.edit-knockout{
    
}
.edit-knockout-select{
    background:rgba(0,0,0,0);
    border:0;
    width:100%;
}