:root{
	--naranja : #f1592a;
	--verde:    #159543;
}
body, html { font-family: 'Roboto', sans-serif; text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important; color: #777; font-weight: 300; width: 100% !important; height: 100% !important;}
h2 { font-weight: 500; font-size: 34px; color: #333; text-transform: uppercase;}
h3 { font-size: 22px; font-weight: 500; color: #333;}
h4 { font-size: 24px; text-transform: uppercase; font-weight: 400; color: #333;}
h5 { text-transform: uppercase; font-weight: 700; line-height: 20px;}
hr { height: 4px; width: 70px; text-align: center;	position: relative;	background: var(--verde); margin: 0 auto; margin-bottom: 20px;	border: none;}

p { font-size: 17px;}
a {	color: #333; font-weight: 400;}
a:hover, a:focus { text-decoration: none; color: #222;}
ul, ol { list-style: none; padding: 0;}

iframe{ width: 96%;}

.intro p{ color:white}
.btn:active, .btn.active {	background-image: none; outline: 0; -webkit-box-shadow: none; box-shadow: none;}
a:focus, .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus { outline: none; outline-offset: none;}

.contenedor{ margin: 0 8%}

/* Navigation */
#menu { padding: 20px; transition: all 0.8s;}
#menu.navbar-default { background-color: rgba(248, 248, 248, 0); border-color: rgba(231, 231, 231, 0);}
#menu a.navbar-brand { font-size: 22px; color: #eee; font-weight: 400; text-transform: uppercase; letter-spacing: 1px;}
#menu.navbar-default .navbar-nav > li > a {	text-transform: uppercase; color: var(--verde); font-weight: 400; font-size: 15px; padding: 5px 0; border: 2px solid transparent;	letter-spacing: 0.5px;	margin: 10px 15px 0 15px;}
#menu.navbar-default .navbar-nav > li > a:hover { color: #eee;}

.on { background-color: rgba(30,30,30,0.9) !important; padding: 0 !important; padding: 20px 0 !important;}
.on a{ color:#FEFEFE}
.in{ background:#555 !important}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { color: #eee !important; background-color: transparent;}
.navbar-toggle { border-radius: 0;}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color: var(--verde);	border-color: var(--verde);}
.navbar-default .navbar-toggle:hover>.icon-bar { background-color: #FFF;}
.navbar-default{ background: none; border:none}
.navbar-default .navbar-nav > li > a{ color:white}
.navbar-default .navbar-nav > li > a:hover{ color:orange}
.section-title { margin-bottom: 70px;}
.section-title p { font-size: 18px;}
.btn-custom {	text-transform: uppercase; color: #fff; text-shadow: 0 0 3px #859c3c; background-color: var(--verde); border: 0; padding: 14px 20px; margin: 0; font-size: 17px; transition: all 0.5s;}
.btn-custom:hover, .btn-custom:focus, .btn-custom.focus, .btn-custom:active, .btn-custom.active {	color: rgba(255,255,255,0.8); background-color: #94ae44;}

.intro {	width: 100%; height:100%; padding: 0; background: url(../imgs/banners_home/imagen.jpg) no-repeat center bottom; background-size:cover;}
.overlay {	background: rgba(0,0,0,0.60); width: 100%; height: 100%; padding:0 10rem; box-sizing:border-box;}
.intro h1 { color: #fff; font-size: 68px; font-weight: 400; margin-top: 0; margin-bottom: 10px; letter-spacing: -1px;}

.fieldset{ background: #FFF;}
.foco2 { background:var(--verde) !important; color: #fff !important;}   

.input{ display: flex;}
.input i{  padding: 12px 10px; background:#d35a2f; color: white; min-width: 50px; text-align: center; border-radius:3px 0 0 3px}
.input input{width: 100%; padding: 10px; outline: none; border-radius: 0 3px 3px 0} 

.legend{ color:var(--verde)}
.b_button{ padding:10px; margin:20px 0; border:1px solid #94ae44; display:inline-block; border-radius:10px;}
.banner{ width: 100%; height: 250px; background:url(../imgs/banners_home/cat_1.jpg); background-size: cover;}
.banner_corte{ width: 100%; height: 450px; background:url(../imgs/banners_home/fondo_cortecloud.jpg) no-repeat #1f86a7; background-size: contain; background-position: bottom left;}
.banner_cursos{ width: 100%; height: 450px; background:url(../imgs/banners_home/fondo_cursos.png) no-repeat #1f86a7; background-size: cover; background-position: bottom right;}
.banner_vacantes{ width: 100%; height: 450px; background:url(../imgs/banners_home/fondo_vacantes.jpg) no-repeat #1f86a7; background-size: cover; background-position: bottom right;}
.banner img{ width: 100%; height: 100%;}

.banner_corte .overlay{ background:none}
.banner_corte .overlay h3{ color:white}
.banner_cursos .overlay{ background:none}
.banner_cursos .overlay h3{ color:white}

.menu_cortecloud{background:#1f86a7;  border-radius:0 0 10px 10px;}
.menu_cortecloud img{ width: 20px !important; height: 20px !important; vertical-align: middle; }
.menu_cortecloud a{ color:white; font-weight: bold !important; width: 100%; display: inline-block; padding:10px;}

#header_2{ height: 100px; display: flex; justify-content: center;}
#div_contenido{ padding:30px 0;}
#catalogo{ display: grid; grid-template-columns: repeat(5, 1fr); gap:20px}
#catalogo > div{ width:100%; box-sizing:border-box; border-radius:10px; border:1px solid #DDD; padding:10px; position:relative; transition: all 0.3s ease-in-out; background: white;}
#catalogo > div:hover{ box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.4); transition: all 0.3s ease-in-out; transform: scale(1.1);}
#catalogo > div a{ display: block;}
#catalogo > div img{ width:100%; height:200px; display:inline-block; border-radius:5px; object-fit: contain;}
#catalogo > div h3{ text-align: right; color:var(--naranja)}
    
#detalle_producto{ padding:2% 4%}
#detalle_producto #div_imagenes img{ width:100%; height:auto; padding:5%; border:1px solid #DDD; border-radius:5px; margin:5px 0}
#detalle_producto #div_principal img{ width:90%; height:auto; padding:2%; margin:0 1%; border:1px solid #DDD; border-radius:5px;}

#detalle_producto #div_caracteristicas h1{  font-weight:normal; color:var(--naranja)}
#detalle_producto #div_caracteristicas h3{  text-align:left; font-weight:normal}    
#detalle_producto #div_caracteristicas h5{ color:#555}
#detalle_producto #div_caracteristicas h5 label{ color:#060;}

#servicios{ padding:5% 0; background: url('../imgs/fondos_cont/contenedor.jpg') no-repeat #FFF; background-size: auto;}
#galeria, #infos{ padding:5% 0}
#infos{ background:#F2F2F2}

#div_servicios{ display: grid; grid-template-columns: repeat(4, 1fr); gap:20px;}
#div_servicios img{ width:100px; height: 100px;}
#div_servicios > div{ width: 100%; box-sizing: border-box; background: white; box-shadow:0 2px 3px rgba(0, 0, 0, 0.2); border:1px solid white; border-radius:10px; display: flex; flex-direction: column; justify-content: space-around; align-items: center; padding:40px 20px; transition: all 0.3s ease-out;}
#div_servicios > div:hover{ border:1px solid var(--naranja); box-shadow: 0 2px 3px var(--naranja); transform: scale(1.05); transition: all 0.3s ease-in;}
#div_servicios > div h5{ color: var(--verde);}    
#div_servicios > div a{ color: var(--naranja); display: block; margin: 10px 0;}

#sucursales{ background: url('../imgs/fondos_cont/contenedor2.jpg'); padding:2% 0}
#sucursales h2, #sucursales p, #sucursales hr{ color:white}

#div_sucursales{ text-align: center; display:grid; grid-template-columns: repeat(5,1fr); gap:20px}
#div_sucursales > div{ width:100%; box-sizing:border-box; border-radius:10px; background: #434343;}
#div_sucursales > div img{ width: 100%;}
#div_sucursales > div h5{ text-align: center; color:white; padding:0 5px; box-sizing: border-box;}
#div_sucursales > div > .menu i{ font-size:18px; margin:10px;}

#div_sucursales .menu{ padding:10px; background: white;}
#div_sucursales .div_numeros{ color:white; padding:10px; box-sizing: border-box;}

#div_galerias{ display: grid; grid-template-columns: repeat(6, 1fr); gap:10px }
#div_galerias > div img{ width: 100%; height:auto; border-radius:20px; object-fit: cover; }

#rows{ display: grid; grid-template-columns:repeat(6, 1fr); gap:10px}

/* Team Section */
#team { color: #fff; padding: 80px 0; background: rgba(21, 149, 67, 0.9);}
#team h2, #team p{ color:white}
#team h3 {	color: #fff; font-size: 1.5rem; margin: 5px 0;}
#team .team-img { width: 200px; height: 200px; border-radius: 50px 0 50px 0; box-shadow: 15px 0 #96b044; object-fit: contain; background: white;}
#team .thumbnail { background: transparent; border: 0;}
#team .thumbnail .caption {	padding-top: 10px;}
#team .thumbnail .caption p { color: #fff;}

/* Portfolio Section */
.categories { text-align: center;}
.categories li { display: inline-block; margin-left: 20px;}
.categories a { color: var(--verde); font-weight: 400; font-size: 15px; padding: 10px 20px; border: 2px solid var(--verde); background:white; border-radius: 10px 0 10px 0; text-transform: uppercase; letter-spacing: 0.5px; display: inline-block; margin:10px 0}
.fcs_tab a{ border-color:var(--naranja) !important; background: var(--naranja) !important; color:white}
    

#lealtad{ padding:3% 0}
#div_lealtad{ font-weight: 1.3rem !important;}
#div_lealtad p{ margin:15px 0}
#div_lealtad ul{ padding-left: 30px ; font-weight: 1.3rem !important;}
#li_beneficios li{ list-style: circle; margin:5px 0}
#li_lealtad li{ list-style:square; margin:5px 0}
#li_part li{ list-style: decimal; margin:5px 0}


/* Footer Section*/
#footer { background: #333; padding: 50px 0 20px 0;}
#footer .social { margin-bottom: 50px;}
#footer .social ul li { display: inline-block;	margin: 0 20px;}
#footer .social i.fa { font-size: 26px; padding: 4px; color: #159543; transition: all 0.3s;}
#footer .social i.fa:hover { color: #eee;}
#footer p {	font-size: 15px;}
#footer a {	color: #999;}

#tipo_galeria{ margin: 30px 0; width: 50%;}
input[type=radio] + label{ font-size: 2rem; padding:20px; background: #DDD; color:#666; box-shadow:1px 1px 3px rgba(0, 0, 0, 0.3)}
input[type=radio]:checked + label { background: linear-gradient(to bottom, #ffa84c 0%,#ff7b0d 100%);box-shadow:1px 1px 3px rgba(245, 129, 4, 0.8); color:white}

.contenido p strong{ color: var(--naranja);}
.contenido p i{ color: var(--naranja);}

#contenedor{ z-index: 1040 !important;}

.politicas li{ margin:10px 0; font-size: 1.6rem;}
.circle{ list-style: circle;}
.title_red{ color:tomato}
.nivel_socio th{ border:1px solid #333;  background: none; font-weight: bolder; text-align: center; color:black; text-transform: uppercase;}
.nivel_socio td{ border:1px solid #333; text-align: center; background: white; padding: 20px 0;}

#cont_calendario{ padding:40px 0}
.calendar{ font-size:1.5rem;}
.calendar tr{ background:none !important}
.calendar tr td{ border: 1px solid #ddd;}
.calendar .calendar-day-head{ background:var(--naranja); color:white; text-align:center; border:1px solid #ddd; height:50px}

.calendar-day{
	padding: 5px;
	text-align:center;
	height:50px;
}
.calendar-day-head{
	background: #ddd;
}
.actual{ background:#ffffd6;}
.ver_tareas{ cursor:pointer}

.table_new th{ background: var(--naranja) !important;}
.table_new td{ font-size:1.6rem; color:black; font-weight: bold;}

#vacantes{ background: #434343;}
#div_vacantes{ position:relative}
#div_vacantes img{ border-radius: 0 200px 0 0; width:100%; height: auto;} 
#div_vacantes h4{ background:var(--naranja); padding:20px; border-radius:0 10px 10px 0; position:absolute; bottom:30px; color:white}