body {
	font-family: "Trebuchet MS", Verdana, Tahoma, sans-serif;
	font-size: 83%;
	text-align: right;
	/*background: url(img/bg.gif);*/
	background-color: #F9F9F9;
	padding: 0;
	color: #666;
}

input[type="date"] {border: 1px solid #ccc; text-align: center; background-color: #fff; height: 30px;  font-weight: bold; width:100%; color: #555; font-size: 14px; background: url(img/calendario.png) no-repeat scroll 7px 7px;}
input[type="date"]:hover {background: url(img/calendario_hover.png) no-repeat scroll 7px 7px;}

img {border: 0;}

#cuenta2 {
	background-color: #ffffff;
	height: 94px;
}

#tags {
background-color: #fff;
border-radius: 5px;
padding: 3px;
color: #8c8c8c;
border: 1px;
border-style: solid;
border-color: #DDDDDD;
font-size: 12px
font-family: ‘ssp’ sans-serif;
font-style: italic;
}



#header {
	background-color: #fff;
	height: 10em;
	}

header {background-color: #ffffff;
		height: 94px;}


#cuenta2 button{
	color: #8C8C8C;
	font-size: 13px
	font-family: ‘ssp’ sans-serif;
	border: 1px;
	border-style: solid;
	border-color: #8C8C8C;
	border-radius: 10px;
	width: 130px;
	height: 35px;
	transition: border-color 0,3s, color 0,3s;
}

#cuenta2 button:hover{
	color: #000000;
	border-color: #000000;
	cursor: pointer;
	}

#header h1 { 	
	margin: 0;
	color: #C6C4C5;
	font-size: 1.8em;
	font-weight: normal;
	cursor: default;
	}	
#header h2 { 	
	margin: 0;
	color: #8D8E90;
	font-size: 1.2em;
	padding-left: 1px;
	cursor: default;
	}	
	
	
	

#buttons #s1 {background: url(img/somos.png) no-repeat 50% 50%;}
#buttons #s2 {background: url(img/consulta.png) no-repeat 50% 50%;}
#buttons #s3 {background: url(img/contacto.jpg) no-repeat 50% 50%;}
#buttons #s4 {background: url(img/ejecutar.png) no-repeat 50% 50%;}
#buttons #s5 {background: url(img/ajustes.png) no-repeat 50% 50%;}
#buttons #s6 {background: url(img/rayo.png) no-repeat 50% 50%;}
#buttons #s7 {background: url(img/factura.png) no-repeat 50% 50%;}
#buttons #s8 {background: url(img/off2.png) no-repeat 50% 50%;}
#buttons #s9 {background: url(img/on.png) no-repeat 50% 50%;}
#buttons #s10 {background: url(img/otro.png) no-repeat 50% 50%;}
#buttons #s11 {background: url(img/graficar.png) no-repeat 50% 50%;}
#buttons #s12 {background: url(img/numerica.png) no-repeat 50% 50%;}
#buttons #s13 {background: url(img/medidor.png) no-repeat 50% 50%;}
#buttons #s14 {background: url(img/exportacion.jpg) no-repeat 50% 50%;}
#buttons #s15 {background: url(img/tarifa.png) no-repeat 50% 50%;}
#buttons #s16 {background: url(img/serial.png) no-repeat 50% 50%;}
#buttons #s17 {background: url(img/topologia.gif) no-repeat 50% 50%;}
#buttons #s18 {background: url(img/reader.jpg) no-repeat 50% 50%;}
#buttons #s19 {background: url(img/actualziar_data.png) no-repeat 50% 50%;}
#buttons #s20 {background: url(img/registrados.png) no-repeat 50% 50%;}
#buttons #s21 {background: url(img/registrar.png) no-repeat 50% 50%;}
#buttons #s22 {background: url(img/backup.jpg) no-repeat 50% 60%;}
#buttons #s23 {background: url(img/delete_user.jpg) no-repeat 60% 50%;}
#buttons #s24 {background: url(img/trash.jpeg) no-repeat 60% 50%;}
#buttons #s25 {background: url(img/report.png) no-repeat 60% 50%;}
#buttons #s26 {background: url(img/cloud.png) no-repeat 60% 50%;}
#buttons #s27 {background: url(img/unificar.jpg) no-repeat 60% 50%;}
#buttons #s28 {background: url(img/vincular.png) no-repeat 60% 50%;}
#buttons #s29 {background: url(img/desvincular.png) no-repeat 60% 50%;}
#buttons #s30 {background: url(img/crear.png) no-repeat 60% 50%;}
#buttons #s31 {background: url(img/alarma.png) no-repeat 60% 50%;}


