/*Font*/

@font-face {
  font-family: 'Diamante';
  src: url('../fonts/btb/2F3574_0_0.eot');
  src: url('../fonts/btb/2F3574_0_0.eot?#iefix') format('embedded-opentype'),
       url('../fonts/btb/2F3574_0_0.woff2') format('woff2'),
       url('../fonts/btb/2F3574_0_0.woff') format('woff'),
       url('../fonts/btb/2F3574_0_0.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Gotham';
  src: url('gothamultra-webfont.eot');
  src: url('../fonts/btb/gothamultra-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/btb/gothamultra-webfont.woff2') format('woff2'),
       url('../fonts/btb/gothamultra-webfont.woff') format('woff'),
       url('../fonts/btb/gothamultra-webfont.ttf') format('truetype'),
       url('../fonts/btb/gothamultra-webfont.svg#gotham_ultraregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
#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:100%;float:left;position:relative;}
#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: -5%;
	transform: translateX(-50%);
	z-index:99;
	width:35%;
	}

#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;
}
@media only screen and (min-width: 320px) {
	.desc-text{
		font-size: 1.45em;
		letter-spacing: 0.5px;
		font-family: 'Diamante',sans-serif; 
		color: #fff; 
		text-align: center; 		
		text-transform:uppercase;
		line-height: 18px;
		margin: 0;
	}
	#modal-container{width:80% !important;}
	#basic-modal-content .bumper-content .bumper-content-left .button-content-left{
		position: absolute; 
		bottom: 10%;
		left: 0%;
		width: 100%;
	}
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
		font-size: 1em;
		text-align: center;
		width: 150px;
		padding-top: 1.5%;
		font-family: 'Gotham',sans-serif;
		background: url("../img/for-kids-button.jpg") no-repeat 0px 0px;
		background-size: 100%;
		color: #fff;
		text-decoration: none;
		position: absolute;
		text-transform: uppercase;
		bottom: 20%;
		margin: 0 auto;
		left: 0;
		right: 0;
		height:30px;
	}	
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right {
		bottom: 5%;
		width: 90%;
		padding: 0;
		right: 0%;
		left: 0;
		text-align: center;
		margin: 0 auto;
		position:absolute;
	}
	#basic-modal-content .bumper-content .bumper-content-right{
		width:100%;
		float:right;
		position:relative;
	}
	.hide{
		display:none;
	}
	.bumper-position{
		display:block;
		width:100%;
	}
	.rollgate-container #basic-modal-content .bumper-logo img {    
		max-width: 100%;
	}
}	

@media screen and (min-width:475px){
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right {
		bottom: 8%;
		width: 70%;
	}
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
		bottom:21%;
		padding-top:1%;
	}
}
@media only screen and (min-width: 568px) {	
	.desc-text{
		font-size: 1.75em;
		line-height:24px;
	}
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
		bottom:22%;
	}
			
}
@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: 1.5em;
		width:220px;
		bottom:24%;
		height:33px;
		padding-top:1.25%;
	}
	.desc-text{
		font-size: 2em;
		line-height:30px;
	}
}
@media only screen and (min-width: 768px) {
		
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right {
		width: 65%;
	}
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
		width:250px;
		height:40px;
		padding-top:0.7%;
		bottom:24%;
	}
}
@media only screen and (min-width: 1024px) {
	#basic-modal-content .bumper-content .bumper-content-right,#basic-modal-content .bumper-content .bumper-content-left {
		width: 49.5%;
	}		
	#modal-container{width:70% !important;padding-top: 6.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;				
		padding-top: 2%;
		bottom: 21.5%;
		height:34px;
		width:220px;
	}
	.desc-text {
		font-size: 1.4em;
	}
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right {
		width: 80%;
		bottom:4%;
	}
	#basic-modal-content .bumper-logo{
		width:18%;
		top:-9%;
	}
	
}
@media screen and (min-width:1280px){	
	.desc-text {
		font-size: 1.8em;
	}
	#basic-modal-content .bumper-content .bumper-content-left .tnf-kids-url, #basic-modal-content .bumper-content .bumper-content-right .tnf-parents-url{
		padding-top:1.5%;
	}
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right{
		bottom:5%;
	}
}
@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.5em;
		padding-top: 1%;
		width:250px;
		bottom:24%;
	}
	.desc-text {
		font-size: 2.2em;
		line-height: 34px;
	}	
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right{
		bottom:7%;
	}
}
@media screen and (min-width:1920px){
	.desc-text {
		font-size: 2.3em;
	}
	#basic-modal-content .bumper-content .bumper-content-right .button-content-right {
		width: 70%;
	}
}
