body, div, table, tr, td, h1, h2, h3, h4, h5, p{padding:0;outline:0;margin:0;font-family: 'Arial';font-family: 'Cuprum', sans-serif;color:#192c50;}
body{background:#FFF;}

body:after{
      content:""; position:fixed;top:0;height:100vh;left:0;right:0;z-index:-1; 
	  /* background: url('hole10.jpg') center center; */
	  -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;
}


a{color:#192c50;text-decoration:underline;font-weight:normal;}
a:hover{color:#192c50;text-decoration:underline;}
	
@keyframes glowing {
	0% { background-color: #000; }
	50% { background-color: #888;  }
	100% { background-color: #fff; }
}

#container{width:100%;margin:auto;}
#top{display:block;width:98%;margin:0 auto;background:#FFF;opacity:1;height:44vw;margin-bottom:2vw;}
#cup{position:relative;width:98%;margin:0 auto;text-align:right;}
#scores{width:100%;display:block;}
#scores div{width:50%;float:left;height:18vw;display:block;color:#FFF;font-weight:bold;text-align:center;
			font-size:10vw;line-height:10vw;padding-top:5vw;}
#scores span{font-size: 1vw;line-height: 2vw;padding-top: 0;display: block;}

#box{display:none;width:100%;position:fixed;top:0;height:100vh;z-index:800;overflow:scroll;right:0;opacity:1;}
#box-in{display:block;width:98%;margin:0 auto;background:#FFF;opacity:1;height:100vh;}
#box-txt{display:block;padding:2vw 5%;width:90%;background:#FFF;clear: both;}
#box-txt p{margin:2vw 0;clear:both;}
.half{width:50%;height:auto;float:left;}
.header1, .header2{width:100%;height:2vw;line-height:2vw;font-size:1vw;text-transform:uppercase; float:none;vertical-align:bottom;border-bottom:solid 2px #DDD;overflow: hidden;}
.header1 div, .header2 div{display:block;float:left;color:#999;}
.line{width:100%;clear:both;height:4vw;border-bottom:solid 2px #DDD;}
.line div{display:block;float:left;font-size:2vw;}
.line div.sm{font-size:1.5vw;}
.h1{height:2vw;}
.h4{height:4vw;line-height:4vw;}
.w4{width:5vw;}
.w3{width:2vw;padding-left:1vw;}
.w1{width:4vw;}
.w14{width:11vw;}
.line img{width:70%;margin:10% 10% 0 0;}
.line h2{font-size: 1.7vw;
    line-height: 1.7vw;
    height: 4vw;
    display: inline-block;
    margin-top: 0.2vw;}
.line h4{font-size:2vw; line-height:4vw;color: #A80000;}
.line h2 span{font-size: 0.8vw; line-height: 0; color: #192c50;   display: block;}
	
#logo{width:100%;display:block;}
#logo img{width:50%;float:left;}
#top p{line-height: 2vw;
    font-family: Arial;
    font-size: 1.2vw;
    padding-top: 0;
    clear: both;
    margin: 1vw 8vw;
    float: none;}

h1{font-size:2vw;font-weight:bold;line-height:2.3vw;text-align:left;text-transform:uppercase;margin-top:1vw;color:#192c50;margin-left:8vw;}
h1 span.one{font-size:1.5vw;display:inline-block;line-height: 1vw;color:#192c50;}
h1 span.two{font-size:3.05vw;display:inline-block;line-height: 3.1vw;color:#192c50;}

.legend {display:inline-block;width:1.2vw;height:1.2vw;margin-top:0px;border-radius:5vw;border:solid 0.2vw #FFF;font-size: 0.8vw;line-height: 1.4vw;vertical-align:middle;}

#top-partners{width:50%;float:right;}
#top-partners img{width:100%;}
#bottom-partners{display:none;clear:both;}
#bottom-partners img{width:100%;}
#cpr{text-align:center;font-size:11px;width:100%;clear:both;}

#logo h2{font-size:1.5vw;font-weight:normal;line-height:2vw;text-align:left;margin:1vw;color:#192c50;text-transform:uppercase;}
#logo h2 span{font-weight:bold;}

.head{width:98%;margin:0 auto;opacity:1;background-color: #fff;}
.full{width:98%;margin:0 auto;}

.match{width:48%;float:left;margin:1%;height:auto;border-top: solid 2px #888;
    border-bottom: solid 2px #888;}
.match div{display:block;float:left;opacity:1;}

.wnames{width:29%;}
.wnames img{height:6.5vw;margin:0.5vw 10% 0 10%;}
.wnames p{font-size:1.7vw;margin:0;font-weight:normal;line-height:1.8vw;}
.wnames p.rr{margin-left:10%;}
.wnames p.ll{margin-right:10%;}
.wscores{width:42%;}
.wscores h3{text-align:center;line-height:10vw;font-size:3.2vw;}
.wscores a{color:#FFF;font-weight:normal;display:block;width:50%;padding:0.2vw;font-size:1.2vw;background:#555;margin:-1.8vw auto;border-radius:5vw;text-transform:uppercase;text-align:center;} /* cbox -2vw*/

.wupdn{width:15%;background:#FFF;}
.wupdn p{margin:0 20%;font-size:2vw;line-height:2vw;}
.wholes{width:70%;font-size:1.5vw;}
.wholes div{display:block;float:left;font-size:1.5vw;opacity:1;}
.wholes div.h{width:11%;height:2vw;line-height:2vw;font-size:1vw;text-align:center;color:#FFF;}
.wholes span{ display: inline-block;
    width: 2vw;
    height: 2vw;
    margin-top: 0px;
    border-radius: 5vw;
    border: solid 0.2vw #FFF;
    font-size: 1.5vw;
    line-height: 2vw;}

.wstat{width:100%;background:#203866;color:#FFF;}
.wstat p{font-size:1vw;line-height:2vw;text-align:center;}
.wstat a{color:#FFF;font-weight:normal;}
/* */
	.w0{width:1.5%;}
	.w27{width:97%;}

	.h1{height:2.5vw;line-height:2vw;}
	.h2{height:4vw;line-height:4vw;}
	.h3{height:6vw;line-height:6vw;}
	.h5{height:12vw;}
	.h8{height:19.5vw;}
	.h9{height:19.5vw;}
	
	.lt{text-align:right;} .ct{text-align:center;} .rt{text-align:left;}

	.lite{color:#777777;background:#FFF;}
	.as{color:#999999;background:#FFF;}
	.green{color:#21835b;background:#FFF;}
	.blue{color:#d80027;background:#FFF;}
	.white{color:#222;background:#FFF;}

	span.empty, .wholes span.empty{background:#fff;border-color:#DDD;color:#999;}
	.wgreen{background:#21835b;}
	.wblue{background:#d80027;}
	.wdraw{background:#999999;}
	.woff{background:#EEE;background: linear-gradient(to bottom,  #ff0000 0%,#ffdddd 50%,#ff0000 99%);}
	span.tee, .match span.tee{border-color:#b6b210;} /*#fdee25;*/
	span.now, .match span.now{animation: glowing 1300ms infinite; } /* background:#fd0000;*/
	
	.togo, .match div.togo{opacity: 1;}
	.clear{clear:both;float:none;}
	
	#cpr{line-height:30px;}
	
	label{font-size:1vw;}
	.playing{display:inline-block;color:#000000;}
	.finished{display:inline-block;color:#008900;}
	.notstarted{display:inline-block;color:#b6b210;}

@media (min-width: 1200px){
	#top{width:1178px;max-width:98%;height:600px;}
	#cup{width:1200px;margin:0px auto}
	.menu{height:80px;margin:40px 40px 0 0;}
	#top p{line-height:17px;font-family:Arial;font-size:14px;padding-top:0;}
	.legend{display:inline-block;width:16px;height:16px;line-height:17px;font-size:9px;margin-top:0px;border-radius:33px;border:solid 3px #FFF;vertical-align:middle;}
	
	#scores div{height:250px;line-height:150px;font-size:150px;padding-top:80px;}
	#scores span{font-size: 20px;line-height: 40px;}

	#box{overflow:hidden;}
	#box-in{display:block;width:1200px;margin:0 auto;background:#FFF;opacity:1;height:100vh;}
	
.half{width:50%;height:auto;float:left;}
.header1, .header2{width:100%;height:24px;line-height:24px;font-size:12px;text-transform:uppercase; float:none;vertical-align:bottom;border-bottom:solid 2px #DDD;overflow: hidden;}
.header1 div, .header2 div{display:block;float:left;color:#999;}
.line{width:100%;clear:both;height:48px;border-bottom:solid 2px #DDD;}
.line div{display:block;float:left;font-size:24px;}
.line div.sm{font-size:18px;}
.h1{height:24px;}
.h4{height:48px;line-height:48px;}
.w4{width:60px;}
.w3{width:24px;padding-left:12px;}
.w1{width:48px;}
.w14{width:140px;}
.line img{width:70%;margin:10% 10% 0 0;}
.line h2{font-size: 20px;   line-height: 20px;
    height: 48px;
    display: inline-block;
    margin-top: 2px;}
.line h4{font-size:24px; line-height:48px;color: #A80000;}
.line h2 span{font-size: 10px; line-height: 0; color: #192c50;   display: block;}
	

#top p{line-height: 24px; font-size: 16px; padding-top: 0; clear: both;  margin: 12px 95px;   float: none;}
#logo h2{font-size:18px;font-weight:normal;line-height:24px;text-align:left;margin:12px;color:#192c50;text-transform:uppercase;}

h1{font-size:24px;font-weight:bold;line-height:26px;text-align:left;text-transform:uppercase;margin-top:12px;color:#192c50;margin-left:95px;}
h1 span.one{font-size:1.5vw;display:inline-block;line-height: 1vw;color:#192c50;}
h1 span.two{font-size:3.05vw;display:inline-block;line-height: 3.1vw;color:#192c50;}

.legend {display:inline-block;width:14px;height:14px;margin-top:0px;border-radius:60px;border:solid 2px #FFF;font-size: 10px;line-height: 16px;vertical-align:middle;}


	
	
	
	
	
	
	
	.full {width:1200px; max-width:98%;margin:0 auto;}
	.head {width:1200px; max-width:98%;}
	
	.wnames img{height:78px;margin:6px 10% 0 10%;}
	.wnames p{font-size:20px;line-height:22px;}
	.wscores h3{line-height:120px;font-size:38px;}
	.wscores a{padding:3px;font-size:12px;margin:-20px auto;border-radius:60px;} /* cbox -20px */
	
	
	.wupdn p{font-size:20px;line-height:24px;}
	.wholes{font-size:16px;}
	.wholes div{font-size:20px;}
	.wholes div.h{height:24px;line-height:24px;font-size:12px;}
	.wholes span{width: 24px;
    height: 24px;
    border-radius: 60px;
    border: solid 2px #FFF;
    font-size: 16px;
    line-height: 24px;} 
	.wstat p{font-size:12px;line-height: 24px;}
	
	.h1{height:30px;line-height:24px;}
	.h2{height:48px;line-height:48px;}
	.h3{height:72px;line-height:72px;}
	.h5{height:144px;}
	.h8{height:234px;}
	.h9{height:234px;}
	
	label{font-size:12px;}
}

@media (min-width: 768px) and (max-width:1199px){
	.full{width:100%;max-width:auto;}
	.half{margin-bottom:10px;}
}


@media (max-width:767px){
	
	#top{width:98%;max-width:auto;height:70vw;}
	#tbl{}
	#cup{}
	#cpr{font-size:2vw;}
	.menu{height:10vw;margin:5vw 8% 0 0;}
	#logo{width:100%;float:none;height:28vw;}
	#logo img{height:auto;width:98%;}
	#top p{line-height:1.5vw;font-family:Arial;font-size: 2.5vw;padding-top:0;margin-left: 26vw;}
	#top b{font-family: Arial;
    height: 2.9vw;
    display: inline-block;    padding: 1vw 0;}
	
	#scores div{height:20vw;font-size:10vw;line-height:20vw;padding-top:0vw;}
	#scores span{display:none;}
	
	#box-txt{background:#FFF;}
	#box-txt p{margin:4vw 0;font-size:3vw;line-height:3vw;}
	
	.half{width:100%;height:auto;float:none;}
	.header1{font-size:3vw;height:4.2vw;}
	.header2{display:none;}
	.line{width:100%;clear:both;height:10vw;border-bottom:solid 2px #DDD;}
	.line div{display:block;float:left;font-size:4vw;line-height:10vw;}
	.line img{width:70%;margin:13% 10% 0 0;}
	.line h2{font-size: 4.5vw;
    line-height: 4vw;
    height: 10vw;
    display: inline-block;
    margin-top: 1vw;}
	.line h2 a{text-decoration:none;}
	.line h4{font-size:4vw; line-height:10vw;color: #A80000;}
	.line h2 span{font-size: 2.6vw;    font-weight: normal;    line-height: 1vw;}
	.line div.sm{font-size: 3vw;color: #008900;}
	
	#top-partners{display:none;width:100%;float:none; height:10vw;}
	#bottom-partners{display:block;width:100%;}
	
	h1{font-size: 5vw;    line-height: 5.4vw;    padding-top: 3vw;    margin-right: 0vw;    margin-left: 17vw;}
	h1 span.one{font-size: 3.5vw;    line-height: 2vw;}	h1 span.two{font-size: 5.05vw;     line-height: 4.1vw;}
	h2, #logo h2{font-size: 3.5vw;   line-height: 4vw;  margin-top: 1vw;}
	.w4{width:10vw;}
	.w3{width:6vw;padding-left:1vw;}
	.w1{width:6vw;}
	.w14{width:28vw;}
	
	.match{width:98%;float:none;margin:1%;height:52vw;}
	.match div{display:block;float:left;opacity:1;}
	
	
	.wnames img{height:15vw;margin:1vw 10% 0 10%;}
	.wnames p{font-size:3.7vw;margin:0;line-height:4vw;}
	.wscores h3{line-height:25vw;font-size:7vw;}
	.wscores a{padding:0.4vw;font-size: 3vw;margin: -6vw auto;border-radius:10vw;} /* cbox -3vw */
	
	.wupdn p{font-size:4.5vw;line-height:5vw;}
	.wholes{font-size:3vw;}
	.wholes div{font-size:3vw;opacity:1;}
	.wholes div.h{width:11%;height:5vw;line-height:4vw;font-size:3.75vw;}
	.wholes span{width: 6vw;height: 6vw;border-radius: 13vw;border: solid 0.5vw #FFF;font-size: 5vw;line-height: 6vw;}
	.wstat p{font-size:3vw;line-height:6vw;}
	
	
	
	.h1{height:7vw;line-height:6vw;}
	.h2{height:10vw;line-height:10vw;}
	.h3{height:15vw;line-height:15vw;}
	.h5{height:30vw;}
	.h8{height:51vw;}
	.h9{height:45vw;}
	
	label{font-size:3vw;}
	
	
	
}




/* ----------------------------------- COLORBOX --------------------- */
/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#4C5455;}
#colorbox{outline:0;}
#cboxContent{margin-top:20px;background:#4C5455;}

.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{border:5px solid #000000; background:#fff;}
#cboxLoadedContent p{margin:20px;font-size:20px;text-align:center;}
#cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
#cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;}
#cboxLoadingGraphic{background:url('imgs/loading.gif') no-repeat center center;}

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
 #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
        
 #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
 #cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url('imgs/controls.png') no-repeat top left; width:28px; height:65px; text-indent:-9999px;}
 #cboxPrevious:hover{background-position:bottom left;}
 #cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url('imgs/controls.png') no-repeat top right; width:28px; height:65px; text-indent:-9999px;}
 #cboxNext:hover{background-position:bottom right;}
 #cboxClose{position:absolute; top:5px; right:5px; display:block; background:url('imgs/controls.png') no-repeat top center; width:38px; height:19px; text-indent:-9999px;}
 #cboxClose:hover{background-position:bottom center;}