@media only screen and (max-width: 768px) {
    video::-webkit-media-controls {
		display:none !important;
	}
	*::-webkit-media-controls-start-playback-button {
	  display: none!important;
	  -webkit-appearance: none;
	}

	#wrapper{
	    min-height: 560px;
	}

	#flechaMasContenido{
	    display: none;
	}

	#close .btnText {
	    font-size: 16px;
	    margin-top: -4px;
	}

	.mobileGradient{
	    display: block;
	    position: absolute;
	    width: 100%;
	    left: 0;
	    height: 100px;
	    z-index: 1;
	    opacity: 0;
	    pointer-events: none;
	    background: rgba(0,0,0,1);
		background: -moz-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,1)), color-stop(75%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0)));
		background: -webkit-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0) 100%);
		background: -o-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0) 100%);
		background: -ms-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0) 100%);
		background: linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
	}

	.mgTop{
		top: 0;
	}
	.mgBottom{
		bottom: 0;
		transform: rotate(180deg);
	}

	#btMenu {
	    right: 15px;
	    top: 20px;
	    position: absolute;
	}

	.noMobile{
		display: none !important;
	}

    #logoPavofrio{
	    width: 130px;
	    top: -55px;
	    left: -20px;
    	/*display: none;*/
    }
    #shadow{
    	display: none;
    }
    #logoFantasmas {
	    /*transform: scale(0.75);*/
	    margin-top: -20px;
	}

	#video1, #video3, #videoContainer1, #videoContainer3{
		top: 35px;
	}
	#video2{
		display: none;
	}
	.videoContainer{
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
	}

	/*menu*/
	#menu{

	}
	#menuContainer {
	    width: 100%;
	    height: 100%;
	    display: table;
	}
	.centerMenu{
		display: table-cell;
		vertical-align: middle;
	}
	.number{
		font-size: 14px;
    	color: #ffbe84;
	}

	.menuItem{
		width: 100%;
	    height: 17%;
	    border-left: none;
	    border-bottom: solid thin #271711;
	    padding-bottom: 10px;
	}
	.texto {
	    font-size: 24px;
	    margin-top: 10px;
	}
	.footer {
	    bottom: -30px;
	    width: 100%;
	    left: 0;
	    margin: 0;
	}
	.txtFooter {
	    font-size: 10px;
	}



	.tHome{
	    font-size: 18px;
	    line-height: 20px;
	    bottom: inherit;
	    top: 160px;
	    width: 70%;
	    margin-left: 15%;
	}
	#replay{
		margin: 0px 0 0 -130px;
	    bottom: 75px !important;
	    top: inherit;
	    width: 260px;
	}
	#juega{
	    margin: 0px 0 0 -130px;
	    bottom: 170px !important;
	    top: inherit;
	    width: 260px;
	}
	#replay .arrow, #juega .arrow{
		/*display: none;*/
		/*top: 14px;*/
	}
	#replay .btnText{
		text-align: center;
	    font-size: 24px;
	}#juega .btnText{
		/*text-align: left;*/
		font-size: 24px;
	}

	.btnDetail{
		margin-top: 2px;
	}

	#juega .btnDetail, #replay .btnDetail{
		margin-top: 3px;
	}

	#tirada{
		height: 100%;
		overflow: hidden;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;

		-webkit-overflow-scrolling: touch;
	}
	.arrowsFakes{
		display: none;
	}
	.arrowsFakesL {
	    left: 90px;
	    transform: rotate(180deg);
	}.arrowsFakesR{
	    right: 90px;
	}

	/*Cards container*/
	#cardsContainer{
	    position: absolute;
	    width: 100%;
	    max-width: 100%;
	    height: 100%;
	    left: 0;
	    top: 0;
	    margin: 0;
	    display: none;
	    transform: scale(1.25);
	}
	#openClose {
	    display: block;
	    position: absolute;
	    left: 50%;
	    top: 50%;
	    width: 30px;
	    height: 30px;
	    z-index: 1;
	    display: none;
	    transition: none;
	        /*box-shadow: 0px 0px 5px rgba(0,0,0,0.5);*/
	}
	#openClose .svgLine{
	    stroke: #fff;
	    stroke-width: 2px;
	    transform-origin: center;
	    transform: rotate(45deg);
	    margin: 7px 0 0 8px;