#buttons #s1:hover {background: url(img/somos_hover.png) no-repeat 50% 50%;}
#buttons #s2:hover {background: url(img/consulta_hover.png) no-repeat 50% 50%;}
#buttons #s4:hover {background: url(img/ejecutar_hover.png) no-repeat 50% 50%;}
#buttons #s5:hover {background: url(img/ajustes_hover.png) no-repeat 50% 50%;}
#buttons #s6:hover {background: url(img/rayo_hover.png) no-repeat 50% 50%;}
#buttons #s7:hover {background: url(img/factura_hover.png) no-repeat 50% 50%;}
#buttons #s12:hover {background: url(img/numerica_hover.png) no-repeat 50% 50%;}
#buttons #s15:hover {background: url(img/tarifa_hover.png) no-repeat 50% 50%;}
#buttons #s16:hover {background: url(img/serial_hover.png) no-repeat 50% 50%;}
#buttons #s19:hover {background: url(img/actualziar_data_hover.png) no-repeat 50% 50%;}
#buttons #s20:hover {background: url(img/registrados_hover.png) no-repeat 50% 50%;}
#buttons #s21:hover {background: url(img/registrar_hover.png) no-repeat 50% 50%;}
#buttons #s25:hover {background: url(img/report_hover.png) no-repeat 60% 50%;}
#buttons #s26:hover {background: url(img/cloud_hover.png) no-repeat 60% 50%;}
#buttons #s28:hover {background: url(img/vincular_hover.png) no-repeat 60% 50%;}
#buttons #s29:hover {background: url(img/desvincular_hover.png) no-repeat 60% 50%;}
#buttons #s30:hover {background: url(img/crear_hover.png) no-repeat 60% 50%;}
#buttons #s31:hover {background: url(img/alarma_hover.png) no-repeat 60% 50%;}
#buttons #s16:hover {background: url(img/serial_hover.png) no-repeat 50% 50%;}
#buttons #s11:hover {background: url(img/graficar_hover.png) no-repeat 50% 50%;}
#buttons #s12:hover {background: url(img/numerica_hover.png) no-repeat 50% 50%;}
#buttons #s13:hover {background: url(img/medidor_hover.png) no-repeat 50% 50%;}
#buttons #s8:hover {background: url(img/off2_hover.png) no-repeat 50% 50%;}
#buttons #s9:hover {background: url(img/on_hover.png) no-repeat 50% 50%;}
#buttons #s10:hover {background: url(img/otro_hover.png) no-repeat 50% 50%;}
#buttons #s32 { background: url(img/descargar.png) no-repeat 60% 50%; }

#back_his {background: url(img/icono_volver_normal.png) no-repeat 50% 50%; }
#back_his:hover {background: url(img/icono_volver_hover.png) no-repeat 50% 50%; cursor:pointer;}
	

#buttons{
	background-color: #F9F9F9;
	width: 100%;
	height: 450px;
	animation: 600;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	}

#buttons div:not(.morris-hover-row-label):not(.morris-hover-point):not(.morris-hover){
	padding: 10px;
	width: 110px;
	float: right;
	height: 110px;
	text-align: center;
	margin-top: 35px;
	margin-right: 6%;
	margin-bottom: 0px;
	margin-left: 0px;
	}

#buttons div a:not(.morris-hover-row-label):not(.morris-hover-point):not(.morris-hover){
	color: #000;
	display: block;
	text-decoration:none;
	padding-top: 115px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	font-size: 16px
	line-height: 20px;
	font-family: ‘ssp’ sans-serif;}

#buttons div a:hover{color: #333;}


#buttons .selected{
	color: #333;
}


#buttons table p {	color: #686868;
	font-size: 16px
	font-family: ‘ssp’ sans-serif;
	font weight: 100;
	line-height: 20px;}


#container {
    height: 100%;
	background-color: #fff;
	width: 850px;
	text-align: left;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 20px;
	font-size: 90%;
}

#content {
	display:block;
	clear:left;
	float:left;
	width: auto;
	background-color:#FFFFFF;
	margin-bottom:10px;
	padding:15px 15px 15px 0px;
}

#content h1 {
	color: #8D8E90;
	font-size: 1.2em;
	cursor: default;
	display: block;
	margin: 10px 0 15px 0px;
	padding: 0;
	border-color: #ddd;
	border-style: solid;
	border-width: 0 0 1px 0;
}
#content h2 {
	color: #8D8E90;
	font-size: 1.0em;
	cursor: default;
	display: block;
	margin: 10px 0 10px 0;
	padding: 0;
	border-color: #ddd;
	border-style: dashed;
	border-width: 0 0 1px 0;
}

