/* -- GENERAL -- */
:root {
	--gd-FontFamily: helvetica, arial, sans-serif;
	--gd-FontSize: 14px;
	--gd-FinePrintFontSize: 12px;
	--gd-FontColor:#666666;
	--gd-FontBoldColor:#000000;
	--gd-LineHeight: 1.7;

	--gd-LinkColor: #2f638e;
	--gd-LinkHoverColor: #173147;

	--gd-BorderColor: #e2e2e2;
	--gd-BorderBgShade: #f0f0f0;

}


*, *:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
	margin:0;
	padding:0;
	font-family: var(--gd-FontFamily);  
	font-size: var(--gd-FontSize);
	line-height: var(--gd-LineHeight);
	color: var(--gd-FontColor);
}


/* ---------------------- BROADCAST ---------------------- */

.arena {
    width:100%;
    height:100vh;
    min-height:400px;
    background-image:url("../images/general/arena.jpg");
    background-repeat:no-repeat;
    background-position:center top;
    background-size:1000px;
    overflow:hidden;
}

.arenaBanner {
    position:absolute;
    z-index:1;
    width:10%;
    display:none;
}

.arenaBanner img {
    display:block;
    width:100%;
}

.arenaBanner.bannerLeft {
    left:2%;
}

.arenaBanner.bannerRight {
    right:2%;
}



.jumbotron {
    width:100%;
    max-width:700px;
    margin:0 auto;
    position:relative;
    z-index:2;
}

.jumbotron img {
    display:block;
    width:100%;
}

.videoSizing {
    position:absolute;
    width:76.75%;
    margin:0 auto;
    top:6.75%;
    left:50%;
    margin-left:-38.375%; 
 }

.videoContainer {
    width:100%;
    height:0;
    padding:56.25% 0 0 0;
    position:relative;
    background-color:#000000;
}

.videoContainer .videoEmbed {
    position:absolute;
    top:0;
    left:0;
    height:100%;
    width:100%;
    border:0;
}


/* ------------------------------------- BREAKPOINT ---------------------------------- */
@media screen and  (min-height:800px) {
    .arena {
        background-size:cover;
    }
}



/* ------------------------------------- BREAKPOINT ---------------------------------- */
@media screen and (min-width:768px) {
    .arena {
        min-height:600px;
    }
}


/* ------------------------------------- BREAKPOINT ---------------------------------- */
@media screen and (min-width:800px) {
    .arenaBanner {
        display:block;
    }
}



/* ------------------------------------- BREAKPOINT ---------------------------------- */
@media screen and (min-width:992px) {
    .arena {
        height:calc(100vh + 200px);
        min-height:800px;
        background-size:cover;
    }


    .jumbotron {
        width:70%;
        max-width:100%;
        margin-bottom:400px;
    }
    
   
}


 /* ------------------------------------- BREAKPOINT ---------------------------------- */
 @media screen and (min-width:1200px) {
    .jumbotron {
        width:70%;
    }

    .arena {
        min-height:1200px;
    }
 }