/* ######################## */
/* # Hero                 # */
/* ######################## */
.herocontainer                                              {width:100%; min-height:560px; background-image:linear-gradient(to bottom, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0) 17%),url('/Images/Header/Pattern-DarkBlue.png?1=1'); background-attachment: fixed; background-size: contain cover; background-position: center; background-repeat: no-repeat; padding:0px; z-index:2; position:relative; display:flex; align-items: center; justify-content: center;}
.herologo                                                   {width:400px; }
.herocontainer .stamp                                       {z-index:1000; position:absolute; transform:translate(0, 0) rotate(-15deg) scale(20); opacity:0;transition:opacity 0.3s ease-in 1.5s, transform 0.3s ease-in 1.5s;}
.stampintoview                                              {opacity:1 !important; transform:translate(55px, 160px) rotate(-12deg) scale(0.7) !important; }

/* iPad Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {
    .herocontainer {background-attachment:scroll;}
  }
/* iPad Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {
    .herocontainer {background-attachment:scroll;}
}

select:disabled {background-color: #e9ecef;color: #6c757d;cursor: not-allowed;opacity: 1;}
input:disabled {background-color: #e9ecef;color: #6c757d;cursor: not-allowed;opacity: 1;}

.loadingicon                                                {width:70px;}

/* ######################## */
/* # Alert/Popup          # */
/* ######################## */
#alertbg					                                  {font-size:15px; position: fixed;left: 0px;top: 0px; z-index:1000; background-color:rgba(0, 0, 0, 0.7); width:100%; height:100%; border:0px red solid; text-align:center; display:flex; align-items:center; justify-content: center;}
#alertbox_data        				                      {position: fixed;left: auto; top:50px; max-height:calc(90vh - 50px); overflow-y:auto; width:75%; background-color:white; border:1px solid black; border-radius:10px; }
#alertboxtitle_data       			                    {border:0px red solid; font-weight:bold; text-align:center; padding:20px 20px 10px 20px;}
#alertboxmessage_data                               {border:0px green solid; text-align:center;padding:10px 20px 20px 20px; }
#alertboxbuttons_data         		                  {border-top:1px silver solid;}
#alertbox_data td         			                    {text-align:center;}
#alertbox_data .leftbutton        	                {border-right:1px solid silver; cursor:pointer; padding:20px;}
#alertbox_data .rightbutton	                        {cursor:pointer; padding:20px;}


/* ######################## */
/* # Videi Popup          # */
/* ######################## */
#videobox_generalinfo				                        {position: fixed; top:50px; height:calc(90vh - 50px); overflow-y:hidden; width:75%; max-width:500px; background-color:white; border:1px solid black; border-radius:10px; }
#videoboxtitle_generalinfo			                        {border:0px red solid; font-weight:bold; text-align:center; padding:20px 20px 10px 20px;}
#videoboxmessage_generalinfo                                {border:0px green solid; text-align:center;padding:10px 20px 20px 20px; }
#videoboxbuttons_generalinfo		                        {border-top:1px silver solid; height:60px; bottom:0; position:absolute; width:100%}
#videobox_generalinfo td			                        {text-align:center;}
#videobox_generalinfo .leftbutton	                        {border-right:1px solid silver; cursor:pointer; padding:20px;}
#videobox_generalinfo .rightbutton	                        {cursor:pointer; padding:20px;}
#videobox_generalinfo video 	                            {border-radius:10px; }

/* ######################## */
/* # Body                 # */
/* ######################## */
.body                                                       {padding:0px; display:flex; flex-direction: column; align-items: center; justify-content: flex-start; border:px red solid}
.cta                                                        {border:0px blue solid; text-align: center; padding:10px 10px 20px 30px;}
#categoryanchor                                             {visibility:hidden; border:1px red solid; height:50px; width:100px; position:absolute; transform: translateY(-130px);}
.categories                                                 {border:0px red solid;text-align: left; padding:20px 0px 20px 0px; width:1000px; margin-left:0; margin-right:0; position:relative}
.category                                                   {border:0px blue solid; display:flex; flex-direction: row; gap:20px; margin-bottom:100px}
.category.odd                                               {flex-direction: row-reverse;}
.category .image                                            {border:0px red solid; padding:0px; width:30%}
.category .text                                             {border:0px blue solid; padding:0 30px 0 30px; width:65%; text-align: center;}
.categoryimage                                              {width:100%; border:0px solid silver; border-radius: 10px; padding:0px;}
.category .text h3                                          {margin-top:0;}

.videoplayer                                                {border:0px blue solid; display:flex; flex-direction: row; gap:20px; margin-bottom:150px; margin-top:80px}
.videoplayer.odd                                            {flex-direction: row-reverse;}
.videoplayer .image                                         {border:0px red solid; padding:0px; width:60%}
.videoplayer .text                                          {border:0px blue solid; padding:0 30px 0 30px; width:65%; text-align: center;}
.videoplayer img                                            {width:100%; border:0px solid silver; border-radius: 10px; padding:0px;}
.videoplayer .text h3                                       {margin-top:0;}

