body {
  font-family: sans-serif;
  box-sizing: border-box;
}

.frr-login {
      font-size: 10px;
      border-radius: 5px;
  }

.frr-bg {
    background-color: rgb(255,255,255);
}

.tourpasswidth {
    width: 75px;
}

.reward img{
        height: 100%;
        display: block;
        object-fit: cover;
        object-position: top;
   }
   
.homeheaderpage {
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(/images/FRRHeader.png);
}
.homefooterpage {
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(/images/FRRFooter.png);
}

.eventpage {
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(/images/ZWF-Volcano-Inside.png);
}

.teampage {
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(/images/ZWF-Waptopia-HillyKOM.jpg);
}

.riderpage {
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(/images/ZWF-London-PRU-banner.jpg);
}

.homepage {
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(/images/ZWIFT-Libbyhill-cobbles.jpg);
}

.standingspage {
    background-size: cover;
    background-image: url(/images/ZWF-Innsbruck-KOM.jpg);
}

.gallerypage {
    background-size: cover;
    background-image: url(/images/ZWF-NewYork-Tunnel.jpg);
}

.TTTTpage {
    background-size: cover;
    background-image: url(/images/3RTTT.jpg);
}

.ZRLTpage {
    background-size: cover;
    background-image: url(/images/ZRL-BeachFront.png);
}

.TTTadminpage {
    background-size: cover;
    background-image: url(/images/ZWF-NewYork-Tunnel.jpg);
}

.ZRLadminpage {
    background-size: cover;
    background-image: url(/images/ZRL-BeachFront.png);
}

.seriesadminpage1 {
    background-size: cover;
    background-image: url(/images/ZRL-BeachFront.png);
}
.seriesadminpage2 {
    background-size: cover;
    background-image: url(/images/France-No\ HUD-Petit-KOM-Ven-Top.jpg);
}

.infoadminpage {
    background-size: cover;
    background-image: url(/images/France-No\ HUD-Petit-KOM-Ven-Top.jpg);
}

