body	{color:#003366; font-family: 'Open Sans', sans-serif; font-size:15px; line-height:1.25em; text-align:justify;
		background-attachment:fixed; background-image:url("../img/bg.jpg"); background-position:center center; background-repeat:no-repeat; background-size:cover;}

h1, h2, h3	{color:#009966!important}
h1	{font-weight:700; font-size:40px; text-transform:uppercase}
h2	{font-weight:700; font-size:24px; margin:0 0 30px 0; text-align:center; text-transform:uppercase}
h3	{font-weight:700; font-size:20px; margin:0 0 20px 0; text-transform:uppercase}
h4	{margin:0 0 20px 0;}

i	{color:#CC0000; margin-right:5px;}
a	{color:#CCC; text-decoration:none!important}
a:focus, a:hover {color:#FFF;}
p	{margin-bottom:20px}
p:last-child	{margin-bottom:0}
strong	{font-weight:500!important; color:#333;}
.no-gutter {margin-right:0; margin-left:0;}
.no-gutter > [class*="col-"] {padding-right:0; padding-left:0;}
ul 		{margin:0 0 15px 15px; padding:0;}
ul li	{margin-bottom:10px}
ol		{margin:0 0 15px 15px; padding:0;}
ol li	{margin-bottom:10px}
.text-center li {text-align:center}
.img	{max-width:100%; height:auto}
.img-responsive {width:100%}
.img-circle {border:4px solid #506c96; padding:10px; max-width:480px; margin:0 auto!important}
.container-fluid {padding:0%!important}
section	{margin:0 0 120px 0}



/* HEADER ========== */
header	{position:relative; width:100%; padding-bottom:160px}
#topbar	{padding:20px; margin:0;}
#topbar, #topbar a	{color:#fff!important}
#topbar i	{color:#009966!important}

#menu #logo	{float:left;}
#menu #logo img	{height:140px; width:auto; margin:0; background:#FFF;)}
#menu-links	{float:right}
#menu-links a	{font-size:16px; font-weight:400; color:#CCC; display:block}
#menu-links a	{width:180px; height:34px; padding:8px 20px 0 0; margin-bottom:1px; background:rgba(255,255,255, 0.2)}
#menu-links a:hover {color:#FFF; background:rgba(255,255,255, 0.5)}

header h1	{font-size:100px; text-align:center; opacity:0.7; margin:0 auto; padding:20vh 0 0 0; animation: rotation 10s infinite linear;}
@keyframes rotation {100%{ transform:rotatey(360deg);}}

#header-base-cont	{position:absolute; width:100; bottom:0; left:0; right:0}
#header-base-cont div	{height:40px;}
#header-base	{background:#FFF; background:rgba(255,255,255,0.05)}
#header-base2	{background:#FFF; background:rgba(255,255,255,0.15)}
#header-base3	{background:#FFF; background:rgba(255,255,255,0.25);}


/* QUIENES ========== */
#quienes	{background:#FFF; background:rgba(255,255,255,0.4);}
#quienes .box	{padding:100px 30px!important; background:#eee;}
.quienes-img	{width:100%; min-height:400px; height:100%; background: url("../img/01.jpg") no-repeat center center / cover;}
.mision-img	{width:100%; min-height:400px; height:100%; background: url("../img/02.jpg") no-repeat center center / cover;}
.vision-img	{width:100%; min-height:400px; height:100%; background: url("../img/vision.jpg") no-repeat right center / cover;}
.valores-img	{width:100%; min-height:400px; height:100%; background: url("../img/valores.jpg") no-repeat right center / cover;}

/* SERVICIOS ========== */
#servicios [class*='col-']	{margin-bottom:40px!important; }
#servicios .box	{width:100%; height:100%; padding:20px 10px; background:#003366; background:rgba(255, 255, 255, 0.75);
				border:6px solid #009966}
#servicios h2	{color:#FFF!important}

#servicios .icono	{width:140px!important; height:auto; margin:0 auto 10px;}

/* CONTACTO ========== */
#contacto, #contacto h2, #contacto h4	{color:#FFF!important}
#contacto .box	{background:#FFF; background:rgba(255, 255, 255, 0.25); padding:10px 5px;}

.nav-tabs	{margin:0 0 20px 0!important;}
.nav-tabs > li > a	{color:#001A33; font-weight:500; background:#009966!important; border:none!important;}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover, .nav-tabs > li > a:hover {color:#FFF!important;}
.tab-content	{background:#FFF; background:rgba(255,255,255,0.4); text-align:center;}

/* FORM ========== */
#contactForm	{max-width:100%}
#contactForm label	{color:#FFF; font-weight:normal; margin:0;}
#contactForm input[type], #contactForm textarea {color:#; background:#; box-shadow:none}
#contactForm textarea {height:px;}
#submit-cont	{width:100%; text-align:***}	
#contactForm button[type=submit]	{color:#001A33; font-weight:500; background:#009966; letter-spacing:2px; border:none;}
#contactForm button[type=submit]:hover	{color:#FFF; background:#;}
.help-block	{color:#FF0000!important}

.map	{margin-bottom:-5px}



/* AVISO DE PRIVACIDAD  ========== */
.clearfix::after {content:""; clear:both; display:table;}
#hdr-aviso	{height:auto!important;}
#aviso		{margin-top:40px!important}
#aviso .box	{padding:40px 5%!important; background:#FFF; background:rgba(255,255,255,0.8); font-size:16px!important;}
#aviso h2	{font-size:24px; padding:0; margin-bottom:-15px}
#aviso h4	{color:#009966!important; font-size:18px!important; margin:40px 0 10px!important}
#aviso a	{color:#0055FF!important;font-weight:500!important;}
#aviso a:hover	{opacity:0.75}
#aviso hr	{width:50%; left:25%; border-color:#009966!important}
#aviso blockquote	{font-size:inherit!important; padding:0 10%!important; border:none!important}
#aviso ol	{padding-left:15px!important}
#aviso strong	{font-weight:500!important; color:#333!important;}





/* FOOTER ========== */
footer		{background:#003366; padding:30px 20px; color:#CCC; font-size:14px}
footer h3	{color:#FFF}
footer .fab	{border:2px solid #CCC; border-radius:50%; padding:5px 9px}
footer i	{color:#009966;}
footer .logo img	{height:70px; text-align:right; float:none!Important; background:#fff;}
footer #copy	{padding-top:20px}
footer #repse	{width:100px; height:auto; margin-top:10px}



#top	{position:fixed; display:none; bottom:5px; right:5px; z-index:1000}
#top i	{color:#CC0000!important; font-size:30px; background:#FFF; border-radius:50%; opacity:0.75}
#top:hover i	{opacity:1}





/* RESPONSIVE ========== ; border:1px solid red */
@media (min-width:992px) {

}

@media (min-width:768px) {
	#topbar span	{margin:0 50px}	
	.row-eq-height {display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex;}
	.cel	{display:none}
	.v-align {display:flex; align-items:center;}
	.banner	{padding:0 15%;}
	.nav-tabs > li:nth-child(-n+2) > a	{margin-right:20px!important;}
	.tab-content				{padding:20px 20px;}
	.tab-content #service-one	{padding:20px 25%;}	
}

@media (max-width:767px) {
	body	{font-size:14px;}
	#menu #logo	{width:50%; height:142px; background:rgba(255,255,255,0.55)}
	#menu #logo img	{width:auto; max-height:142px; max-width:100%; margin:0; background:transparent}
	#menu-links	{width:50%}
	#menu-links a	{font-size:16px; font-weight:400; color:#CCC; display:block}
	#menu-links a	{width:100%; height:35px; padding:8px 20px 0 0; margin-bottom:1px;}
	#quienes .box	{padding:90px 10px!important;}
	footer	{text-align:center!important}
	.fa-ul {margin-left:10px}
	.fa-ul li {margin-bottom:10px}
	h1	{font-size:28px;}
	h2	{font-size:22px;}
	.flex-switch {display:flex; flex-direction:column-reverse; @include sm-min {flex-direction:row;}}
	header h1	{font-size:40px; text-align:center; padding:20vh 0 0 0;}
	footer .marg-b	{margin-bottom:40px;}
	.mar-b	{margin-bottom:80px}
	#topbar span	{width:100%; display:block; margin-bottom:15px}	
	.img-circle {margin-bottom:-60px!important}
	#fbtl	{max-width:100%}
	.quienes .box	{padding:40px 15px!important;}
	.tab-content	{padding:20px 0;}	
}