*
{
font-family:Helvetica,Swiss,Arial;
font-weight:normal;
margin:0;
padding:0;
outline:none;
text-align:center;
color:#FFFFFF;
}
body
{
font-size:100%;  
//background-image:url('Images/Background.png');
background-position:left top;
background-repeat:repeat;
background-size:1.5em;
//background-color:#523538;
background-attachment: fixed;
}
div.table
{
overflow-x:auto;
margin:0;
padding:0;
}
div.table::-webkit-scrollbar-track 
{
background:#523538;
}
div.table::-webkit-scrollbar-thumb 
{
background:#2E1E20;
}
div.table::-webkit-scrollbar-thumb:hover
{
background:black;
}
table
{
border-collapse: collapse;
width: 100%;
}
th
{
background-color: #523538;
}
table, th, td
{
border: 1px solid #523538;
padding: 0.2em;
text-align: left;
}
tr:hover 
{
background-color: #2E1E20;
}
td.blank
{
background-color: #523538;
}
table.poule
{
overflow-x:auto;
}
table.poule th
{
text-align: center;
}
table.poule td
{
text-align: center;
}
table.poule th.left
{
text-align: left;
}
table.poule td.left
{
text-align: left;
}
video.banner
{
position:absolute;
top:0;
left:50%;
background-color:black;
transform:translateX(-50%);
min-width:100%; 
min-height:100%; 
width:auto; 
height:auto;
filter:blur(2px) brightness(0.7);
z-index:-8; 
}
img.banner
{
position:absolute;
top:0; 
left:50%;
background-color:black;
transform:translateX(-50%);
max-width: 100%;
height:auto;
object-fit: cover;
filter:blur(1px) brightness(0.7);
z-index:-9; 
}
img.logo
{
width:7%;
height:auto;
padding:0.5em;
margin:auto;
}
img.picture
{
max-width: 100%;
height: auto;
}
img.smallerpicture
{
max-width: 70%;
height: auto;
margin: 0.5em;
}