/*	    -webkit-filter: drop-shadow(0px 0px 3px #ff1100);
	    filter: drop-shadow(0px 0px 3px #ff1100);*/
	}
	.circle{
		border: solid 2px #fff;
	}
	#descubrelo{
		position: absolute;
        font-family: BrandonGrotesque;
        color: #fff6eb;
        right: 40px;
        bottom: 0;
        /*opacity: 0;*/
	}

	.gradient{
		position: absolute;
		width: 30px;
		height: 30px;
		opacity: 0.5;
		background: rgba(0,0,0,0.65);
		background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 61%, rgba(0,0,0,0) 100%);
		background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(0,0,0,0.65)), color-stop(61%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0)));
		background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 61%, rgba(0,0,0,0) 100%);
		background: -o-radial-gradient(center, ellipse cover, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 61%, rgba(0,0,0,0) 100%);
		background: -ms-radial-gradient(center, ellipse cover, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 61%, rgba(0,0,0,0) 100%);
		background: radial-gradient(ellipse at center, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 61%, rgba(0,0,0,0) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=1 );
	}

	.card{
	    width: 251px;
	    height: 409px;
	    position: absolute;
	    left: 1000px;
	    transform-style: preserve-3d;
	    cursor: pointer;
	    top: 50%;
	    margin-top: -165px;
	}
	.card_mask .back{
		transform: rotateY(0deg);
	}

	.infoFinish{
		display: none;
	}

	.cardSmall{
		width: 120px;
    	height: 200px;
	}
	.cardSmall .card_mask{
		width: 120px;
    	height: 197px;
	}

	#textoTirada{
	    font-size: 16px;
	    bottom: inherit;
	    top: 220px;
	    margin: 0 auto;
	    line-height: 18px;
	    width: 60%;
	    position: relative;
	    left: 0;
	}

	#elige{
		font-family: 'DomaineDispNar-BoldItalic';
	    color: #ffbe84;
	    width: 100%;
	    text-align: center;
	    font-size: 18px;
	    display: none;
	    position: relative;
	    margin: 250px 0;
	}

	#cardSelectedTirada{
		display: none; 
	    width: 100%;
	    height: 100%;
	    background: rgba(0,0,0,0.8);
	    position: absolute;
	    left: 0;
	    top: 0;
	    margin: 0;

	    overflow: auto;
	}
	#cardSelectedTirada .infoCard {
	    width: 100%;
	    position: relative;
	    height: 100%;
	}
	#cardSelectedTirada .titular{
		text-align: center;
		/*font-size: 28px;*/
    	padding: 0 20px;
	}
	#cardSelectedTirada .bodyCopy{
	    text-align: center;
	    padding: 10px 130px;
	    font-size: 16px;
	    line-height: 18px;
	}

	#cardSelectedTirada .info {
	    display: table-cell;
	    vertical-align: middle;
	}

	.vertical {
	    position: absolute;
	    margin: 0 -58px;
	    width: 116px;
	    top: initial;
	    bottom: 30px;
	    left: 50%;
	}

	#continuar {
	    margin: 20px auto;
	    left: 0;
	    top: 0;
	    position: relative;
	    right: 0;
	    width: 135px;
	    bottom: 0;
	}

	#txtReset, #reset{
		display: none;
	}

	.allGButton{
		display: none !important;
	}

	#txtAllGhost{
		visibility: hidden;
		opacity: 0;
	}

	.ghostContainer{
		position: absolute;
	    width: 100%;
	    max-width: 100%;
	    height: 100%;
	    left: 0;
	    top: 0;
	    margin: 0;
	    /*display: none;*/
	    transform: scale(1.25);
	}

	.ghostCard {
	    width: 251px;
	    height: 409px;
	    position: absolute;
	    overflow: hidden;
	    border-radius: 20px;
	    left: 2000px;
	    cursor: pointer;
	    top: 50%;
	    margin-top: -165px;
	}

	#cardSelectedFinish {
	    height: auto;
	    margin: -250px 0 0 0;
	    left: 0;
	    top: 0;
	    width: 100%;
	    position: relative;
	}

	#cardSelectedFinish .infoCard {
	    width: 100%;
	    left: 0;
	}

	#fraseResultado {
	    left: 50%;
	    top: 15px;
	    font-size: 14px;
	    width: 175px;
	    line-height: 16px;
	    right: 20px;
	    margin-left: -25px;
	}

	#result {
	    width: 78px;
	    height: 78px;
	    position: absolute;
	    margin: 0 -125px;
	    left: 50%;
	    top: 0px;
	}

	.resultText {
	    max-width: 70%;
	    margin-left: 15%;
	    float: none;
	    margin-top: 110px;
	}

	.infoCard .lineV {
	    margin: 30px auto;
	    position: relative;
	    width: 60%;
	    left: 0;
	    top: 0;
	    border-bottom: dashed #723b41 1px;
	    border-left: none;
	    height: 2px;
	}

	#claim{
		position: relative;
		right: 0;
		bottom: inherit;
		width: 100%;
	}
	#claim img {
	    width: 70%;
	}

	.compartir{
	    position: absolute;
	    width: 370px;
	    bottom: inherit;
	    margin-bottom: 50px;
	    left: 50%;
	    margin-left: -185px;
	}
	.horizontal{
		width: 116px;
		margin-left: 30px;
	}

	#resetFinish{
		position: relative;
		bottom: inherit;
		right: inherit;
		margin: 30px auto 20px;
		}#resetFinish img{
			/*display: none;*/
		}#resetFinish .btnText{
			/*font-family: 'DomaineDispNar-BoldItalic';
			color: #ffbe84;*/
		}



	#closeCard{
		display: none;
	}

	#consejo {
	    margin: 20px auto 20px;
	    width: 210px;
	}

	#middleLayer{
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.8);
		display: table;
		position: absolute;
		z-index: 1;
		text-align: center;
		visibility: hidden;
		opacity: 0;
	}

	#middleLayer p{
		display: table-cell;
		vertical-align: middle;
		padding: 0 115px;

		font-family: 'BrandonText';
		text-align: center;

	    font-size: 18px;
	    line-height: 20px;
	    color: #fff6eb;
	}

	#middleLayer img{
		width: 40px;
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -20px;
		margin-top: 100px;
	}	




	.bodyCopy, .resultText .bodyCopy{
		font-size: 16px;
		line-height: 18px;
	}


}





