*
{
	background-color: rgba(0,0,0,0);
	margin-top: 0px;
	margin-bottom: 0px;
	color: rgb(43,43,43);
}

@font-face
{
    font-family: 'Irresponsible Direction';
    src: url('irresponsible_direction-webfont.woff2') format('woff2'), url('fonts/irresponsible_direction-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face
{
    font-family: 'Nexa Rust';
    src: url('nexarustsans-black-webfont.woff2') format('woff2'), url('fonts/nexarustsans-black-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

html, body
{
	background-color: white;
	font-family: 'Open Sans', sans-serif;
}

#encuentra3, #encuentra4
{
	display: none;
}

#path3
{
	display: none;
}

header
{
	background-color: rgba(43,43,43,1);
	height: 80px;
	display: block;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	box-shadow: 0px 0px 5px rgb(0,0,0);
	z-index: 100;
}

#menu
{
	display: block;
	position: absolute;
	margin-top: 25px;
	margin-left: 25px;
	cursor: pointer;
	fill: white;
}

header img
{
	background-color: none;
	height: 60px;
	margin-top: 10px;
	display: block;
	position: absolute;
	margin-left: calc(50% - 65.087px);
	background-color: rgba(0,0,0,0);
}

#shoppingbag
{
	float: right;
	margin-top: 25px;
	margin-right: 25px;
	cursor: pointer;
	fill: white;
}

header svg
{
	transition: all 0.3s ease;
}

#menu:hover, #shoppingbag:hover
{
	fill: #dff411ff;
}

header ul
{
	display: block;
	position: absolute;
	list-style: none;
	padding: 0px;
	margin-top: 28px;
}

header ul li
{
	display: inline-block;
	position: relative;
	margin-top: 0px;
	margin-left: 10px;
	margin-right: 10px;
}

header ul li a
{
	display: block;
	position: relative;
	margin-top: 0px;
	font-size: 18px;
	color: #ffffff;
	text-decoration: none;
	font-family: 'Nexa Rust', sans-serif;
	transition: all 0.3s ease;
}

header ul li a:hover
{
	color: #dff411ff;
}

#ul1
{
	margin-left: 80px;
	right: 0px;
	margin-right: calc(50% + 65.087px + 65px);
}

#ul2
{
	margin-right: 80px;
	left: 0px;
	margin-left: calc(50% + 65.087px + 65px);
}

#slidemenu
{
	display: block;
	position: fixed;
	left: 0px;
	top: 80px;
	width: 295px;
	height: calc(100vh - 80px);
	background-color: #2b2b2b;
	z-index: 100;
	margin-left: -400px;
	box-shadow: 0px 6px 5px black;
}

#slidemenu ul
{
	margin-top: 20px;
	padding: 0px;
	list-style: none;
	width: calc(100% - 50px);
	margin-left: 25px;
}

#slidemenu ul li
{
	margin-top: 5px;
	margin-bottom: 5px;
}

#slidemenu ul li a
{
	color: white;
	transition: all 0.3s ease;
	text-decoration: none;
	font-family: 'Nexa Rust', sans-serif;
	font-size: 25px;
}

#slidemenu ul li a:hover
{
	color: #dff411;
}

#redes
{
	display: block;
	position: absolute;
	bottom: 35px;
	width: 105px;
	margin-left: 90px;
}

#fba, #iga
{
	cursor: pointer;
	transition: all 1s ease;
}

#fb, #ig
{
	height: 40px;
	width: 40px;
	transition: all 1s ease;
}

#fb path, #ig path
{
	fill: white;
}

#fba:hover #fb path, #iga:hover #ig path
{
	fill: #dff411;
}

#ig
{
	margin-left: 20px;
}

#banner
{
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	height: 40vw;
	width: 100%;
	margin-top: 80px;
	background-size: 100% auto;
	background-position: center center;
	background: none;
}

#ban1, #ban2, #ban3, #ban4, #ban5
{
	width: 100%;
	position: absolute;
}

#ban2, #ban3, #ban4, #ban5
{
	display: none;
}

#banner2
{
	margin-left: 0px;
	left: 0px;
	top: 0px;
	margin-top: 0px;
	width: 100%;
	height: 100%;
	display: block;
	position: relative;
	background: none;
}

#banner3
{
	display: table-cell;
	position: relative;
	vertical-align: middle;
}

#banner3 h1
{
	width: 90%;
	margin-left: 5%;
	font-size: 30px;
	font-weight: 800;
	/*font-family: 'Nexa Rust', sans-serif;*/
	color: rgb(43,43,43);
}

#banner3 p
{
	width: 90%;
	margin-left: 5%;
	margin-top: 10px;
	color: rgb(43,43,43);
}

#banner3 h2
{
	display: block;
	width: 100%;
	text-align: center;
	margin-top: 30px;
}

#banner h2 a
{
	background: linear-gradient(to right, #2b2b2b 50%, #dff411ff 50%);
	background-size: 200% 100%;
	background-position: bottom right;
	color: rgb(43,43,43);
	font-size: 15px;
	letter-spacing: 2px;
	font-family: 'Nexa Rust', sans-serif;
	padding: 10px 10px 10px 15px;
	transition: all 0.3s ease;
	text-decoration: none;
}

#banner3 h2 a:hover
{
	background-position: bottom left;
	color: #dff411ff;
}

#banner3 h2 a svg
{
	vertical-align: top;
	margin-left: 10px;
	height: 15px;
	margin-top: 3px;
	transition: all 0.3s ease;
}

#banner3 h2 a:hover svg
{
	fill: #dff411ff;
}

#circulos
{
	display: block;
	position: absolute;
	width: 94px;
	bottom: 0px;
	margin-left: calc(50% - 42px);
	margin-bottom: 15px;
	background-color: rgba(0,0,0,0.5);
	height: 19px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 3px;
}

#circulos svg
{
	width: 15px;
	height: 15px;
	cursor: pointer;
	transition: all 0.2s ease;
	fill: rgb(125,125,125);
	margin-top: 0px;
}

.full
{
	transition: all 0.5s ease;
}

#encuentra
{
	display: block;
	position: relative;
	width: 100%;
	margin-top: calc(80px + 40vw + 100px);
	padding-top: 50px;
	padding-bottom: 50px;
}

#encuentra h1
{
	text-align: center;
	font-family: 'Nexa Rust', sans-serif;
	font-size: 25px;
}

#encuentra2
{
	display: table;
	position: relative;
	width: 60%;
	max-width: 650px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
}

.encuentra
{
	display: table-cell;
	width: 23.5%;
}

.encuentra img
{
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	height: 120px;
}

.encuentra h2
{
	text-align: center;
	margin-top: -5px;
}

.encuentra h2 a
{
	color: rgb(43,43,43);
	font-size: 20px;
	text-decoration: none;
	font-weight: 600;
	transition: all 0.3s ease;
}

.encuentra h2 a:hover
{
	border-bottom: 3px solid #dff411ff;
}

#encuentra h3
{
	text-align: center;
	margin-top: 25px;
}

#encuentra h3 a
{
	text-decoration: none;
	font-weight: 500;
	font-size: 25px;
	transition: all 0.4s ease;
	font-family: 'Nexa Rust', sans-serif;
	background: linear-gradient(to bottom, rgba(0,0,0,0) 50%, #dff411ff 50%);
	background-size: 100% 180%;
	background-position: top;
	padding-left: 7px;
	padding-right: 5px;
	font-size: 23px;
	letter-spacing: 1px;
}

#encuentra h3 a:hover
{
	background-position: bottom;
	background-size: 100% 200%;
}

#cursos
{
	display: table;
	position: relative;
	width: 100%;
	height: auto;
	background-color: rgb(43,43,43);
	padding-top: 100px;
	padding-bottom: 100px;
	margin-top: 50px;
}

#cursos1
{
	display: table-cell;
	width: 50%;
	vertical-align: middle;
}

#cursos1 h2
{
	font-weight: 600;
	margin-bottom: 0px;
	font-size: 20px;
	width: 90%;
	margin-left: 5%;
	color: white;
}

#cursos1 h1
{
	font-weight: 800;
	font-size: 30px;
	width: 90%;
	margin-left: 5%;
	color: white;
}

#cursos1 p
{
	width: 90%;
	margin-left: 5%;
	margin-top: 15px;
	color: white;
}

#cursos1 h3
{
	text-align: left;
	margin-top: 35px;
	width: 90%;
	margin-left: 5%;
	color: white;
	transition: all 0.3s ease;
}

#cursos1 h3:hover
{
	transform: translate(5px,0px);
}

#cursos1 h3 a
{
	background: linear-gradient(to right, white 50%, #dff411ff 50%);
	background-size: 200% 100%;
	background-position: bottom right;
	color: rgb(43,43,43);
	font-size: 15px;
	letter-spacing: 2px;
	font-family: 'Nexa Rust', sans-serif;
	padding: 8px 10px 8px 15px;
	transition: all 0.3s ease;
	text-decoration: none;
}

#cursos1 h3 a svg
{
	vertical-align: top;
	margin-left: 10px;
	height: 15px;
	margin-top: 3px;
	transition: all 0.3s ease;
}

#cursos1 h3 a:hover
{
	background-position: bottom left;
}

#cursos2
{
	display: table-cell;
	width: 50%;
}

#cursos21, #cursos22
{
	display: table;
	position: relative;
	width: 100%;
	height: auto;
}

.curso
{
	display: table-cell;
	position: relative;
	width: 50%;
	vertical-align: middle;
}

.curso img
{
	height: 60px;
	display: inline-block;
	vertical-align: middle;
}

.curso h3
{
	display: inline-block;
	vertical-align: middle;
	margin-left: 15px;
	/*color: #dff411;*/
	color: white;
}

.curso p
{
	margin-top: 10px;
	color: white;
}

#cursos22
{
	margin-top: 50px;
}

footer
{
	margin-top: 100px;
	background-color: rgb(30,30,30);
	border-top: 1px solid rgb(150,150,150);
	padding-top: 40px;
	padding-bottom: 15px;
	display: block;
	position: absolute;
	width: 100%;
	left: 0px;
}

.footer
{
	display: table-cell;
	position: relative;
	vertical-align: top;
}

.spacef
{
	display: table-cell;
	position: relative;
}

#footer1
{
	display: table;
	position: relative;
	width: 90%;
	margin-left: 5%;
}

#f1
{
	width: 30%;
}

#sf1
{
	width: 2.5%;
}

#f2
{
	width: 12.5%;
}

#sf2
{
	width: 2.5%;
}

#f3
{
	width: 12.5%;
}

#sf3
{
	width: 2.5%;
}

#f4
{
	width: 27.5%;
}

#f1 svg
{
	fill: rgb(100,100,100);
	height: 15px;
	margin-right: 5px;
	vertical-align: middle;
}

#f1 img
{
	height: 110px;
}

#f1 ul, #f2 ul, #f3 ul
{
	list-style: none;
	padding: 0px;
}

#f1 ul li
{
	margin-top: 5px;
}

#f1 ul li a, #f2 ul li a, #f3 ul li a
{
	text-decoration: none;
	font-weight: 400;
	color: rgb(100,100,100);
	font-size: 15px;
}

#f1 ul li a:hover, #f2 ul li a:hover, #f3 ul li a:hover
{
	text-decoration: underline;
}

#f1 ul li a strong, #f2 ul li a strong, #f3 ul li a strong
{
	color: rgb(200,200,200);
}

#f2 ul li strong
{
	color: rgb(200,200,200)
}

#f4
{
	vertical-align: middle;
}

#f4 h2
{
	text-align: center;
	font-weight: 400;
	font-size: 15px;
	color: rgb(100,100,100);
}

#f4 img
{
	height: 40px;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
}

#holdtheline
{
	width: 90%;
	margin-left: 5%;
	height: 1px;
	background-color: rgb(60,60,60);
	margin-top: 30px;
}

#loveisntalwaysontime
{
	text-align: center;
	font-size: 12px;
	font-weight: 500;
	margin-top: 10px;
	color: rgb(100,100,100);
}

#loveisntalwaysontime a
{
	color: rgb(100,100,100);
}

#f4 h5
{
	font-weight: 600;
	color: rgb(200,200,200);
	font-size: 15px;
}

#f4 p
{
	color: rgb(100,100,100);
	font-size: 12px;
	margin-top: 5px;
}

#f4 form
{
	width: 100%;
	background-color: rgb(80,80,80);
	vertical-align: middle;
	height: 30px;
	margin-top: 10px;
	overflow: visible;
}

#mce-EMAIL
{
	background-color: rgba(0,0,0,0);
	height: 30px;
	margin-top: 0px;
	top: 0px;
	width: calc(100% - 120px);
	padding-left: 5px;
	border: 0px;
	color: white;
}

#mce-EMAIL:focus
{
	outline: none;
}

#mc-embedded-subscribe
{
	border: 0px;
	background-color: #101010;
	color: white;
	width: 100px;
	right: 0px;
	display: block;
	position: relative;
	margin-left: 15px;
	height: 30px;
	cursor: pointer;
	float: right;
	border-radius: 0px !important;
	-webkit-appearance: none;
  	border-radius: 0;
}

#mail::placeholder
{
	color: rgb(150,150,150);
}

#mail
{
	margin-left: 0px;
	border: none;
	height: 100%;
	vertical-align: middle;
	width: calc(100% - 10px - 30px);
	margin-left: 5px;
	color: rgb(150,150,150);
}

#mail:focus
{
	outline: none;
}

#cta
{
	width: 30px;
	height: 30px;
	float: right;
}

#pagos
{
	margin-left: 0px;
	display: block;
	position: absolute;;
	height: 40px;
	margin-left: 5%;
	margin-top: 30px;
	float: left;
}

#redes2
{
	position: relative;
	float: right;
	height: 40px;
	width: 100px;
	top: 30px;
	margin-right: 5%;
}

#redes2 svg
{
	height: 40px;
	fill: rgb(100,100,100);
}

#ig2
{
	margin-left: 15px;
}

#fd
{
	height: 40px;
	margin-top: 30px;
	display: inline-block;
	position: relative;
	float: none;
	margin-left: calc(50% - (356px/2));
	margin-right: auto;
}

#studio1
{
	height: 40px;
	margin-top: 30px;
	display: inline-block;
	position: relative;
	float: none;
	margin-left: 30px;
	margin-right: auto;
	opacity: 0.3;
}

#studio2
{
	height: 40px;
	margin-top: 30px;
	display: inline-block;
	position: relative;
	float: none;
	margin-left: 30px;
	margin-right: auto;
	opacity: 0.3;
}

#cuadros
{
	position: relative;
	display: table;
	width: 95%;
	margin-left: 2.5%;
	margin-top: calc(40vw + 50px + 80px);
}

#cuadro
{
	position: relative;
	display: table-cell;
	width: 23%;
	height: 24.1vw;
	background-color: rgba(0,0,0,0.2);
}

#cuad1
{
	transition: all 0.5s ease;
	width: 100%;
	height: 100%;
}

#cuad1:hover
{
	box-shadow: 0px 0px 15px rgba(0,0,0,0.9);
}













#todo
{
	display: block;
	position: relative;
	text-align: center;
	font-family: 'Nexa Rust', sans-serif;
	margin-top: 120px;
	width: 100vw;
	margin-bottom: 25px;
}

.prods
{
	display: table;
	position: relative;
	width: 90%;
	margin-left: 5%;
	margin-top: 30px;
}

.prod
{
	display: table-cell;
	position: relative;
	width: 30%;
	vertical-align: top;
}

.prod img
{
	height: 500px;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	transition: all 0.2s ease;
}

.prod img:hover
{
	opacity: 0.6;
}

.prod h2
{
	text-align: center;
	margin-top: 0px;
	width: 100%;
}

.prod h2 a
{
	text-decoration: none;
	font-weight: 800;
	transition: all 0.2s ease;
	color: rgb(70,70,70);
}

.prod h2 a:hover
{
	color: black;
}

.prod h3
{
	text-align: center;
	font-weight: 600;
}













#producto
{
	display: table;
	position: relative;
	margin-top: 130px;
}

#prod1, #prod2
{
	display: table-cell;
	vertical-align: middle;
}

#prod1
{
	width: 55%;
}

#prod2
{
	width: 45%;
}

#prodbg
{
	width: 60%;
	margin-left: 20%;
	height: 600px;
	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat;
}

#prod1 h1, #prod1 h2, #prod1 h3, #prod1 p, #prod1 h4
{
	width: 90%;
	margin-left: 5%;
}

#prod1 h1
{
	font-size: 30px;
	font-family: 'Nexa Rust';
}

#prod1 h2
{
	font-size: 20px;
	margin-top: 0px;
}

#prod1 h3
{
	font-size: 20px;
	color: rgb(70,70,70);
	margin-top: 5px;
}

#prod1 p
{
	font-size: 16px;
	line-height: 1.8;
	margin-top: 20px;
}

#prod1 ul
{
	width: 90%;
	margin-left: 5%;
}

#prod1 h4
{
	margin-top: 25px;
}

#prod1 h4 a
{
	background: linear-gradient(to right, #2b2b2b 50%, #dff411 50%);
	background-size: 205% 100%;
	color: #2b2b2b;
	background-position: bottom right;
	text-decoration: none;
	font-family: 'Nexa Rust';
	font-size: 18px;
	padding: 5px 15px 5px 15px;
	border-radius: 3px;
	transition: all 0.5s ease;
}

#prod1 h4 a:hover
{
	background-position: bottom left;
	color: #dff411;
}

.producto
{
    display: table;
    width: 90%;
    padding-top: 20px;
	padding-bottom: 20px;
	margin-top: 100px;
	margin-left: 5%;
}

.producto1
{
    display: table-cell;
    width: 38%;
	vertical-align: middle;
}

.producto2
{
    display: table-cell;
    width: 62%;
    vertical-align: middle;
}

.buttons
{
    width: 100%;
    width: 145px;
	margin-top: 20px;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
}

.buttons svg
{
    display: inline-block;
    cursor: pointer;
    height: 15px;
    width: 20px;
    margin-left: 0px;
    margin-right: 0px;
}

#left, #right
{
    opacity: 0.7;
}

#left:hover, #right:hover
{
    opacity: 1;
}

.full
{
    display: none;
    opacity: 1;
}

#produ1 .full
{
    display: block;
}

.producto2 h1
{
	font-size: 28px;
	font-family: 'Nexa Rust', sans-serif;
	letter-spacing: 0px;
}

.producto2 h2
{
    opacity: 0.8;
	margin-top: 5px;
	font-size: 22px;
}

.producto2 p
{
    margin-top: 20px;
}

.producto2 h3
{
	margin-top: 10px;
	font-size: 27px;
}

.producto2 h3 a
{
    display: inline;
    background: linear-gradient(to right, rgba(0,0,0,0) 50%, red 50%);
    background-size: 200% 100%;
    background-position: bottom right;
    color: white;
    text-decoration: none;
    padding: 5px 10px;
    font-size: 25px;
    border-radius: 3px;
    transition: all 0.5s ease;
    border: 3px solid red;
}

.producto2 h3 a:hover
{
    background-position: bottom left;
    color: red;
}

.producto2 h4
{
	font-size: 20px;
	font-family: 'Nexa Rust', sans-serif;
	margin-top: 10px;
}

.slideshow
{
    width: 90%;
    display: block;
	overflow: hidden;
	margin-left: 5%;
	height: 30.78vw;
}

.pic
{
    position: relative;
    top: 0px;
	display: none;
	width: 100%;
}

#pic1
{
	display: block;
	position: relative;
}

.prodb
{
    border: 0px;
    display: inline-block;
    margin: 0px;
    padding: 0px;
    width: 20px;
    cursor: pointer;
}

.prodb:focus
{
    outline: none;
}

.buy
{
	display: block;
	position: relative;
	margin-left: 0px;
	background: linear-gradient(to right, #2b2b2b 50%, #dff411 50%);
	background-size: 200% 100%;
	background-position: bottom right;
	font-family: 'Nexa Rust';
	width: 140px;
	font-size: 20px;
	border: none;
	cursor: pointer;
	margin-top: 30px;
	padding-top: 5px;
	padding-bottom: 5px;
	transition: all 0.4s ease-in-out;
}

.buy:hover
{
	background-position: bottom left;
	color: #dff411;
}

.ocontainer
{
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100vw;
	height: 100vh;
	z-index: 1000;
}

.opciones
{
	display: table;
	position: fixed;
	background-color: rgb(0,0,0,0.9);
	height: 100vh;
	width: 100vw;
	left: 0px;
	right: 0px;
	margin-top: 0px;
	top: 0px;
}

.opciones2
{
	display: table-cell;
	vertical-align: middle;
}

.opciones2 h1
{
	color: white;
	text-align: center;
	font-weight: 900;
}

.confunda
{
	background: linear-gradient(to right, #2b2b2b 50%, #dff411 50%);
	background-size: 200% 100%;
	background-position: bottom right;
	color: #2b2b2b;
	border: none;
	font-size: 25px;
	letter-spacing: 1.5px;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	font-weight: 900;
	padding-top: 8px;
	padding-bottom: 8px;
	width: 280px;
	margin-top: 20px;
	cursor: pointer;
	transition: all 0.3s ease;
}

.confunda:hover
{
	background-position: bottom left;
	color: #dff411;
}

.sinfunda
{
	background-color: rgb(100,100,100);
	background-size: 200% 100%;
	background-position: bottom right;
	color: white;
	border: none;
	font-size: 25px;
	letter-spacing: 1.5px;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	font-weight: 900;
	padding-top: 8px;
	padding-bottom: 8px;
	margin-top: 20px;
	cursor: pointer;
	transition: all 0.3s ease;
	width: 280px;
}

#icono
{
	height: 25px;
	display: block;
	margin-top: 5px;
}

#icono:hover
{
	opacity: 1;
}

#bannerqs
{
    display: table;
	width: 100%;
	margin-top: 80px;
}

#bannerqs1, #bannerqs2
{
    display: table-cell;
    width: 50%;
}

#bannerqs1
{
    vertical-align: middle;
}

#bannerqs1 h1
{
	text-align: center;
	font-weight: 500;
	font-family: 'Nexa Rust';
	font-size: 30px;
}

#bannerqs1 h1 strong
{
	font-family: 'Nexa Rust', sans-serif;
	background-color: #dff411;
	padding: 5px 10px;
	display: block;
	width: 340px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
}

#bannerqs1 h2
{
    text-align: center;
	margin-top: 15px;
	font-size: 25px;
}

#bannerqs1 h2 a
{
    text-decoration: none;
    display: inline;
    opacity: 0.6;
    border: 1px solid black;
    padding: 5px 10px;
    border-radius: 3px;
	font-weight: 300;
}

#bannerqs1 h2 a:hover
{
    opacity: 1;
}

#bannerqs2
{
    background-image: url('qs.jpg');
    height: 40vw;
    background-size: cover;
    background-position: center center;
}

#qsinfo
{
	margin-top: 50px;
}

#qsinfo p
{
	font-size: 19px;
	line-height: 1.6;
	width: 50%;
	margin-left: 10%;
	margin-top: 30px;
}

.big
{
	font-size: 23px;
}

#last
{
	text-indent: 0px;
}

#qsinfo img
{
	width: 60%;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	max-width: 600px;
}









/* CONTACTO */
.contact
{
    display: table;
	width: 100%;
	height: calc(100vh - 80px);
	margin-top: 80px;
}

.contact1
{
    display: table-cell;
    width: 38%;
    background-image: url('contactbg.png');
    vertical-align: middle;
}

.contact2
{
    display: table-cell;
    width: 62%;
    vertical-align: middle;
}

.contact1 img
{
    width: 70%;
	max-width: 250px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	position: relative;
}

.contact1 h1
{
    text-align: center;
    color: #2b2b2b;
    font-weight: 500;
    font-size: 25px;
	margin-top: 15px;
	font-family: 'Nexa Rust', sans-serif;
}

.contact2 h1
{
    text-align: center;
    font-size: 30px;
}

.contact2 p
{
    text-align: center;
    line-height: 1.6;
	font-size: 18px;
	width: 90%;
	margin-left: 5%;
}

.contactform
{
    width: 90%;
    max-width: 450px;
	margin-top: 25px;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
}

.nombrel
{
    display: inline-block;
    width: 45%;
}

.apellidol
{
    width: 45%;
    float: right;
}

.nombrei
{
    display: inline-block;
    width: 45%;
}

.apellidoi
{
    float: right;
    width: 45%;
}

.nombrel, .apellidol, .telefonol, .maill, .textol
{
    font-size: 16px;
	margin-top: 15px;
	font-weight: 700;
}

.nombrei, .apellidoi, .telefonoi, .maili, .textoi
{
    background-color: rgb(220,220,220);
    border: none;
    font-size: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
	border-radius: 3px;
	margin-bottom: 15px;
}

.nombrei:focus, .apellidoi:focus, .telefonoi:focus, .maili:focus, .textoi:focus
{
    outline: none;
}

.telefonol, .maill, .textol
{
    width: 100%;
}

.telefonoi, .maili, .textoi
{
    width: 100%;
}

.formsubmit
{
    width: 260px;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	border: 0px;
	background-color: #dff411;
	color: #2b2b2b;
	border-radius: 20px;
	font-size: 20px;
	font-weight: 700;
	transition: all 0.3s ease;
	box-shadow: 0px 3px 10px rgba(0,0,0,0.4);
	cursor: pointer;
	margin-top: 30px;
	margin-bottom: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-family: 'Nexa Rust', sans-serif;
}

.formsubmit:hover
{
	transform: translate(0px,3px);
	box-shadow: 0px 0px 8px rgba(0,0,0,0.4);
}

.textoi
{
    max-width: 100%;
    min-width: 100%;
    height: 70px;
    min-height: 50px;
}

.irahome
{
    text-align: center;
}

.irahome a
{
    width: 190px;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	border: 0px;
	background-color: #dff411;
	color: #2b2b2b;
	border-radius: 20px;
	font-size: 20px;
	letter-spacing: 3px;
	font-weight: 700;
	transition: all 0.3s ease;
	box-shadow: 0px 3px 10px rgba(0,0,0,0.4);
	cursor: pointer;
	margin-top: 20px;
	margin-bottom: 0px;
	padding-top: 5px;
    padding-bottom: 5px;
	text-decoration: none;
	font-family: "Nexa Rust", sans-serif;
}

.irahome a:hover
{
	transform: translate(0px,3px);
	box-shadow: 0px 0px 8px rgba(0,0,0,0.4);
}

#topspace
{
	height: 100px;
}

#whats
{
	display: block;
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 1000;
	background-color: #53c85a;
	height: 60px;
	width: 60px;
	border-radius: 1000px;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
}

#whats img
{
	height: 40px;
	top: 10px;
	left: 12px;
	display: block;
	position: relative;
}

.marcban
{
	display: block;
	position: relative;
	margin-top: 80px;
	width: 100%;
	margin-left: 0px;
	margin-right: 0px;
}

#marcban1
{
	display: block;
}

#marcban2
{
	display: none;
}










@media screen
and (min-width: 800px)
and (max-width: 1000px)
{
	#ul1
	{
		margin-right: calc(50% + 65.087px + 25px);
		padding: 0px;
	}

	#ul2
	{
		margin-left: calc(50% + 65.087px + 25px);
		padding: 0px;
	}

	header ul li
	{
		margin-left: 3px;
		margin-right: 3px;
	}

	header ul li a
	{
		font-size: 17px;
	}

	#menu
	{
		margin-left: 15px;
	}

	#shoppingbag
	{
		margin-right: 15px;
	}
}

@media screen
and (max-width: 800px)
{
	#marcban1
	{
		display: none;
	}

	#marcban2
	{
		display: block;
	}

	.marcban
	{
		margin-top: 60px;
	}

	header
	{
		height: 60px;
	}

	#ul1, #ul2
	{
		display: none;
	}

	header img
	{
		margin-left: 20px;
		height: 40px;
		margin-top: 10px;
	}

	header svg
	{
		margin-top: 0px;
		top: 0px;
		height: 25px;
	}

	#shoppingbag
	{
		right: 65px;
		margin-top: 17px;
		margin-right: 0px;
		position: absolute;
	}

	#whats
	{
		display: block;
	}

	#menu
	{
		right: 15px;
		left: auto;
		margin-top: 0px;
		top: 18px;
		margin-right: 0px;
	}

	#slidemenu
	{
		top: 60px;
		width: 100%;
		height: calc(100vh - 60px);
		margin-left: -100%;
	}

	#slidemenu ul
	{
		display: block;
		position: relative;
		margin-left: auto;
		margin-right: auto;
	}

	#slidemenu ul li
	{
		text-align: center;
	}

	#banner
	{
		height: 120vw;
		margin-top: 60px;
	}

	#circulos
	{
		margin-bottom: 5px;
	}

	#encuentra
	{
		margin-top: calc(120vw + 80px + 0px);
	}

	#encuentra h1
	{
		font-size: 5vw;
	}

	.encuentra h2 a
	{
		font-size: 5.5vw;
	}

	#encuentra h3 a
	{
		font-size: 7vw;
	}

	#encuentra2
	{
		display: none;
	}

	#encuentra3, #encuentra4
	{
		display: table;
		position: relative;
		width: 80%;
		margin-left: 10%;
	}

	#encuentra3
	{
		margin-top: 30px;
	}

	#encuentra4
	{
		margin-top: 15px;
	}

	.encuentra
	{
		display: table-cell;
		position: relative;
		width: 50%;
	}

	#cursos
	{
		display: block;
		position: relative;
		padding-top: 50px;
		padding-bottom: 50px;
		margin-top: calc(60px + 120vw + 50px);
	}

	#cursos1, #cursos2
	{
		display: block;
		position: relative;
		width: 100%;
	}

	#cursos2
	{
		margin-top: 60px;
	}

	#cursos21, #cursos22
	{
		display: block;
		position: relative;
	}

	.curso
	{
		display: block;
		position: relative;
		width: 90%;
		margin-left: 5%;
	}

	#footer
	{
		display: block;
		position: relative;
		margin-top: 50px;
	}

	.footer
	{
		display: block;
		position: relative;
	}

	.spacef
	{
		display: none;
	}

	#footer1
	{
		width: 90%;
		margin-left: 5%;
	}

	#f1, #f2, #f3, #f4
	{
		display: block;
		position: relative;
		width: 100%;
		margin-top: 25px;
	}

	#f1
	{
		margin-top: 0px;
	}

	#f4 h2
	{
		text-align: left;
	}

	#f4 img
	{
		margin-left: 0px;
	}

	#loveisntalwaysontime
	{
		font-size: 3vw;
	}

	#redes
	{
		margin-left: calc(50% - 52.5px);
	}

	#cursos22
	{
		margin-top: 0px;
	}

	.curso
	{
		margin-top: 20px;
	}

	#cursos h2
	{
		font-size: 6vw;
	}

	#cursos h1
	{
		font-size: 9vw;
	}

	#cursos p
	{
		font-size: 5vw;
	}

	.curso h3
	{
		font-size: 6vw;
	}

	.curso p
	{
		font-size: 4vw;
	}

	#f1 ul li a, #f2 ul li a, #f3 ul li a
	{
		font-size: 4.5vw;
	}

	#f4 h2
	{
		font-size: 4.5vw;
	}

	#f4 img
	{
		height: 30px;
	}

	#f4 h5
	{
		font-size: 4.5vw;
	}

	#f4 p
	{
		font-size: 3vw;
	}

	#pagos
	{
		display: block;
		position: relative;
		float: none;
		margin-left: auto;
		margin-right: auto;
		left: 0px;
	}

	#fd
	{
		height: 35px;
		margin-left: calc(50% - (310px/2));
	}

	#studio1, #studio2
	{
		margin-left: 20px;
	}

	/*#fd
	{
		display: block;
		position: relative;
		margin-left: auto;
		margin-right: auto;
	}

	#studio1, #studio2
	{
		display: block;
		position: relative;
		margin-left: auto;
		margin-right: auto;
	}*/

	#redes2
	{
		display: block;
		position: relative;
		left: 0px;
		right: auto;
		float: none;
		margin-top: 30px;
		top: 0px;
		bottom: 0px;
		margin-left: auto;
		margin-right: auto;
	}

	.producto
    {
        width: 100%;
        display: block;
    }

    .producto1
    {
        width: 100%;
        display: block;
    }

    .slideshow
    {
        width: 90%;
		height: 90vw;
    }

    .pic
    {
        width: 100%;
        height: 100%;
    }

    .producto2
    {
        margin-top: 50px;
        display: block;
        width: 90%;
        margin-left: 5%;
    }

    .producto2 h3
    {
        text-align: center;
    }

    .producto2 h3 a
    {
        display: block;
        transition: all 0.1s ease;
	}
	
	#cuadros
	{
		display: block;
		width: 90%;
		margin-left: 5%;
		height: auto;
		margin-top: calc(60px + 30px + 120vw);
	}

	#cuadro
	{
		display: block;
		width: 100%;
		margin-bottom: 20px;
		height: 90vw;
	}

	#todo
	{
		width: 90%;
		margin-left: 5%;
		font-size: 8vw;
		margin-top: 110px;
		margin-bottom: 40px;
	}

	.prods
	{
		display: block;
		position: relative;
		width: 90%;
		margin-left: 5%;
		margin-top: 0px;
	}

	.prod
	{
		display: block;
		position: relative;
		width: 100%;
		margin-left: 0px;
		margin-top: 20px;
	}

	.prod img
	{
		height: auto;
		width: 55%;
	}

	.producto
	{
		width: 100%;
		margin-left: 0px;
		margin-top: 70px;
	}

	.producto2
	{
		margin-top: 30px;
	}

	.buy
	{
		width: 100%;
	}

	#icono:hover
	{
		opacity: 1;
	}

	#bannerqs
    {
		margin-top: 60px;
        display: block;
    }

    #bannerqs1, #bannerqs2
    {
        display: block;
        width: 100%;
    }

    #bannerqs1
    {
        padding-top: 20vw;
        padding-bottom: 20vw;
    }

    #bannerqs1 h1
    {
        width: 90%;
        margin-left: 5%;
        font-size: 8vw;
    }

    #bannerqs1 h2 a
    {
        font-size: 6vw;
    }

    #bannerqs2
    {
        height: 120vw;
	}
	
	#qsinfo
	{
		margin-top: 35px;
		width: 100%;
	}

	#qsinfo p
	{
		width: 90%;
		margin-left: 5%;
		font-size: 4.5vw;
	}

	.contact
    {
		display: block;
		margin-top: 60px;
		height: auto;
    }

    .contact1
    {
        display: block;
        width: 100%;
        padding-top: 15vw;
        padding-bottom: 15vw;
    }

    .contact2
    {
        display: block;
        width: 100%;
        padding-top: 15vw;
        padding-bottom: 15vw;
    }

    .contact1 h1
    {
        font-size: 6.5vw;
        width: 90%;
        margin-left: 5%;
    }

    .contact2 h1
    {
        font-size: 8vw;
    }

    .contact2 p
    {
        font-size: 5vw;
    }

    .nombrel, .apellidol, .telefonol, .maill, .textol
    {
        font-size: 4vw;
    }

    .nombrei, .apellidoi, .telefonoi, .maili, .textoi
    {
        font-size: 5.5vw;
    }
    
    .formsubmit
    {
        width: 280px;
	}
}