:root {
	--color1: #E31E2E;	/* rojo */
	--color2: #511A20;	/* guinda */
	--color3: #F0F4F5;	/* blanco */
	--color4: #0E0E0E;	/* negro */

	--bg-color1: #E31E2E;
	--bg-color2: #511A20;
	--bg-color3: #F0F4F5;
	--bg-color4: #0E0E0E;

	--bg-page: #FFF;
	--bg-menu: #0E0E0E;
	--bg-menu-opt: #E31E2E;
	--f-menu-opt: rgba(240,244,245,5);
	--f-menu-opt-over: #F0F4F5;

	--bg-menu-subopt: rgba(14,14,14,0.8);
	--bg-menu-subopt-over: #E31E2E;;
	--f-menu-subopt: rgba(240,244,245,5);
	--f-menu-subopt-over: #F0F4F5;

	--bg-top-line: #511A20;
	--f-top-line: #F0F4F5;

	--bg-footer: #E31E2E;
	--bg-footer-top: #0E0E0E;
	--f-footer-top-title: #E31E2E;
	--f-footer-top-content: #F0F4F5;
	
	--bg-body: rgba(240,244,245,0.5);
	--f-body-title: #E31E2E;
	--f-body-subtitle: #0E0E0E;
	

/* SIN REVISAR */*
	--alert-color: #FFF;
	--alert-bg: #A3121F;
	--alert-bg-hover: #015746;

	--color1fc: #FFF;
	--color2fc: #FFF;
	--color3fc: #FFF;
	--color4fc: #FFF;
	--color5fc: #FFF;

	--page-bg: rgba(255,255,255,0.8);
	--page-bg-negative: rgba(1,164,131,0.9);
	--page-title: #FFF;
	--page-title-caption: rgba(255,255,255,0.9);

	--form-bg: rgba(1,164,131,0.1);
	--form-border: rgba(1,87,70,0.4);
	--form-field-border: rgba(1,87,70,0.2);
	--form-field-border-focus: rgba(1,87,70,0.6);
	--form-field-bg: rgba(255,255,255,0.8);
	--form-field-bg-focus: #FFF;
	--form-field-color: #292929;

	--fc-default : #292929;
	--fc-boxes : rgba(255,255,255,0.9);

	--page-link-title: #015746;
	--page-link-fc: rgba(1,164,131,0.2);
	--page-link-a: rgba(1,164,131,0.5);
	--page-link-ah: #015746;
}

/*-------------------------------------------------*/
/* =  Fonts
/*-------------------------------------------------*/

/* Headers */
/* H1	*/			@font-face {font-family: fHeader; src: url('fonts/ReadexPro-Bold.ttf');}
/* H2-6 */		@font-face {font-family: fHeaderL; src: url('fonts/ReadexPro-SemiBold.ttf');}
/* Caption */	@font-face {font-family: fHeaderC; src: url('fonts/ReadexPro-Regular.ttf');}

/* Content */
@font-face {font-family: fBody; src: url('fonts/Karla-VariableFont_wght.ttf');}

/* Menu & Buttons */
@font-face {font-family: fDefault; src: url('fonts/OpenSans-Regular.ttf');}
@font-face {font-family: fDefaultL; src: url('fonts/OpenSans-Light.ttf');}
@font-face {font-family: fDefaultB; src: url('fonts/OpenSans-Bold.ttf');}
@font-face {font-family: fDefaultXB; src: url('fonts/OpenSans-ExtraBold.ttf');}

/*-------------------------------------------------*/
/* =  Banners
/*-------------------------------------------------*/
.tp-banner-container, 
.tp-banner, 
.tp-banner-fullscreen-container {
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
}

/*-------------------------------------------------*/
/* =  content
/*-------------------------------------------------*/

body {
	background-color: var(--bg-page);	
	margin: 0;
	padding: 0;
}

body .container-area {
	width: 90%;
	margin: 2% 5%;
	padding: 0;	
}

h1 {font-family: fHeader, sans-serif;}
h2,h3,h4,h5,h6 {font-family: fHeaderL, sans-serif;}

.row, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {margin: 0; padding: 0}

.Left {text-align: left;}
.Right {text-align: right;}
.Justify {text-align: justify;}
.Center {text-align: center;}

.divider {clear: both;}

/*-------------------------------------------------*/
/* =  Header
/*-------------------------------------------------*/
.navbar-default {
	background-color: var(--bg-menu);
	border: none;
	margin: 0;
	padding: 0;
}

.navbar-default .container {width: 100%;}

.top {
	margin: 0;
	padding: 0;
}

.top .container {
	width: 100%;
	margin: 0;
	padding: 0;
}

.top .container .top-line {
	background-color: var(--bg-top-line);
	padding: 5px 0;	
}

.top .container .top-line span {
	color: var(--f-top-line);
	font-size: 22px;
	line-height: 42px;
}