div.gallery
{
width:100%;
height:20em;
border:1px solid rgba(0,0,0,0.5);
background-color:rgba(0,0,0,0.5);
}
div.gallery img
{
max-width:100%;
max-height:100%;
width:auto;
height:auto;
}
div.thumbnails
{
cursor:grab;
margin:0;
overflow-x:scroll;
overflow-y:hidden;
padding:0;
white-space:nowrap;
-webkit-overflow-scrolling:touch;
scrollbar-width:none;  
scroll-behavior: smooth;
}
div.thumbnails::-webkit-scrollbar 
{
display:none;
}
div.thumbnails span 
{
transition:all 1s;
cursor:pointer;
opacity: 1;
display:inline-block;
width:4em;
height:3em;
border:1px solid rgba(0,0,0,0.5);
position:relative;
background-color:rgba(0,0,0,0.5);
}
div.thumbnails span:hover
{
opacity: 0.7;
border:1px solid rgba(64,64,64,0);
background-color:rgba(64,64,64,0);
-moz-box-shadow: 0 0 5px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.5);
box-shadow: 0 0 5px rgba(0,0,0,0.5);
}
div.thumbnails span img
{
max-width:100%;
max-height:100%;
width:auto;
height:auto;
border:0;
position:absolute;
margin:auto;
top:0;
right:0;
bottom:0;
left:0;
}
.close 
{
color:white;
position:absolute;
top:0.5em;
right:0.5em;
font-size:1.5em;
font-weight:bold;
}
.close:hover, .close:focus 
{
color:#999;
text-decoration:none;
cursor:pointer;
}
/* Next & previous buttons */
.prior, .next
{
cursor:pointer;
position:absolute;
top:50%;
width:auto;
padding:0.5em;
margin-top:-50px;
color:white;
font-weight:bold;
font-size:1.5em;
transition:0.6s ease;
border-radius:0.1em;
user-select:none;
}
.prior 
{
left: 0;
}
.next 
{
right: 0;
}
/* On hover, add a black background color with a little bit see-through */
.prior:hover, .next:hover 
{
background-color: rgba(0, 0, 0, 0.8);
}
img.inline 
{
height: 1.1em;
vertical-align: middle;
}
h1
{
color:White;
font-size:2em;    
font-weight:bold;
}
h2
{
color:White;
font-size:1.4em;    
}
h3
{
color:White;
font-size:1.2em;    
font-weight:bold;
}
h4
{
color:White;
font-size:1.1em; 
font-style:italic;
}
h5
{
color:White;
font-size:1.1em;    
font-weight:bold;
text-align:left;
padding:0.25em;
}
p
{
font-size:0.8em;    
padding:0.25em;
text-align:left;
}
p.center
{
text-align:center;
}
p.right
{
text-align:right;
}
p.small
{
color:Black;
text-align:center;
font-size:0.6em;    
margin:0.5em;
}
div.page
{
width:100%;
float:left;
}
div.header
{
top:0;
width:100%;
position:relative;
overflow:hidden;
}
div.facebook
{
top:0;
width:2em;
height:auto;
z-index:99;
float:left;
}
div.twitter
{
top:0;
width:2em;
height:auto;
z-index:99;
float:right;
}
div.info
{
-webkit-transition:background-color 1s;
-ms-transition:background-color 1s;
-o-transition:background-color 1s;
transition:background-color 1s;
padding:1em;
margin:0.5em;
margin-left:10%;
margin-right:10%;
border-radius:0.5em;
background-color:rgba(0,0,0,0.35);
-webkit-backdrop-filter:blur(1px);
-ms-backdrop-filter:blur(1px);
-o-backdrop-filter:blur(1px);
backdrop-filter:blur(1px);
}
div.info:hover
{
background-color:rgba(0,0,0,0.65);
}
a 
{
color:pink;
font-style:italic;
text-decoration:none;
text-align:left;
}
a:visited 
{
color:hotpink;
}
a:hover 
{
color:magenta;
}
a:active 
{
color:magenta;
text-decoration:underline;
}
ol
{
padding-left:2em;    
}
li
{
font-size:0.8em;
text-align:left;
padding: 0.25em;
}
table.tableau 
{
table-layout:fixed;
font-size:50%;
border:none;
border-collapse:collapse;
padding:0;
margin:0;
width:100%;
}
table.tableau th 
{
background-color:transparent;
border:none;
font-weight:bold;
text-align:center;    
}
table.tableau th.seeding 
{
width:4em;
}
table.tableau tr:hover 
{
background: none;
}
table.tableau td 
{
border:none;
text-align:center;    
}
table.tableau td.fencer 
{
background: #523538; 
border: solid black 2px;
}
table.tableau td.quarter1 
{
background: #354652;
}
table.tableau td.quarter2 
{ 
background: #525035;
}
table.tableau td.quarter3 
{
background: #35523b;
}
table.tableau td.quarter4 
{
background: #52354d;
}
table.tableau td.link 
{
border-right:solid black 2px;
}
tr.gold 
{
background: #C9B037;
}
tr.gold:hover 
{
background-color: #786A21;
}
tr.silver
{
background: #B4B4B4;
}
tr.silver:hover 
{
background-color: #737373;
}
tr.bronze
{
background: #AD8A56;
}
tr.bronze:hover 
{
background-color: #785F3A;
}