/**********************************/
/**********************************/
/**********************************/
/**********************************/
/**********************************/
/**********************************/

			/*MOBILE*/

/**********************************/
/**********************************/
/**********************************/
/**********************************/
/**********************************/
/**********************************/



@media only screen and (max-width: 414px) {

	video::-webkit-media-controls {
		display:none !important;
	}
	*::-webkit-media-controls-start-playback-button {
	  display: none!important;
	  -webkit-appearance: none;
	}

	#wrapper{
	    min-height: 560px;
	}

	#flechaMasContenido{
	    display: block;
	}

	#close .btnText {
	    font-size: 16px;
	    margin-top: -4px;
	}

	.mobileGradient{
	    display: block;
	    position: absolute;
	    width: 100%;
	    left: 0;
	    height: 100px;
	    z-index: 1;
	    opacity: 0;
	    pointer-events: none;
	    background: rgba(0,0,0,1);
		background: -moz-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,1)), color-stop(75%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0)));
		background: -webkit-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0) 100%);
		background: -o-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0) 100%);
		background: -ms-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0) 100%);
		background: linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
	}

	.mgTop{
		top: 0;
	}
	.mgBottom{
		bottom: 0;
		transform: rotate(180deg);
	}

	#btMenu {
	    right: 15px;
	    top: 20px;
	    position: absolute;
	}

	.noMobile{
		display: none !important;
	}

    #logoPavofrio{
    	width: 120px;
	    top: -50px;
	    left: -20px;
    	/*display: none;*/
    }
    #shadow{
    	display: none;
    }
    #logoFantasmas {
	    transform: scale(0.55);
	    margin-top: -40px;
	}

	#video1, #video3, #videoContainer1, #videoContainer3{
		top: 35px;
	}
	#video2{
		display: none;
	}
	.videoContainer{
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
	}

	/*menu*/
	#menu{

	}
	#menuContainer {
	    width: 100%;
	    height: 100%;
	    display: table;
	}
	.centerMenu{
		display: table-cell;
		vertical-align: middle;
	}
	.number{
		font-size: 12px;
    	color: #ffbe84;
	}

	.menuItem{
		width: 100%;
	    height: 14%;
	    border-left: none;
	    border-bottom: solid thin #271711;
	    padding-bottom: 10px;
	}
	.texto {
	    font-size: 22px;
	    margin-top: 10px;
	}
	.footer {
	    bottom: -30px;
	    width: 100%;
	    left: 0;
	    margin: 0;
	}
	.txtFooter {
	    font-size: 10px;
	}



	.tHome{
	    font-size: 16px;
	    line-height: 18px;
	    bottom: inherit;
	    top: 110px;
	    width: 90%;
	    margin-left: 5%;
	}
	#replay{
		margin: 0px 0 0 -108px;
		bottom: 45px !important;
		top: inherit;
		width: 210px;
	}
	#juega{
	    margin: 0px 0 0 -108px;
	    bottom: 120px !important;
	    top: inherit;
	    width: 215px;
	}
	#replay .arrow, #juega .arrow{
		/*display: none;*/
		/*top: 14px;*/
	}
	#replay .btnText{
		text-align: center;
	    font-size: 20px;
	}#juega .btnText{
		/*text-align: left;*/
		font-size: 20px;
	}
	.btnDetail{
		margin-top: 2px;
	}

	#juega .btnDetail, #replay .btnDetail{
		margin-top: 8px;
	}

	#tirada{
		height: 100%;
		overflow: hidden;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;

		-webkit-overflow-scrolling: touch;
	}
	.arrowsFakes{
		display: none;
	}
	.arrowsFakesL {
	    left: 20px;
	    transform: rotate(180deg);
	}.arrowsFakesR{
	    right: 20px;
	}
	/*Cards container*/
	#cardsContainer{
	    position: absolute;
	    width: 100%;
	    max-width: 100%;
	    height: 100%;
	    left: 0;
	    top: 0;
	    margin: 0;
	    display: none;
	    transform: scale(1);
	}
	#openClose {
	    display: block;
	    position: absolute;
	    left: 50%;
	    top: 50%;
	    width: 30px;
	    height: 30px;
	    z-index: 1;
	    display: none;
	    transition: none;
	        /*box-shadow: 0px 0px 5px rgba(0,0,0,0.5);*/
	}
	#openClose .svgLine{
	    stroke: #fff;
	    stroke-width: 2px;
	    transform-origin: center;
	    transform: rotate(45deg);
	    margin: 7px 0 0 8px;

