@font-face {font-family: "arial"; src: url(fonts/arial.ttf); font-weight: normal; } 
@font-face {font-family: "Gotham Book"; src: url(fonts/Gotham-Book.otf); font-weight: normal; } 
@font-face {font-family: "Gotham Bold"; src: url(fonts/Gotham-Bold.otf); font-weight: normal; } 
@font-face {font-family: "Gotham Condensed Bold"; src: url(fonts/GothamCondensed-Bold.otf); font-weight: normal; } 
@font-face {font-family: "OpenSans Regular"; src: url(fonts/OpenSans-Regular.ttf); font-weight: normal; } 
@font-face {font-family: "OpenSans Bold"; src: url(fonts/OpenSans-Bold.ttf); font-weight: normal; } 


hr {
	background-color: #333;
}

.vtop-5 { margin-top: 5px;  }
.vtop-10 { margin-top: 10px;  } .vtop-15 { margin-top: 15px;  }
.vtop-20 { margin-top: 20px;  } .vtop-25 { margin-top: 25px;  }
.vtop-30 { margin-top: 30px;  } .vtop-35 { margin-top: 35px;  }
.vtop-40 { margin-top: 40px;  } .vtop-45 { margin-top: 45px;  }
.vtop-50 { margin-top: 50px;  } .vtop-55 { margin-top: 55px;  }
.vtop-60 { margin-top: 60px;  } .vtop-65 { margin-top: 65px;  }
.vtop-70 { margin-top: 70px;  } .vtop-75 { margin-top: 75px;  }
.vtop-80 { margin-top: 80px;  } .vtop-85 { margin-top: 85px;  }
.vtop-90 { margin-top: 90px;  } .vtop-95 { margin-top: 95px;  }
.vtop-100 { margin-top: 100px;  }


.hide {
	display: none;
}

/*** Start ***/

body, html {
	font-family: "Gotham Book" !important;
	font-size: 9pt !important;
	padding: 0;
	margin: 0;
	background-color: #131313 !important;
	width: 100%;
	height: 100% !important;
}
	

a {
	color: #ccae35;
	text-decoration: none;
}

a:hover {
	color: #fff;
	text-decoration: none;
}

p {
	color: #fff;
	text-align: center;
}

