/*Font*/
  
@font-face {font-family: 'FranklinGothicLTPro-Heavy';src: url('../fonts/webfonts/372727_C_0.eot');src: url('../fonts/webfonts/372727_C_0.eot?#iefix') format('embedded-opentype'),url('../fonts/webfonts/372727_C_0.woff2') format('woff2'),url('../fonts/webfonts/372727_C_0.woff') format('woff'),url('../fonts/webfonts/372727_C_0.ttf') format('truetype');}
@font-face {font-family: 'FranklinGothicLTPro-Bk';src: url('../fonts/webfonts/372727_1_0.eot');src: url('../fonts/webfonts/372727_1_0.eot?#iefix') format('embedded-opentype'),url('../fonts/webfonts/372727_1_0.woff2') format('woff2'),url('../fonts/webfonts/372727_1_0.woff') format('woff'),url('webfonts/372727_1_0.ttf') format('truetype');}
@font-face {font-family: 'FranklinGothicLTPro-Dm';src: url('../fonts/webfonts/372727_D_0.eot');src: url('../fonts/webfonts/372727_D_0.eot?#iefix') format('embedded-opentype'),url('../fonts/webfonts/372727_D_0.woff2') format('woff2'),url('../fonts/webfonts/372727_D_0.woff') format('woff'),url('../fonts/webfonts/372727_D_0.ttf') format('truetype');}
@font-face {font-family: 'FranklinGothicLTPro-Md';src: url('../fonts/webfonts/372727_13_0.eot');src: url('../fonts/webfonts/372727_13_0.eot?#iefix') format('embedded-opentype'),url('../fonts/webfonts/372727_13_0.woff2') format('woff2'),url('../fonts/webfonts/372727_13_0.woff') format('woff'),url('../fonts/webfonts/372727_13_0.ttf') format('truetype');}


#basic-modal-content {display:none;}

/* Container */
#wrapper {
    width: 100%;
    max-width: 1620px;
    margin: 0 auto;
    font-size: 1em;
}
#modal-container{width:70% !important;z-index:9999;position:fixed; padding-top: 8.5%; margin-top: 2%; margin: 0 auto; top:0; bottom:0; left:0; right:0;overflow-y: auto;overflow-x: hidden;}
#basic-modal-content{padding:10px !important;background-color:#fff;display:inline-block; position: relative;}
#basic-modal-content .bumper-content .bumper-content-left{width:50%;float:left}
#basic-modal-content .bumper-content .bumper-content-right{width:50%;float:right}
#basic-modal-content .bumper-content .bumper-content-left img,#basic-modal-content .bumper-content .bumper-content-right img{width:100%}
#basic-modal-content .bumper-logo{
	position: absolute;
	left: 50%;
	top: -12%;
	transform: translateX(-50%);
	}
.rollgate-container #basic-modal-content .bumper-logo img{width:100%}
#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url{
	background: url("../img/kids-button-bg.png") no-repeat 0px 0px; 
    bottom: 21%;
    left: 15%;
}
#basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
	background: url("../img/parents-button-bg.png") no-repeat 0px 0px; 
    bottom: 20.5%;
    right: 12%;
}
#modal-container::-webkit-scrollbar {
	display: none;
}
#modal-bg{
	position: fixed;
    z-index: 1040;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: #000;
	opacity: 0.5;
}
#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
	font-size: 1.1em;
	text-align: center;
	width: 40%;
	height: 5%;
	padding-top: 2%;
	font-family: 'FranklinGothicLTPro-Dm'; 
	background-size: 100%;
	color: #fff;
	text-decoration: none;
	position: absolute;
	text-transform: uppercase;
}
#basic-modal-content .bumper-content .bumper-content-left .button-content-left{position: absolute; bottom: 10%; left: 3%; width: 43%;}
#basic-modal-content .bumper-content .bumper-content-right .button-content-right{position: absolute; bottom: 3%; right: 7%; width: 38%;}
.desc-text{font-family: 'FranklinGothicLTPro-Dm'; color: #fff; text-align: center; letter-spacing: 1.2px;}
@media only screen and (min-width: 320px) {
	.desc-text{
		font-size: 1.2em;
		letter-spacing: 0.5px;
	}
	#modal-container{width:80% !important;}
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
		font-size: 1.1em;
	}
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url {
		bottom: 60%;
		left: 29%;
	}
	#basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url {
	   right: 30%;
	}
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right {
		bottom: 3%;
		width: 82%;
		padding: 0px 25px;
		right: 0%;
	}
}
@media only screen and (min-width: 375px) {
	.desc-text{
		font-size: 1.5em;
	}
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
		font-size: 1.3em;
	}
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url{ 
		bottom: 60%;
	}
	#basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url {
	   right: 32%;
	}
}
@media screen and (min-width:475px){
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
		font-size: 1.5em;
	}
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right {
		bottom: 5%;
		width: 88%;
	}
}
@media only screen and (min-width: 568px) {
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
		font-size: 1.7em;
		padding-top: 2.5%;
	}
	.desc-text{
		font-size: 1.8em;
	}
	#basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url {
	   right: 30%;
	}
}
@media screen and (min-width:641px){
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url {
		font-size: 2em;
	}
}
@media only screen and (min-width: 768px) {
	.desc-text{
		font-size: 2em;
	}
	#basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url {
	   right: 31%;
	}
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right {
		width: 92%;
	}
}
@media screen and (min-width:968px){
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url {
		padding-top: 3%;
	}
}
@media only screen and (max-width: 1023px) {
#container{padding-top: 6%;}
#basic-modal-content .bumper-logo{top: -5%; }
#basic-modal-content .bumper-content .bumper-content-left{width:100%;float:left}
#basic-modal-content .bumper-content .bumper-content-right{width:100%;float:right}
#basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{ bottom: 12%;}
#basic-modal-content .bumper-content .bumper-content-left .button-content-left{bottom: 54%; left: 10%; width: 82%;}

}
@media only screen and (min-width: 1024px) {
#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url {
    bottom: 22%;
    left: 15%;
}
#modal-container{width:70% !important;padding-top: 6.5%;}
#basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url {
    bottom: 22%;
    right: 15%;
}
#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url {
    font-size: 1.1em;
    width: 20%;
    height: 10%;
    padding-top: 1.5%;
}
.desc-text {
    font-size: 1.4em;
}
#basic-modal-content .bumper-content .bumper-content-right .button-content-right {
    width: 45%;
}
}
@media screen and (min-width:1280px){
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url {
		font-size: 1.4em;
		padding-top: 1.3%;
	}
	.desc-text {
		font-size: 1.8em;
	}
}
@media screen and (min-width:1366px){
	.desc-text {
		font-size: 1.9em;
	}
}
@media screen and (min-width:1440px){
	.desc-text {
		font-size: 2em;
	}
}
@media screen and (min-width:1600px){
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url {
		font-size: 1.8em;
		padding-top: 1.3%;
	}
	.desc-text {
		font-size: 2.2em;
	}
}
@media screen and (min-width:1920px){
	.desc-text {
		font-size: 2.3em;
	}
}
@media screen and (min-width:1298px){
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right {
		/*bottom: 10%;*/
	}
}