.top .container .top-branding {
	background: var(--bg-color1) url(../../images/cupi2-bg-4-areas-red.jpg);
	padding: 2% 0;
}

.top .container .top-branding img.logo {
	width: 40%;
	height: 40%;
}

.header-content .container .home-video-area h2 {
	font-size: 40px;
	line-height: 50px;
	color: rgba(255,255,255,0.8);
	letter-spacing:0.02em;
}

.header-content .container .home-video-area h2 span {
	font-size: 80px;
	line-height: 90px;
	color: #FFF;
	letter-spacing:0.04em;
	text-shadow: 2px 2px 4px #222;
}

.header-content .container .home-video-area h3 {
	font-size: 30px;
	color: rgba(255,255,255,0.5);
}

.header-content .container .home-video-area .link {margin: 40px 0 0 0;}

.header-content .container .home-video-area a {
	font: 20px Open Sans, serif;
	color: #FFF;
	background-color: #6F9215;
	padding: 20px 40px;
	text-decoration: none;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-o-border-radius: 20px;
}

.header-content .container .home-video-area a:hover {background-color: #495F0A;}

/*-------------------------------------------------*/
/* =  Footer
/*-------------------------------------------------*/

footer {
	margin: 0;
	padding: 0;
}

footer .container {
	width: 100%;
	margin: 0;
	padding: 0;
}

footer .upper {
	background-color: var(--bg-footer-top);
	padding: 3% 0;
}

footer .upper h4 {
	font-family: fDefaultXB, sans-serif;
	font-size: 26px;
	line-height: 40px;
	color: var(--f-footer-top-title);
}

footer .upper p, footer .upper ul, footer .upper a {
	font-size: 18px;
	line-height: 26px;
	color: var(--f-footer-top-content);
	text-decoration: none;
}

footer .upper ul {color: var(--color1)}

footer .upper p span {font-weight: 700;}

footer .upper a:hover {text-decoration: underline;}

footer .upper ul {
  margin: 0;
  padding: 0 0 0 25px;
}

footer .upper img {margin: 0 2px; 0 0}

footer .upper img.logo {
	width: 40%;
	height: 40%;
	margin: 0;
	opacity: 0.3;
}

footer .bottom {
	padding: 15px 40px;
	background-color: var(--bg-footer);
}

footer .bottom p,
footer .bottom a {
	font-size: 14px;
	color: var(--color3);
	text-decoration: none;
}

footer .bottom p.copyright {text-align: right;}

footer .bottom a:hover {opacity: 0.75;}

/*-------------------------------------------------*/
/* =  PAGE CONTENT
/*-------------------------------------------------*/

.body {
	position: relative;
	margin: 0;
	padding: 0;
}

.body .container {
	background-color: var(--bg-body);
	width: 100%;
	margin: 0;
	padding: 0;
}

.body .container .title-area {
	background-color: var(--bg-color1);
	width: 100%;
	margin: 0;
	padding: 2% 0;
}

.body .container .title-area h1.title {
	font-family: fHeader, sans-serif;
	font-size: 60px;
	font-weight: 600;
	line-height: 80px;
	margin: 0;
	padding: 0;
	color: var(--color3);
	text-shadow: 3px 3px 3px rgba(0,0,0,0.4);
	text-transform: none;
}

.body .container .title-area p.subtitle {
	font-family: fHeaderC, sans-serif;
	font-size: 30px;
	line-height: 40px;
	color: var(--color2);
	margin: 0;
	padding: 0;
}

.body .container .body-area {
	width: 100%;
	margin: 0;
	padding: 0;
}

.section-title {font-family: fHeader, sans-serif;}

.section-title .font-size1 {
	font-size: 100px;
	line-height: 120px;
}

.section-content {font-family: fBody, sans-serif;}

.section-content .font-size1 p {
	font-size: 30px;
	line-height: 40px;
	padding: 0 0 15px 0;
	color: #FFF; 
}

/*-------------------------------------------------*/
/* =  MORE STYLES
/*-------------------------------------------------*/

.full-size {
	width: 100%; 
	height: 100%;
	margin: 0;
	padding: 0;
}

.size90 {width: 90%; height: 90%;}
.size80 {width: 80%; height: 80%;}
.size70 {width: 70%; height: 70%;}
.size60 {width: 60%; height: 60%;}
.size50 {width: 50%; height: 50%;}
.size40 {width: 40%; height: 40%;}
.size30 {width: 30%; height: 30%;}
.size20 {width: 20%; height: 20%;}

.p01 {padding: 1%}
.p02 {padding: 2%}
.p03 {padding: 3%}
.p04 {padding: 4%}
.p05 {padding: 5%}
.p06 {padding: 6%}
.p07 {padding: 7%}
.p08 {padding: 8%}
.p09 {padding: 9%}
.p10 {padding: 10%}

.ptb01 {padding-top: 1%; padding-bottom: 1%;}
.ptb02 {padding-top: 2%; padding-bottom: 2%;}
.ptb03 {padding-top: 3%; padding-bottom: 3%;}
.ptb04 {padding-top: 4%; padding-bottom: 4%;}
.ptb05 {padding-top: 5%; padding-bottom: 5%;}
.ptb06 {padding-top: 6%; padding-bottom: 6%;}
.ptb07 {padding-top: 7%; padding-bottom: 7%;}
.ptb08 {padding-top: 8%; padding-bottom: 8%;}
.ptb09 {padding-top: 9%; padding-bottom: 9%;}
.ptb10 {padding-top: 10%; padding-bottom: 10%;}

.plr01 {padding-left: 1%; padding-right: 1%;}
.plr02 {padding-left: 2%; padding-right: 2%;}
.plr03 {padding-left: 3%; padding-right: 3%;}
.plr04 {padding-left: 4%; padding-right: 4%;}
.plr05 {padding-left: 5%; padding-right: 5%;}
.plr06 {padding-left: 6%; padding-right: 6%;}
.plr07 {padding-left: 7%; padding-right: 7%;}
.plr08 {padding-left: 8%; padding-right: 8%;}
.plr09 {padding-left: 9%; padding-right: 9%;}
.plr10 {padding-left: 10%; padding-right: 10%;}

.shadow {
	box-shadow: 2px 10px 10px -10px #000;
	-moz-box-shadow: 2px 10px 10px -10px #000;
	-webkit-box-shadow: 2px 10px 10px -10px #000;
}

.frame {
	padding: 15px;
	background-color: #FFF;
}

.frameT {
	margin: 20px 0;
	padding: 0 25px 25px 25px;
	background-color: rgba(255,255,255,0.6);
	border: 1px solid #DDD;
}

.image-L {
	float: left;
	margin: 0 20px 20px 0;
}

.image-R {
	float: right;
	margin: 0 0 20px 20px;
}

.image-L p.caption,
.image-R p.caption {
	font-size: 16px;
	font-style: italic;
	color: #111;
	text-align: center;
	margin-top: 15px;
}

.image-w-text {
	width: 90%;
	display: table;
	background-color: #FFF; 
	margin: 5%;
	padding: 0;
	border: none;
}

.image-w-text img {
	width: 100%;
	height: 100%;
}

.image-w-text .text {
	padding: 10px 15px 30px 15px;
	text-align: center;
	font-family: Roboto, sans-serif;
}

.image-w-text .text .title {
	height: 80px;
	text-align: center;
	vertical-align: middle;
	margin-bottom: 15px;
}

.image-w-text .text h3 {
	font-size: 26px;
	line-height: 34px;
	color: #4C6823;
	padding: 15px 0;
	margin: 0;
}

.image-w-text .text .service-size {height:180px}

.image-w-text .text p {
	font-size: 18px;
	line-height: 26px;
	color: #333;
	margin: 0;
	padding: 0 0 16px 0;
}

.image-w-text .text p span {font-weight: 700;}

.image-w-text .text a {
	display: inline-block;
	font-size: 16px;
	text-decoration: none;
	text-align: center;
	color: #FFF;
	background-color: #719B34;
	margin-top: 15px;
	padding: 8px 18px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
}

.image-w-text .text a:hover {
	background-color: #585858;
	transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
}

a.call-to-action {
	font: 600 30px Open Sans, sans-serif;
	color: #FFF;
	background-color: #4C6823;
	padding: 20px 30px;
	margin: 0 5px 5px 0;
	line-height: 50px;
	outline: none;
	border: none;
	text-decoration: none;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	box-shadow: 1px 3px 10px -5px #000;
	-moz-box-shadow: 1px 3px 10px -5px #000;
	-webkit-box-shadow: 1px 3px 10px -5px #000;
}

a.call-to-action:hover {
	background-color: #3E3E3E;
	transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
}


/*-------------------------------------------------*/
/* =  tables page
/*-------------------------------------------------*/
.tables-section {margin-bottom: 40px;}

.tables-section h2 {
	font-size: 30px;
	line-height: 40px;
	color: #393939;
	padding: 0 0 10px 0;
}

.tables-section p {margin-bottom: 20px;}

.tables-section table {
	width: 100%;
	border: 1px solid rgba(0,0,0,0.2);
}

.tables-section table thead tr th {
	font-size: 16px;
	text-align: center;
	vertical-align: text-top;
	color: #FFF;
	background-color: #495F0A;
	padding: 15px 0;
	letter-spacing: 0.1em;
	border-bottom: 1px solid rgba(255,255,255,0.2);
	border-right: 1px solid rgba(255,255,255,0.2);
}

.tables-section table tbody tr.odd {background-color: #FFF;}
.tables-section table tbody tr.even {background-color: #F3F3F3;}

.tables-section table tbody tr td {
	font-size: 18px;
	color: #333;
	padding: 10px 15px;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	border-right: 1px solid rgba(0,0,0,0.1);
}

/*-------------------------------------------------*/
/* FORMS
/*-------------------------------------------------*/

.form-section {
	width: 100%;
	margin: 0;
	padding: 0;
}

.form-section .row {padding-bottom: 12px;}

.form-section .col-md-1, 
.form-section .col-md-2, 
.form-section .col-md-3, 
.form-section .col-md-4, 
.form-section .col-md-5, 
.form-section .col-md-6, 
.form-section .col-md-7, 
.form-section .col-md-8, 
.form-section .col-md-9, 
.form-section .col-md-10, 
.form-section .col-md-11, 
.form-section .col-md-12 {
	padding-right: 8px;
}

.form-section h3 {
	font-size: 36px;
	line-height: 48px;
	color: var(--color1);
}

.form-section .caption {
	font: 14px/26px fDefault, sans-serif;
	color: rgba(255,255,255,0.5);
	padding-left: 3px;
} 

.form-section .Form1 input[type="text"],
.form-section .Form1 textarea,
.form-section .Form1 select {
	width: 100%;
	padding: 8px 12px;
	font: 18px fDefault, sans-serif;
	color: #F0F0F0;
	background-color: #292929;
	outline: none;
	border: none;
	border-bottom: #292929;
}

.form-section .Form1 textarea {height: 150px;}

.form-section .Form1 input[type="text"]:focus,
.form-section .Form1 textarea:focus,
.form-section .Form1 select:focus {
	color: #FFF;
	background-color: #000;
	border-bottom: 1px solid var(--color1);
}

.form-section .bottom-form {padding-top: 3%;}

.form-section .bottom-form p {
	font: 14px/22px fDefault, sans-serif;
	color: rgba(255,255,255,0.65);
}

.Form1 input[type="submit"],
.Form1 input[type="button"],
button,
a.default {
	font: 18px fDefault, sans-serif;
	color: #FFF;
	background-color: #E31E2E;
	padding: 10px 20px;
	margin: 1%;
	outline: none;
	border: none;
	text-decoration: none;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	box-shadow: 1px 3px 10px -5px #000;
	-moz-box-shadow: 1px 3px 10px -5px #000;
	-webkit-box-shadow: 1px 3px 10px -5px #000;
}

a.default {padding: 12px 30px;}

.Form1 input[type="submit"]:hover,
.Form1 input[type="button"]:hover,
button:hover,
a.default:hover {
	background-color: #0E0E0E;
	transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
}

/*-------------------------------------------------*/
/* =  Responsive Part
/*-------------------------------------------------*/
@media (max-width: 1500px) {
}

@media (max-width: 1199px) {
}

@media (max-width: 991px) {
}

@media (max-width: 767px) {
}

@media (max-width: 500px) {

	.Left, .Right {text-align: center;}

	body {background-image: none;}

	body .container-area {
		width: 100%;
		margin: 0;
		padding: 0;	
	}
	
	.top-branding img {
		width: 80%;
		height: 80%;
	}

	.top .container .top-line span {
		font-size: 16px;
		line-height: 26px;
	}

	footer {text-align: center;}

	footer .bottom p.copyright {text-align: center;}

	footer .upper ul {
		list-style-type: none;
		padding:0;
	}

	footer .upper h4 {
		font-size: 22px;
		line-height: 30px;
		font-weight: 600;
		padding-top: 30px;
	}

	footer .upper img.logo {
		width: 40%;
		height: 40%;
	}

	.body .container .title-area h1.title {
		font-size: 30px;
		line-height: 40px;
		text-shadow: 2px 2px 2px rgba(0,0,0,0.4);
	}

	.body .container .title-area p.subtitle {
		font-size: 20px;
		line-height: 30px;
	}

	.section-title .font-size1 {
		font-size: 40px;
		line-height: 50px;
	}

	.section-content .font-size1 p {
		font-size: 20px;
		line-height: 28px;
		padding: 0 0 10px 0;
		text-align: justify;
	}

	.size90, .size80, .size70, .size60, .size50,	.size40, .size30,	.size20 {
		width: 100%; 
		height: 100%
	}

	.p01, .p02, .p03, .p04, .p05, .p06, .p07, .p08, .p09, .p10 {padding: 7%}
	.ptb01, .ptb02, .ptb03, .ptb04, .ptb05, .ptb06, .ptb07, .ptb08, .ptb09, .ptb10 {padding: 7%}
	.plr01, .plr02, .plr03, .plr04, .plr05, .plr06, .plr07, .plr08, .plr09, .plr10 {padding: 7%}
}