h2 {
	font-family: "Gotham Bold", sans-serif;
	color: #c4d310;
	padding: 10px;
    font-size: 20pt;
    text-transform: uppercase;
    //border-bottom: 3px solid #dda406;
    margin: auto;
    width: 100%;
    margin-bottom: 10px;
    /* standard gradient background */
	background: linear-gradient(#c4d310, #ffbb00);
	/* clip hackery */
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-align: center;
}




h3 {
	font-family: "OpenSans Regular", sans-serif;
	color: #c4d310;
    font-size: 12pt;
    text-transform: uppercase;
    border-bottom: none;
    margin: auto;
    width: 100%;
    margin: 10px 0 10px 0;
    text-align: center;
    margin-top: 20px;

}

.link {
	color: #ff933a;
}


button[type=submit], input[type=submit] {
	font-family: "Gotham Book" !important;
	background-color:#e5a606;
	border-radius:28px;
	border:1px solid #dd9104;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size:9pt;
	padding:8px 10px;
	text-decoration:none;
	text-shadow:0px 1px 0px #2f6627;
	text-transform: uppercase;
}
button[type=submit]:hover, input[type=submit]:hover {
	background-color:#dd9204;
}
button[type=submit]:active, input[type=submit]:active {
	position:relative;
	top:1px;
}


/*** HEADER ***/
.my-container {
	background: url('../img/img/bg-top.jpg') top center repeat-x;
	width: 100%;
	height: auto;
}

.my-content {
	margin: auto;
	width: 1400px;
	min-height: 1400px;
	height: auto;
}

.navi-container {
	position: relative;
	z-index: 9980;
	width: 100%;
}


.navi {
	width: 100%;
	height: 65px;
}


.navi .logo {
	float: left;
	margin: 15px 0 0 -15px;
}

.btn-navi {
	float: left;
	margin-left: 100px;
	width: 875px;
	height: 65px;
}

.top-navi {
	margin: 20px 0 0 30px;
}

.top-navi ul
{
	z-index: 9980;
	font-family: "Gotham Book", sans-serif;
	color: #cee705;
	position: relative;
	padding: 0;
	list-style-type: none;
	text-align: center;
}

.top-navi ul li { display: inline; }
.top-navi ul li a { 
	position: relative;
	right: 0;
	font-size: 10.5pt; color: #bababb; text-transform: uppercase; margin: 0 15px 0 15px; 
	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-ms-transition: all 0.3s;
  	-o-transition: all 0.3s;
  	transition: all 0.3s;
}
.top-navi ul li a:hover { 
	position: relative;
	right: -5px;
	font-size: 10.5pt; color: #e3ac14; text-transform: uppercase; margin: 0 15px 0 15px; 
	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-ms-transition: all 0.3s;
  	-o-transition: all 0.3s;
  	transition: all 0.3s;
}


.status {
	float: left;
	margin-top: 5px;
	background: url('../img/img/bg-server-status.png') top center repeat-x;
	width: 209px;
	height: 53px;
}

.status .online-players {
	position: relative;
	text-align: right;
	top: 8px;
	right: 20px;
	font-size: 8pt;
	color: #fff;
}

.status .server-status {
	position: relative;
	text-align: right;
	top: 15px;
	right: 20px;
	font-size: 8pt;
}

.banner {
	width: 100%;
	min-height: 675px;
}

.banner .logo {
	position: absolute;
	top: 90px;
	z-index: 9999;
}

.banner .logo {
	margin: 70px 0 0 30px;
	animation: fadein 2s;
	-webkit-transition: all 1s cubic-bezier(.8,1.8,.75,.75);
	-moz-transition: all 1s cubic-bezier(.8,1.8,.75,.75);
	-o-transition: all 1s cubic-bezier(.8,1.8,.75,.75);
	transition: all 1s cubic-bezier(.8,1.8,.75,.75);
}


.banner .swordsman {
	position: absolute;
	top: 20px;
	z-index: 1;
}

.banner .swordsman {
	margin: 0 0 0 500px;
}


.banner .login {
	position: relative;
	top: 175px;
	left: 190px;
	z-index: 9998;
	background: url('../img/img/bg-login.png') no-repeat;
	width: 370px;
	height: 379px;
}

.login-form {
	position: relative;
	top: 52px;
}

.login-form table {
	position: relative;
	z-index: 9999;
	font-family: "Gotham Book";
	font-size: 10pt;
	color: #898989;
}

.txt-login {
	background: rgba(13,13,1,1);
	width: 100%;
	height: 32px;
	border-radius: 5px;
	border: none !important;
	text-align: center;
}

.txt-login {
	background: rgba(13,13,1,1);
	width: 100%;
	height: 32px;
}

.btn-login {
	position: relative;
	left: 7px;
	opacity: 0.8;
	background: url('../img/img/btn-login.png');
	width: 276px;
	height: 53px;
	border: 0;
	outline: 0;
	cursor: pointer;
	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-ms-transition: all 0.3s;
  	-o-transition: all 0.3s;
  	transition: all 0.3s;
}

.btn-login:hover {
	opacity: 1;
}


.btn-logout {
	opacity: 0.8;
	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-ms-transition: all 0.3s;
  	-o-transition: all 0.3s;
  	transition: all 0.3s;
}

.btn-logout:hover {
	opacity: 1;
}

.qlinks {
	position: relative;
	float: right;
	top: -60px;
	right: 100px;
	z-index: 9999;
	background: rgba(0,0,0,0.8);
	width: 870px;
	height: 60px;
	border-radius: 30px;
}


.qlinks ul
{
	z-index: 9980;
	font-family: "Gotham Book", sans-serif;
	color: #cee705;
	position: relative;
	padding: 0;
	list-style-type: none;
	text-align: center;
}

.qlinks ul li { display: inline; }
.qlinks ul li a { 
	position: relative;
	top: 18px;
	font-size: 12pt; color: #ccae35; margin: 0 5px 0 5px; 
	padding: 20px 20px 21px 20px;
	border-radius: 30px;
	letter-spacing: 5px;
	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-ms-transition: all 0.3s;
  	-o-transition: all 0.3s;
  	transition: all 0.3s;
}
.qlinks ul li a:hover { 
	position: relative;
	font-size: 12pt; color: #e3ac14; margin: 0 5px 0 5px;
	background-color: #77590f;
	padding: 20px 20px 21px 20px;
	border-radius: 30px;
	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-ms-transition: all 0.3s;
  	-o-transition: all 0.3s;
  	transition: all 0.3s;
}

.news {
	position: relative;
	top: -90px;
	margin: auto;
	width: 1215px;
	height: auto;
}

.news .header {
	margin: 0 0 0 20px;
}

.news-content {
	margin: 10px 0 0 0;
}

.news-content .news-item {
	float: left;
	margin-left: 20px;
	background: url('../img/img/bg-news.png');
	width: 222px;
	height: 282px;
}

.news-img {
	position: relative;
	left: 1px;
}

.news-desc {
	padding: 5px;
	overflow: hidden;
}


.news-desc .date {
	float: left;
	font-size: 7.5pt;
	color: #8b8b8b;
}

.news-desc .type {
	float: right;
	text-transform: uppercase;
	font-size: 7.5pt;
	color: #c6af34;
}

.news-desc .title {
	font-family: "Gotham Bold", sans-serif;
	font-size: 11pt;
	color: #fff;
}

.news-desc .info {
	font-size: 7.5pt;
	color: #8b8b8b;
	height: 100px;
	overflow: hidden;
}

.news-desc .author {
	float: left;
	color: #8b8b8b;
	font-size: 7.5pt;
}

.news-desc .link {
	float: right;
	color: #8b8b8b;
	font-size: 7.5pt;
}

.profile {
	margin: -100px 0 0 0;
	background: url('../img/img/bg-welcome.png');
	width: 1403px;
	height: 690px;
}

.profile .profile-content {
	float: right;
	margin: 40px 70px 0 0;
	width: 645px;
	height: auto;
}

.profile .p-title {
	font-family: "Gotham Bold", sans-serif;
	font-size: 24pt;
	color: #cdb656;
}

.profile .p-desc {
	width: 90%;
	height: 200px;
	font-size: 14pt;
	color: #898989;
}

.profile .m-title {
	font-size: 24pt;
	color: #cdb656;
}

.profile .new-chars {
	position: relative;
	top: 25px;
	left: 145px;
	width: 115px;
	float: left;
	font-family: "Gotham Bold", sans-serif;
	font-size: 24pt;
	color: #fff;
}


.profile .sign-ups {
	position: relative;
	float: left;
	top: 25px;
	left: 305px;
	width: 115px;
	font-family: "Gotham Bold", sans-serif;
	font-size: 24pt;
	color: #fff;
}


.reviews {
	position: relative;
	z-index: 9997;
	background: url('../img/img/bg-reviews.png') no-repeat;
	margin: -120px auto 0 auto;
	width: 1181px;
	height: 385px;
}

.reviews-content {
	position: relative;
	top: 100px;
	left: 15px;
	width: 1145px;
	height: auto;
	margin: 0 auto 0 auto;
}

.reviews-item {
	float: left;
	width: 380px;
	height: 220px;
	text-align: center;
	overflow: hidden;
}

.r-name {
	font-family: "Gotham Bold", sans-serif;
	font-size: 15pt;
	color: #ccae35;
}

.r-desc {
	margin: auto;
	width: 80%;
	font-size: 11pt;
	color: #898989;
}

.section-content {
	font-size: 11pt;
	width: 100%;
	padding: 20px;
	background: rgba(0,0,0,0.5);
	position: relative;
	z-index: 9999;
	width: 100%;
	border-radius: 15px;
}


.section-pages p {
	color: #fff !important;
}


.section-pages table {
	margin: auto;
}

.my-menus {
	position: relative;
	z-index: 9950;
	margin: auto;
}


.footer {
	position: relative;
	z-index: 9995;
	margin-top: -80px;
	background: url('../img/img/bg-footer.png') top center no-repeat;
	font-family: "Gotham Book", sans-serif;
	width: 100%;
	height: 298px;
}

.footer2 {
	position: relative;
	z-index: 9990;
	margin-top: -120px;
	background: url('../img/img/bg-footer.png') top center no-repeat;
	font-family: "Gotham Book", sans-serif;
	width: 100%;
	height: 298px;
}

.footer .footer-content, .footer2 .footer-content {
	position: relative;
	top: 150px;
	margin: auto;
	width: 1400px;
	height: auto;
}

.footer .lpane, .footer2 .lpane {
	float: left;
	width: 75%;
}

.footer .links, .footer2 .links {
	color: #454545;
}

.footer .links a, .footer .links a:visited, .footer2 .links a, .footer2 .links a:visited {
	font-size: 9pt;
	color: #ccae35;
	text-decoration: none;
}

.footer .copyright, .footer2 .copyright {
	margin-top: 20px;
	color: #898989;
	font-size: 9pt;
}

.footer .logos, .footer2 .logos {
	margin-left: -25px;
}

.footer .rpane, .footer2 .rpane {
	float: right;
	width: 20%;
	color: #ccae35;
	font-size: 9pt;
}

.footer a, .footer2 a {
	opacity: 0.7;
	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-ms-transition: all 0.3s;
  	-o-transition: all 0.3s;
  	transition: all 0.3s;	
}

.footer a:hover, .footer2 a:hover {
	opacity: 1;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}