@import url('../font-awesome/css/font-awesome.css');

/* COLORS ==================================================
#0088CC
#004488
================================================== */

/* GENERAL ================================================== */
html		{width: 100%; height: 100%;}
body		{width:100%; height:100%; background:#FFF; color:#99BBDD; font-weight:normal; font-size:16px; font-family:Arial, sans-serif; line-height:20px; background: url(../images/bg.png);}
a		{color:#DDD; text-decoration: none !important;}
a:hover, a:visited	{color:#00BBFF;}
a:focus	{outline: none;}
.fa	{color: #00AAEE;}
hr		{height: 2px; color: #0088CC; background-color: #0088CC; border: none; border-radius: 2px;}
.rad	{border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px;}
strong, .HL	{color:#00AAEE;	font-weight:bold;}
.no-gutter > [class*='col-']	{padding-left:0; padding-right:0;}
.green {color:#00FF00}

/* TYPOGRAPHY ============================================ */
h1, h2, h3, h4, h5, h6	{color:#00AAEE;	font-weight:normal; margin:0;}
h1	{font-size:24px;}
h2	{font-size:22px;}
h3	{font-size:18px;}
h4	{font-size:18px;}
h5	{font-size:16px;}
h6	{font-size:14px;}


/* HEADER ================================================== */
header .container .row	{background: #FFF; margin-top:10px; border-radius:6px 6px 0 0; -moz-border-radius:6px 6px 0 0; -webkit-border-radius:6px 6px 0 0; }
header img	{width:350px; height:auto; margin:0 auto; padding:5px 0;}
#whatsapp {position:fixed; z-index:100; top:5px; left:5px}

/* NAV ================================================== */
.navbar-default	{float:left; width:100%; height:auto; background:transparent!important; margin:0px!important; padding:0px!important; border:none!important; margin-bottom:2.5%!important;}
#navbar			{width:100%!important; margin:0; padding:0; background:transparent!important; }
.nav-justified	{width:100%!important;}
.nav-justified li	{float:left; width:25%!important; height:60px; line-height:60px;}
.nav-justified li:hover	{background:transparent!important;}
.nav-justified li a	{color: #CCC !important; font-size:22px; padding:0; margin:0;}
.nav-justified > li > a:hover, .nav-justified  > li > a:focus, .nav-justified  > .active > a {color: #FFF !important; background:transparent!important;}
.navbar-default .navbar-toggle			{background-color: #0088CC; border: none;}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus	{background-color: #0088CC;}
.navbar-default .navbar-toggle .icon-bar	{background-color: #FFF;}


.nav-justified > .nav-01 	{background:#0088CC!important; border-radius:0 0 0 6px; -moz-border-radius:0 0 0 6px; -webkit-border-radius:0 0 0 6px;}
.nav-justified > .nav-02	{background:#004488!important;}
.nav-justified > .nav-03	{background:#0088CC!important;}
.nav-justified > .nav-04	{background:#004488!important; border-radius:0 0 6px 0; -moz-border-radius:0 0 6px 0; -webkit-border-radius:0 0 6px 0;}
.nav-justified > .nav-01:hover {background:#0088CC!important;}
.nav-justified > .nav-02:hover	{background:#004488!important;}
.nav-justified > .nav-03:hover	{background:#0088CC!important;}
.nav-justified > .nav-04:hover	{background:#004488!important;}

/* SLIDER ============================================= */
#slider-cont			{float:left; background:transparent!important; background-size:100% 100%; margin-bottom:1%}
.flexslider				{background-color: #FFF; height: auto; overflow: hidden; margin: 0; border: none;}
.flexslider .slides li	{position: relative; height:auto;}
.flexslider img			{background-position: center center!important;}
.slide-border			{width:100%; height:2px; background-image:url(../images/nav-border.png); background-size:100%}
.slide-border-6			{width:100%; height:6px; background-image:url(../images/nav-border.png); background-size:100%}
#shadow	img				{width:100%; height:auto;}


/* PAGE ===================================== */
#page		{float:left; width:100%; height:auto; margin:0; padding:60px 0; background:#004488; text-align: justify; letter-spacing:0.2px;}
#page .text img, #page .faqs img	{float:right; width:100%; padding-left:20px}
#page .title {margin:-85px 0 60px;}
#page .title h1	{color:#EEE!important; margin:0px; padding: 10px 8% 10px 1%; display: inline-block; background: #0088CC; letter-spacing: 0px;
			border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px;}
#page .title hr	{height: 2px; color: #0088CC; background-color: #0088CC; margin-top: 10px;}
#page h2		{font-size:20px; color: #EEE!important; margin-bottom:10px; padding: 5px 3% 5px 1%; display: inline-block; background: #0088CC;
			border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px;}
.page .fa	{color: #0088CC}
.fa-ul li		{margin-bottom: 10px}
.no-pad		{padding:0}
#logos		{background:#FFF; margin:2.5% 0; padding:0; text-align:center; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px;}
#logos img	{width: 100%; height: auto;}


/* HOME ============================= */
#promos			{background:#; padding:0; margin:0}
.promo			{background:#0088CC; padding:0; overflow:hidden; border:6px solid #0088CC; border-radius:6px;}
.promo-cel .click		{background:transparent}
.promo img		{background:#FFF; padding:0px; width:100%; transform:scale(1); transition:all .5s ease;}
.promo img:hover	{transform:scale(1.1)}
.promo a		{margin:0; padding:0;}			
.click			{position:relative; z-index:10; width:100%; height:50px; bottom:0; text-align:center; background:#004488; color:#0088CC; line-height:50px;
				font-weight:bold; letter-spacing:1px}
.promo a:hover .click {color:#FFF;}

#videos {margin-bottom:30px}
#videos .embed-responsive-16by9 {padding-bottom:177.7777777777778%!important;}
#videos iframe {border-radius:9px; }

/* PREGUNTAS --- */
#page .faqs h2	{margin-bottom:-5px;}
.faqs h3		{font-size:17px; font-weight:normal; margin:20px 0 6px 0;}
.faqs i		{margin-right:15px;}
.faqs h2 .fa	{color:#003377}
.faqs h2  i	{margin-right:8px;}
.faqs p .fa	{color:#99BBDD}

/* CONTACTO ============================= */
#page .form, #page .dir, .map	{background: #005599; padding:15px;}
#page .dir			{height:auto; line-height:24px}

#page .dir img:hover	{opacity:0.75}
#page .dir hr			{margin:5% 0;}

.map		{margin:20px 0 0; padding:20px 15px;}
.map iframe	{width:100%; height:450px; margin:0; padding:0;}



/* FOOTER ============================= */
footer	{float:left; width:100%; height:auto; background:#004488; padding:30px 0; margin:0 0 2.5% 0; color:#99BBDD; font-size:14px; line-height:18px;
		border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px;}

footer h2	{color:#00AAEE; font-size:18px; font-weight:normal;}
footer hr	{background:#0066AA; height: 1px; margin-top: 4px;}
footer i	{color:#ccc!important;}
#conducef img	{float: right;}
footer ul	{margin-left:25px!important;}
footer img	{border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px;}

#promos-col {width:100%}
#promos-col .col {float:left}
/* RESPONSIVE ========================================================== */
@media (min-width: 768px) {
	.container	{width:96%;}
	#page .dir img	{width:50%; margin:85px 0 65px 25%!important}
	#promos-col .col {width:20%; margin-bottom:25px}
	.promo, .promo-space {margin:0 5px!important;}
	#videos .col {width:14.2857%; float:left!important; padding:0 5px}
}

@media (max-width: 767px) {
	#page	{padding-left:10px; padding-right:10px;}
	.navbar-default	{background:#004488!important;}
	.nav-justified li		{width:100%!important; height:50px; line-height:50px; font-size:18px; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0;}
	.flex-control-paging li a	{display:none}
	.flex-direction-nav a:before 	{display:none;}
	footer .section	{border-bottom: 6px solid #003377; margin-bottom:30px; padding-bottom:10px}
	#page img		{float:left; width:80%; padding:0; margin:20px 0 0 10%;}
	#page .dir		{margin-top:20px;}	
	#page .dir img	{float:none; width:100%; padding:0; margin:0;}
	.promo			{margin:2px}
	.promo-cel .click {background:#0088CC!important}
	header .container .row	{margin-top:10px}
	#videos .col {width:100%; padding:10px}
}
@media (max-width: 767px) {
	#promos-col .col {width:50%}
}
@media (max-width: 767px) {
	/* DISABLE CEL MENU ============================= */
	.navbar			{margin-bottom:30px!important;}
	.navbar-toggle	{display:none!important}
	.navbar-collapse.collapse {display:block!important; }
	.navbar-nav>li, .navbar-nav {float:left!important;}
	.navbar-nav.navbar-right:last-child {margin-right:-15px!important;}
	.nav-justified {float:left!important;}
	.nav li		{width:25%!important; display:flex; justify-content:center; align-items:center; }
	.nav li a	{font-size:14px!important; font-weight:normal; line-height:1.1!important; }
}
@media (max-width: 600px) {
	.click {height:40px; line-height:40px; font-size:14px}
}