#content a {color: #8D8E90;}

#content a:hover {
	color: #03F;
	font-size: 80%;
	font-family: "Trebuchet MS", Verdana, Tahoma, sans-serif;
}

#content .sidebar {
	position: relative;
	clear:right;
	float: right;
	margin: .5em 0 0 .5em;
	padding: 0 .7em .7em .7em;
	width: 135px;
	font-size: .9em;
	border: 1px solid #ddd;
	background-color:#FFFFFF;
}

#content ul li{list-style-image: url(img/list.gif);}


button {
	background : #ffffff;
	border : 1px solid #ddd;

}
input {
	border : 1px solid #ddd;
	margin : 2px 0px 2px 0px;
	padding : 4px 4px 4px 0px;
	font-family: "Trebuchet MS", Verdana, Tahoma, sans-serif;
}
textarea {
	border : 1px solid #ddd;
	height : 6em;
}

#footer {
	color: #8c8c8c;
	font-size: 10px;
	text-align: center;
	display: block;
	clear: left;
	width: 100%;
	background-color:#FFFFFF;
	border-color:#fff;
	border-style:solid;
	border-width:1px 0 0 0;
	padding-top: 0px;
	margin:1px 1px 1px 1px;
}
#footer a {
	text-decoration: none;
	color: #8c8c8c;
	border-bottom: 1px dashed #A2AFBF;
}
#footer a:hover {
	border-bottom: 1px dashed #fff;
	color: #000;
}
#container #content h3 a em {
	font-size: 80%;
}
#container #content h3 em {
	color: #03F;
	font-size: 80%;
}
#accesos_directos a{
	color:#8c8c8c;
}

#breadcrumps{color: #396190;
font-size: 14px;
font-weight: bold;}

#breadcrumps a{text-decoration: none;}


.tabs td {	
border: 1px solid #C8C8C8;
height: 28px;
color: #8C8C8C;
font-family: "Trebuchet MS", Verdana, Tahoma, sans-serif;
font-size: 12px;}


.tabs th {	
border: 1px solid #C8C8C8;
height: 28px;
color: #8C8C8C;
font-family: "Trebuchet MS", Verdana, Tahoma, sans-serif;
font-size: 12px;}

.display td {	
border: 1px solid #C8C8C8;
height: 25px;
color: #8C8C8C;
font-family: "Trebuchet MS", Verdana, Tahoma, sans-serif;
font-size: 13px;}


.display th {	
border: 1px solid #C8C8C8;
height: 25px;
color: #fff;
font-family: "Trebuchet MS", Verdana, Tahoma, sans-serif;
font-size: 13px;}

.display{margin: 0 auto; }

/* -------------------- Select Box Styles: bavotasan.com Method (with special adaptations by ericrasch.com) */
/* -------------------- Source: http://bavotasan.com/2011/style-select-box-using-only-css/ */
.styled-select {
   background: #f9f9f9;
   height: 39px;
   overflow: hidden;
   width: 100%;
}

.styled-select select {
   background: #fff;
   border: none;
   font-size: 12px;
   height: 39px;
   padding: 5px; /* If you add too much padding here, the options won't show in IE */
   width: 100%;
}

.styled-select.slate {
   background: #f9f9f9 no-repeat 326px 42px;
   height: 34px;
   width: 100%;
}

.styled-select.slate select {
   border: 1px solid #ccc;
   font-size: 16px;
   height: 40px;
   width: 100%;
}


/* -------------------- Colors: Background */
.slate   { background-color: #ddd; }

/* -------------------- Colors: Text */
.slate select   { color: #555; }





/*SWITCH BUTTON */
    .onoffswitch {
        position: relative; width: 80px; float: left; margin: auto; 
        -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
    }
    .onoffswitch-checkbox {
        display: none;
    }
    .onoffswitch-label {
        display: block; overflow: hidden; cursor: pointer;
        border: 2px solid #FFFFFF; border-radius: 50px;
    }
    .onoffswitch-inner {
        display: block; width: 200%; margin-left: -100%;
        transition: margin 0.3s ease-in 0s;
    }
    .onoffswitch-inner:before, .onoffswitch-inner:after {
        display: block; float: left; width: 50%; height: 35px; padding: 0; line-height: 36px;
        font-size: 18px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
        vertical-align:center;
        box-sizing: border-box;
    }
    .onoffswitch-inner:before {
        content: "ON";
        padding-left: 15px;
        background-color: #F0F0F0; color: #5AC117;
    }
    .onoffswitch-inner:after {
        content: "OFF";
        padding-right: 9px;
        background-color: #F0F0F0; color: #999999;
        text-align: right;
    }
    .onoffswitch-switch {
        display: block; width: 26px; margin: 1.5px;
        background: #A1A1A1;
        position: absolute; top: 0; bottom: 0;
        right: 50px;
        border: 2px solid #FFFFFF; border-radius: 50px;
        transition: all 0.3s ease-in 0s; 
    }
    .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
        margin-left: 0;
    }
    .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
        right: 0px; 
        background-color: #00CC00;
    }