/*	    -webkit-filter: drop-shadow(0px 0px 3px #ff1100);
	    filter: drop-shadow(0px 0px 3px #ff1100);*/
	}
	.circle{
		border: solid 2px #fff;
	}

	#descubrelo{
		position: absolute;
        font-family: BrandonGrotesque;
        color: #fff6eb;
        right: 40px;
        bottom: 0;
        /*opacity: 0;*/
	}


	.gradient{
		position: absolute;
		width: 30px;
		height: 30px;
		opacity: 0.5;
		background: rgba(0,0,0,0.65);
		background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 61%, rgba(0,0,0,0) 100%);
		background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(0,0,0,0.65)), color-stop(61%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0)));
		background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 61%, rgba(0,0,0,0) 100%);
		background: -o-radial-gradient(center, ellipse cover, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 61%, rgba(0,0,0,0) 100%);
		background: -ms-radial-gradient(center, ellipse cover, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 61%, rgba(0,0,0,0) 100%);
		background: radial-gradient(ellipse at center, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 61%, rgba(0,0,0,0) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=1 );
	}

	.card{
	    width: 251px;
	    height: 409px;
	    position: absolute;
	    left: 1000px;
	    transform-style: preserve-3d;
	    cursor: pointer;
	    top: 50%;
	    margin-top: -165px;
	}
	.card_mask .back{
		transform: rotateY(0deg);
	}

	.infoFinish{
		display: none;
	}

	.cardSmall{
		width: 120px;
    	height: 200px;
	}
	.cardSmall .card_mask{
		width: 120px;
    	height: 197px;
	}

	#textoTirada{
	    font-size: 16px;
	    bottom: inherit;
	    top: 110px;
	    margin: 0 auto;
	    line-height: 18px;
	    width: 90%;
	    position: relative;
	    left: 0;
	}

	#elige{
		font-family: 'DomaineDispNar-BoldItalic';
	    color: #ffbe84;
	    width: 100%;
	    text-align: center;
	    font-size: 18px;
	    display: none;
	    position: relative;
	    margin: 130px 0;
	}

	#cardSelectedTirada{
		display: none; 
	    width: 100%;
	    height: 100%;
	    background: rgba(0,0,0,0.8);
	    position: absolute;
	    left: 0;
	    top: 0;
	    margin: 0;

	    overflow: auto;
	}
	#cardSelectedTirada .infoCard {
	    width: 100%;
	    position: relative;
	    height: auto;
	}
	#cardSelectedTirada .titular{
		text-align: center;
		font-size: 28px;
    	padding: 0 20px;
	}
	#cardSelectedTirada .bodyCopy{
	    text-align: center;
	    padding: 10px 20px;
	    font-size: 16px;
	}
	.vertical {
	    position: relative;
	    margin: 0 auto;
	    width: 116px;
	    top: 0;
	    bottom: inherit;
	    left: 0;
	}

	#continuar {
	    margin: 20px auto 30px;
	    left: 0;
	    top: 0;
	    position: relative;
	    right: 0;
	    width: 135px;
	    bottom: 0;
	}

	#txtReset, #reset{
		display: none;
	}

	.allGButton{
		display: none !important;
	}

	#txtAllGhost{
		visibility: hidden;
		opacity: 0;
	}

	.ghostContainer{
		position: absolute;
	    width: 100%;
	    max-width: 100%;
	    height: 100%;
	    left: 0;
	    top: 0;
	    margin: 0;
	    /*display: none;*/
	    transform: scale(1);
	}

	.ghostCard {
	    width: 251px;
	    height: 409px;
	    position: absolute;
	    overflow: hidden;
	    border-radius: 20px;
	    left: 2000px;
	    cursor: pointer;
	    top: 50%;
	    margin-top: -165px;
	}


	#cardSelectedFinish {
		height: auto;
	    margin: 30px 0 0 0;
	    left: 0;
	    top: 0;
	    width: 100%;
	    position: relative;
	}

	#cardSelectedFinish .infoCard {
	    width: 100%;
	    left: 0;
	}

	#fraseResultado {
	    left: inherit;
	    top: 15px;
	    font-size: 14px;
	    width: 175px;
	    
	    line-height: 16px;
	    right: 20px;
	}

	#result {
	    width: 78px;
	    height: 78px;
	    position: absolute;
	    margin: 0 -125px;
	    left: 50%;
	    top: 0px;
	}

	.resultText {
	    max-width: 90%;
	    margin-left: 5%;
	    float: none;
	    margin-top: 110px;
	}

	.infoCard .lineV {
	    margin: 30px auto;
	    position: relative;
	    width: 90%;
	    left: 0;
	    top: 0;
	    border-bottom: dashed #723b41 1px;
	    border-left: none;
	    height: 2px;
	}

	#claim{
		position: relative;
		right: 0;
		bottom: inherit;
		width: 100%;
	}
	#claim img {
	    width: 70%;
	}

	.compartir{
		position: relative;
		width: 100%;
		bottom: inherit;
		margin-bottom: 50px;
	}
	.horizontal{
		width: 116px;
	}

	#resetFinish{
		position: relative;
		bottom: inherit;
		right: inherit;
		margin: 30px auto 20px;
		}#resetFinish img{
			/*display: none;*/
		}#resetFinish .btnText{
			/*font-family: 'DomaineDispNar-BoldItalic';
			color: #ffbe84;*/
		}



	#closeCard{
		display: none;
	}
	#cardSelectedTirada .info {
	    display: block;
	    vertical-align: middle;
	    margin: 140px auto 0;
	}

	#consejo {
	    margin: 20px auto 40px;
	    width: 210px;
	}

	#middleLayer{
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.8);
		display: table;
		position: absolute;
		z-index: 1;
		text-align: center;
		visibility: hidden;
		opacity: 0;
	}

	#middleLayer p{
		display: table-cell;
		vertical-align: middle;
		padding: 0 25px;

		font-family: 'BrandonText';
		text-align: center;

	    font-size: 16px;
	    line-height: 18px;
	    color: #fff6eb;
	}

	#middleLayer img{
		width: 40px;
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -20px;
		margin-top: 100px;
	}	

	.bodyCopy, .resultText .bodyCopy{
		font-size: 14px;
		line-height: 16px;
	}

}
/*