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

.buttons {
  position: relative;
  white-space: nowrap;
  min-height: 33px;
  margin-bottom: 30px;
	top: 100px;
	margin-left: 5px ;
     
}
  .buttons a {
    
    -webkit-animation: bounceInDown 900ms 200ms ease-in-out both;
    -moz-animation: bounceInDown 900ms 200ms ease-in-out both;
    -ms-animation: bounceInDown 900ms 200ms ease-in-out both;
    -o-animation: bounceInDown 900ms 200ms ease-in-out both;
    animation: bounceInDown 900ms 200ms ease-in-out both;
    /* nuevo */
      margin-top: -100px;
    width: 90px;
      /* de 65 a 75 */
    height: 80px;
    position: absolute;
    top: 0;
		text-decoration: none;
    padding-top: 9px;
    outline-width: 0px;
    z-index: 990;
    color: #fbffde;
    text-align: center;
      
    line-height: 10px;
    display: block; }
    .buttons a:not(.active) {
      -webkit-box-shadow: inset 0 1px 1px rgba(111, 55, 125, 0.8), inset 0 -1px 0px rgba(63, 59, 113, 0.2), 0 9px 16px 0 rgba(0, 0, 0, 0.3), 0 4px 3px 0 rgba(0, 0, 0, 0.3), 0 0 0 1px #150a1e;
      -moz-box-shadow: inset 0 1px 1px rgba(111, 55, 125, 0.8), inset 0 -1px 0px rgba(63, 59, 113, 0.2), 0 9px 16px 0 rgba(0, 0, 0, 0.3), 0 4px 3px 0 rgba(0, 0, 0, 0.3), 0 0 0 1px #150a1e;
      box-shadow: inset 0 1px 1px rgba(111, 55, 125, 0.8), inset 0 -1px 0px rgba(63, 59, 113, 0.2), 0 9px 16px 0 rgba(0, 0, 0, 0.3), 0 4px 3px 0 rgba(0, 0, 0, 0.3), 0 0 0 1px #150a1e;
      background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #697d09), color-stop(100%, #8ea22d));
      background-image: -webkit-linear-gradient(#697d09, #8ea22d);
      background-image: -moz-linear-gradient(#697d09, #8ea22d);
      background-image: -o-linear-gradient(#697d09, #8ea22d);
      background-image: linear-gradient(#697d09, #8ea22d);
     /* text-shadow: 0 0 21px rgba(223, 206, 228, 0.5), 0 -1px 0 #311d47; */}
      .buttons a:not(.active):hover, .buttons a:not(.active):focus {
        -webkit-transition: color 200ms linear;
        -moz-transition: color 200ms linear;
        -o-transition: color 200ms linear;
        transition: color 200ms linear;
        -webkit-transition: text-shadow 500ms linear;
        -moz-transition: text-shadow 500ms linear;
        -o-transition: text-shadow 500ms linear;
        transition: text-shadow 500ms linear;
        color: #fff;
        /*text-shadow: 0 0 21px rgba(223, 206, 228, 0.5), 0 0 10px rgba(223, 206, 228, 0.4), 0 0 2px #2a153c;*/ }
      .buttons a:not(.active):active {
        color: #e4e3ce !important; }
    .buttons a.active, .buttons a:active {
     -webkit-box-shadow: 0 9px 16px 0 rgba(0, 0, 0, 0.1), 0 0 0 1px #170c22, 0 2px 1px 0 rgba(121, 65, 135, 0.5), inset 0 0 4px 3px rgba(15, 8, 22, 0.2);
      -moz-box-shadow: 0 9px 16px 0 rgba(0, 0, 0, 0.1), 0 0 0 1px #170c22, 0 2px 1px 0 rgba(121, 65, 135, 0.5), inset 0 0 4px 3px rgba(15, 8, 22, 0.2);
      box-shadow: 0 9px 16px 0 rgba(0, 0, 0, 0.1), 0 0 0 1px #170c22, 0 2px 1px 0 rgba(121, 65, 135, 0.5), inset 0 0 4px 3px rgba(15, 8, 22, 0.2);
      
	  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #898787), color-stop(100%, #898787));
      background-image: -webkit-linear-gradient(#898787, #898787);
      background-image: -moz-linear-gradient(#898787, #898787);
      background-image: -o-linear-gradient(#898787, #898787);
      background-image: linear-gradient(#898787, #898787);
      text-shadow: 0 0 21px rgba(223, 206, 228, 0.5), 0 0 10px rgba(223, 206, 228, 0.4), 0 0 2px #2a153c;
      color: #e4e3ce; }
      .buttons a.active:before, .buttons a:active:before {
        position: absolute;
        display: block;
        content: "";
        width: 1px;
        height: 65px;
        top: 1px;
        left: -2px;
        background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(91, 35, 105, 0)), color-stop(41%, #5b2369), color-stop(59%, #5b2369), color-stop(100%, rgba(91, 35, 105, 0)));
        background-image: -webkit-linear-gradient(rgba(91, 35, 105, 0), #5b2369 41%, #5b2369 59%, rgba(91, 35, 105, 0));
        background-image: -moz-linear-gradient(rgba(91, 35, 105, 0), #5b2369 41%, #5b2369 59%, rgba(91, 35, 105, 0));
        background-image: -o-linear-gradient(rgba(91, 35, 105, 0), #5b2369 41%, #5b2369 59%, rgba(91, 35, 105, 0));
        background-image: linear-gradient(rgba(91, 35, 105, 0), #5b2369 41%, #5b2369 59%, rgba(91, 35, 105, 0));
        -webkit-box-shadow: -2px 0 6px 0 #5b2369;
        -moz-box-shadow: -2px 0 6px 0 #5b2369;
        box-shadow: -2px 0 6px 0 #5b2369; }
      .buttons a.active:after, .buttons a:active:after {
        position: absolute;
        display: block;
        content: "";
        width: 1px;
        height: 65px;
        top: 1px;
        right: -2px;
        background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(91, 35, 105, 0)), color-stop(41%, #5b2369), color-stop(59%, #5b2369), color-stop(100%, rgba(91, 35, 105, 0)));
        background-image: -webkit-linear-gradient(rgba(91, 35, 105, 0), #5b2369 41%, #5b2369 59%, rgba(91, 35, 105, 0));
        background-image: -moz-linear-gradient(rgba(91, 35, 105, 0), #5b2369 41%, #5b2369 59%, rgba(91, 35, 105, 0));
        background-image: -o-linear-gradient(rgba(91, 35, 105, 0), #5b2369 41%, #5b2369 59%, rgba(91, 35, 105, 0));
        background-image: linear-gradient(rgba(91, 35, 105, 0), #5b2369 41%, #5b2369 59%, rgba(91, 35, 105, 0));
        -webkit-box-shadow: 2px 0 6px 0 #5b2369;
        -moz-box-shadow: 2px 0 6px 0 #5b2369;
        box-shadow: 2px 0 6px 0 #5b2369; }
    .buttons a.active {
      z-index: 1000; }
    .buttons a:active {
      z-index: 999; }
    .buttons a:last-of-type {
      -webkit-border-radius: 0 7px 7px 0;
      -moz-border-radius: 0 7px 7px 0;
      -ms-border-radius: 0 7px 7px 0;
      -o-border-radius: 0 7px 7px 0;
      border-radius: 0 7px 7px 0; }
    .buttons a:first-of-type {
      -webkit-border-radius: 7px 0 0 7px;
      -moz-border-radius: 7px 0 0 7px;
      -ms-border-radius: 7px 0 0 7px;
      -o-border-radius: 7px 0 0 7px;
      border-radius: 7px 0 0 7px;
      left: 0; }
    .buttons a:nth-of-type(2) {
      left: 90px; }
    .buttons a:nth-of-type(3) {
      left: 180px; }
    .buttons a:nth-of-type(4) {
      left: 270px; }
    .buttons a:nth-of-type(5) {
      left: 360px; }
    .buttons a:nth-of-type(6) {
      left: 450px; }
    .buttons a:nth-of-type(7) {
      left: 540px; }
    .buttons a:nth-of-type(8) {
      left: 630px; }
    .buttons a i:before {
      margin-left: 2px;
      font-size: 22px; }
    .buttons a i.icon-bar-chart:before {
      font-size: 20px;
      margin-top: 0px; }
    .buttons a i.icon-sync:before {
      font-size: 20px;
      margin-left: 3px;
      margin-top: 1px; }
    .buttons a i.icon-download:before {
      font-size: 19px;
      margin-top: 1px;
      margin-left: 4px; }


.boton-alumbrado{
	  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0e3083), color-stop(100%, #0e3083))!important;
      background-image: -webkit-linear-gradient(#0e3083, #0e3083)!important;
      background-image: -moz-linear-gradient(#0e3083, #0e3083)!important;
      background-image: -o-linear-gradient(#0e3083, #0e3083)!important;
      background-image: linear-gradient(#0e3083, #0e3083)!important;
}

.boton-biomasa{
	  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #97bf0d), color-stop(100%, #7e8a62))!important;
      background-image: -webkit-linear-gradient(#97bf0d, #7e8a62)!important;
      background-image: -moz-linear-gradient(#97bf0d, #7e8a62)!important;
      background-image: -o-linear-gradient(#97bf0d, #7e8a62)!important;
      background-image: linear-gradient(#97bf0d, #7e8a62)!important;
}

.boton-termica{
	  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f29400), color-stop(100%, #c88f42))!important;
      background-image: -webkit-linear-gradient(#f29400, #c88f42)!important;
      background-image: -moz-linear-gradient(#f29400, #c88f42)!important;
      background-image: -o-linear-gradient(#f29400, #c88f42)!important;
      background-image: linear-gradient(#f29400, #c88f42)!important;
}

.boton-geotermia{
	  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #2eaadc), color-stop(100%, #669bbb))!important;
      background-image: -webkit-linear-gradient(#2eaadc, #669bbb)!important;
      background-image: -moz-linear-gradient(#2eaadc, #669bbb)!important;
      background-image: -o-linear-gradient(#2eaadc, #669bbb)!important;
      background-image: linear-gradient(#2eaadc, #669bbb)!important;
}

.boton-aerotermia{
	  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #bbb94c), color-stop(100%, #bbb94c))!important;
      background-image: -webkit-linear-gradient(#bbb94c, #bbb94c)!important;
      background-image: -moz-linear-gradient(#bbb94c, #bbb94c)!important;
      background-image: -o-linear-gradient(#bbb94c, #bbb94c)!important;
      background-image: linear-gradient(#bbb94c, #bbb94c)!important;
}

.boton-fotovoltaica{
	  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e2007a), color-stop(100%, #be4f80))!important;
      background-image: -webkit-linear-gradient(#e2007a, #be4f80)!important;
      background-image: -moz-linear-gradient(#e2007a, #be4f80)!important;
      background-image: -o-linear-gradient(#e2007a, #be4f80)!important;
      background-image: linear-gradient(#e2007a, #be4f80)!important;
}

.boton-edificios{
	  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e2001a), color-stop(100%, #bd4e35))!important;
      background-image: -webkit-linear-gradient(#e2001a, #bd4e35)!important;
      background-image: -moz-linear-gradient(#e2001a, #bd4e35)!important;
      background-image: -o-linear-gradient(#e2001a, #bd4e35)!important;
      background-image: linear-gradient(#e2001a, #bd4e35)!important;
}

.boton-agua{
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6AB3A0), color-stop(100%, #92C7B7))!important;
    background-image: -webkit-linear-gradient(#6AB3A0, #92C7B7)!important;
    background-image: -moz-linear-gradient(#6AB3A0, #92C7B7)!important;
    background-image: -o-linear-gradient(#6AB3A0, #92C7B7)!important;
    background-image: linear-gradient(#6AB3A0, #92C7B7)!important;
}

/* peripherial stuff: text and body */
.buttons p  { position: absolute; bottom: 50px; left: 13px; right: 50px; color: #a99bad; font-family: Helvetica, sans-serif; font-size: 10px; margin-top: 250px; margin-left: 50px  }
.buttons p > a { color: white; font-weight: bold; }

body, html { padding: 0; height: 100%; overflow: hidden; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #8ea22d), color-stop(100%, #fbffde));
  background-image: -webkit-linear-gradient(#8ea22d, #fbffde);
  background-image: -moz-linear-gradient(#8ea22d, #fbffde);
  background-image: -o-linear-gradient(#8ea22d, #fbffde);
  background-image: linear-gradient(#8ea22d, #fbffde); }

.text-button{
	font-size:9px;
	/*line-height:12px;*/
	font-family: 'Open Sans', sans-serif;
	text-transform:uppercase;
}
.margin-image{
	margin-bottom:8px;
}