
* {
  box-sizing: border-box;
}

.row::after {
  content: "";
  clear: both;
  display: table;
}

[class*="col-"] {
  float: left;
  padding: 15px;
}
html {
  font-family: "Lato", Tahoma, Arial, sans-serif;
}
body{
	margin:0;
    background-color:#FFF;
    background-image: url(../img/electricista.jpg);
	background-repeat:repeat-x;
} 
.romin{width:95%; align-items:center; text-align:left; height:auto;  display:flex; flex-flow:row nowrap; align-items:justify; position:relative; margin-top:top;  margin-left:2.5%; border-top-left-radius:0.3em; 
border-top-right-radius:0.3em;  padding:0px 0px; background-color:#FFFFFF; box-sizing:border-box; overflow: visibility;}
/*.miloguer{padding:13px 8px;}
.miloguer{position:relative; padding:8px 8px; float:left; border-radius:0.5em; width:12%; height:auto; 
opacity:0.6; box-shadow:0px 6px 8px 0px rgba(0, 0, 0, 0.2);}
.tuper{ }*/

input{justify-content: space-between; margin: 0px 4px;}

#boton{ display:inline-table; bottom:-5px;}

.section {width:95%; height:auto; margin:auto auto; position:relative; padding:20px; background-color:#FFFFFF;}
.aviso{
font-family: Arial, Tahoma, sans-serif; border-radius:0.3em;
background-image:url(../img/dinamica.jpg);
background-repeat:repeat-X repeat-Y; 
/*box-shadow:0px 4px 9px 0px #9E9E9E;
box-shadow:rgba(9,17,355, 0.2) 2px 4px;*/
text-align:center;
padding:0px; /*ajustar fold*/
border-radius:0.3em;
color:#F3FAFB;
text-shadow:0 4px 2px rgba(255,255,255,.9);
font-size:20px;
line-height:1.657;
position:relative;
overflow:hidden;
}
.aviso::after{content:''; display:block; position:absolute; border-width: 0px 20px 20px 0px; 
border-style: solid; border-color: rgba(255,34, 0, 0.2) #FFF; top:0; right:0; border-bottom-left-radius:0.3em; border-top-right-radius:0.3em;}
 .aviso::before{content:''; display:block; position:absolute; border-width: 0px 20px 20px 0px; 
border-style: solid; border-color: rgba(255,34, 0, 0.2) #FFF; top:0; right:0; border-bottom-left-radius:0.3em; border-top-right-radius:0.3em;}
.myedon{font-size:18px; }
.myedon:before{content:'\025b2'; color:red; }
.fondos{background-color: #FFFFFF;}
.three {
  width:95%;
  display:table;
  height:auto;
  margin:auto auto;
  background-color:#FFFFFF;
  padding:0px;/* aquamarine #FF0000*/
}

.menurespons{width:95%; height:40px; margin:auto auto; opacity:0.9; position:relative; background-image: linear-gradient(45deg, #FF0000, #F403d1); border-radius:0.3em; box-shadow: 0 4px 9px 0 #9E9E9E; display: none;}

.tufin {
    width:50%;
    padding: 8px 0px;
    background-color: transparent;
    text-align: center;
	float:left;
    box-sizing: border-box;
	border-radius:0.3em;
    color: #fff;
    font-size:22px;
	transition:all .5s ease;
    display: none;
}

.toggle {
    width:50%;
    padding: 8px 0px;
    background-color: transparent; 
    text-align: center;
	float: right;
    box-sizing: border-box;
	border-radius:0.3em;
    color: #fff;
    font-size:22px;
	transition:all .5s ease;
    display: none;
}
#mmarco{
border-top:2px ridge hsla(0, 10%, 10%, 0.1);
padding:2px 0px;
display:block;
}
#nav2{border-left-style:ridge; border-left-width:2px; border-left-color:hsla(0, 10%, 10%, 0.1); padding:18px 16px;}

.rojo{background-image:url(../img/dinamica.jpg); background-repeat:repeat-X repeat-Y; display:block; padding: 8px 20px;
 border-radius:0.2em; width:45%; font-size:18px; text-decoration:none; text-shadow:0 4px 2px rgba(255,255,255,.9); position:relative;
 box-shadow: 0 4px 9px 0 #9E9E9E;}
 
 .rojo a:before{content:''; width:100%; height:21px; position:absolute; padding: 0px; display:block; top:0px; left:0px;
background:#00000061; border-top-left-radius:0.2em; border-top-right-radius:0.2em; z-index:999; opacity:0.5; }
 
@media only screen and (max-width: 700px){	
.miloguer{width:70px; height:auto; padding:7px 8px; display:block;}
.menurespons{display:table; box-sizing:border-box;}
.menurespons::after{content:''; display:block; position:absolute; border-width: 0px 20px 20px 0px; 
border-style: solid; border-color: #FF33D1 #FFF; bottom:0; right:0; border-bottom-left-radius:0.3em; transform:rotate(90deg);}
 .menurespons::before{content:''; display:block; position:absolute; border-width: 0px 20px 20px 0px; 
border-style: solid; border-color: #FF33D1 #FFF; bottom:0; right:0; border-bottom-left-radius:0.3em; transform:rotate(90deg);}
.fi-rr-menu-burger, .fi-rr-share, .fi-rr-cross{font-size:20px; color:#FFFFFF; cursor:pointer;}
 .toggle, .tufin{display: inline-block;}
.toggle:hover, .tufin:hover{background-color:#00000020;}
.icons ul li{/*margin-left:0px;*/align-items:center; text-align:center;}
.aside{box-sizing:border-box; top:0; padding:0;} 
.asil{box-sizing:border-box;} 
 /*display:table; height:0%;galeria margin-top:-10% 
vino:max-height:0;*/ 
/*#vino{left:-120%; height:0; position:relative; transition: 2s; align-items:center; overflow:hidden;  z-index:999; justify-content:center;}
#primate{display:none;}
#segund{display:none;} ;  overflow:visibility; transition:2s; @keyframes  prev{from {left: -120%;opacity: 1;} to {left: 0%;opacity: 1;}} @keyframes nec{from {left: 0%;opacity: 1;}to {left: -120%;opacity: 1;} height: auto; height:0; animation-name:prev; animation-name: nec;*/
.icons{transition: left 1s linear; left:-120%; overflow:hidden; z-index:999; position:relative; justify-content:center; max-height:0;}
.lumi{ max-height: none;  left:0%;  animation-duration: 1s;}
.nilo{transition: right 3s linear; max-height:0;  left:-40%; overflow:hidden; border-color:red; border-width:2px; border-style:solid;}

#mmarco{display:none;}
#nav2{display:none;}
}

/*.sociales que viene de class col-2 Redes sociales*/
#vino{height:auto; position:relative;background-color:rgba(250,250,275, 0.5); border-radius:0.3em; box-shadow: 1px -0.5px 1px #E6E6FF; text-align:center; overflow:hidden; align-content:center;}

.icons ul li{
margin-left:4px; /*separacion entre iconos-redes*/
padding: 5px 0px;
border-radius:0.3em;
display:inline-block;
cursor:pointer;
}
.icos ul li{
margin-left:4px; /*separacion entre iconos-redes*/
padding: 5px 0px;
border-radius:0.3em;
display:inline-block;
cursor:pointer;
}
.icos ul li a{cursor:pointer;}
.icos ul, li{
list-style:none;
border:none;
}
.icos ul li a{
text-decoration:none;
font-size:29px;
border:none;
}
.icos ul li i{
text-decoration:none;
border:none;
}
.icos ul li a:hover{
opacity:0.6;
}
.icos ul li i:hover{
opacity:0.6;
}
.menus{ position:relative; padding:10px 0px; overflow-x:hidden;} /*vertical 10px 40px*/
.aside {overflow:hidden; position:relative;}
.asil {overflow:hidden; position:relative;}
  
.libre, .sincontenido{
background-color:#FFFFFF;
display:block;
border-radius:0.3m;
float:left;	
}
.acodion{max-width:1000px;}
.acordion .contentB{position:relative; opacity:0.8;}
.acordion .contentB .label{position:relative; padding:5px; background-image: -moz-linear-gradient(top, #ffffff, #e9e9e9);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e9e9e9));
	background-image: -webkit-linear-gradient(top, #ffffff, #e9e9e9);
	background-image: -o-linear-gradient(top, #ffffff, #e9e9e9);
	background-image: linear-gradient(to bottom, #ffffff, #e9e9e9);
	background-repeat: repeat-x;
	border-color: #e7e7e7 #e7e7e7 #bfbfbf;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); border-radius:0.3em; font-weight: bold; font-family:helvetica, arial; font-size:18px;  text-align:justify; 
text-shadow: hsla(150, 55%, 20%, 0.9) 3px 3px 3px;}
.acordion .contentB .label:before{content:'\025bc'; position:absolute; top:50%; right:20px; transform:translateY(-50%); font-size:1.5em; cursor:pointer; color:red;}
.acordion .contentB .label:hover{opacity:0.6;}
.acordion .contentB.actim .conten{height:auto; left:0%; padding: 4px;}/*height:auto*/
.acordion .contentB.actim .label:before{content:'\025b2'; cursor:pointer; color:blue;}
.acordion .contentB.actim .label:hover{opacity:0.6;}/*abajo content:height:0; */
.acordion .contentB .conten{background-color:rgba(250,250,275, 0.5); position:relative; height:auto; left:-120%; overflow:visibility; transition:1s; -webkit-box-shadow: inset 1px 0px 0px rgba(350,0,50,0.001), 1px 1px 2px 1px rgba(9,17,298,.3);-moz-box-shadow: inset 1px 0px 0px rgba(350,0,50,0.001), 1px 1px 2px 1px rgba(9,17,298,.3); box-shadow: inset 1px 0px 0px rgba(350,0,50,0.001), 1px 1px 2px 1px rgba(9,17,298,.3); font-weight: bold; font-family:helvetica, arial; font-size:16px;  text-align:justify; border-radius:0.3em; text-shadow: hsla(150, 55%, 20%, 0.9) 3px 3px 3px;}

.icon-mobile2{background-color:transparent; color:#000;  font-size:29px; text-decoration:none; list-style:none;}
.icon-mobile2:hover{color:silver;}
.icon-whatsapp{background-color:#0dc143; color:white; font-size:29px; border-radius:50%; text-decoration:none; list-style:none;}
.icon-telegram{background-color:#22AAB0; color:white; font-size:29px; border-radius:50%; text-decoration:none; list-style:none;}
.icon-telegram:hover{opacity:0.6;} .icon-whatsapp:hover{opacity:0.6;}
.fi-rr-envelope{background-color:#FFF;  color:#EE0000; font-size:29px; margin-left: 10px; text-decoration:none; border:none; list-style:none;}
.botonera nav{
display: flex;
flex-wrap: wrap; /*permite que si cabe en una l¨ªnea, bajen a la siguiente*/
justify-content: space-around; /*distribuye espacio sobrante alrededor de los items*/
text-align: center;
}
.botonera a:hover{ 
   opacity:0.5;
	transition:0.25s ease-in;
   -moz-transition: all .25s ease-in; 
   -o-transition: all .25s ease-in; 
    -webkit-transition: all .25s ease-in;
}
.planti{ position: relative; display: inline-block;    
			margin-top: 10px;
			text-decoration: none;
			}
.planti img{
border: solid thin #EEEFEE; border-radius:0.3em; padding:8px 8px; display: block; margin: 0; 
}
			.planti:before{ 
			content:'';
			position:absolute;
			bottom: 0;
			right: 0; 
			width: 0;
			height: 0; 
			border-style: solid;
			border-width: 0px 20px 20px 0px; border-color: #FFF rgba(0,0,0,0.11);  border-bottom-left-radius:0.3em;
			border-top-right-radius:0.3em; 
			/*transform: translate(0px, 0px);*/
			transform: rotate(-90deg);
			z-index: 2;
			}
.mobile{
opacity:0.7;
width:560px;
height:170px;
display:block;
/*overflow-y:auto;*/
border:1px solid #dedede;
border-radius:0.3em;
border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #CCCCCC;
	border-left-color: #CCCCCC;
	box-shadow:0 4px 8px 0 #9E9E9E;
margin-bottom:15px;
padding: 20px 20px;
 z-index:1;
}	
.mat{
height:auto;
margin:auto auto;
text-shadow: rgba(0,0,150,0.4) 2px 2px 1px;
text-align:center;
border-radius:0.4em;
padding:20px 15px;
margin-top:70px;
text-decoration:none;
}
.footer{
  position:relative;
  text-align: center;
  font-size: 14px;
  padding: 10px 30px;
  max-width: 1000px;
  display:block;
}
.lluvia{
  position:relative;
  text-align: center;
  border-radius:0.3em;
  width:100%;
  height:10%;
  display:block;
}
.lluvia:before{content:'';
width:100%;
height:50%;
position:absolute;
margin-top:0%;
text-align: center;
display:block;
background-image:linear-gradient(to bottom, #cd171e, #cd171e); 
border-top-left-radius:0.3em;
border-top-right-radius:0.3em;
z-index:2;
opacity:0.2;}

#maps{
display:block;
margin-top:15px;
font-size:17px;
padding:0px 0px;
position:relative;
	color: #000;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
}
.lttc{background-color: #fff;}
.sampedro{padding:15px 0px;
background-color: #f5f5f5;
	background-image: -moz-linear-gradient(top, #ffffff, #e9e9e9);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e9e9e9));
	background-image: -webkit-linear-gradient(top, #ffffff, #e9e9e9);
	background-image: -o-linear-gradient(top, #ffffff, #e9e9e9);
	background-image: linear-gradient(to bottom, #ffffff, #e9e9e9);
	background-repeat: repeat-x;
	border-color: #e7e7e7 #e7e7e7 #bfbfbf;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); border-radius:0.3em;
}

/* For mobile phones: */
[class*="col-"] {
  width: 100%;
}


@media only screen and (min-width: 600px) {
  /* For tablets: */
  
  .col-s-1 {width: 8.33%;}
  .col-s-2 {width: 16.66%;}
  .col-s-3 {width: 25%;}
  .col-s-4 {width: 33.33%;}
  .col-s-5 {width: 41.66%;}
  .col-s-6 {width: 50%;}
  .col-s-7 {width: 58.33%;}
  .col-s-8 {width: 66.66%;}
  .col-s-9 {width: 75%;}
  .col-s-10 {width: 83.33%;}
  .col-s-11 {width: 91.66%;}
  .col-s-12 {width: 100%;}
}
@media only screen and (min-width: 768px) {
  /* For desktop: */
  .col-1 {width: 8.33%;}
  .col-2 {width: 16.66%;}
  .col-3 {width: 25%;}
  .col-4 {width: 33.33%;}
  .col-5 {width: 41.66%;}
  .col-6 {width: 50%;}
  .col-7 {width: 58.33%;}
  .col-8 {width: 66.66%;}
  .col-9 {width: 75%;}
  .col-10 {width: 83.33%;}
  .col-11 {width: 91.66%;}
  .col-12 {width: 100%;}
}