/*END SWITCH BUTTON */




/*SWITCH BUTTON 2*/
    .onoffswitch2 {
        position: relative; width: 80px; float: left; margin: auto; 
        -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
    }
    .onoffswitch-checkbox2 {
        display: none;
    }
    .onoffswitch-label2 {
        display: block; overflow: hidden; cursor: pointer;
        border: 2px solid #FFFFFF; border-radius: 50px;
    }
    .onoffswitch-inner2 {
        display: block; width: 200%; margin-left: -100%;
        transition: margin 0.3s ease-in 0s;
    }
    .onoffswitch-inner2:before, .onoffswitch-inner2:after {
        display: block; float: left; width: 50%; height: 35px; padding: 0; line-height: 36px;
        font-size: 18px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
        vertical-align:center;
        box-sizing: border-box;
    }
    .onoffswitch-inner2:before {
        content: "ON";
        padding-right: 18px;
        background-color: #F0F0F0; color: #5AC117;
    }
    .onoffswitch-inner2:after {
        content: "OFF";
        padding-right: 9px;
        background-color: #F0F0F0; color: #999999;
        text-align: right;
    }
    .onoffswitch-switch2 {
        display: block; width: 26px; margin: 1.5px;
        background: #A1A1A1;
        position: absolute; top: 0; bottom: 0;
        right: 50px;
        border: 2px solid #FFFFFF; border-radius: 50px;
        transition: all 0.3s ease-in 0s; 
    }
    .onoffswitch-checkbox2:checked + .onoffswitch-label2 .onoffswitch-inner2 {
        margin-left: 0;
    }
    .onoffswitch-checkbox2:checked + .onoffswitch-label2 .onoffswitch-switch2 {
        right: 0px; 
        background-color: #00CC00;
    }
/*END SWITCH BUTTON */


/*TABLE LOG */

.table_log table {
	padding: 0px; 
	width: 100%; 
	font-size: 100%;  
	background-color: #f9f9f9; 
    background: #f5f5f5;
    border-collapse: separate;
    box-shadow: inset 0 1px 0 #fff;
    font-size: 12px;
    line-height: 24px;
    margin: 0 auto;
    text-align: left;
    width: 20px;
}   

.table_log thead{color: #555;}

.table_log th {
    background: url(), linear-gradient(#777, #444);
    border-left: 1px solid #555;
    border-right: 1px solid #777;
    border-top: 1px solid #555;
    border-bottom: 1px solid #333;
    box-shadow: inset 0 1px 0 #999;
    color: #fff;
  	font-weight: bold;
    padding: 10px 15px;
    position: relative;
    text-shadow: 0 1px 0 #000;  
}

.table_log th:after {
    background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,.08));
    content: '';
    display: block;
    left: 0;
    margin: 1px 0 0 0;
    position: absolute;
    top: 25%;
    width: 100%;
}

.table_log th:first-child {
    border-left: 1px solid #777;    
    box-shadow: inset 1px 1px 0 #999;
}

.table_log th:last-child {
    box-shadow: inset -1px 1px 0 #999;
}

.table_log td {
    border-right: 1px solid #fff;
    border-left: 1px solid #e8e8e8;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #e8e8e8;
    padding: 5px 15px;
    position: relative;
    transition: all 300ms;
}

.table_log td:first-child {
    box-shadow: inset 1px 0 0 #fff;
}   

.table_log td:last-child {
    border-right: 1px solid #e8e8e8;
    box-shadow: inset -1px 0 0 #fff;
}   

.table_log tr {
    background: url();  
}

.table_log tr:nth-child(odd) td {
    background: #f1f1f1 url();  
}

.table_log tr:last-of-type td {
    box-shadow: inset 0 -1px 0 #fff; 
}

.table_log tr:last-of-type td:first-child {
    box-shadow: inset 1px -1px 0 #fff;
}   

.table_log tr:last-of-type td:last-child {
    box-shadow: inset -1px -1px 0 #fff;
}   

.table_log tbody:hover td {
    color: transparent;
    text-shadow: 0 0 0px #aaa;
}

