*{
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}
body{
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	min-height: 100vh;
	background: #00beac;
    background: #78241F;
    /*ipad*/
    margin-top: -95px;
}
.container{
	height: 595px;/*v2*/
	width: 595px;/*v2*/
    height: 665px;/*v3*/
    width: 665px;/*v3*/
	background: #78241F;
    background-color: #78241F;
	position: relative;
	border-radius: 50%;
	overflow: hidden;
	box-shadow: 0 0 10px gray;
	transition: 3500ms all;

    /*margin-bottom: 200px; IPAD */
}


.container div{
	height: 50%;
	width: 340px;
    width: 255px;/*v2*/
    width: 285px;/*v3*/
	clip-path: polygon(100% 0,50% 100%, 0 0);
    -webkit-clip-path: polygon(100% 0,50% 100%, 0 0);
	transform: translateX(-50%);
    overflow: hidden;
	transform-origin: bottom;
	position: absolute;
	left: 21%;
    left: 170px;/*v2*/
    left: 190px;/*v3*/
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-family: monospace;
	font-weight: 1000;
	color:#008276;
	writing-mode: vertical-rl;

    /*ipad*/
    top: 0%;

}

.container div img.premio{
    width: 100px;/*v2*/
    width: 80%;/*v3*/
    margin-top: -90px;
}

.container .premio-1,
.container .one{
	background: #A12F2F;
	left: 50%;
}
.container .premio-2,
.container .two{
	background: #F2F2E9;
	transform: rotate(45deg);
}
.container .premio-3,
.container .three{
	background: #A12F2F;
	transform: rotate(90deg);
}
.container .premio-4,
.container .four{
	background: #F2F2E9;
	transform: rotate(135deg);
}
.container .premio-5,
.container .five{
	background: #A12F2F;
	transform: rotate(180deg);
}
.container .premio-6,
.container .six{
	background: #F2F2E9;
	transform: rotate(225deg);
}
.container .premio-7,
.container .seven{
	background: #A12F2F;
	transform: rotate(270deg);
}
.container .premio-8,
.container .eight{
	background: #F2F2E9;
	transform: rotate(315deg);
}



.mid{
    height: 175px;/*v2*/
    width: 175px;/*v2*/
	height: 195px;/*v3*/
	width: 195px;/*v3*/
	border-radius: 50%;
	position: absolute;
    margin-bottom: 200px;
	background: #78241F;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mid img.logotipo
{
    width: 100px;/*v2*/
    width: 100%;/*v3*/
}


#spin, #spin2{
	height: 90px;
	width: 260px;
	background: #A12F2F;
	position: absolute;
	margin-top: 600px; /*v2*/
    margin-top: 750px; /*v3*/
	font-size: 30px;
	color: #F2F2E9;
	font-weight: 1000;
	letter-spacing: 4px;
	border: 1px solid #F2F2E9;
	cursor: pointer;
	box-shadow: 0 5px 10px gray;
	transition: 0.2s all;

    /*ipad*/
    margin-top: 58%;
}
#spin:hover{
	box-shadow: none;
}


.stoper{
	height: 70px;
	width: 60px;
	background: #ffffff;
	position: absolute;
	clip-path: polygon(100% 0,50% 100%, 0 0);
    -webkit-clip-path: polygon(100% 0,50% 100%, 0 0);
	margin-top: -800px;/*v2*/
    margin-top: -870px;/*v3*/
    /*ipad*/
    margin-top: -43%;
    height: 60px;
}

#close-estadisticas {
    font-size: 1.5rem;
    float: right;
    font-weight: 800;
    text-transform: capitalize;
    background-color: black;
    color: white;
    border-radius: 50%;
    padding: 6px 18px;
    margin-right: -30px;
}