input.paypalbutton
{
background-color:#555555;
border:none;
cursor:pointer;
color:white;
margin:0.5em;
padding:1% 5%;
text-align:center;
text-decoration:none;
display:inline-block;
font-size:100%;
border-radius:4px;
-webkit-transition:background-color 1s;
-ms-transition:background-color 1s;
-o-transition:background-color 1s;
transition:background-color 1s;
}
input.paypalbutton:hover 
{
background-color:#4CAF50;
}
input.paypalbutton:active
{
position:relative;
top:2px;
}
input.paypalbutton:focus
{
outline:none;    
}
input.paypalbutton::-moz-focus-inner
{
border:0;
}
input[type=text], select, textarea 
{
font-size:0.8em;
color:black;
padding:12px;
border:1px solid #ccc;
border-radius:4px;
box-sizing:border-box;
width:100%;
margin-top:6px;
margin-bottom:16px;
resize:vertical
}
input[type=date] 
{
font-size:0.8em;
color:black;
width:100%;
padding:12px;
border:1px solid #ccc;
border-radius:4px;
box-sizing:border-box;
margin-top:6px;
margin-bottom:16px;
resize:vertical
}
input[type=checkbox] 
{
font-size:1em;
float: left;
color:black;
padding:12px;
border:1px solid #ccc;
border-radius:4px;
box-sizing:border-box;
margin-top:6px;
margin-bottom:16px;
resize:vertical
}
input[type=label] 
{
float: left;
}
input[type=submit] 
{
font-size:0.8em;
background-color:#4CAF50;
color:black;
padding:12px 20px;
border:none;
border-radius:4px;
cursor:pointer;
margin-left:5%;
margin-right:5%;
width:30%;
}
input[type=submit]:hover 
{
background-color:#45A049;
}
input.cancel[type=submit] 
{
background-color:#AF504C;
}
input.cancel[type=submit]:hover 
{
background-color:#A04945;
}
a.button, a.button:visited 
{
font-size:0.8em;
font-style:normal;
text-align:center;
text-decoration:none;
background-color:#4CAF50;
color:black;
padding:12px 20px;
border:none;
border-radius:4px;
cursor:pointer;
margin-left:5%;
margin-right:5%;
display:inline-block;
width:30%;
}
a.button:hover 
{
background-color:#45A049;
}
span
{
display:flex;
gap:1em;
justify-content:center;
align-items:center;
} 
@media screen and (min-width:1px) 
{
body 
{
font-size:70%;
}
div.sponsors img
{
height:50;
}
}
@media screen and (min-width:300px) 
{
body 
{
font-size:80%;
}
div.info
{
margin-left:2%;
margin-right:2%;
}
div.sponsors img
{
height:60;
}
}
@media screen and (min-width:500px) 
{
body
{
font-size:85%;
}
div.info
{
margin-left:4%;
margin-right:4%;
}
div.sponsors img
{
height:70;
}
}
@media screen and (min-width:600px)
{
body
{
font-size:90%;
}
div.info
{
margin-left:6%;
margin-right:6%;
}

div.sponsors img
{
height:80;
}
}
@media screen and (min-width:700px) 
{
body
{
font-size:95%;
}
div.info
{
margin-left:8%;
margin-right:8%;
}
div.sponsors img
{
height:90;
}
}
@media screen and (min-width:800px)
{
body
{
font-size:100%;
}
div.sponsors img
{
height:100;
}
}
@media screen and (min-width:900px) 
{
body
{
font-size:125%;
}
div.sponsors img
{
height:110;
}
}
@media screen and (min-width:1200px)
{
body
{
font-size:150%;
}
}
@media screen and (min-width:1400px)
{
body
{
font-size:175%;
}
}
@media screen and (min-width:1600px)
{
body
{
font-size:200%;
}
}
@media screen and (min-width:1800px)
{
body
{
font-size:225%;
}
}
@media screen and (min-width:2000px) 
{
body
{
font-size:250%;
}
}
@media screen and (min-width:2250px) 
{
body
{
font-size:300%;
}
}
@media screen and (min-width:2500px)
{
body
{
font-size:400%;
}
}
@font-face
{
font-family:Lato;
src:url('Fonts/Lato-Regular.ttf');
}
@font-face
{
font-family:Lato;
font-weight:bold;
src:url('Fonts/Lato-SemiBold.ttf');
}
