/*
Theme Name: Pinball
*/

/* FONTS */
@import url("https://use.typekit.net/qjy3tgn.css");

@font-face {
	font-family: 'ITCAvantGardeStd';
	src: url('css/fonts/ITCAvantGardeStd-Demi.eot?') format('eot'), 
	     url('css/fonts/ITCAvantGardeStd-Demi.woff') format('woff'), 
	     url('css/fonts/ITCAvantGardeStd-Demi.ttf')  format('truetype'),
	     url('css/fonts/ITCAvantGardeStd-Demi.svg#ITCAvantGardeStd') format('svg');
}


/**** Foundation.css ****/

*, :before, :after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box }
.row {
	clear: both;
	width: 1032px;
	margin: 0 auto;
	max-width: 100% 
}
.row:before, .row:after {
	content: "";
	display: table 
}
.row:after {
	clear: both 
}
.row .row {
	width: auto;
	min-width: 0;
	max-width: none;
	margin: 0 -15px 
}
.row.collapse .columns {
	padding: 0 
}
.row .row.collapse {
	margin: 0 
}
.columns {
	float: left;
	min-height: 1px;
	padding: 0 15px;
	position: relative 
}
.columns.centered {
	float: none;
	margin: 0 auto 
}
.one, .row .one {
	width: 8.33333% 
}
.two, .row .two {
	width: 16.66667% 
}
.three, .row .three {
	width: 25% 
}
.four, .row .four {
	width: 33.33333% 
}
.five, .row .five {
	width: 41.66667% 
}
.six, .row .six {
	width: 50% 
}
.seven, .row .seven {
	width: 58.33333% 
}
.eight, .row .eight {
	width: 66.66667% 
}
.nine, .row .nine {
	width: 75% 
}
.ten, .row .ten {
	width: 83.33333% 
}
.eleven, .row .eleven {
	width: 91.66667% 
}
.twelve, .row .twelve {
	width: 100% 
}
#loader {
	display:none;
	margin: 0 auto 32px;
    line-height: 88px;
}
p.error {
	color: #f16639;
    text-align: center;
    margin: 0 0 20px;
}
@media only screen and (max-width: 767px) {
.row {
	clear: both;
	width: auto;
	min-width: 0
}
.columns {
	float: none;
	width: auto!important
}
.columns:last-child {
	float: none 
}
.columns:before, .columns:after {
	content: "";
	display: table 
}
.columns:after {
	clear: both 
}
}
.ctl-arcade-rank-table * { text-shadow:none !important }
.ctl-arcade-rank-table > p, .ctl-arcade-rank-header,
.ctl-arcade-rank-filters {
	display:none !important;	
}
.ctl-arcade-rank-table {
    border: none !important;
    background-color: transparent !important;
}
.ctl-arcade-rank-table { margin-bottom:50px; float:left; width:100%; }
.ctl-arcade-rank-container {
/*     width: 460px; */
    width: 920px; 
    max-width:100%;
    margin: 0 auto 0px !important;
}
* {
	outline: none; 
	text-decoration: none 
}
img {
	height: auto;
	max-width: 100% 
}
h1, h2, h3, h4, h5, h6 {
	margin: 0 0 15px;
	font-weight: 700;
	line-height: 1.2 
}
p {
	margin: 0 0 22px 
}
ul {
	margin: 0;
	padding: 0;
	list-style: none 
}
input[type="text"],
input[type="password"], 
input[type="email"],
select,
textarea {
	border: 0;
	float: left;
	width: 100%;
	height: 45px;
	color: #fff;
	font-size: 20px;
	margin: 0 0 27px; 
	padding: 6px 18px;
	border-radius: 10px;
	background: transparent;
	border: 2px solid #F06738;
/* 	font-family: 'ITCAvantGardeStd'; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
}
input[type="text"]:hover,
input[type="password"]:hover, 
input[type="email"]:hover {
	border: 2px solid #fff;
}
input[type="text"]::-webkit-input-placeholder,
input[type="email"]::-webkit-input-placeholder,
input[type="password"]::-webkit-input-placeholder {
	color: #fff;
}
input[type="text"]:-moz-placeholder,
input[type="email"]:-moz-placeholder,
input[type="password"]:-moz-placeholder {
	color: #fff;
}
input[type="text"]::-moz-placeholder,
input[type="email"]::-moz-placeholder,
input[type="password"]::-moz-placeholder {
	color: #fff;
}
input[type="text"]:-ms-input-placeholder,
input[type="email"]:-ms-input-placeholder,
input[type="password"]:-ms-input-placeholder {
	color: #fff;
}

input[type="text"]:focus::-webkit-input-placeholder,
input[type="email"]:focus::-webkit-input-placeholder,
input[type="password"]:focus::-webkit-input-placeholder	{ 
	color:transparent;
}
input[type="text"]:focus:-moz-placeholder,
input[type="email"]:focus:-moz-placeholder,
input[type="password"]:focus:-moz-placeholder {
	color:transparent; 
} /* FF 4-18 */
input[type="text"]:focus::-moz-placeholder,
input[type="email"]:focus::-moz-placeholder,
input[type="password"]:focus::-moz-placeholder {
	color:transparent;
} /* FF 19+ */
input[type="text"]:focus:-ms-input-placeholder,
input[type="email"]:focus:-ms-input-placeholder,
input[type="password"]:focus:-ms-input-placeholder {
	color:transparent;
} /* IE 10+ */  
  
textarea {
	resize: none;
	height: 104px; 
}
input[type="submit"] {
	border: 0;
	margin: 0;
	color: #000;
	width: 100%;
	float: left;
	height: 46px;
	cursor: pointer;
	font-size: 20px;
	border-radius: 0;
	font-weight: bold;
	background: #caab45;
	font-family:inherit;
	text-transform: uppercase
}
button.playbtn {
	border: 0;
    background: none;
}

/**** Main.css ****/
 
body {
	margin: 0;
	float: left;
	width: 100%;
	color: #fff;
	font-size: 22px;
	line-height: 1.4;
	font-weight: normal;
/* 	font-family: 'ITCAvantGardeStd'; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	background: #000 url(images/bodybg1.jpg) no-repeat center bottom;
	background-size:cover;
	/* background-attachment: fixed; */
	
}
body.registration {
	background-color: #000;
	background-image:url(images/bg_registration.jpg);
	background-attachment: fixed;
	background-position: center bottom;
}
@media only screen and (min-width: 1800px) {
	body.registration {
		background-attachment: initial;
	}
}

.header {
	float: left;
	width: 100%;
	padding-top: 82px;
	position: relative;
}
a.backbtn {
	/* background: #f06637; */
	/* font-family: 'ITC Avant Garde Gothic'; */
	/* background-color: transparent; */
	top: 22px;
	left: 58px;
	color: #fff;
	width: 200px;
	font-size: 17px;
	font-weight: bold;
	line-height: 48px;
	position: absolute;
	border-radius: 25px;
	text-align: center;
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	border: 2px solid #f06637;
	background-color: rgba(0, 0, 0, .3);
	transition: width 0.2s linear;
}
a.backbtn:hover {
	/* color: #f06637; */
	/* background: #fff; */
	color: #fff;
	width: 240px;
}
.sharebtns {
	top: 25px;
	right: 58px;
	float: right;
	position: absolute;
}
.sharebtns span {
	float: left;
	color: #f06738;
	font-size: 18px;
	line-height: 32px;
}
.sharebtns ul {
	float: left;
}
.sharebtns li {
	float: left;
	padding-left: 12px;
}
.sharebtns a {
	float: left;
	width: 40px;
	height: 40px;
	color: #030404;
	font-size: 20px;
	padding: 3px 3px 0;
	text-align: center;
	border-radius: 50%;
	/* background: #bcbec0; */
	background: transparent;
	border: 1px solid transparent;
}
.sharebtns a.fb {
	font-size: 24px;
	padding-top: 5px;
}
.sharebtns a:hover {
	background: transparent;
	border: 1px solid #f06637;
}
@media (max-width:767px) {
	.sharebtns {
		display: none;
	}
}
.logo {
	float: left;
	width: 100%;
	text-align: center;
	margin-bottom: 40px;
}
.leaderboard {
	top: 31px;
	right: 45px;
	text-align: center;
	position: absolute;
}
.leaderboard img {
	display: block;
	margin:0 auto 10px;
}
.leaderboard span {
	color: #f06637;
	display: block;
	font-size: 14px;
/* 	font-family: 'Rammetto One', sans-serif; */
/* 	font-family: 'ITCAvantGardeStd', arial, sans-serif; */
/* 	font-weight: bold; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
}
.leaderboard a:hover span {
	color: #fff;
}
.maincontent {
	float: left;
	width: 100%;
	text-align: center;	
	margin-bottom: 15px;
}
.maincontent h2 {
	font-size: 26px;
	line-height: 1.4;
/* 	font-weight: normal; */
	margin-bottom: 36px;
/* 	font-family: 'Rammetto One', sans-serif; */
/* 	font-family: 'ITCAvantGardeStd', arial, sans-serif; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	font-weight: bold;
}
.maincontent p {
/* 	font-family: 'ITCAvantGardeStd', arial, sans-serif; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	font-weight: normal;
}
.maincontent h1 {
	font-size: 56px;
	margin-top: -20px;
/* 
	font-weight: normal;
	font-family: 'Rammetto One', sans-serif;
 */
/* 	font-family: 'ITCAvantGardeStd', arial, sans-serif; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	font-weight: bold;
}
.maincontent a, .maincontent a:link, .maincontent a:visited {
    color: #f06637;
    text-decoration: underline;
}
.maincontent a:hover, .maincontent a:active, .maincontent a:target, .maincontent a:focus  {
    color: #ffffff;
    text-decoration: underline;
}
.contactform {
	float: left;
	width: 100%;
	padding: 0 45px;
	margin-bottom: 30px;
}
.contactform label {
	float: left;
	width: 100%;
	font-size: 18px;
	margin-bottom: 6px;
/* 	font-family: 'Rammetto One', sans-serif; */
/* 	font-family: 'ITCAvantGardeStd', arial, sans-serif; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	font-weight: 100;
}
.atleast {
	clear: both;
	width: 270px;
	margin:0 auto;
	margin-top: 10px;
	font-size: 13.2px;
	margin-bottom: 12px;
}
.atleast label {
	float: none;
	font-size: 14px;
}
.atleast input[type="checkbox"] {
	/* float: left; */
	margin-right: 12px;
}
.playbtn {
	float: left;
	width: 100%;
	text-align: center;
	margin-bottom: 50px;
}
.playbtn img {
	display: block; cursor:pointer;
	margin: 0 auto 32px;
}
.playbtn p.byclicking {
	color: #fff;
	font-size: 13.2px;
	margin-bottom: 30px;
}
a.terms {
	color: #fff;
	border-bottom: 1px solid #bcbec0;
}
a.playguest {
	color: #f06637;
	padding-bottom: 3px;
/* 	border-bottom: 2px solid #fff; */
	text-decoration: underline;
	font-weight: bold;
}
a.playguest:hover, 
a.terms:hover  {
/* 	color: #f06637; */
	color: #fff;
	border-color: #f06637;
}
.copyrights {
	float: left;
	width: 100%;
	font-size: 18px;
	padding: 0 65px;
	margin-top: 100px;
	text-align: center;
	margin-bottom: 32px;
/* 	font-family: 'ITC Avant Garde Gothic Std Book'; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
}
.playbtn h3 {
	font-size: 24px;
	margin-bottom: 8px;
	font-weight: bold;
/* 	font-family: 'ITCAvantGardeStd', arial, sans-serif; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	color: #eb1c23;
}
p.sharefull {
	font-size: 24px;
}
.playbtn ul {
	float: left;
	width: 100%;
	margin-top: 8px;
	text-align: center;
}
.playbtn li {
	padding: 0 10px;
	display: inline-block;
}
.playbtn li a {
	float: left;
	color: #030404;
	font-size: 20px;
	padding: 3px 3px 0;
	text-align: center;
}
/* .playbtn li a.fb {
	font-size: 24px;
	padding-top: 5px;
} */

.boardswrapper {
	float: left;
	width: 100%;
	padding: 0 40px;
	text-align: left;
	margin-top: 32px;
}

.boardinfo-wrapper {
	float: left;
	width: 100%;
	padding: 0 30px;
	margin-bottom: 50px;
}
.ctl-arcade-rank-body {
	display: grid;
	grid-auto-flow: column; /* Makes items fill the first column before moving to the next */
	gap: 10px; /* Optional spacing */
	grid-template-rows: repeat(10, 1fr); /* Defines three rows before moving to the next column */
}
@media only screen and (max-width: 767px) {
	.ctl-arcade-rank-body {
		grid-template-rows: auto; /* Defines three rows before moving to the next column */
		grid-auto-flow: row; /* Makes items fill the first column before moving to the next */
	}
}

.ctl-arcade-rank-row:hover {
	background-color: transparent !important;
}
.ctl-arcade-rank-table-green .ctl-arcade-rank-body .ctl-arcade-rank-row:nth-child(odd),
.ctl-arcade-rank-table-green .ctl-arcade-rank-body .ctl-arcade-rank-row:nth-child(even) {
	background-color: transparent !important;
}

.ctl-arcade-rank-body .ctl-arcade-rank-row:last-child {
	border-bottom-left-radius: 20px !important;
	border-bottom-right-radius: 20px !important;
}

.ctl-arcade-rank-table-green .ctl-arcade-rank-row:hover {
	background-color: transparent !important;
}

.boardinfo, .ctl-arcade-rank-row {
/* 	float: left; */
	width: 100%;
	padding-top: 8px;
	min-height: 76px;
	padding-left: 95px;
	position: relative;
	border-radius: 20px;
	margin-bottom: 0px;
	/* background: rgb(65,64,66); */
	background: transparent;
	box-shadow: 0px 5px 5.76px 0.24px rgba(0, 0, 0, 0.65);
	/* background: linear-gradient(90deg, rgba(65,64,66,1) 0%, rgba(18,30,33,1) 100%); */
	border: 1px solid #ffffff;
}
@media only screen and (max-width: 767px) {
	.boardinfo, .ctl-arcade-rank-row {
		margin-bottom: 0px;
	}
}

.ctl-arcade-rank-row:nth-child(1),
.ctl-arcade-rank-row:nth-child(2),
.ctl-arcade-rank-row:nth-child(3),
.ctl-arcade-rank-row:nth-child(4),
.ctl-arcade-rank-row:nth-child(5),
.ctl-arcade-rank-row:nth-child(6),
.ctl-arcade-rank-row:nth-child(7),
.ctl-arcade-rank-row:nth-child(8),
.ctl-arcade-rank-row:nth-child(9),
.ctl-arcade-rank-row:nth-child(10) {
	border: 1px solid #F06738 !important;
}



.counting, .ctl-arcade-rank-row .ctl-arcade-rank-col:nth-child(1) {
	left: 0;
	top: 0;
	width: 74px;
	height: 100%;
	color: #414042 !important;
	font-size: 30px;
	background: #fff;
	font-weight: bold;
	line-height: 90px;
	position: absolute;
	text-align: center;
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
/* 	font-family: 'ITC Avant Garde Gothic'; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
}
.boardinfo h4, .ctl-arcade-rank-row .ctl-arcade-rank-col:nth-child(2) {
	font-size: 20px;
	font-weight: 100;
	margin-bottom: 4px;
/* 	font-family: 'ITCAvantGardeStd', arial, sans-serif; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	display: block;
    width: 100%;
    text-align: left;
    padding: 0; 
    color: #fff;
}
.boardinfo strong, .ctl-arcade-rank-row .ctl-arcade-rank-col:nth-child(3) {
	display: block;
	font-size: 24px;
	margin-bottom: 5px;
/* 
	font-weight: normal;
	font-family: 'Rammetto One', sans-serif;
 */
	display: block;
    width: 100%;
    text-align: left;
    padding: 0; color: #fff;
/* 	font-family: 'ITCAvantGardeStd', arial, sans-serif; */
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	font-weight: bold;
}
.topboard, .ctl-arcade-rank-row:nth-child(1),
.topboard, .ctl-arcade-rank-row:nth-child(2),
.topboard, .ctl-arcade-rank-row:nth-child(3),
.topboard, .ctl-arcade-rank-row:nth-child(4),
.topboard, .ctl-arcade-rank-row:nth-child(5),
.topboard, .ctl-arcade-rank-row:nth-child(6),
.topboard, .ctl-arcade-rank-row:nth-child(7),
.topboard, .ctl-arcade-rank-row:nth-child(8),
.topboard, .ctl-arcade-rank-row:nth-child(9),
.topboard, .ctl-arcade-rank-row:nth-child(10) {
	/* background: rgb(241,102,57); */
	/* background: linear-gradient(90deg, rgba(241,102,57,1) 0%, rgba(204,51,0,1) 100%); */
	background-color: transparent;
}

.topboard .counting, 
.ctl-arcade-rank-row:nth-child(1) .ctl-arcade-rank-col:nth-child(1),
.ctl-arcade-rank-row:nth-child(2) .ctl-arcade-rank-col:nth-child(1) {
	background-color: #f06738 !important;
	color: #fff !important;
}
.topboard h4, .ctl-arcade-rank-row .ctl-arcade-rank-col:nth-child(2) {
	font-size: 24px !important;
}
.topboard strong, .ctl-arcade-rank-row .ctl-arcade-rank-col:nth-child(3) {
	font-size: 34px !important;
}

.ctl-arcade-rank-table .ctl-arcade-rank-no-scores {
	color: #f06637 !important;
	font-size: 18px !important;
	background-color: transparent !important;
	text-shadow: none !important;
	font-family: itc-avant-garde-gothic-pro, sans-serif !important;
	font-weight: normal !important;
	letter-spacing: 3px !important;
}

.ctl-arcade-rank-row {
	transform: scale(0.9); 
	transition:all 0.3s linear; 
	-webkit-transition:all 0.3s linear; 
	-moz-transition:all 0.3s linear;
}
.ctl-arcade-rank-row:nth-child(1) .ctl-arcade-rank-col:nth-child(1),
.ctl-arcade-rank-row:nth-child(2) .ctl-arcade-rank-col:nth-child(1),
.ctl-arcade-rank-row:nth-child(3) .ctl-arcade-rank-col:nth-child(1),
.ctl-arcade-rank-row:nth-child(4) .ctl-arcade-rank-col:nth-child(1),
.ctl-arcade-rank-row:nth-child(5) .ctl-arcade-rank-col:nth-child(1),
.ctl-arcade-rank-row:nth-child(6) .ctl-arcade-rank-col:nth-child(1),
.ctl-arcade-rank-row:nth-child(7) .ctl-arcade-rank-col:nth-child(1),
.ctl-arcade-rank-row:nth-child(8) .ctl-arcade-rank-col:nth-child(1),
.ctl-arcade-rank-row:nth-child(9) .ctl-arcade-rank-col:nth-child(1),
.ctl-arcade-rank-row:nth-child(10) .ctl-arcade-rank-col:nth-child(1) {
/* 	transform: scale(1);  */
	background-color: #f06738 !important;
	color: #fff !important;
}

.ctl-arcade-rank-table-green {
	box-shadow: none !important;
}

.orientation-msg-container {
	width: 100%;
	height: 100%;
	display: none;
	position: fixed;
	background-color: #000;
}

@media only screen and (max-width: 1023px) {
	/*.logo img { width: 400px; }*/
	.leaderboard, .sharebtns { right: 15px; }
	a.backbtn { left: 15px; }
	.copyrights { text-align: center !important; padding: 0 15px; }
}
@media only screen and (max-width: 767px) {
/* 	.logo-wrapper { zoom:0.4; } */
	body { font-size: 18px; }
	.header { padding: 25px 15px; text-align: center; }
	a.backbtn { position: unset; display: inline-block; margin-bottom: 25px; }
	.sharebtns { width: 100%; position: unset; margin-bottom: 25px; }
	.sharebtns span { width: 100%; margin-bottom: 10px; }
	.sharebtns ul { width: 100%; text-align: center; }
	.sharebtns li { float: none; display: inline-block; padding-left: 10px; padding-right: 10px; }
	.maincontent h1 { font-size: 30px; }
	.boardswrapper, .boardinfo-wrapper { padding: 0; }
	.counting { font-size: 40px; }
	.topboard h4, p.sharefull { font-size: 20px; }
	.topboard strong { font-size: 24px; }
	.playbtn h3, .maincontent h2 { font-size: 20px; line-height: 1.4; }
	.copyrights { font-size: 14px; margin-top: 0; }
	.leaderboard { position: unset; margin-bottom: 30px; display:none;}
	.leaderboard img { display: inherit; }
	.contactform { padding: 0; }
	.logo { margin-bottom: 0; }
	input[type="text"], input[type="email"], select, textarea { font-size: 18px; }
}

.page-id-11 .maincontent h2 {
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	font-weight: normal;
	color: #f06637;
	text-transform: uppercase;
	letter-spacing: 4px;
	margin-bottom: 100px;
}
@media only screen and (max-width: 768px) {
	.page-id-11 .maincontent h2 {
		margin-bottom: 10vw;
	}
}

.page-id-11 .logo-wrapper {
	width: 30%;
	transition: width 0.3s linear;
}

.playbtn a.play {
	font-family: itc-avant-garde-gothic-pro, sans-serif;
	font-weight: 400;
	border: 2px solid #f06637;
	border-radius: 30px;
	background-color: rgba(0, 0, 0, .3);
	color: #fff;

	display: block;
	line-height: 2.7;
	letter-spacing: 10px;
	width: 323px;
	margin-left: auto;
	margin-right: auto;
	background-size: contain;
	margin-bottom: 50px;
	transition: width 0.3s linear;
}
.playbtn a.play:hover {
	width: 355px;
	border: 2px solid #fff;
}

@media only screen and (max-width: 1023px) {
	.page-id-11 .logo-wrapper { width: 50%; }
}

@media only screen and (max-width: 768px) {
	.page-id-11 .logo-wrapper { width: 70%; }
}

body.page-id-9 {
    margin: 0;
    background: black !important;
}
.page-id-9 .header {
    display: none;
}
.page-id-9 .copyrights {
    display: none;
}
.page-id-9 .row {
    clear: both;
    width: 100%;
}
.page-id-9 .twelve.columns {
    padding: 0px;
}
.page-id-9 .ctl-arcade-game-iframe-wrapper {
	margin-bottom:0px;
}