@charset "utf-8";
/* CSS Document */

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

COLOR PALETTE




[Table of Contents]

1. Fonts
2. Body and some general stuff
3. Header
	3.1 Logo
	3.2 Main Nav
	3.3 Header Side
	3.4 Hamburger
4. Menu
	4.1 Menu Social
	4.2 Menu copyright
5. Home
	5.1 Hero Slider
	5.2 Hero Slider Navigation
6. Hero Boxes
7. Page Section
8. Buttons
9. Popular
10. Register
11. Search
	11.1 Search Form
12. Services
13. Testimonials
14. Events
15. Footer
	15.1 Newsletter
	15.2 Footer Content
	15.3 Footer Copyright


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

/***********
1. Fonts
***********/

@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap');

/*********************************
2. Body and some general stuff
*********************************/

*
{
	margin: 0;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
html {
        scroll-behavior: smooth;
       /*Comenta la línea (o dale el valor 'auto' a scroll behavior )
       para probar la diferencia con y sin scroll suavizado*/
    }
body
{
	font-family: 'Nunito', sans-serif;
	font-size: 14px;
	font-weight: 400;
	background: #FFFFFF;
	color: #a5a5a5;
}
.N2
{
	font-family: 'Nunito', sans-serif;
	font-weight: 200;
}
.N3
{
	font-family: 'Nunito', sans-serif;
	font-weight: 300;
}
.N4
{
	font-family: 'Nunito', sans-serif;
	font-weight: 400;
}
.N5
{
	font-family: 'Nunito', sans-serif;
	font-weight: 500;
}
.N6
{
	font-family: 'Nunito', sans-serif;
	font-weight: 600;
}
.N7
{
	font-family: 'Nunito', sans-serif;
	font-weight: 700;
}
div
{
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
ul
{
	list-style: none;
	margin-bottom: 0px;
}
p
{
	font-family: 'Nunito', sans-serif;
	font-size: 14px;
	line-height: 2.29;
	font-weight: 400;
	color: #a5a5a5;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a
{
	display: inline;
	position: relative;
	color: inherit;
	border-bottom: solid 1px #ffa07f;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
a, a:hover, a:visited, a:active, a:link
{
	text-decoration: none;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a:active
{
	position: relative;
	color: #FF6347;
}
p a:hover
{
	color: #FFFFFF;
	background: #ffa07f;
}
p a:hover::after
{
	opacity: 0.2;
}
::selection
{
	background: #FFD266;
	color: #C88E00;
}
p::selection
{
	background: #FFD266;
	color: #C88E00;
}
h1{font-size: 36px;}
h2{font-size: 22px;}
h3{font-size: 18px;}
h4{font-size: 14px;}
h5{font-size: 11px;}
h1, h2, h3, h4, h5, h6
{
	font-family: 'Nunito', sans-serif;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
h1::selection, 
h2::selection, 
h3::selection, 
h4::selection, 
h5::selection, 
h6::selection
{
	
}
.so{	
	-webkit-text-shadow: #000 5px 2px 4px;
	text-shadow: #000 5px 2px 4px;
}
.t_13 {font-size: 13px;}
.t_14 {font-size: 14px;}
.t_15 {font-size: 15px;}
.t_16 {font-size: 16px;}
.t_17 {font-size: 17px;}
.t_18 {font-size: 18px;}
.t_19 {font-size: 19px;}
.t_20 {font-size: 20px;}
.t_21 {font-size: 21px;}
.t_22 {font-size: 22px;}
.t_23 {font-size: 23px;}
.t_24 {font-size: 24px;}
.t_25 {font-size: 25px;}
.t_26 {font-size: 26px;}
.t_27 {font-size: 27px;}
.t_28 {font-size: 28px;}
.t_29 {font-size: 29px;}
.t_30 {font-size: 30px;}
.t_31 {font-size: 31px;}
.t_32 {font-size: 32px;}
.t_33 {font-size: 33px;}
.t_34 {font-size: 34px;}
.t_35 {font-size: 35px;}
.t_36 {font-size: 36px;}
.t_37 {font-size: 37px;}
.t_38 {font-size: 38px;}
.t_39 {font-size: 39px;}
.t_40 {font-size: 40px;}
.t_41 {font-size: 41px;}
.t_42 {font-size: 42px;}
.t_43 {font-size: 43px;}
.t_44 {font-size: 44px;}
.t_45 {font-size: 45px;}
.t_46 {font-size: 46px;}
.t_47 {font-size: 47px;}
.t_48 {font-size: 48px;}
.t_49 {font-size: 49px;}
.t_50 {font-size: 50px;}
.t_51 {font-size: 51px;}
.t_52 {font-size: 52px;}
.t_53 {font-size: 53px;}
.t_54 {font-size: 54px;}
.t_55 {font-size: 55px;}
.t_56 {font-size: 56px;}
.t_57 {font-size: 57px;}
.t_58 {font-size: 58px;}
.t_59 {font-size: 59px;}
.t_60 {font-size: 60px;}

.verd { color:#E30613; }
.blanco { color:#fff; }
.grisc { color:#ccc; }
.grise { color:#eee; }
.grisd { color:#ddd; }

.topy{
	background: url("../images/bg-llano.png");
	height: 25px;	
	width: 100%;
	margin: auto;
	margin-top:-20px;
}

::-webkit-input-placeholder
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}
:-moz-placeholder /* older Firefox*/
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}
::-moz-placeholder /* Firefox 19+ */ 
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
} 
:-ms-input-placeholder
{ 
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}
::input-placeholder
{
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #a5a5a5 !important;
}
.form-control
{
	color: #db5246;
}
section
{
	display: block;
	position: relative;
	box-sizing: border-box;
}

/* Botón Ir Arriba
		----------------------------------------------- */
		#IrArriba {
		position: fixed;
		bottom: 40px; /* Distancia desde abajo */
		right: 40px; /* Distancia desde la derecha */
		z-index:9999;
		}
		
		#IrArriba span {
		width: 51px; /* Ancho del botón */
		height: 51px; /* Alto del botón */
		display: block;
		background: url(../images/flcha-arriba.png?v=1.01) no-repeat center center;
		z-index:9999;
		}

.efectazo{
	 width:100%; height:100%;
	 background-attachment: fixed;
 	 background-position: center center;
  	 background-size:  100% 100%;
}

.clear
{
	clear: both;
}
.clearfix::before, .clearfix::after
{
	content: "";
	display: table;
}
.clearfix::after
{
	clear: both;
}
.clearfix
{
	zoom: 1;
}
.float_left
{
	float: left;
}
.float_right
{
	float: right;
}
.trans_200
{
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.trans_300
{
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.trans_400
{
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}
.trans_500
{
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}
.fill_height
{
	height: 100%;
}
.super_container
{
	width: 100%;
	overflow: hidden;
}
.prlx_parent
{
	overflow: hidden;
}
.prlx
{
	height: 130% !important;
}
.nopadding
{
	padding: 0px !important;
}

/*********************************
3. Header
*********************************/

.header
{
	position: fixed;
	top: 0px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 100%;
	height: 147px;
	background: url("../images/bgt.png?v=1.01");
	background-repeat: repeat-x;
	background-position: top;
	z-index: 10;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}

.header .main_nav_item a
{
	font-family: "Nunito Sans", sans-serif;
	font-size: 17px;
	text-transform: uppercase;
	font-weight: 400;
	color: #fff;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.header .main_nav_item a:hover
{
	color: #ccc;
}

.header.scrolled .main_nav
{
	margin-top: 30px;
	margin-right: 100px;
}

.header.scrolled .main_nav_item a
{
	font-family: "Nunito Sans", sans-serif;
	font-size: 17px;
	text-transform: uppercase;
	font-weight: 400;
	color: #fff;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.header.scrolled .main_nav_item a:hover
{
	color: #222;
}

.media
{
	position: absolute; top:10px; right:80px
}
.header.scrolled .media
{
	top:10px; 
}
.header.scrolled .menu_social_item a i
{
	color: #fff;
}
.header.scrolled .menu_social_item a i:hover
{
	color: #222;
}


.header.scrolled
{	
	top: 0px;
	background: #222935;
	height:106px;
	opacity: 0.98;
    
    z-index: 99999;
}
.header.scrolled .hamburger_container i
{
	color: #fff;
}
.header.scrolled .header_content::before
{
	
}
.header_content
{
	width:94%;;
	height: 100%;
    margin: auto;
}
.header_content::before
{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: '';
    border: none;
	/* box-shadow: 0px 20px 49px rgba(0,0,0,0.67); */
	z-index: -1;
}

/*********************************
3.1 Logo
*********************************/

.header.scrolled .logo_container
{
	display: inline-block;
	margin-left: 76px;
	width: 140px;
    margin-top: 20px;
}
.header.scrolled .header_content
{
	width:94%;;
	height: 100%;
    margin: auto;
    border:none;
}
.logo_container
{
	display: inline-block;
	margin-left: 50px;
	width: 250px;
    margin-top:50px;
}
.logo span
{
	font-family: 'Open Sans', sans-serif;
	font-size: 20px;
	font-weight: 900;
	color: #3a3a3a;
	vertical-align: middle;
	text-transform: uppercase;
	margin-left: 3px;
}

/*********************************
3.2 Main Nav
*********************************/

.main_nav_container
{
	display: inline-block;
	margin-left: auto;
	
}
.main_nav
{
	margin-top: 80px;
	margin-right: 100px;
}
.main_nav_item
{
	display: inline-block;
	margin-right: 40px;
}
.main_nav_item:last-child
{
	margin-right: 0px;
}
.main_nav_item a
{
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 700;
	color: #3a3a3a;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.main_nav_item a:hover
{
	color: #E30613;
}

/*********************************
3.3 Header Side
*********************************/

.header .header_side
{
	width: 279px;
	height: 100%;
	background: none;
}

.header.scrolled .header_side
{
	width: 279px;
	height: 100%;
	background: #E30613;
}
.header_side img
{
	width: 29px;
	height: 29px;
}
.header_side span
{
	display: block;
	position: relative;
	font-size: 18px;
	font-weight: 500;
	color: #FFFFFF;
	padding-left: 12px;
}

/*********************************
3.4 Hamburger
*********************************/

.hamburger_container
{
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 20px;
	display: none;
	cursor: pointer;
}
.hamburger_container i
{
	font-size: 24px;
	padding: 10px;
	color: #fff;
}
.hamburger_container:hover i
{
	color: #E30613;
}

/*********************************
4. Menu
*********************************/

.menu_container
{
	position: fixed;
	top: 0;
	right: -50vw;
	width: 50vw;
	height: 100vh;
	background:url("../images/bgmenu.jpg?v=1.02");
	z-index: 99999;
	-webkit-transition: all 0.6s ease;
	-moz-transition: all 0.6s ease;
	-ms-transition: all 0.6s ease;
	-o-transition: all 0.6s ease;
	transition: all 0.6s ease;
	visibility: hidden;
	opacity: 0;
}
.menu_container.active
{
	visibility: visible;
	opacity: 1;
	right: 0;
}

.menu_list
{
	-webkit-transform: translateY(3.5rem);
	-moz-transform: translateY(3.5rem);
	-ms-transform: translateY(3.5rem);
	-o-transform: translateY(3.5rem);
	transform: translateY(3.5rem);
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 1000ms 600ms ease;
	opacity: 0;
}
.menu_container.active .menu_list
{
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}
.menu_item
{
	margin-bottom: 9px;
}
.menu_item a
{
	font-family: 'Open Sans', sans-serif;
	font-size: 36px;
	font-weight: 700;
	color: #FFF;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
	padding: 10px 0px;
}
.menu_item a:hover
{
	color: #E30613;
}
.menu_close_container
{
	position: absolute;
	top: 86px;
	right: 79px;
	width: 21px;
	height: 21px;
	cursor: pointer;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}
.menu_close
{
	top: 9px;
	width: 21px;
	height: 3px;
	background: #fff;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.menu_close::after
{
	display: block;
	position: absolute;
	top: -9px;
	left: 9px;
	content: '';
	width: 3px;
	height: 21px;
	background: #fff;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.menu_close_container:hover .menu_close,
.menu_close_container:hover .menu_close::after
{
	background: #E30613;
}

/*********************************
4.1 Menu Social
*********************************/

.menu_social_container
{
	margin-top: 100px;
	-webkit-transform: translateY(3.5rem);
	-moz-transform: translateY(3.5rem);
	-ms-transform: translateY(3.5rem);
	-o-transform: translateY(3.5rem);
	transform: translateY(3.5rem);
	-webkit-transition: all 1000ms 1000ms ease;
	-moz-transition: all 1000ms 1000ms ease;
	-ms-transition: all 1000ms 1000ms ease;
	-o-transition: all 1000ms 1000ms ease;
	transition: all 1000ms 1000ms ease;
	opacity: 0;
	padding-left: 4px;
}
.menu_social_item
{
	display: inline-block;
	margin-right: 20px;
	font-size: 17px;
}
.menu_social_item a i
{
	color: #fff;
}
.menu_social_item a i:hover
{
	color: #E30613;
}
.menu_container.active .menu_social_container
{
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

/*********************************
4.2 Menu copyright
*********************************/

.menu_copyright
{
	margin-top: 60px;
	-webkit-transform: translateY(3.5rem);
	-moz-transform: translateY(3.5rem);
	-ms-transform: translateY(3.5rem);
	-o-transform: translateY(3.5rem);
	transform: translateY(3.5rem);
	-webkit-transition: all 1000ms 1200ms ease;
	-moz-transition: all 1000ms 1200ms ease;
	-ms-transition: all 1000ms 1200ms ease;
	-o-transition: all 1000ms 1200ms ease;
	transition: all 1000ms 1200ms ease;
	opacity: 0;
	padding-left: 3px;
}
.menu_container.active .menu_copyright
{
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	-o-transform: translateY(0px);
	transform: translateY(0px);
	opacity: 1;
}

/*********************************
5. Home
*********************************/

.home
{
	width: 100%;
	height: 100vh;
}

/*********************************
5.1 Hero Slider
*********************************/

.hero_slider_container
{
	width: 100%;
	height: 100%;
}
.hero_slide
{
	width: 100%;
	height: 100%;
}
.hero_slide_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.hero_slide_container
{
	width: 100%;
	height: 100vh;
}
.hero_slide_content
{
	max-width: 80%;
	-webkit-transform: translateY(30px);
	-moz-transform: translateY(30px);
	-ms-transform: translateY(30px);
	-o-transform: translateY(30px);
	transform: translateY(30px);
}
.hero_slide_content h1
{
	font-size: 50px;
	font-weight: 400;
	color: #FFFFFF;
}
.hero_slide_content h1 span
{
	background: #E30613;
	padding-left: 13px;
	padding-right: 13px;
	margin-left: -12px;
	margin-right: -12px;
}
.animated
{
	-webkit-animation-duration : 1s !important;
	animation-duration : 1s !important;
	-webkit-animation-delay : 500ms;
	animation-delay : 500ms;
}
.animate-out
{
	-webkit-animation-delay : 0ms;
	animation-delay : 0ms;
}

/*********************************
5.2 Hero Slider Navigation
*********************************/

.hero_slider_nav
{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(calc(-50% + 30px));
	width: 58px;
	height: 58px;
	background: none;
	z-index: 9;
	cursor: pointer;
}
.hero_slider_nav:hover
{
	background: none;
}
.hero_slider_nav:hover span
{
	color: #FFFFFF;
}
.hero_slider_nav span
{
	display: block;
	text-transform: uppercase;
	font-size: 12px;
	font-weight: 700;
	color: #121212;
	line-height: 1;
}
.hero_slider_left
{
	left: 0%;
}
.hero_slider_right
{
	right: 0%;
}

/*********************************
6. Hero Boxes
*********************************/

.hero_boxes
{
	width: 100%;
	height: 0px;
	z-index: 9;
	padding-top: 0px;
}
.hero_boxes_inner
{
	position: absolute;
	top: -212px;
	left: 0;
	width: 100%;
}
.hero_box
{
	width: 100%;
	height: 161px;
	background: #1a1a1a;
	padding-left: 50px;
	cursor: pointer;
}
.hero_box:hover
{
	background: #E30613;
}
.hero_box img
{
	width: 62px;
	height: auto;
	margin-top: -6px;
}
.svg path
{
	fill: #E30613;
}
.hero_box svg
{
	width: 62px;
	height: auto;
}
.hero_box:hover svg path
{
	fill: #FFFFFF;
}
.hero_box_content
{
	padding-left: 13px;
	padding-top: 11px;
	margin-top: -6px;
}
.hero_box_title
{
	font-size: 24px;
	font-weight: 500;
	color: #FFFFFF;
	margin-bottom: 7px;
}
.hero_box_link
{
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
	color: #FFFFFF;
	padding-left: 3px;
}
.hero_box_link:hover
{
	color: #1a1a1a;
}

/*********************************
7. Page Section
*********************************/

.page_section
{
	padding-top: 117px;
	padding-bottom: 117px;
}
.section_title
{

}
.section_title h1
{
	display: block;
	color: #1a1a1a;
	font-weight: 500;
	padding-top: 24px;
}
.section_title h1::before
{
	display: block;
	position: absolute;
	top: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 120px;
	height: 3px;
	content: '';
	background: #E30613;
}

/*********************************
8. Buttons
*********************************/

.button
{
	cursor: pointer;
}
.button:hover
{
	box-shadow: 0px 10px 20px rgba(0,0,0,0.2);
}
.button a
{
	font-size: 14px;
	line-height: 48px;
	font-weight: 700;
	text-transform: uppercase;
}
.button_1
{
	width: 202px;
	height: 48px;
}

/*********************************
9. Popular
*********************************/

.popular
{

}
.course_boxes
{
	margin-top: 68px;
}
.card
{
	display: block;
	background: #f8f9fb;
	border: none;
}
.card-img-top
{
	border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
.card-body
{
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 15px;
	padding-right: 15px;
}
.card-title
{
	margin-top: 55px;
}
.card-title a
{
	font-size: 22px;
	font-weight: 500;
	color: #1a1a1a;
	line-height: 1.2;
}
.card-title a:hover
{
	color: #a5a5a5;
}
.card-text
{
	font-size: 14px;
	font-weight: 500;
	color: #a5a5a5;
	margin-top: -12px;
}
.price_box
{
	width: 100%;
	height: 67px;
	background: #eaebec;
	margin-top: 41px;
	padding-left: 35px;
}
.course_author_image
{
	width: 46px;
	height: 46px;
	border-radius: 50%;
	overflow: hidden;
}
.course_author_name
{
	font-size: 14px;
	font-weight: 500;
	color: #1a1a1a;
	padding-left: 20px;
	margin-top: 7px;
}
.course_author_name span
{
	color: #a5a5a5;
}
.course_price
{
	width: 67px;
	height: 67px;
	background: #E30613;
	margin-left: auto;
}
.course_price span
{
	color: #FFFFFF;
	font-size: 18px;
	font-weight: 500;
	margin-top: 7px;
}

/*********************************
10. Register
*********************************/

.register
{
	width: 100%;
}
.register_section
{
	width: 100%;
	background: #E30613;
	padding-top: 156px;
	padding-bottom: 161px;
}
.register_content
{
	width: 522px;
}
.register_title
{
	color: #FFFFFF;
	margin-bottom: 16px;
	line-height: 1.63;
}
.register_title:last-child
{
	margin-bottom: 0px;
}
.register_title	span
{
	color: #1a1a1a;
}
.register_text
{
	color: #FFFFFF;
	font-weight: 500;
	margin-top: 32px;
	padding-left: 25px;
	padding-right: 25px;
	margin-bottom: 0px;
}
.register_button
{
	background: #1a1a1a;
	margin-top: 65px;
}
.register_button a
{
	color: #FFFFFF;
}

/*********************************
11. Search
*********************************/

.search_section
{
	width: 100%;
	height: 100%;
	background: #ececec;
}
.search_content
{
	width: 522px;
}
.search_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	opacity: 0.23;
}
.search_title
{
	color: #1a1a1a;
}

/*********************************
11.1 Search Form
*********************************/

.search_form
{
	margin-top: 57px;
}
.input_field
{
	width: 100%;
	height: 42px;
	background: #FFFFFF;
	box-sizing: border-box;
	border: solid 2px #FFFFFF;
	padding-left: 25px;
	margin-bottom: 24px;
}
input:last-of-type
{
	margin-bottom: 0px;
}
.input_field:focus
{
	outline: none !important;
	border: solid 2px #E30613;
}
.search_submit_button
{
	width: 100%;
	height: 48px;
	background: #E30613;
	color: #FFFFFF;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 700;
	margin-top: 28px;
	border: none;
	cursor: pointer;
}
.search_submit_button:hover
{
	box-shadow: 0px 10px 20px rgba(0,0,0,0.2);
}
.search_submit_button:focus
{
	outline: solid 2px #FFFFFF;
}

/*********************************
12. Services
*********************************/

.services
{
	padding-bottom: 76px;
}
.services_row
{
	margin-top: 65px;
}
.service_item
{
	margin-bottom: 41px;
}
.service_item h3
{
	font-family: 'Nunito', sans-serif;
	font-size: 22px;
	font-weight: 500;
	color: #1a1a1a;
	margin-bottom: 13px;
}
.service_item p
{
	font-size: 14px;
	font-weight: 500;
	color: #a5a5a5;
	max-width: 100%;
	margin-bottom: 0px;
}
.icon_container
{
	height: 41px;
	width: auto;
	margin-bottom: 30px;
}
.icon_container img
{
	height: 100%;
}

/*********************************
13. Testimonials
*********************************/

.btver{
	clear: both;
	border: #fff solid 1px;
	width: 330px;
	padding: 15px;
	margin: auto;
	font-size: 20px;
	text-align: center;
	color: #fff;
	/* Aqui colocamos la transicion para cada navegador */
	  -webkit-transition:all 0.4s ease-out;  /* Chrome y Safari */
	  -o-transition:all 	0.4s ease-out;  /* Opera */
	  -moz-transition:all 	0.4s ease-out;  /* Mozilla Firefox */
	  -ms-transition:all 	0.4s ease-out;   /* Internet Explorer */
	  transition:all 		0.4s ease-out;  /* W3C */	
	letter-spacing: 4px;
}

.btver:hover{
	background: #E30613;
	clear: both;
	border: #ccc solid 1px;
	width: 330px;
	padding: 15px;
	margin: auto;
	font-size: 20px;
	text-align: center;
	color: #fff;
	opacity: 0.8;
	/* Aqui colocamos la transicion para cada navegador */
	  -webkit-transition:all 0.2s ease-out;  /* Chrome y Safari */
	  -o-transition:all 	0.2s ease-out;  /* Opera */
	  -moz-transition:all 	0.2s ease-out;  /* Mozilla Firefox */
	  -ms-transition:all 	0.2s ease-out;   /* Internet Explorer */
	  transition:all 		0.2s ease-out;  /* W3C */
	letter-spacing: 5px;
}


.testimonials
{
	width: 100%;
	/* background: #1a1a1a; */
	padding-top: 100px;
}
.testimonials_background_container
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.testimonials_background
{
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	opacity: 0.27;
}
.testimonials .section_title h1
{
	color: #FFFFFF;
	font-size:60px;
}
.testimonials .section_title h2
{
	color: #FFFFFF;
	font-size:30px;
}

.testimonials_slider_container
{
	padding-left: 30px;
	padding-right: 30px;
	margin-top: 56px;
}
.testimonials_item
{
	width: 100%;
	padding-bottom: 75px;
}
.quote
{
	font-size: 36px;
	color: #E30613;
}
.testimonials_text
{
	color: #FFFFFF;
	margin-bottom: 0px;
}
.testimonial_user
{
	margin-top: 43px;
}
.testimonial_image
{
	width: 98px;
	height: 98px;
	border-radius: 50%;
	overflow: hidden;
}
.testimonial_image img
{
	width: 100%;
	height: auto;
}
.testimonial_name
{
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	color: #f6af03;
	margin-top: 21px;
}
.testimonial_title
{
	font-size: 14px;
	font-weight: 500;
	color: #FFFFFF;
	margin-top: 6px;
}
.testimonials_slider .owl-dots
{
	display: -webkit-box !important;
	display: -moz-box !important;
	display: -ms-flexbox !important;
	display: -webkit-flex !important;
	display: flex !important;
	flex-direction: row !important;
	justify-content: center;
	align-items: center;
}
.testimonials_slider .owl-dot span
{
	width: 8px !important;
	height: 8px !important;
	border: solid 2px #FFFFFF;
	background: transparent !important;
}
.testimonials_slider .owl-dot.active span
{
	width: 16px !important;
	height: 16px !important;
	border: none;
	background: #E30613 !important;
}

/*********************************
14. Events
*********************************/

.event_items
{
	margin-top: 68px;
}
.event_item
{
	margin-bottom: 56px;
}
.event_item:last-child
{
	margin-bottom: 0px;
}
.event_date
{
	width: 131px;
	height: 131px;
	border: solid 2px #E30613;
	margin-bottom: 18px;
}
.event_day
{
	font-size: 48px;
	font-weight: 700;
	color: #E30613;
	margin-bottom: 1px;
	line-height: 1;
}
.event_month
{
	font-size: 16px;
	font-weight: 700;
	color: #E30613;
}
.event_name a
{
	font-size: 22px;
	font-weight: 500;
	color: #1a1a1a;
}
.event_name a:hover
{
	color: #E30613;
}
.event_location
{
	font-size: 14px;
	font-weight: 500;
	color: #1a1a1a;
	margin-top: 2px;
}
.event_content p
{
	font-weight: 500;
	color: #a5a5a5;
	margin-top: 21px;
	margin-bottom: 13px;
}
.event_image
{

}
.event_image img
{
	width: 100%;
}

/*********************************
15. Footer
*********************************/

.footer
{
	width: 100%;
	padding:20px 0px;
	background:#222935;
}
.footer .section_title h1
{
	color: #FFFFFF;
}

/*********************************
15.1 Newsletter
*********************************/

.newsletter
{
	padding-bottom: 85px;
	border-bottom: solid 1px #cc0000;
}
.newsletter_form_container
{
	width: 60%;
	margin-top: 48px;
}
.newsletter_email
{
	width: calc(100% - 164px);
	height: 42px;
	border: none;
	padding-left: 27px;
	font-weight: 500;
	color: #1a1a1a;
}
.newsletter_email:focus
{
	outline: solid 2px #E30613;
}
.newsletter_submit_btn
{
	width: 164px;
	height: 42px;
	border: none;
	background: #E30613;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
}
.newsletter_submit_btn:focus
{
	border: solid 2px #FFFFFF;
}

/*********************************
15.2 Footer Content
*********************************/

.footer_content 
{
	padding-top: 40px;
	padding-bottom: 40px;
	border-bottom: solid 1px #666;
}
.footer_content .logo_container
{
	padding-left: 0px;
}
.footer_content .logo span
{
	color: #FFFFFF;
}
.footer_about_text
{
	margin-top: 24px;
	margin-bottom: 0px;
	padding-right: 20px;
}
.footer_column_title
{
	font-size: 18px;
	font-weight: 500;
	color: #FFFFFF;
	padding-top: 15px;
}
.footer_column_content
{
	margin-top: 32px;
}
.footer_list_item
{
	margin-bottom: 11px;
}
.footer_list_item a
{
	font-size: 14px;
	color: #a5a5a5;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.footer_list_item a:hover
{
	color: #E30613;
}
.footer_contact_item
{
	font-size: 14px;
	font-weight: 400;
	color: #a5a5a5;
	margin-bottom: 22px;
}
.footer_contact_item:last-child
{
	margin-bottom: 0px;
}
.footer_contact_icon
{
	display: inline-block;
	width: 28px;
	height: 28px;
	vertical-align: middle;
	margin-right: 10px;
}
.footer_contact_icon img
{
	width: 100%;
}

/*********************************
15.3 Footer Copyright
*********************************/

.footer_bar
{
	padding-top: 19px;
	padding-bottom: 19px;
}
.footer_social .menu_social_item a i
{
	color: #fff;
}
.footer_social .menu_social_item a i:hover
{
	color: #E30613;
}
.footer_social .menu_social_item:last-child
{
	margin-right: 0px;
}





/* galeria  */
#galeria {
            margin: 3rem auto;
            width:96%;
            padding:0 10px 10px;
            box-sizing: border-box;
            column-count: 4;

            /* Espacio entre columnas */
            -moz-column-gap: 10px;
            -webkit-column-gap: 10px;
            column-gap: 20px;
            
            /* Filete entre columnas */
            /*-moz-column-rule: 1px solid #bbb;
            -webkit-column-rule: 1px solid #bbb;
            column-rule: 1px solid #bbb;*/


        }
        
        #galeria header {
            -webkit-column-span:all;
            column-span:all;
        }

        article {
            background:#fff;
            border-radius:5px;
            border:1px solid #ccc;
            margin:0 0 20px 0;
            text-align: center;
            max-width: 100%;
            filter: opacity(100%);

            /*Evitamos que se corte al cambiar de columna*/
            break-inside: avoid;
            page-break-inside: avoid;         
       
        }
        
        article img {
            width:100%;
        }

        article:hover {
            transition: .2s ease;
            filter: opacity(100%);
        }

        figure {
            padding:0rem;
            box-sizing: border-box;
			margin: 0 0 0rem;
        }

 
        /* Móviles en horizontal o tablets en vertical */
        @media (max-width: 767px) { 
            #galeria {
                columns:2;
            }

        }
        
        /* Móviles en vertical */

        @media (max-width: 480px) {
            #galeria {
                columns: 1;
            }
        }


/* mouse */

.overlay {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .3)
    /*background-image: url(../images/overlay-pattern.png);
    background-repeat: repeat;
    background-color: rgba(0, 0, 0, .3)*/
}

.home .mouse {
    position: absolute;
    width: 26px;
    height: 40px;
    border: 2px solid #fff;
    border-radius: 13px;
    background: 0 0;
    bottom: 30px;
    margin: 0 auto;
    left: 0;
    right: 0;
    z-index: 10
}
.home .mouse .wheel {
    width: 6px;
    height: 6px;
    background-color: #fff;
    border-radius: 50%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 6px;
    left: 0;
    right: 0;
    -webkit-animation: magic-mouse 1.7s infinite ease;
    animation: magic-mouse 1.7s infinite ease
}
.home .banner-caption h2,
.home .banner-caption h3 {
    font-family: Montserrat;
    color: #fff;
    animation-delay: 1s;
    text-transform: uppercase
}
@keyframes magic-mouse {
    0% {
        margin-top: 6px;
        opacity: 0
    }
    30% {
        opacity: 1
    }
    100% {
        margin-top: 18px;
        opacity: 0
    }
}
@-webkit-keyframes magic-mouse {
    0% {
        margin-top: 6px;
        opacity: 0
    }
    30% {
        opacity: 1
    }
    100% {
        margin-top: 18px;
        opacity: 0
    }
}

.servi{
	width: 100%; max-width: 24%; float: left;
    margin: 0.5%;
	position: relative;
    padding-bottom: 100px;
    cursor: pointer;
}
.ser{
	width: 100%;  
	background:#000;
	overflow: hidden;
	position: relative;
}

.ser img{
	width: 100%; 
	opacity: 1;
	/* Aqui colocamos la transicion para cada navegador */
	  -webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
	  -o-transition:all 	0.3s ease-out;  /* Opera */
	  -moz-transition:all 	0.3s ease-out;  /* Mozilla Firefox */
	  -ms-transition:all 	0.3s ease-out;   /* Internet Explorer */
	  transition:all 		0.3s ease-out;  /* W3C */	
}

.servi:hover .ser img{
	width: 100%; 
	opacity: 0.8;
	/* Aqui colocamos la transicion para cada navegador */
	  -webkit-transition:all 0.5s ease-out;  /* Chrome y Safari */
	  -o-transition:all 	0.5s ease-out;  /* Opera */
	  -moz-transition:all 	0.5s ease-out;  /* Mozilla Firefox */
	  -ms-transition:all 	0.5s ease-out;   /* Internet Explorer */
	  transition:all 		0.5s ease-out;  /* W3C */	
	transform : scale(1.1);
	-moz-transform : scale(1.1); /* Firefox */
	-webkit-transform : scale(1.1); /* Chrome - Safari */
	-o-transform : scale(1.1); /* Opera */
	-ms-transform : scale(1.1); /* IE9 */
}

.titser{
	position: absolute;
    background: #222935;
    width: 200px;
    height: 150px;
	z-index: 99;
	bottom:30px;
	text-align: center;
    left: 50%;
    margin-left: -100px;
     -webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
	  -o-transition:all 	0.3s ease-out;  /* Opera */
	  -moz-transition:all 	0.3s ease-out;  /* Mozilla Firefox */
	  -ms-transition:all 	0.3s ease-out;   /* Internet Explorer */
	  transition:all 		0.3s ease-out;  /* W3C */
}

.servi:hover .titser{
	bottom:10px;
	  -webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
	  -o-transition:all 	0.3s ease-out;  /* Opera */
	  -moz-transition:all 	0.3s ease-out;  /* Mozilla Firefox */
	  -ms-transition:all 	0.3s ease-out;   /* Internet Explorer */
	  transition:all 		0.3s ease-out;  /* W3C */	
}




.ser2{
	width: 100%; 
	background:#000;
	overflow: hidden;
	position: relative;
	margin-bottom:1px;
}

.ser2 img{
	width: 100%; 
	opacity: 0.6;
	/* Aqui colocamos la transicion para cada navegador */
	  -webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
	  -o-transition:all 	0.3s ease-out;  /* Opera */
	  -moz-transition:all 	0.3s ease-out;  /* Mozilla Firefox */
	  -ms-transition:all 	0.3s ease-out;   /* Internet Explorer */
	  transition:all 		0.3s ease-out;  /* W3C */	
}

.ser2:hover img{
	width: 100%; 
	opacity: 1;
	/* Aqui colocamos la transicion para cada navegador */
	  -webkit-transition:all 0.5s ease-out;  /* Chrome y Safari */
	  -o-transition:all 	0.5s ease-out;  /* Opera */
	  -moz-transition:all 	0.5s ease-out;  /* Mozilla Firefox */
	  -ms-transition:all 	0.5s ease-out;   /* Internet Explorer */
	  transition:all 		0.5s ease-out;  /* W3C */	
	transform : scale(1.1);
	-moz-transform : scale(1.1); /* Firefox */
	-webkit-transform : scale(1.1); /* Chrome - Safari */
	-o-transform : scale(1.1); /* Opera */
	-ms-transform : scale(1.1); /* IE9 */
}

.titser2{
	position: absolute;
	z-index: 2;
	top: 50%;
	width: 100%;
	text-align: center;
	opacity: 1;	
	/* Aqui colocamos la transicion para cada navegador */
	  -webkit-transition:all 0.6s ease-out;  /* Chrome y Safari */
	  -o-transition:all 	0.6s ease-out;  /* Opera */
	  -moz-transition:all 	0.6s ease-out;  /* Mozilla Firefox */
	  -ms-transition:all 	0.6s ease-out;   /* Internet Explorer */
	  transition:all 		0.6s ease-out;  /* W3C */	
}

.ser2:hover .titser2{
	position: absolute;
	z-index: 99;
	top: 60%;
	width: 100%;
	text-align: center;
	opacity: 1;
	/* Aqui colocamos la transicion para cada navegador */
	  -webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
	  -o-transition:all 	0.3s ease-out;  /* Opera */
	  -moz-transition:all 	0.3s ease-out;  /* Mozilla Firefox */
	  -ms-transition:all 	0.3s ease-out;   /* Internet Explorer */
	  transition:all 		0.3s ease-out;  /* W3C */	
}




/* menu pancho */

@font-face {
    font-family: 'din_next_lt_probold';
    src: url('dinnextltpro-bold-webfont.woff2') format('woff2'),
         url('dinnextltpro-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
:root {
  --primColor: none;
  --secoColor: #fff;
  --cornerRad: 4px;
}

.menu
{
	position: absolute;
	top:130px;
	right: 0%;
	width: 300px;
	padding: 10px 50px;
}


details {
  margin: 30px;
	font-family: 'din_next_lt_probold';
}
summary {
  
  text-align: center;
  padding: 12px 10px;
  width: 23px;
  height: 17px;
  background-color: var(--primColor);
  border-radius: var(--cornerRad);
  color: var(--secoColor);
  cursor: pointer;
  user-select: none;
  outline: none;
  transition: transform 200ms ease-in-out 0s;
position: absolute;
	top: 20px;
	right: 20%;
}
summary::before,
summary::after {
  position: static;
  top: 0;
  left: 0;
}
summary::before {
  content: "";
}
summary::after {
  content: url("../images/menu.png?v=1.10");
}
summary:hover {
  transform: scale(1);
}
summary::marker {
  font-size: 0;
}
summary::-webkit-details-marker {
  display: none;
}
details[open] .menu {
  animation-name: menuAnim;
	background:rgba(41,41,41,0.4);
}
details[open] summary::before {
  content: "X";
	font-size: 60px;
	margin-left: 230px;
	margin-top: 20px;
}
details[open] summary::after {
  content: "";
}
.menu {
  height: 0;
  width: fit-content;
  border-radius: var(--cornerRad);
  background-color: var(--primColor);
  box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.2);
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  animation: closeMenu 300ms ease-in-out forwards;
	font-size: 40px;
	color: #fff;
	text-align: left;
}
.menu a {
  padding: 12px 24px;
  margin: 0 16px;
  color: var(--secoColor);
  text-decoration: none;
  text-align: left;
  transition: filter 200ms linear 0s;
}
.menu a:nth-of-type(1) {
  padding-top: 24px;
}
.menu a:nth-last-of-type(1) {
  border-bottom: none;
}
.menu a:hover {
  filter: brightness(200%);
}
details::before {
  content: " ";
  color: #fff;
  font-size: 50px;
  position: absolute;
  margin-left: 80px;
  padding: 10px 10px;
  
}
details[open]::before {
  animation: fadeMe 300ms linear forwards;
}
@keyframes menuAnim {
  0% {
    height: 0;
  }
  100% {
    height: 200px;
  }
}
@keyframes fadeMe {
  0% {
    opacity: 0.4;
  }
  100% {
    opacity: 0;
  }
}