.table_log tbody:hover tr:hover td {
    color: #444;
    text-shadow: 0 1px 0 #fff;
}






.btn_l1 {
    display:inline-block;
    border-top:1px solid #a3a375;
    box-shadow:rgba(0,0,0,1) 0 1px 0;
    text-shadow:rgba(0,0,0,.1) 0 0px 0;
    text-decoration:none;
    background:#888844;
    background-repeat:no-repeat;
    background-image:-webkit-linear-gradient(
        top left,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    -webkit-linear-gradient(
        #a3a375, #888844
    );
    background-image:-moz-linear-gradient(
        0 0,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    -moz-linear-gradient(
        #a3a375, #888844
    );    
    background-image:-o-linear-gradient(
        0 0,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    -o-linear-gradient(
        #a3a375, #888844
    );
    background-image:linear-gradient(
        0 0,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    linear-gradient(
        #a3a375, #888844
    );
    background-position:-150px -150px, 0 0;
    -moz-background-size:250% 250%, 100% 100%;
         background-size:250% 250%, 100% 100%;
    -webkit-transition:background-position 0s ease;
       -moz-transition:background-position 0s ease;       
         -o-transition:background-position 0s ease;
            transition:background-position 0s ease;
}

.btn_l1:hover,
.btn_l1:focus {
    color:#fff;
    background-position:0 0, 0 0;
    -webkit-transition-duration:1.0s;
       -moz-transition-duration:1.0s;
            transition-duration:1.0s;
}

.btn_l1:active {
    top:1px;   
}






.btn_l2 {
    display:inline-block;
    border-top:1px solid #a3a375;
    box-shadow:rgba(0,0,0,1) 0 1px 0;
    text-shadow:rgba(0,0,0,.1) 0 0px 0;
    text-decoration:none;
    background:#aaaa55;
    background-repeat:no-repeat;
    background-image:-webkit-linear-gradient(
        top left,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    -webkit-linear-gradient(
        #a3a375, #aaaa55
    );
    background-image:-moz-linear-gradient(
        0 0,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    -moz-linear-gradient(
        #a3a375, #aaaa55
    );    
    background-image:-o-linear-gradient(
        0 0,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    -o-linear-gradient(
        #a3a375, #aaaa55
    );
    background-image:linear-gradient(
        0 0,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    linear-gradient(
        #a3a375, #aaaa55
    );
    background-position:-100px -100px, 0 0;
    -moz-background-size:250% 250%, 100% 100%;
         background-size:250% 250%, 100% 100%;
    -webkit-transition:background-position 0s ease;
       -moz-transition:background-position 0s ease;       
         -o-transition:background-position 0s ease;
            transition:background-position 0s ease;
}

.btn_l2:hover,
.btn_l2:focus {
    color:#fff;
    background-position:0 0, 0 0;
    -webkit-transition-duration:0.5s;
       -moz-transition-duration:0.5s;
            transition-duration:0.5s;
}

.btn_l2:active {
    top:1px;   
}







.btn_l3 {
    display:inline-block;
    border-top:1px solid #a3a375;
    box-shadow:rgba(0,0,0,1) 0 1px 0;
    text-shadow:rgba(0,0,0,.1) 0 0px 0;
    text-decoration:none;
    background:#b2b266;
    background-repeat:no-repeat;
    background-image:-webkit-linear-gradient(
        top left,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    -webkit-linear-gradient(
        #a3a375, #b2b266
    );
    background-image:-moz-linear-gradient(
        0 0,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    -moz-linear-gradient(
        #a3a375, #b2b266
    );    
    background-image:-o-linear-gradient(
        0 0,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    -o-linear-gradient(
        #a3a375, #b2b266
    );
    background-image:linear-gradient(
        0 0,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0.2) 37%,
        rgba(255, 255, 255, 0.8) 45%,
        rgba(255, 255, 255, 0.0) 50%
    ),
    linear-gradient(
        #a3a375, #b2b266
    );
    background-position:-100px -100px, 0 0;
    -moz-background-size:250% 250%, 100% 100%;
         background-size:250% 250%, 100% 100%;
    -webkit-transition:background-position 0s ease;
       -moz-transition:background-position 0s ease;       
         -o-transition:background-position 0s ease;
            transition:background-position 0s ease;
}

.btn_l3:hover,
.btn_l3:focus {
    color:#fff;
    background-position:0 0, 0 0;
    -webkit-transition-duration:0.5s;
       -moz-transition-duration:0.5s;
            transition-duration:0.5s;
}

.btn_l3:active {
    top:1px;   
}