.statscontainer                                             {background-color:white; width:100vw; display:flex; justify-content: center; margin:50px 0 50px 0;background-image:url('/Images/Backgrounds/Background-Confetti-Gold.png'); background-size:300px}
.stats                                                      {width:1000px; border:0px blue solid; text-align: center; padding:50px 10px 50px 10px; display:flex; flex-wrap: wrap; flex-direction:row; align-items: center; justify-content:space-evenly; gap:50px;}
.stats .iconcontainer                                       {margin-bottom:10px}
.stats h1                                                   {font-size:3rem; font-weight: 300; margin:0; border:0px red solid; line-height: 3rem;}
.stats p                                                    {margin:0;  border:0px red solid; font-weight:400}
.stat                                                       {border:0px red solid; width:190px; background-color:white;}

/* ######################## */
/* # Tabs                 # */
/* ######################## */
.tabs                                                       {display:flex; justify-content: space-evenly;}
.tabbody                                                    {display:flex; flex-direction: column; align-items: center; border:0px red solid; width:100%; max-width:auto; padding:20px 0 0 0px;}
.tabbody.upload                                             {height:auto;}
.tabbody.upload h2                                          {}

::selection                                                {color: #fff;background: #6990F2;}
.fileupload .field                                         {position:relative; border:0px red solid; padding-bottom:3px;}
.fileupload .uploadicon                                    {width:300px; height:auto}
.fileupload .content                                       {border:0px red solid; height:calc(100% - 100px); overflow-x:auto; overflow-y:auto; padding:0; display:flex; scroll-snap-type:x mandatory; -webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;}
.fileupload .content::-webkit-scrollbar                    {display: none;}
.fileupload li                                             {list-style: none;}
.fileupload .progress-area .row .uploadcontent             {width: 100%;}
.fileupload .progress-area .details                                     {display: flex;align-items: center;margin-bottom: 7px;justify-content: space-between;}
.fileupload .progress-area .uploadcontent .progress-bar                 {height:6px;width:100%;margin-bottom: 4px;background: #fff;border-radius: 30px}
.fileupload .uploadcontent .progress-bar .progress                      {height: 100%;width: 0%;background: #6990F2;border-radius: inherit;}
.fileupload .uploaded-area                                              {max-height: 232px; overflow-y: scroll;}
.fileupload .uploaded-area.onprogress                                   {max-height: 150px;}
.fileupload .uploaded-area::-webkit-scrollbar                           {width: 0px;}
.fileupload .uploaded-area .row .uploadcontent                          {display: flex;align-items: center;}
.fileupload .uploaded-area .row .details                                {display: flex;margin-left: 15px;flex-direction: column; width:100%; justify-content: center;}
.fileupload .uploaded-area .row .details .size                          {color: #404040;font-size: 11px;}
.fileupload .uploaded-area i.fa-check                                   {font-size: 16px;}

/* ######################## */
/* # Upload CTA           # */
/* ######################## */
.uploadctacontainer                                           {margin-left: calc(50% - 50vw); min-height:300px; width:100vw; margin-bottom:70px; color:white; background-color:#1c6991; display:flex; flex-direction: column; padding:30px 0 30px 0; align-items:center; justify-content: center;background-image:url('/Images/Header/Pattern-Grey-25.png'); background-attachment: fixed; background-size:  cover; background-position: center; background-repeat: no-repeat; }
.uploadctacontainer h1                                        {font-weight:400; margin-bottom:0; margin-top:0;}
.uploadctacontainer p                                         {width:100%; max-width:1000px; text-align: center;}

/* ######################## */
/* # Upload Tabs          # */
/* ######################## */
.memberloggedin .optiontabs                                   {width:100%; border:0px rgb(175, 175, 175) inset; background-color:var(--lightgrey); border-radius: 8px; padding:5px 0 5px 0px; display:flex; flex-direction: row; justify-content:stretch; gap:0px; overflow:hidden; position:relative;}
.memberloggedin .optiontab                                    {height:100%; width:100%; border:0px red solid; border-radius: 8px; padding:2px; flex-grow: 1; position:relative; z-index:0; cursor:pointer; text-align: center;}
.memberloggedin .selector                                     {background-color:white; height:calc(100% - 6px);  position:absolute; top:3px; left:3px; border-radius: 7px; box-shadow: 0px 0px 7px rgb(127, 127, 127); cursor:pointer; transition: transform 0.25s;}
.memberloggedin .optiondivider                                {width:1px; border-right:1px solid silver;}
.memberloggedin .panels                                       {border:0px red solid; margin-top:20px; position:relative}
.memberloggedin .panel                                        {border:0px blue solid;width:100%; position:absolute;}
.memberloggedin .panel p                                      {padding:0; margin:0 0 10px 0}

/* ######################## */
/* # Popups               # */
/* ######################## */
.popup                                                        {width:1000px; background-color:white; position:fixed; bottom:0; margin-bottom:0px; border-radius: 20px 20px 0 0; z-index:20; box-shadow: 0px 0px 10px 1px #b4b3b3; transition: transform 0.5s ease-in-out 0s; overflow:hidden;}
.popup .header                                                {display:flex; align-items: center; justify-content: space-between;; border-bottom:1px solid var(--lightgrey); background-color:white; padding:10px 15px 10px 15px; margin:0;}
.popup .header h2                                             {padding:0; margin:0;}
.popup .header .icon                                          {width:20px; height:20px; cursor:pointer}                
.popup .content                                               {padding:5px 20px 20px 20px;}
.popupbackground                                              {position:fixed; top:0; left:0; width:100vw; height:100vh; background-color:rgba(0, 0, 0, 0.481); z-index:16; display:none; opacity:0; transition: opacity 0.5s}
.popup .searchfield                                           {padding:10px; border-radius: 10px; width:100%; border:1px solid grey}
.popup .infoicon                                              {width:15px; height:15px; margin-right:5px; cursor:pointer;}

/* ######################## */
/* # Upload Info Popup    # */
/* ######################## */
.uploadinfopopup                                              {height:calc(100vh - 50px); transform: translateY(130%);width:calc(100% - 200px);}
.uploadinfopopup .content                                     {padding:0 20px 20px 20px; overflow-y:auto;border:0px red solid; height:calc(100% - 50px)}
.uploadinfopopup .headercontainer                             {display:none; grid-template-columns: 50% 50%; padding-bottom:20px;margin-bottom:0px; }

.uploadinfopopup .existingcompetitioncontainer                {grid-column-start: 1; grid-column-end: 3; grid-row-start: 1; grid-row-end: 1;}
.uploadinfopopup .typecontainer                               {grid-column-start: 1; grid-column-end: 3; grid-row-start: 2; grid-row-end: 2;}
.uploadinfopopup .namecontainer                               {grid-column-start: 1; grid-column-end: 3; grid-row-start: 3; grid-row-end: 3;}
.uploadinfopopup .locationcontainer                           {grid-column-start: 1; grid-column-end: 3; grid-row-start: 4; grid-row-end: 4;}
.uploadinfopopup .countrycontainer                            {grid-column-start: 1; grid-column-end: 1; grid-row-start: 5; grid-row-end: 5;}
.uploadinfopopup .datecontainer                               {grid-column-start: 12; grid-column-end: 2; grid-row-start: 5; grid-row-end: 5;}
.uploadinfopopup .moreinfocontainer                           {grid-column-start: 1; grid-column-end: 3; grid-row-start: 6; grid-row-end: 6; text-align:left;}
.uploadinfopopup .buttoncontainer                            {grid-column-start: 1; grid-column-end: 4; grid-row-start: 7; grid-row-end: 7;}
.uploadinfopopup .filescontainer                              {border:0px red solid; display:none; text-align:left;}
.uploadinfopopup .filescontainer h3                           {border:0px green solid; margin-top:0; padding-top:0}
.uploadinfopopup .toolbar                                     {border-top:1px solid silver; width:100%; display:flex; justify-content: flex-end; padding:10px; gap:20px;}
.uploadinfopopup .toolbar img                                 {height:25px; cursor:pointer;}


/* ######################## */
/* # Upload Fields        # */
/* ######################## */
#divFileUploadBefore .headercontainer                             {display:grid; grid-template-columns: 50% 50%; padding-bottom:10px;margin-bottom:0px; }
#divFileUploadBefore .typecontainer                               {grid-column-start: 1; grid-column-end: 3; grid-row-start: 1; grid-row-end: 1;}
#divFileUploadBefore .namecontainer                               {grid-column-start: 1; grid-column-end: 3; grid-row-start: 2; grid-row-end: 2;}
#divFileUploadBefore .locationcontainer                           {grid-column-start: 1; grid-column-end: 3; grid-row-start: 3; grid-row-end: 3;}
#divFileUploadBefore .datecontainer                               {grid-column-start: 1; grid-column-end: 1; grid-row-start: 4; grid-row-end: 4;}
#divFileUploadBefore .countrycontainer                            {grid-column-start: 2; grid-column-end: 2; grid-row-start: 4; grid-row-end: 4;}
#divFileUploadBefore .moreinfocontainer                           {grid-column-start: 1; grid-column-end: 3; grid-row-start: 5; grid-row-end: 5;}
#divFileUploadBefore .buttoncontainer                             {grid-column-start: 1; grid-column-end: 4; grid-row-start: 6; grid-row-end: 6;}

/* ######################## */
/* # FILE Info Popup      # */
/* ######################## */
.fileinfopopup                                              {height:calc(100vh - 50px); transform: translateY(130%);width:calc(100% - 200px)}
.fileinfopopup .content                                     {padding:0 20px 20px 20px;  overflow-y:auto; border:0px red solid; height:calc(100% - 50px)}
.fileinfopopup #divFileDataContainer                        {width:calc(100%);}

/* ######################## */
/* # PANEL RESULTS Popup  # */
/* ######################## */
.panelresultspopup                                            {height:calc(100vh - 50px); transform: translateY(130%);width:1000px; z-index:200}
.panelresultspopup .content                                   {padding:0 20px 20px 20px;  overflow-y:hidden; border:0px red solid; height:calc(100% - 50px)}

/* ######################## */
/* # Panel popup Tabs     # */
/* ######################## */
.panelresultspopup .optiontabs                                {width:100%; border:0px rgb(175, 175, 175) inset; background-color:var(--lightgrey); border-radius: 8px; padding:5px 0 5px 0px; display:flex; flex-direction: row; justify-content:stretch; gap:0px; overflow:hidden; position:relative;}
.panelresultspopup .optiontab                                 {height:100%; width:100%; border:0px red solid; border-radius: 8px; padding:2px; flex-grow: 1; position:relative; z-index:0; cursor:pointer; text-align: center; font-size:1rem}
.panelresultspopup .selector                                  {background-color:white; height:calc(100% - 6px);  position:absolute; top:3px; left:3px; border-radius: 7px; box-shadow: 0px 0px 7px rgb(127, 127, 127); cursor:pointer; transition: transform 0.25s;}
.panelresultspopup .optiondivider                             {width:1px; border-right:1px solid silver;}
.panelresultspopup .panels                                    {border:0px red solid; margin-top:20px; position:relative}
.panelresultspopup .panel                                     {border:0px blue solid;width:100%; position:absolute;}
.panelresultspopup .panel                                     {border:0px green  solid; height:calc(100vh - 370px); overflow:auto;}
.panelresultspopup .panel p                                   {padding:0; margin:0 0 10px 0}
.panelresultspopup .desktop                                   {display:}
.panelresultspopup .mobile                                    {display:none;}
.panelresultspopup .desktopcol                                {display:table-cell;}
.panelresultspopup .mobilecol                                 {display:none;}
.panelresultspopup .panels table                                      {font-size:0.8rem; border:0px silver solid; width:100%}
.panelresultspopup .panels th                                         {text-align:left; border-top:0px lightgrey solid; padding:10px 5px 10px 5px;}
.panelresultspopup .panels td                                         {text-align:left; border-top:1px lightgrey dotted;  padding:5px 5px 5px 5px;} 

/* ######################## */
/* # RESULTS Popup        # */
/* ######################## */
.resultspopup                                                   {height:calc(100vh - 50px); transform: translateY(130%);width:1000px; z-index:100}
.resultspopup .content                                          {padding:0 20px 20px 20px;  overflow-y:auto; border:0px red solid; height:calc(100% - 50px)}
.resultspopup .competitiondate                                  {font-size:1rem}
.resultspopup .competitioncategory                              {font-size:1rem; margin-top:20px;}
.resultspopup .competitioneventname                             {font-size:1rem; letter-spacing:}
#divResultsContainer table                                      {font-size:0.8rem; border:0px silver solid; width:100%}
#divResultsContainer th                                         {text-align:left; border-bottom:1px lightgrey solid; padding:10px 5px 10px 5px;}
#divResultsContainer td                                         {text-align:left; border-top:1px lightgrey dotted;  padding:10px 5px 10px 5px;}
#divResultsContainer td a                                       {text-decoration: underline; color:blue;}
#divResultsContainer td a:visited                               {text-decoration: underline; color:purple;}
#divResultsContainer .flag                                      {height:15px; width:auto}
#divResultsContainer .headericon                                {height:15px; width:auto}
#divResultsContainer .arrow                                     {width:10px;}
#divResultsContainer .backarrow                                 {width:15px; position:relative; margin-left:-0px; cursor:pointer;}
#divResultsContainer .searchfield                               {background-image:url('/Images/Icons/Search.png'); background-repeat: no-repeat; background-size:25px; background-position:right 10px center; padding-right:45px}
#divResultsContainer .clickablearea                             {border:0px red solid; height:40px; width:45px; right:5px; top:10px;position:absolute; cursor:pointer;}
#divResultsContainer .icon                                      {width:25px;}
#divResultsContainer td._pb                                     {background-color:rgba(0, 255, 0, 0.1)}
#divResultsContainer td._sb                                     {background-color:rgba(0, 132, 255, 0.1)}
#divResultsContainer div.pb                                     {background-color:rgb(6, 148, 6); color:white; width:100%; height:15px; border-radius: 10px; position:relative; display:flex; justify-content: center; align-items: center;margin-left: auto; font-size:0.6rem}
#divResultsContainer div.sb                                     {background-color:rgb(43, 104, 160); color:white;width:100%; height:15px; border-radius: 10px; position:relative;  display:flex; justify-content: center; align-items: center;margin-left: auto; font-size:0.6rem}
.resultspopup .desktop                                          {display:}
.resultspopup .mobile                                           {display:none;}
.resultspopup .desktopcol                                       {display:table-cell;}
.resultspopup .mobilecol                                        {display:none;}

/* ######################## */
/* # Leader Board Box     # */
/* ######################## */
.leaderboardcontainer                                         {display:flex; flex-direction: column; justify-content: flex-start; align-items: center; background-color:rgb(243, 243, 243, 0); height:auto; min-height:calc(100vh - 153px); box-sizing: border-box;border:0px red solid; width:100%; padding:20px 20px 0 20px;}
.leaderboardcontainer .filterbox                              {border:1px solid #eff1f4; background-color:white; border-radius: 10px; width:100%; max-width:1000px; box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.226); text-align: center; padding:0px 50px 20px 30px;background-image:url('/Images/Header/Pattern-grey-25.png'); background-attachment: fixed; background-size: contain cover; background-position: center; background-repeat: no-repeat;}
.leaderboardcontainer .leaderboardsummary                     {border:0px red solid; margin:50px 0 50px 0; display:flex; justify-content: space-evenly;  column-gap:20px; row-gap:60px; width:100%; max-width:1000px; flex-wrap: wrap;}
.leaderboardcontainer .leaderboardsummary .banner             {border:0px red solid;width:calc(33% - 20px); flex-shrink: 0; position: relative;}
.leaderboardcontainer .leaderboardsummary .box                {width:100%; height:auto;}
.leaderboardcontainer .leaderboardsummary .button2            {min-width:200px; height:40px; width:auto; padding:10px 20px 10px 20px; background-image: url('/Images/Icons/Trophy_WH.png'), url('/Images/Icons/Arrow-Right_WH.png'), url('/Images/Backgrounds/Gold.png'); background-repeat: no-repeat, no-repeat, repeat; background-size:20px, 15px, 100%;  background-position: 8px center, right center, center center; border:2px solid white; position:absolute;bottom:-5px; left:50%; transform:translateX(-50%); display:flex; justify-content: center; align-items: center; color:white; font-size:1rem; font-weight: 400;box-shadow: 2px 2px 10px 2px rgba(0, 0, 0, 0.25);}
.leaderboardcontainer .leaderboardsummary .competitors        {border:0px red solid; position:absolute; left:0; top:90px; width:calc(100% - 25px); padding:0 0px 0 0px; margin:0 0px 0 10px; display:flex; justify-content: space-evenly; box-sizing:border-box;}
.leaderboardcontainer .leaderboardsummary .competitor         {border:0px green solid; width:100%; height:170px; top:10px; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; position:relative; padding:15px 10px 10px 10px; }
.leaderboardcontainer .leaderboardsummary .discipline         {border:0px purple solid; width:100%; height:45%; padding:20px; position:absolute;top:-70px; display:flex; justify-content: center; align-items: center; color:white; font-size:1.1rem; font-weight: 500; line-height: 1.1rem}
.leaderboardcontainer .leaderboardsummary .crown1             {width:auto; height:65px; top:-130px; left:50%; transform:translateX(-50%); position:absolute;}
.leaderboardcontainer .leaderboardsummary .crown2             {width:auto; height:70px; top:-130px; left:50%; transform:translateX(-50%); position:absolute;}
.leaderboardcontainer .leaderboardsummary .flag               {width:50px; height:25px; margin-bottom:10px;cursor:help}
.leaderboardcontainer .leaderboardsummary .competitor .name   {font-size:1.1rem; font-weight: 500; width:100%; text-align: center;}
.leaderboardcontainer .leaderboardsummary .competitor .score  {font-size:1.5rem; font-weight: 500; width:100%; text-align: center; margin-top:20px;}
.leaderboardcontainer .leaderboardsummary .competitor .date   {font-size:0.7rem; font-weight: 400; width:100%; text-align: center; margin-top:0px;}

.leaderboardcontainer .leaderboardsummary .competitor:nth-child(n+3):last-child {border-left:2px rgb(218, 179, 80) solid;} 

.leaderboardfilterfieldcontainer                              {display:grid; grid-template-columns: 1fr 1fr 1fr; margin-bottom:20px;}
#cboLeaderBoardYear                                           {grid-column-start: 1; grid-column-end: 1; grid-row-start: 1; grid-row-end: 1;}
#cboLeaderBoardCountry                                        {grid-column-start: 2; grid-column-end: 4; grid-row-start: 1; grid-row-end: 1;}
#cboLeaderBoardDiscipline                                     {grid-column-start: 1; grid-column-end: 3; grid-row-start: 2; grid-row-end: 2;}
#cboLeaderBoardSegment                                        {grid-column-start: 3; grid-column-end: 3; grid-row-start: 2; grid-row-end: 2;}
#cboLeaderBoardGender                                         {grid-column-start: 1; grid-column-end: 1; grid-row-start: 3; grid-row-end: 3;}
#cboLeaderBoardAge                                            {grid-column-start: 2; grid-column-end: 2; grid-row-start: 3; grid-row-end: 3;}
#cboLeaderBoardAgeLevel                                       {grid-column-start: 3; grid-column-end: 3; grid-row-start: 3; grid-row-end: 3;}


/* ######################## */
/* # Search Box           # */
/* ######################## */
.searchbrowsecontainer                                  {display:flex; flex-direction: column; justify-content: flex-start; align-items: center; background-color:rgb(243, 243, 243, 0); height:auto; min-height:calc(100vh - 153px); box-sizing: border-box;border:0px red solid; width:100%; padding:20px 20px 0 20px;}
.searchbrowsecontainer .searchbox                       {border:1px solid #eff1f4; background-color:white; border-radius: 10px; width:100%; max-width:1000px; box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.226); text-align: center; padding:0px 50px 30px 50px;background-image:url('/Images/Header/Pattern-grey-25.png'); background-attachment:fixed; background-size: contain cover; background-position: center; background-repeat: no-repeat;}
.searchbrowsecontainer .searchfield                     {background-color:white; max-width:500px; background-image: url('/Images/Icons/search.png'); background-position: left center; background-position: 5px center; background-repeat: no-repeat; background-size:20px; padding-left:30px; outline: 1px solid white;}
.searchbrowsecontainer .resultsbox                      {padding:20px;border:1px solid #eff1f4; background-color:white; border-radius: 10px; width:100%; max-width:1000px; box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.226); text-align: center; padding:20px 20px 20px 20px;background-image:url('/Images/Header/Pattern-grey-25.png'); background-attachment: fixed; background-size: contain cover; background-position: center; background-repeat: no-repeat;}
.searchbrowsecontainer .resultsbox th, td               {text-align:left;}
.searchbrowsecontainer .resultsbox td a                 {text-decoration: underline; color:blue;}
.searchbrowsecontainer .resultsbox td a:visited         {text-decoration: underline; color:purple;}
.searchbrowsecontainer .resultsbox .flag                {height:15px; width:auto}
.searchbrowsecontainer .resultsbox .headericon          {height:15px; width:auto}
.searchbrowsecontainer .resultsbox .viewall             {margin-top:10px;}
.searchbrowsecontainer .searchresults                   {width:100%; max-width:1000px; display:flex; flex-direction: row; justify-content: space-between;  row-gap:10px; column-gap: 10px; margin-top:10px; flex-wrap: wrap; padding-bottom:30px; border:0px red solid}
.searchbrowsecontainer .searchresults h3                {width:100%; margin:0px 0 0 0; padding:0;}
.searchbrowsecontainer .searchcategory                  {border:1px solid #eff1f4; cursor:pointer; background-color:white; border-radius: 10px; width:calc(25% - 10px); flex-shrink: 0; flex-grow: 0; box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.226); text-align: center; padding:10px 10px 10px 10px;background-image:url('/Images/Header/Pattern-grey-25.png'); background-attachment: fixed; background-size: 1500px; background-position: top; background-repeat: repeat; display:flex; flex-direction: row; justify-content: flex-start; gap:5px}
.searchbrowsecontainer .searchcategory img              {width:20px; height:20px;}
.searchbrowsecontainer .namesubtext                     {color:grey}
.searchbrowsecontainer .desktopcol                      {display:table-cell;}
.searchbrowsecontainer .mobilecol                       {display:none;}

/* ######################## */
/* # Elements             # */
/* ######################## */
.elementsfiltercontainer                                {padding-bottom:0px; gap:10px; justify-content: space-between; flex-wrap: wrap; position:relative; display:flex;}
.elementsfiltercontainer #txtElementSearch              {width:100%;}
.elementsfiltercontainer #cboElementsElement            {width:calc(75% - 5px);}
.elementsfiltercontainer #cboElementsYear               {width:calc(25% - 5px)}
.elementsfiltercontainer #cboElementsDiscipline         {width:calc(50% - 5px)}
.elementsfiltercontainer #cboElementsAge                {width:calc(50% - 5px)}
.elementsfiltercontainer #cboElementsLevel              {width:calc(50% - 5px)}
.elementsfiltercontainer #cboElementsSegment            {width:calc(50% - 5px)}
.elementsfiltercontainer #cboElementsGender             {width:calc(50% - 5px)}
.elementsfiltercontainer #cboElementsQOE                {width:calc(50% - 5px)}

#divRecentCompetitionsAnchor                            {position:relative; transform: translateY(-120px);}
#divSearchResultsAnchor                                 {position:relative; transform: translateY(-135px);}
#divCompetitorSearchResultsAnchor                       {position:relative; transform: translateY(-135px);}
#divElementSearchResultsAnchor                          {position:relative; transform: translateY(-135px);}
#divLeaderBoardAnchor                                   {position:relative; transform: translateY(-135px); margin-top:20px}

/* ######################## */
/* # Mobile               # */
/* ######################## */
@media only screen and (max-width: 1000px){ 
    .herocontainer                                          {width:100%; height:350px; min-height:350px; background-image:linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 20%),url('/Images/Header/Pattern-DarkBlue.png?1=1'); background-attachment:scroll; background-size:cover ; background-position:center; background-repeat: no-repeat; padding:0px; z-index:; position:relative; display:flex; align-items: center; justify-content: center;}
    .herologo                                               {height:250px; width:auto; }

    /* ######################## */
    /* # Body                 # */
    /* ######################## */    
    .cta                                                    {border:0px blue solid; text-align: center; padding:10px 20px 20px 20px}
    .cta h1                                                 {border:0px blue solid; margin-top:25px}
    #categoryanchor                                         {visibility:; border:1px red solid; height:50px; width:100px; position:absolute; transform: translateY(-120px);}
    .categories                                             {border:0px red solid;text-align: left; padding:0px 20px 20px 20px; width:100%}
    .categories h2                                          {text-align: center;}
    .category                                               {border:0px blue solid; display:flex; flex-direction: column;margin-bottom:50px; gap:10px;text-align: center;display:flex; align-items: center; justify-content: center;}
    .category.odd                                           {flex-direction: column}
    .category .image                                        {border:0px red solid; padding:0px; width:100%;max-width:300px;}
    .category .text                                         {border:0px red solid; padding:0px 0 0px 0; width:100%; text-align: center;}
    .categoryimage                                          {width:100%; max-width:500px; border:0px solid silver; border-radius: 10px;}
    .category .text h3                                      {margin-top:10px;}
    .category .image h3                                     {display:none;margin-bottom:0;}

    .videoplayer                                            {border:0px blue solid; display:flex; flex-direction: column;margin-bottom:50px; gap:10px;text-align: center;display:flex; align-items: center; justify-content: center;margin-top:30px}
    
    .videoplayer.odd                                        {flex-direction: column}
    .videoplayer .image                                     {border:0px red solid; padding:0px; width:100%;max-width:500px;}
    .videoplayer .text                                      {border:0px red solid; padding:0px 0 0px 0; width:100%; text-align: center;}
    .videoplayer img                                        {width:100%; max-width:500px; border:0px solid silver; border-radius: 10px;}
    .videoplayer .text h3                                   {margin-top:10px;}
    .videoplayer .image h3                                  {display:none;margin-bottom:0;}


    .stats                                                  {text-align:center; justify-content:space-evenly; gap:30px; padding:80px 10px 20px 10px;}
    .stats h1                                               {font-size:2rem; font-weight: 300; line-height: 2rem;}
    .stats p                                                {}
    .stat                                                   {width:100px; padding-bottom:30px}
 
    .stampintoview                                          {opacity:1 !important; transform:translate(45px,100px) rotate(-12deg) scale(0.5) !important; }

    #videobox_generalinfo				                    {width:90%;}

    .searchbrowsecontainer .searchbox                       {background-image:url('/Images/Header/Pattern-grey-25.png'); background-attachment:scroll; background-size: 1500px; background-position: top; background-repeat:no-repeat; padding:0px 20px 20px 20px}
    .searchbrowsecontainer .resultsbox                      {background-image:url('/Images/Header/Pattern-grey-25.png'); background-attachment:scroll; background-size: 1500px; background-position: top; background-repeat:no-repeat; padding:20px}
    .searchbrowsecontainer .resultsbox .desktop             {display:none;}
    .searchbrowsecontainer .namesubtext                     {}
    .uploadinfopopup .filescontainer .desktop               {display:none;}
    
    
    .searchbrowsecontainer .searchresults                   {row-gap:10px; column-gap: 10px; margin-top:0px; flex-wrap: wrap;}
    .searchbrowsecontainer .searchresults h3                {margin:10px 0 0 0; }
    .searchbrowsecontainer .searchcategory                  {width:calc(50% - 5px); }
    .searchbrowsecontainer .actionbuttons                   {display:flex; justify-content: space-evenly;}
    .searchbrowsecontainer .desktopcol                      {display:none;}
    .searchbrowsecontainer .mobilecol                       {display:table-cell;}

    #divRecentCompetitionsAnchor                            {position:relative; transform: translateY(-100px);}
    #divSearchResultsAnchor                                 {position:relative; transform: translateY(-100px);}
    #divCompetitorSearchResultsAnchor                       {position:relative; transform: translateY(-100px);}
    #divElementSearchResultsAnchor                          {position:relative; transform: translateY(-100px);}
    #divLeaderBoardAnchor                                   {position:relative; transform: translateY(-100px);}
    #tabCompetition                                         {padding-top:10px;}

    .leaderboardcontainer .filterbox                             {background-image:url('/Images/Header/Pattern-grey-25.png'); background-attachment:scroll; background-size: 1500px; background-position: top; background-repeat:no-repeat; padding:0px 20px 20px 20px}    
    .leaderboardcontainer .filterbox                              {padding:0px 20px 20px 20px; }
    .leaderboardcontainer .leaderboardsummary                     {gap:50px}
    .leaderboardcontainer .leaderboardsummary .banner             {border:0px red solid;width:100%; max-width:350px; flex-shrink: 0; position: relative;}
    .leaderboardcontainer .leaderboardsummary .box                {width:100%; height:auto;}
    .leaderboardcontainer .leaderboardsummary .crown              {width:auto; height:100px; top:10px; left:50%; transform:translateX(-50%); position:absolute;}    
    .leaderboardcontainer .leaderboardsummary .button2            {min-width:200px; height:40px; width:auto; padding:20px; background-image: url('/Images/Icons/Trophy_WH.png'), url('/Images/Icons/Arrow-Right_WH.png'), url('/Images/Backgrounds/Gold.png'); background-repeat: no-repeat, no-repeat, repeat; background-size:20px, 15px, 100%;  background-position: 8px center, right center, center center; border:2px solid white; position:absolute;bottom:-5px; left:50%; transform:translateX(-50%); display:flex; justify-content: center; align-items: center; color:white; font-size:1rem; font-weight: 400;box-shadow: 2px 2px 10px 2px rgba(0, 0, 0, 0.25);}
    .leaderboardcontainer .leaderboardsummary .competitors        {border:0px red solid; position:absolute; left:0; top:100px; width:calc(100% - 30px); padding:0 0 0 0; display:flex; justify-content: space-evenly;}
    .leaderboardcontainer .leaderboardsummary .competitor         {border:0px green solid; width:100%; height:205px; display: flex; flex-direction: column; justify-content: center; align-items: center; position:relative; padding:10px}
    .leaderboardcontainer .leaderboardsummary .discipline         {border:0px red solid; top:-80px; font-size:1.2rem; font-weight: 600;}
    .leaderboardcontainer .leaderboardsummary .crown1             {width:auto; height:60px; top:-135px; left:50%; transform:translateX(-50%); position:absolute;}
    .leaderboardcontainer .leaderboardsummary .crown2             {width:auto; height:75px; top:-140px; left:50%; transform:translateX(-50%); position:absolute;}
    .leaderboardcontainer .leaderboardsummary .competitor .name   {font-size:1.2rem; font-weight: 500; width:100%; text-align: center;}
    .leaderboardcontainer .leaderboardsummary .competitor .score  {font-size:1.5rem; font-weight: 500; width:100%; text-align: center; margin-top:20px;}
 
    .leaderboardfilterfieldcontainer                              {display:grid; grid-template-columns: 1fr 1fr; margin-bottom:20px;}
    #cboLeaderBoardCountry                                        {grid-column-start: 1; grid-column-end: 3; grid-row-start: 1; grid-row-end: 1;}
    #cboLeaderBoardDiscipline                                     {grid-column-start: 1; grid-column-end: 1; grid-row-start: 2; grid-row-end: 2;}
    #cboLeaderBoardSegment                                        {grid-column-start: 2; grid-column-end: 2; grid-row-start: 2; grid-row-end: 2;}

    #cboLeaderBoardYear                                           {grid-column-start: 1; grid-column-end: 1; grid-row-start: 3; grid-row-end: 3;}
    #cboLeaderBoardGender                                         {grid-column-start: 2; grid-column-end: 2; grid-row-start: 3; grid-row-end: 3;}

    #cboLeaderBoardAge                                            {grid-column-start: 1; grid-column-end: 1; grid-row-start: 4; grid-row-end: 4;}
    #cboLeaderBoardAgeLevel                                       {grid-column-start: 2; grid-column-end: 2; grid-row-start: 4; grid-row-end: 4;}

    .uploadinfopopup                                              {height:calc(100vh - 50px); border-radius: 0; width:100%;  overflow-y:auto;}
    .uploadinfopopup .toolbar                                     {justify-content: center; }
    .uploadinfopopup .moreinfocontainer                           {text-align:center;}
    .fileinfopopup                                                {height:calc(100vh - 50px); border-radius: 0; width:100%;  overflow-y:auto;}
    .fileinfopopup #divFileDataContainer                          {width:calc(100vw - 40px);}

    .panelresultspopup                                            {height:calc(100vh - 50px); transform: translateY(130%);width:100%; border-radius: 0;}
    .panelresultspopup .content                                   {padding:0 20px 20px 20px;  overflow-y:auto; border:0px red solid; height:calc(100% - 50px)}
    .panelresultspopup .desktop                                   {display:none;}
    .panelresultspopup .mobile                                    {display:table-row;}
    .panelresultspopup .desktopcol                                {display:none;}
    .panelresultspopup .mobilecol                                 {display:table-cell;}
    .panelresultspopup .optiontab                                 {font-size:0.8rem}
    .panelresultspopup .panel                                     {border:0px purple  solid; height:calc(100vh - 370px); overflow:auto;}

    .resultspopup                                                 {height:calc(100vh - 50px); transform: translateY(130%);width:100%; border-radius: 0;}
    .resultspopup .content                                        {padding:0 20px 20px 20px;  overflow-y:auto; border:0px red solid; height:calc(100% - 50px)}
    .resultspopup .desktop                                      {display:none;}
    .resultspopup .desktopcol                                   {display:none;}
    .resultspopup .mobilecol                                    {display:table-cell;}
    .resultspopup .searchbuttoncontainer                        {text-align:center;}
    .resultspopup .competitioncategory                          {font-size:0.9rem; letter-spacing: 0px;}
    .resultspopup .competitioneventname                         {font-size:0.9rem; letter-spacing: 0px;}


}