.bgcarbon {
    background:
        linear-gradient(27deg, #151515 5px, transparent 5px) 0 5px,
        linear-gradient(207deg, #151515 5px, transparent 5px) 10px 0px,
        linear-gradient(27deg, #222 5px, transparent 5px) 0px 10px,
        linear-gradient(207deg, #222 5px, transparent 5px) 10px 5px,
        linear-gradient(90deg, #1b1b1b 10px, transparent 10px),
        linear-gradient(#1d1d1d 25%, #1a1a1a 25%, #1a1a1a 50%, transparent 50%, transparent 75%, #242424 75%, #242424);
        background-color: #131313;
        background-size: 20px 20px;
}
.bgpolkadot {
        background: radial-gradient(#FAFAFA 10%, transparent 10%);
        background-color: #E53935;
        background-position: 0 0, 5px 5px;
        background-size: 10px 10px;
      
}

.infoHOME {
      overflow-x: hidden;
      overflow-y: auto;
      height: 1000px;
      border: 0px solid WHITE;
      border-radius: 10px;
      background-color: black;
}

.galleryHOME {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 600px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);

}

.infoSELECTION {
    overflow-x: hidden;
    overflow-y: auto;
    font-weight: bold;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.infoSELECTION300 {
    overflow-x: hidden;
    overflow-y: auto;
    font-weight: bold;
    height: 300px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.infoSELECTION400 {
    overflow-x: hidden;
    overflow-y: auto;
    font-weight: bold;
    height: 400px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.infoSELECTION500 {
    overflow-x: hidden;
    overflow-y: auto;
    font-weight: bold;
    height: 500px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.infoSELECTIONSPLIT {
    overflow-x: hidden;
    overflow-y: auto;
    font-weight: bold;
    height: 320px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}


.inputMIDDLE {
    overflow-x: hidden;
    overflow-y: auto;
    font-weight: bold;
    height: 700px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.infoEVENT {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 260px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.infoTEAM {
    overflow-x: hidden;
    overflow-y: auto;
    margin-top:10px;
    font-size: 15px;
    font-weight: bold;
    height: 350px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.infoTEAMaction {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 300px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.infoRIDER {
    overflow-x: hidden;
    overflow-y: auto;
    margin-top:10px;
    font-size: 15px;
    font-weight: bold;
    height: 350px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.infoRIDERdb {
    overflow-x: hidden;
    overflow-y: auto;
    margin-top:10px;
    font-size: 15px;
    font-weight: bold;
    height: 400px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.infoRIDERaction {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 260px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.tttSELECT {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.feedbackSELECT {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 12px;
    font-weight: bold;
    height: 320px;
    width:40%;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.feedbackACTION {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 320px;
    width:40%;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.frrSTATS {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 12px;
    font-weight: bold;
    color:white;
    border-radius: 10px;
}

.manageteamSELECT {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 300px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.manageteamACTION {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 400px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.TEAMSELECT {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 12px;
    font-weight: bold;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,1);
}

.zrlrosterSELECT {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 12px;
    font-weight: bold;
    height: 320px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.zrlrosterACTION {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 320px;
    width:60%;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.zrlresultsSELECT {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 320px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}
.zrlresultsACTION {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 320px;
    
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.memberINFO {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 650px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.frrschedule {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}


.seriesresultsSELECT {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 12px;
    font-weight: bold;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.frrSTATSselect {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}
.frrresultsACTION {
    overflow-x: hidden;
    overflow-y: auto;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.frrinformation {
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 15px;
    font-weight: bold;
    height: 600px;
    color:white;
    border: 1px solid WHITE;
    border-radius: 10px;
    background-color: rgba(0,0,102,0.5);
}

.tttDISPLAY {
    font-size: 15px;
    font-weight: bold;
    color:black;
}

.submitsave {
    color:white;
    font-weight: bold;
    background-color: rgba(245, 7, 7, 0.9);
}

.submitquit {
    color:black;
    font-weight: bold;
    background-color:lightskyblue;
}

.rostername {
    background-color: lightblue;
}

.infoinput {
    background-color:  rgb(243, 192, 23);
}

.inforeadonly {
    background-color:  rgb(70,193,235);
}

/*Text formatting */
.HLwhite {color:white;}
.HLred {color:red;}

.HLred15 {
    font-size: 15px;
    font-weight: bold;
    color:red;
}

.HLorange15 {
    font-size: 15px;
    font-weight: bold;
    color:orange;
}

.HLorange20 {
    font-size: 20px;
    font-weight: bold;
    color:orange;
}

.HLred18 {
    font-size: 18px;
    font-weight: bold;
    color:red;
}

.HLred20 {
    font-size: 20px;
    font-weight: bold;
    color:red;
}

.HLblack14 {
    font-size: 14px;
    font-weight: bold;
    color: black;
}

.HLblack15 {
    font-size: 15px;
    font-weight: bold;
    color: black;
}
.HLblack18 {
    font-size: 18px;
    font-weight: bold;
    color: black;
}

.HLwhite12 {
    font-size: 12px;
    font-weight: bold;
    color:white;
}

.HLwhite15 {
    font-size: 15px;
    font-weight: bold;
    color:white;
}

.HLwhite18 {
    font-size: 18px;
    font-weight: bold;
    color:white;
}

.HLwhite20 {
    font-size: 20px;
    font-weight: bold;
    color:white;
}


.HLblack18tttcc {
    font-size: 18px;
    font-weight: bold;
    background-color: black;
    color:white;
}
.HLred18tttcc {
    font-size: 18px;
    font-weight: bold;
    background-color:red;
    color:white;
}

.HLgreen18tttcc {
    font-size: 18px;
    font-weight: bold;
    background-color:green;
    color:white;
}

.HLblue18tttcc {
    font-size: 18px;
    font-weight: bold;
    background-color:blue;
    color:white;
}

.HLorange18tttcc {
    font-size: 18px;
    font-weight: bold;
    background-color:orange;
    color:white;
}

.toggle {
    cursor: pointer;
    display: inline-block;
  }
  
  .toggle-switch {
    display: inline-block;
    background: red;
    border-radius: 16px;
    width: 58px;
    height: 32px;
    position: relative;
    vertical-align: middle;
    transition: background 0.25s;
  }
  .toggle-switch:before, .toggle-switch:after {
    content: "";
  }
  .toggle-switch:before {
    display: block;
    background: linear-gradient(to bottom, #fff 0%, #eee 100%);
    border-radius: 50%;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);
    width: 24px;
    height: 24px;
    position: absolute;
    top: 4px;
    left: 4px;
    transition: left 0.25s;
  }
  .toggle:hover .toggle-switch:before {
    background: linear-gradient(to bottom, #fff 0%, #fff 100%);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5);
  }
  .toggle-checkbox:checked + .toggle-switch {
    background: yellow;
  }
  .toggle-checkbox:checked + .toggle-switch:before {
    left: 30px;
  }
  
  .toggle-checkbox {
    position: absolute;
    visibility: hidden;
  }
  
  .toggle-label {
    margin-left: 5px;
    position: relative;
    top: 2px;
  }
  

  .fa {
    padding: 5px;
    font-size: 10px;
    width: 30px;
    text-align: center;
    text-decoration: none;
    margin: 2px 2px;
  }
  
  .fa:hover {
      opacity: 0.7;
  }
  
  .fa-facebook {
    background: #3B5998;
    color: white;
  }
  
  .fa-twitter {
    background: #55ACEE;
    color: white;
  }
  
  .fa-google {
    background: #dd4b39;
    color: white;
  }
  
  .fa-linkedin {
    background: #007bb5;
    color: white;
  }
  
  .fa-youtube {
    background: #bb0000;
    color: white;
  }
  
  .fa-instagram {
    background: #125688;
    color: white;
  }
  
  .fa-pinterest {
    background: #cb2027;
    color: white;
  }
  
  .fa-snapchat-ghost {
    background: #fffc00;
    color: white;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
  }
  
  .fa-skype {
    background: #00aff0;
    color: white;
  }
  
  .fa-android {
    background: #a4c639;
    color: white;
  }
  
  .fa-dribbble {
    background: #ea4c89;
    color: white;
  }
  
  .fa-vimeo {
    background: #45bbff;
    color: white;
  }
  
  .fa-tumblr {
    background: #2c4762;
    color: white;
  }
  
  .fa-vine {
    background: #00b489;
    color: white;
  }
  
  .fa-foursquare {
    background: #45bbff;
    color: white;
  }
  
  .fa-stumbleupon {
    background: #eb4924;
    color: white;
  }
  
  .fa-flickr {
    background: #f40083;
    color: white;
  }
  
  .fa-yahoo {
    background: #430297;
    color: white;
  }
  
  .fa-soundcloud {
    background: #ff5500;
    color: white;
  }
  
  .fa-reddit {
    background: #ff5700;
    color: white;
  }
  
  .fa-rss {
    background: #ff6600;
    color: white;
  }