html, body
	{
		height: 100%;
	}
	
	body
	{
		margin: 0px;
		padding: 0px;
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#45484d+0,000000+100;Black+3D+%231 */
        background: #333333; /* Old browsers */
        background: -moz-linear-gradient(top, #333333 0%, #000000 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, #333333 0%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, #333333 0%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
		font-family: 'Varela', sans-serif;
		font-size: 11pt;
		font-weight: 300;
		color: #FFF;
	}
	
	h1, h2
	{
		margin: 0;
		padding: 0;
		font-weight: 700;
		color: #FFF;
	}

	h4 {
        margin: 0;
        padding: 0;
        font-weight: 700;
        color: #2B3F48;
        text-transform: uppercase;
        font-size: 2.7em;
	}

	h3, label, br, alert
	{
		margin: 0;
		padding: 0;
		font-weight: 500;
		color: #FFF;
	}

    h3 a
    {
        text-decoration: none;
        color: rgba(255,255,255,0.8);
    }

    h5
    {
        display: block;
        font-size: 1.17em;
        margin-top: 1em;
        margin-bottom: 1em;
        margin-left: 0;
        margin-right: 0;
        margin: 0;
        padding: 0;
        font-weight: 700;
        color: #FFF;
    }

    h6
    {
        display: block;
        font-size: 1em;
        margin-top: 1.33em;
        margin-bottom: 1.33em;
        margin-left: 0;
        margin-right: 0;
        margin: 0;
        padding: 0;
        font-weight: 500;
        color: #FFF;
    }

	p, ol, ul
	{
		margin-top: 0;
	}

	ol, ul
	{
		padding: 0;
		list-style: none;
	}

	ul.actions
	{
		text-align: center;
	}

		ul.actions li
		{
		}

	p
	{
		line-height: 180%;
	}

	strong
	{
	}

	a
	{
		color: #FFF;
	}

	#logout
	{
	    background: #202020;
	    color: #FFF;
	}

	a:hover
	{
		text-decoration: none;
	}

	.container
	{
		overflow: hidden;
		margin: 0em auto;
		width: 1000px;
	}

	.error-text {
        margin: 0;
        padding: 0;
        font-weight: 700;
        color: #FFA07A;
	}

/*********************************************************************************/
/* Image Style                                                                   */
/*********************************************************************************/

	.image
	{
		display: inline-block;
		width: 100%;
	}

	.move-player-image
	{
	    left: auto;
        clip: rect(200px, 500px, 800px, 0px);
        position: absolute;
        top: 200px;
	}

	.mw2-lobby-code-div
    	{
            width: 100px; /* width of container */
            margin-left: auto;
            margin-right: auto;
            overflow: hidden;
            border: 5px solid #009E2D;
    	}

    .mw2-lobby-code-div img {
        margin: -760px -1080px -265px -410px;
    }

    .move-rc-player-image
    {
        left: auto;
        clip: rect(120px, 920px, 300px, 25px);
        position: absolute;
        top: 640px;
        max-width: 960px;
        max-height: 540px;
    }

    .image-screenshot
    {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 75%;

        text-align: center;
        border:5px solid black
    }

    .image-logo
    {
        display: block;
        margin-left: auto;
        margin-right: auto;
        height: 75px;

        position: absolute;
        top: 5px;
        left: 0;

        text-align: center;
    }

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

	.image-full
	{
		display: block;
		width: 100%;
		margin: 0 0 2em 0;
	}

	.image-left
	{
		float: left;
		margin: 0 2em 2em 0;
	}

	.image-centered
	{
		display: block;
		margin: 0 0 2em 0;
	}

	.image-centered img
	{
		margin: 0 auto;
		width: auto;
	}

/*********************************************************************************/
/* List Styles                                                                   */
/*********************************************************************************/

	ul.staff
	{
		margin-bottom: 3em;
	}

	ul.staff li
	{
		display: inline-block;
	}

	ul.staff li img
	{
		width: 80%;
		border-radius: 50%;
	}


/*********************************************************************************/
/* Social Icon Styles                                                            */
/*********************************************************************************/

	ul.contact
	{
		margin: 0;
		padding: 2em 0em 0em 0em;
		list-style: none;
	}

	ul.contact li
	{
		display: inline-block;
		padding: 0em 0.30em;
		font-size: 1em;
	}

	ul.contact li span
	{
		display: none;
		margin: 0;
		padding: 0;
	}

	ul.contact li a
	{
		color: #FFF;
	}

	ul.contact li a:before
	{
		display: inline-block;
		background: #3f3f3f;
		width: 40px;
		height: 40px;
		line-height: 40px;
		border-radius: 20px;
		text-align: center;
		color: #FFFFFF;
	}

	ul.contact li a.icon-twitter:before { background: #2DAAE4; }
	ul.contact li a.icon-facebook:before { background: #39599F; }
	ul.contact li a.icon-dribbble:before { background: #C4376B;	}
	ul.contact li a.icon-tumblr:before { background: #31516A; }
	ul.contact li a.icon-rss:before { background: #F2600B; }

/*********************************************************************************/
/* Button Style                                                                  */
/*********************************************************************************/

	.button
	{
		display: inline-block;
		padding: 0em 3em;
		background: #009E2D;
		letter-spacing: 0.20em;
		line-height: 4em;
		text-decoration: none;
		text-transform: uppercase;
		font-weight: 400;
		font-size: 1em;
		color: #FFF;
	}

	.button:before
	{
		display: inline-block;
		background: #FFC31F;
		margin-right: 1em;
		width: 40px;
		height: 40px;
		line-height: 40px;
		border-radius: 20px;
		text-align: center;
		color: #272925;
	}

	.btn {
      background-color: #009E2D;
      border: 1px solid #009E2D;
      border-radius: 4px;
      box-shadow: rgba(0, 0, 0, .1) 0 2px 4px 0;
      box-sizing: border-box;
      color: #fff;
      cursor: pointer;
      font-family: "Akzidenz Grotesk BQ Medium", -apple-system, BlinkMacSystemFont, sans-serif;
      font-size: 16px;
      font-weight: 400;
      outline: none;
      outline: 0;
      /* padding: 10px 25px; */
      text-align: center;
      transform: translateY(0);
      transition: transform 150ms, box-shadow 150ms;
      user-select: none;
      -webkit-user-select: none;
      touch-action: manipulation;
    }

    .btn:hover {
      box-shadow: rgba(0, 0, 0, .15) 0 3px 9px 0;
      transform: translateY(-2px);
    }

    .btn:disabled {
      background: #8B0000;
    }

    @media (min-width: 768px) {
      .btn {
        padding: 10px 30px;
      }
    }

    .button-circle {
      background-color: #FFF;
      border: none;
      color: white;
      padding: 20px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
      font-size: 16px;
      margin: 4px 2px;
      border-radius: 50%;
    }

    .btn-old
    {
        display: inline-block;
        padding: 0em 3em;
        background: #009E2D;
        letter-spacing: 0.20em;
        line-height: 4em;
        text-decoration: none;
        text-transform: uppercase;
        font-weight: 400;
        font-size: 1em;
        color: #FFF;
    }

    .btn-old:before
    {
        display: inline-block;
        background: #FFC31F;
        margin-right: 1em;
        width: 40px;
        height: 40px;
        line-height: 40px;
        border-radius: 20px;
        text-align: center;
        color: #272925;
    }

/*********************************************************************************/
/* Heading Titles                                                                */
/*********************************************************************************/

	.title
	{
		margin-bottom: 3em;
	}

	.title h2
	{
		text-transform: uppercase;
		font-size: 2.7em;
	}

	.title .byline
	{
		font-size: 1.7em;
		color: #6F6F6F;
	}

/*********************************************************************************/
/* 4-column                                                                      */
/*********************************************************************************/

	.box1,
	.box2,
	.box3,
	.box4
	{
		width: 235px;
	}

	.box1,
	.box2,
	.box3,
	{
		float: left;
		margin-right: 20px;
	}

	.box4
	{
		float: right;
	}

/*********************************************************************************/
/* 3-column                                                                      */
/*********************************************************************************/

	.boxA,
	.boxB,
	.boxC
	{
		width: 320px;
	}

	.boxA,
	.boxB
	{
		float: left;
		margin-right: 20px;
	}

	.boxC
	{
		float: right;
	}

/*********************************************************************************/
/* 2-column                                                                      */
/*********************************************************************************/

	.tbox1,
	.tbox2
	{
		width: 575px;
	}

	.tbox1
	{
		float: left;
	}

	.tbox2
	{
		float: right;
	}

	#wrapper
	{
		background: #FFF;
	}

/*********************************************************************************/
/* Header                                                                        */
/*********************************************************************************/

	#header-wrapper
	{
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#45484d+0,000000+100;Black+3D+%231 */
        background: #333333; /* Old browsers */
        background: -moz-linear-gradient(top, #333333 0%, #000000 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, #333333 0%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, #333333 0%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
}

	#header
	{
		position: relative;
		padding: 3em 0em;
		background: #333333; /* Old browsers */
        background: -moz-linear-gradient(top, #333333 0%, #000000 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, #333333 0%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, #333333 0%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#000000',GradientType=0 ); /* IE6-9 */

	}

/*********************************************************************************/
/* Logo                                                                          */
/*********************************************************************************/

	#logo
	{
		position: absolute;
		top: 0em;
		left: 0;
	}

	#logo h1
	{
		color: #FFF;
	}

	#logo a
	{
		text-decoration: none;
		text-transform: uppercase;
		color: #FFF;
	}

/*********************************************************************************/
/* Menu                                                                          */
/*********************************************************************************/

	#menu
	{
		position: absolute;
		top: 33px;
		right: 0;
	}

	#menu ul
	{
		display: inline-block;
	}

	#menu li
	{
		display: block;
		float: left;
		text-align: center;
	}

	#menu li a, #menu li span
	{
		padding: 1em 1.5em;
		letter-spacing: 1px;
		text-decoration: none;
		text-transform: uppercase;
		font-size: 0.8em;
		color: #FFF;
	}

	#menu li:hover a, #menu li.active a, #menu li.active span
	{
		color: #FFF;
	}

	#menu .current_page_item a
	{
		background: #009E2D;
		color: #FFF;
	}

	#menu .icon
	{
	}


/*********************************************************************************/
/* Hosts Menu                                                                    */
/*********************************************************************************/

	#hosts-menu
	{
		position: absolute;
		top: 6em;
		right: 0;
	}

	#hosts-menu ul
	{
		display: inline-block;
	}

	#hosts-menu li
	{
		display: block;
		float: left;
		text-align: center;
	}

	#hosts-menu li a, #hosts-menu li span
	{
		padding: 1em 1.5em;
		letter-spacing: 1px;
		text-decoration: none;
		text-transform: uppercase;
		font-size: 0.8em;
		color: #FFF;
	}

	#hosts-menu li:hover a, #hosts-menu li.active a, #hosts-menu li.active span
	{
		color: #FFF;
	}

	#hosts-menu .current_page_item a
	{
		background: #009E2D;
		color: #FFF;
	}

	#hosts-menu .icon
	{
	}


/*********************************************************************************/
/* Banner                                                                        */
/*********************************************************************************/

	#banner
	{
		overflow: hidden;
		padding: 2em 0em 0em 0em;
		background: #202020;
		background-size: cover;
		text-align: center;
		color: rgba(255,255,255,.8);
	}

    #control-panel
    {
        overflow: hidden;
        padding: 2em 0em 5em 0em;
        background: #202020;
        background-size: cover;
        text-align: center;
        color: rgba(255,255,255,.8);
    }

	#banner .title
	{
		margin-bottom: 1em;
		text-transform: uppercase !important;
	}

	#banner .title h2
	{
		color: #FFF;
	}

	#banner .title .byline
	{
		color: rgba(255,255,255,.6);
	}

	#banner .button
	{
		margin-top: 3em;
		background: #009E2D !important;
	}

/*********************************************************************************/
/* Page                                                                          */
/*********************************************************************************/

	#page
	{
		padding: 5em 0em;
		text-align: center;
	}

	#page .button
	{
		margin-top: 2em;
		display: inline-block;
		text-align: center;
	}

/*********************************************************************************/
/* Content                                                                       */
/*********************************************************************************/

	#content
	{
	}

/*********************************************************************************/
/* Sidebar                                                                       */
/*********************************************************************************/

	#sidebar
	{
	}

/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/

	#footer
	{
	}

/*********************************************************************************/
/* Copyright                                                                     */
/*********************************************************************************/

	#copyright
	{
		overflow: hidden;
		padding: 5em 0em;
		border-top: 1px solid rgba(255,255,255,0.08);
	}

	#copyright p
	{
		text-align: center;
		font-size: 1em;
		color: rgba(255,255,255,0.5);
	}

	#copyright a
	{
		text-decoration: none;
		color: rgba(255,255,255,0.8);
	}

/*********************************************************************************/
/* Featured                                                                      */
/*********************************************************************************/

	#featured
	{
		overflow: hidden;
		padding: 5em 0em;
		background: #009E2D;
		color: rgba(255,255,255,.8);
		text-align: center;
	}

	#featured a
	{
		color: rgba(255,255,255,1);
	}

	#featured .button
	{
		background: #FFF;
		margin-top: 3em;
		font-size: 1em;
		color: #009E2D;
	}

	#featured .title
	{
	}

	#featured .title h2
	{
		color: #FFF;
	}

	#featured .title .byline
	{
		color: rgba(255,255,255,.6);
	}

/*********************************************************************************/
/* Featured                                                                      */
/*********************************************************************************/

.box
{
	padding: 3em 2em 2em 2em;
	border: 1px solid rgba(0,0,0,0.1);
	border-radius: 8px;
		text-align: center;
}


	#extra
	{
		overflow: hidden;
		padding: 5em 0em;
	}

	#extra .title
	{
		text-align: center;
	}

	#extra .button
	{
		margin-top: 5em;
	}

	#extra .fa
	{
		display: block;
		margin-bottom: 0.5em;
		text-align: center;
		font-size: 3em;
	}

/*********************************************************************************/
/* Select List                                                                      */
/*********************************************************************************/


.select-css {
	display: block;
	text-align-last: center;
	font-size: 16px;
	font-family: sans-serif;
	font-weight: 700;
	color: #444;
	line-height: 1.3;
	padding: .6em 1.4em .5em .8em;
	width: 75%;
	max-width: 80%;
	box-sizing: border-box;
	margin-left: auto;
    margin-right: auto;
	border: 1px solid #aaa;
	box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	border-radius: .5em;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
	  linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
	background-repeat: no-repeat, repeat;
	background-position: right .7em top 50%, 0 0;
	background-size: .65em auto, 100%;
}
.select-css::-ms-expand {
	display: none;
}
.select-css:hover {
	border-color: #888;
}
.select-css:focus {
	border-color: #aaa;
	box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
	box-shadow: 0 0 0 3px -moz-mac-focusring;
	color: #222;
	outline: none;
}
.select-css option {
	font-weight:normal;
}

/*********************************************************************************/
/* Form Control                                                                    */
/*********************************************************************************/

input[type=text] {
  width: 75%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
}
input[type=password] {
  width: 75%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
}
input[type=email] {
  width: 75%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
}

.flex-container {
  display: flex;
  flex-wrap: wrap;
  max-width: 90%;
  margin-left: auto;
  margin-right: auto;
  border-radius: 25px;
  justify-content: center;
}

.flex-container > div {
  width: 200px;
  margin: 10px;
  border: 3px solid #009E2D;
  border-radius: 10px;
}

.flex-container > div {
  width: 200px;
  margin: 10px;
  border: 3px solid #009E2D;
  border-radius: 10px;
  display:block;
}

.control-parent {
    position: relative;
    text-align: center;
    margin: auto;
    width: 1280px;
    height: 734px;
    -webkit-transform: scale(.6);
    transform: scale(.6);
    -webkit-transform-origin: center top;
    transform-origin: center top;
}



.sidebar {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  right: 0;
  background-color: #111;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}

.sidebar a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #009E2D;
  display: block;
  transition: 0.3s;
}

.sidebar a:hover {
  color: #f1f1f1;
}

.sidebar .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

.openbtn {
  font-size: 20px;
  cursor: pointer;
  background-color: #009E2D;
  color: white;
  padding: 10px 15px;
  border: none;
}

.openbtn:hover {
  background-color: #444;
}

#main {
  transition: margin-left .5s;
  padding: 16px;
}