* {
	box-sizing: border-box;
	font-family: fontawesome, arial, verdana;
}
body {
	background: black;
}
z {
    font-family: Fontawesome; 
    font-weight: normal;
    color: forestgreen;
}
ti {
    font-size: 1.2rem;
    color: white;
}
#tooltip {
    position: absolute;
    left: 157px;
    top: 205px;
    z-index: 1;
    display:hidden;
    border: 2px solid #008316;
    padding: 3px 6px 2px 6px;
    border-radius: 5px;
    background: #043b00;
    color: #7aff00;
    font-family: 'FontAwesome', bahn;
    font-size: 0.8rem;
    font-weight: normal;
    box-shadow: 0px 1px 4px #010201;
    text-shadow: 0px 1px 2px #010101;
}
/* Stile per il contenitore principale */
.container {
    display: flex;
    position: relative;
    flex-direction: column;
    min-height: 90vh;
    max-width: 950px;
    width: calc(100% - 4px);
    margin: 0 auto;
    /* padding: 2px; */
    box-sizing: border-box;
    height: 100vh;
    /* border: 1px solid #474747; */
    max-height: 96vh;
    /*box-shadow: 0px 0px 4px #484;*/
}
.continterno {
    display: flex;
    flex-direction: column;
    min-height: 90vh;
}

/* Stile per i div in alto e in basso (variabili) */
.top {
    border: 1px solid #124547;
    padding: 3px 8px 2px 8px;
    font-size: 0.9rem;
    color: darkcyan;
    background: linear-gradient(to bottom, #edf5fb 0%, #f0f2f3 40%, #a9cbe1 100%);
    box-shadow: 0px 0px 5px #07ffd1ad inset;
    display: block;
    flex-wrap: wrap;
    justify-content: center;
    overflow-x: auto;
    border-radius: 9px 9px 0px 0px;
    z-index: 13;
}
.top::before {
    /*background-image: url('/immagini/sf_001.jpg');*/
}
.bottom {
    border: 1px solid #286d6f;
    padding: 1px 4px;
    background: linear-gradient(to bottom, #edf5fb 0%, #f0f2f3 40%, #a9cbe1 100%);
    color: darkcyan;
    font-family: 'bahn';
    text-align: center;
    font-size: 0.8em;
}
div#counter {
    color: #3f76d7;
    font-size: 0.9rem;
    font-weight: bold;
}
.topinttitolo {
    display: block;
    text-align: center;
    font-style: normal;
    font-size: 1.1em;
    font-family: fontawesome,bahn,verdana,arial;
}
.topinttitolo::before {
    content: "» ";
    color: goldenrod;
    font-size: 1.3em;
    line-height: 1em;
    text-shadow: 0px 1px 0px #010203;
}
.topinttitolo::after {
    content: " «";
    color: goldenrod;
    font-size: 1.3em;
    line-height: 1em;
    text-shadow: 0px 1px 0px #010203;
}
.mmenu, .smenu {
    position: relative;
    border: 1px solid #111;
    bottom: 0px;
    font-family: fontawesome, bahn,arial;
    color: navy;
    cursor: pointer;
}
.mmenu {
    padding: 2px 2px 2px 0px;
    background: #97c2c3;
    border-radius: 5px 5px;
    box-shadow: 0px 1px 1px #dddddd inset;
    font-family: 'FontAwesome', swiss, bahn, arial;
    font-size: 0.81em;
    font-weight: bold;
    min-width: 44px;
    min-height: 26px;
    display: inline-table;
    position: relative;
    transition-duration: 0.5s;
    border: 1px solid #49757d;
}
.mmenu2 {
    /* padding: 5px 5px 7px 5px; */
    background: repeating-linear-gradient(139deg, #fbfdfd, #86f3d04f 100%);
    border-radius: 5px;
    box-shadow: 0px 0px 3px #91cd96 inset;
    text-shadow: 0px 1px #eee;
    border: 1px solid #0b8513;
    display: flex;
    margin: 2px;
    flex-direction: row;
    cursor: pointer;
    transition-duration: 0.5s;
}
.mmenu2.selected {
    /* padding: 5px 5px 7px 5px; */
    background: repeating-linear-gradient(179deg, #e6efa9, #86ccf375 61px);
    border-radius: 5px;
    box-shadow: 0px -2px 3px #4b9952 inset;
    text-shadow: 0px 1px #eee;
    border: 1px solid #0b8513;
}

.mmenu2:hover {
    border: 1px solid green;
    background: #fefefe;
    box-shadow: 0px 0px 5px #0eaf1b inset;
}
.mmenu2t {
    color: #056312;
    display: inline-flex;
    align-content: center;
    align-items: center;
    padding: 5px;
    font-family: verdana, arial;
    font-weight: bold;
}
.mmenu2i {
    /* background: cadetblue; */
    padding: 2px  1px 3px 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.smenu {
    padding: 3px 5px 5px 5px;
    background: #f3f3d5;
    border-radius: 5px;
    box-shadow: 0px -1px 2px #555 inset;
    text-shadow: 0px 1px #eee;
    border: 1px solid #ccc;
}
span.smenu:hover {
    border: 1px solid green;
    box-shadow: 0px 0px 4px green inset;
    color: #815e07;
}
.selected {
    border: 1px solid #ffb30e;
    /* border-bottom: 1px solid #eef5fa; */
    /* border-radius: 5px 5px 0 0; */
    background: #f5f2c8;
    /* bottom: -2px; */
    /* padding: 1px 5px 2px 5px; */
}
span.smenu.selected {
    background: #47d7a7;
    border-radius: 5px;
    padding: 1px 5px 0px 5px;
    border: 1px solid darkgreen;
    box-shadow: 0px 1px 2px #fff inset;
}
span.smenu2.selected {
    background: #47d7a7;
    border-radius: 5px;
    padding: 1px 5px 0px 5px;
    border: 1px solid darkgreen;
    box-shadow: 0px 1px 2px #fff inset;
}
.mmenui {
    color: #10730f;
    text-shadow: 0px 1px 0px #fff;
    padding: 1px 0px 0px 3px;
    margin-right: 4px;
}
.mmenu:hover {
    color: blue;
    background: aliceblue;
    border: 1px solid #35359b;
    /* border-bottom: 1px solid aliceblue; */
    box-shadow: 0px 0px 5px cyan;
}
.mainmenu table {
    position: relative;
    /* bottom: 1px; */
    top: 1px;
}
.mainmenu td {
    position: relative;
    text-shadow: 0px 1px #8bd9d9;
}
/* Stile per l'area centrale che occupa tutto lo spazio rimanente */
.middle {
    flex: 1;
    /* border: 1px solid cadetblue; */
    color: darkgoldenrod;
    /* margin-top: 1px; */
    /* margin-bottom: 1px; */
}
#content {
    position: absolute;
    display: none;
}
#dimensione {
    position: absolute;
    display: block;
    right: 1px;
    bottom: 1px;
    background: darkgoldenrod;
    color: #232324;
    padding: 1px 4px;
    font-size: 0.6em;
    border: 1px solid #565;
}
div#mainareaint {
    position: relative;
    padding: 1px 4px;
    color: gold;
    border-left: 1px solid #444;
    border-right: 1px solid #444;
    box-shadow: 0px 0px 7px #447 inset;
    background: #080709;
    border-radius: 0px 0px 7px 7px;
    max-height: 85vh;
    overflow: auto;
}
.mainmenu {
    position: absolute;
    display: block;
}
.menubutton {
    display: inline-block;
    cursor: pointer;
    background: transparent;
    border: 2px groove #33875b;
    border-radius: 3px;
    padding: 2px 5px;
    color: aquamarine;
    text-shadow: 0px 1px #111;
    font-weight: bold;
    line-height: normal;
    /* border-top-style: double; */
}
.menubutton:hover {
    color: aliceblue;
    background: #fefefe22;
    border: 2px groove #23d1a7;
}
#intestazione {
    display: flex;
    flex-direction: row;
    position: relative;
    background: transparent;
    border: 0px;
    color: goldenrod;
    padding: 0px 0px 1px 44px;
    margin-top: 4px;
    text-align: left;
    justify-content: flex-start;
    font-style: italic;
    font-weight: bold;
    align-content: center;
    align-items: flex-start;
    min-height: 20px;
    overflow: visible;
}
#status {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    position: absolute;
    align-items: flex-end;
    right: 7px;
    bottom: 0;
}
#username {
    font-size: 0.8em;
    display: block;
    position: absolute;
    bottom: 14px;
    z-index: 1;
    color: #fcff7cd6;
    background: #000a53;
    padding: 0px 3px 1px 3px;
    border-radius: 0px 0px 5px 5px;
    border: 1px solid #292828;
    width: 100%;
    text-align: center;
}
#statutente {
    display: flex;
    flex-direction: row;
    font-style: normal;
}
#utentionline, 
#msgunread {
    width: 35px;
    cursor: pointer;
}
#utentionline:hover, 
#msgunread:hover {
    color: white;
}
#datacorrente, 
#utentionline, 
#msgunread {
    position: relative;
    color: #3fb7b7;
    right: 1px;
    background: #242526;
    font-size: 0.7em;
    padding: 1px 4px 2px 4px;
    bottom: -1px;
    border: 1px solid #445;
    border-bottom: 0px;
    border-radius: 5px 5px 0px 0px;
    margin-left: 2px;
    box-shadow: 0px 2px 3px #000 inset;
}
#utentionlineval { 
	color: lightgreen; 
    text-align: right;
    position: absolute;
    right: 4px;
}
#msgunreadval {
    color: moccasin;
    text-align: right;
    position: absolute;
    right: 4px;
}

/*
	================
	FONT DEFINITIONS 
	================
*/
@font-face {
	font-family: 'Axettac';
	src: url('font/Axettac Demo.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'GeoSlab';
	src: url('font/tt1019m_.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'GeoSlab';
	src: url('font/tt1020m_.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}	
@font-face {
	font-family: 'Swiss';
	src: url('font/tt0009m_.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'Swiss';
	src: url('font/tt0172m_.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
}	
@font-face {
	font-family: 'Swiss';
	src: url('font/tt0010m_.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}	
@font-face {
	font-family: 'Swiss';
	src: url('font/tt0172m_.ttf') format('truetype');
	font-weight: bold;
	font-style: italic;
}	
@font-face {
	font-family: 'Impact';
	src: url('font/impact.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'Rave';
	src: url('font/rave.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'FontAwesome';
	src: url('font/fontawesome-webfont.ttf?v=4.5.0') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'lcd';
	src: url('font/lcd-bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}	
@font-face {
	font-family: 'bahn';
	src: url('font/bahn.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}	
@font-face {
	font-family: 'bahn';
	src: url('font/bahn.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'dominican';
	src: url('font/DOMIN___.TTF') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'carnevalee';
	src: url('font/carnevalee.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'Offen';
	src: url('font/offenbacher.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'Exotic';
	src: url('font/Exotc350 DmBd BT Demi-Bold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'Exotic';
	src: url('font/Exotc350 Bd BT Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}	
@font-face {
	font-family: 'Bronice';
	src: url('font/Bronice Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}	
@font-face {
	font-family: 'Bronice';
	src: url('font/Bronice Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}	
/* 
    BOX STANDARD  ------------------------------ 
*/
.box_container {
    display: inline-block;
    position: relative;
    border: 1px solid #1e80b7;
    border-radius: 5px;
    border-style: outset;
    height: max-content;
    margin-bottom: 2px;
    margin-top: 2px;
}
span.box_titolo {
    display: block;
    position: relative;
    padding: 3px 30px 2px 25px;
    font-family: 'bahn';
    font-size: 1em;
    color: gold;
    border-radius: 5px 5px 0 0;
    border: 2px solid #135f7b;
    background: #0d2d3d;
    box-shadow: 0px 1px 4px #010101 inset;
    text-shadow: 0px 1px #010101;
}
span.box_titolotext {
    display: inline-block;
    position: relative;
    font-family: fontawesome,'bahn';
    font-size: 1em;
    color: gold;
    text-shadow: 0px 1px #010101;
}
span.box_icona {
    position: absolute;
    top: 4px;
    left: 5px;
    color: darkorange;
    font-size: 0.9em;
}
span.box_opzclose {
    display: block;
    position: absolute;
    right: 3px;
    top: 2px;
    font-size: 1.1em;
    font-family: 'FontAwesome', arial;
    color: #8b0b0b;
    text-shadow: 0px 0px 3px #eee;
    cursor: pointer;
    background: #efefef;
    border-radius: 9px;
    padding: 0px 1px 0px 1px;
    box-shadow: 0px 0px 4px #111 inset;
}
.box_opzclose {
    display: block;
    position: absolute;
    right: 3px;
    top: 0px;
    font-size: 1.1em;
    font-family: 'FontAwesome', arial;
    color: #c71111;
    text-shadow: 0px 0px 3px #771e1e;
    cursor: pointer;
}
.box_opzclose:hover {
    color: #ff0000;
    box-shadow: 0px 0px 4px #fefefe inset;
}
span.box_content {
    display: block;
    position: relative;
    border-right: 2px solid;
    border-left: 2px solid;
    border-color: #135f7b;
    padding: 1px 4px;
    background: #135f7b;
    font-family: bahn,arial;
    text-shadow: 0px 1px 2px #111;
    box-shadow: 0px 0px 5px inset #111;
    text-align: center;
}
span.box_baropts {
    display: block;
    position: relative;
    background: #175777;
    text-align: right;
    padding: 2px 2px;
    border-radius: 0 0 5px 5px;
    border: 2px solid #135f7b;
    box-shadow: 0px 1px 4px #010101 inset;
}
span.box_mnuopzs {
    display: inline-flex;
    position: relative;
    padding: 2px 4px;
    font-size: 1rem;
    font-family: fontawesome, bahn, arial;
    color: #ffaf48;
    border: 1px solid #011016;
    border-radius: 4px;
    margin-left: 2px;
    background: #22222211;
    text-shadow: 0px 1px 2px #111;
    box-shadow: 0px -2px 5px #111 inset;
    cursor: pointer;
    align-content: center;
    /* flex-direction: row; */
    align-items: center;
}
span.box_mnuopzs:hover {
    color: yellow;
    background: #aaa4;
    text-shadow: 0px 1px 2px #111;
    box-shadow: 0px -2px 5px #111 inset;
    cursor: pointer;
}
span.box_opzicona {
    position: relative;
    color: #dbd258;
    font-size: 0.9em;
}
span.box_opztesto {
    position: relative;
    color: #dfaf2f;
    /* font-size: 0.9em; */
    margin-left: 4px;
    font-weight: bold;
    font-family: swiss;
}
.top::before,
span.box_titolo::before, 
span.box_baropts::before, 
span.box_content::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 0.08;
    pointer-events: none;
}
span.box_titolo::before {
    background-image: url('/immagini/sf_002.jpg');
}
span.box_baropts::before {
    background-image: url('/immagini/sf_002.jpg');
}
span.box_content::before {
    background-image: url('/immagini/sf_001.jpg');
}
/* 
    BOX TIPO 2  ------------------------------ 
*/
.box2_container {
    display: inline-block;
    position: relative;
    border: 1px solid #37b71e;
    border-radius: 5px;
    border-style: outset;
    height: max-content;
    margin-bottom: 2px;
    margin-top: 2px;
}
span.box2_titolo {
    display: block;
    position: relative;
    padding: 3px 30px 2px 25px;
    font-family: 'bahn';
    font-size: 1em;
    color: #33b714;
    border-radius: 5px 5px 0 0;
    border: 2px solid #1a7b13;
    background: #0d3d0f;
    box-shadow: 0px 1px 4px #010101 inset;
    text-shadow: 0px 1px #010101;
}
span.box2_titolotext {
    display: inline-block;
    position: relative;
    font-family: fontawesome,'bahn';
    font-size: 1em;
    color: #31ff00;
    text-shadow: 0px 1px #010101;
}
span.box2_icona {
    position: absolute;
    top: 4px;
    left: 5px;
    color: #edd717;
    font-size: 0.9em;
}
span.box2_opzclose {
    display: block;
    position: absolute;
    right: 3px;
    top: 2px;
    font-size: 1.1em;
    font-family: 'FontAwesome', arial;
    color: #8b0b0b;
    text-shadow: 0px 0px 3px #eee;
    cursor: pointer;
    background: #efefef;
    border-radius: 9px;
    padding: 0px 1px 0px 1px;
    box-shadow: 0px 0px 4px #111 inset;
}
.box2_opzclose {
    display: block;
    position: absolute;
    right: 3px;
    top: 0px;
    font-size: 1.1em;
    font-family: 'FontAwesome', arial;
    color: #c71111;
    text-shadow: 0px 0px 3px #771e1e;
    cursor: pointer;
}
.box2_opzclose:hover {
    color: #ff0000;
    box-shadow: 0px 0px 4px #fefefe inset;
}
span.box2_content {
    display: block;
    position: relative;
    border-right: 2px solid;
    border-left: 2px solid;
    border-color: #2b7b13;
    padding: 1px 4px;
    background: #9dcdac;
    font-family: bahn,arial;
    font-weight: bold;
    font-size: 1.0em;
    line-height: 1.3em;
    text-shadow: 0px 1px 2px #fffcfc;
    box-shadow: 0px 0px 5px inset #111;
    color: darkgreen;
}
span.box2_baropts {
    display: block;
    position: relative;
    background: #269320;
    text-align: right;
    padding: 2px 2px;
    border-radius: 0 0 5px 5px;
    border: 2px solid #1a7b13;
    box-shadow: 0px 1px 4px #010101 inset;
}
span.box2_mnuopzs {
    display: inline-block;
    position: relative;
    padding: 2px 5px 2px 22px;
    font-size: 0.9em;
    font-family: fontawesome, arial;
    color: #ffaf48;
    border: 1px solid #011016;
    border-radius: 4px;
    margin-left: 2px;
    background: #22222211;
    text-shadow: 0px 1px 2px #111;
    box-shadow: 0px -2px 5px #111 inset;
    cursor: pointer;
}
span.box2_mnuopzs:hover {
    color: yellow;
    background: #aaa4;
    text-shadow: 0px 1px 2px #111;
    box-shadow: 0px -2px 5px #111 inset;
    cursor: pointer;
}
span.box2_opzicona {
    position: absolute;
    left: 5px;
    top: 3px;
    color: #dbd258;
    font-size: 0.9em;
}
/* ========================================= */
input, select {
    background: #ffffff47;
    color: #fff4e6;
}
input:focus, select:focus {
   background: aliceblue;
	color: navy;
}
.buttonpay {
    font-family: fontawesome,bahn,arial;
    font-size: 1.2em;
    font-weight: bold;
    background: gold;
    color: blue;
    cursor: pointer;
    border: 2px solid goldenrod;
    border-radius: 10px;
    display: inline-block;
    padding: 3px 15px;
    box-shadow: 0px 1px 2px #010101 inset;
    text-shadow: 0px 1px #fefefe;
}
.buttonpay:hover {
	background: #f0f8f1;
}
.dologout {
    background: #5e5f5ebd;
    padding: 1px 3px;
    border-radius: 5px;
    cursor: pointer;
}
.splitv {
    display: flex;
    position: relative;
    width: 95%;
    overflow: hidden;
    align-items: flex-start;
    justify-content: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
}
.button02 {
    font-family: bahn,verdana,arial;
    font-weight: bold;
    font-size: 1.1em;
    color: #fddc2b;
    background: #0c9f19;
    border-radius: 10px;
    padding: 5px 10px;
    border: 2px solid darkgreen;
    box-shadow: 0px 1px 4px #111 inset;
    cursor: pointer;
    text-shadow: 0px 1px 0px #1a2902;
}
input.button02:hover {
    background: aliceblue;
    color: #0f5f02;
    border: 2px solid yellow;
    text-shadow: 0px 1px 0px #94eb07;
}
/* ANIMAZIONE CON MOVIMENTO ORIZZONTALE E CAMBIO COLORE */
.animazione {
    font-size: 2.2em;
    position: relative;
    animation: muovi 4s infinite;
    display: inline-block;
    color: yellow;
    margin-right: 9px;
}
@keyframes muovi {
0% {
    left: 0;
    text-shadow: none;
    color: transparent;
    text-shadow: 0px 1px 2px transparent;
}
40% {
    left: 15px;
    color: #edd083;
    text-shadow: 0px 1px 2px #111;
}
50% {
    left: 20px;
    color: #edd083;
    text-shadow: 0px 1px 2px #111;
}
60% {
    left: 15px;
    color: #edd083;
    text-shadow: 0px 1px 2px #111;
}
100% {
    left: 0;
    text-shadow: none;
    color: transparent;
    text-shadow: 0px 1px 2px transparent;
}
}
/* ANIMAZIONE CON GIRO DI 360° E LAMPEGGIO */
.anim_rot_down {
    animation: rot_down 3s infinite;
    display: inline-block;
}
@keyframes rot_down {
0% {
	color: transparent;
    text-shadow: none;
	transform: rotate(0deg);
}
50% {
	color: darkgreen;
	transform: rotate(360deg);
}
60% {
	color: white;
	transform: rotate(360deg);
}
70% {
	color: #67f300;
	transform: rotate(360deg);
}
80% {
	color: white;
	transform: rotate(360deg);
}
90% {
	color: #67f300;
	transform: rotate(360deg);
}
100% {
	color: transparent;
    text-shadow: none;
	transform: rotate(360deg);
}
}
/* ANIMAZIONE CON GIRO DI 180° E LAMPEGGIO */
.anim_rot_down5s {
    animation: rot_down5 5s infinite;
    display: inline-block;
}
@keyframes rot_down5 {
0% {
	color: transparent;
    text-shadow: none;
	transform: rotate(0deg);
}
20% {
	color: rgb(8, 46, 82);
	transform: rotate(180deg);
}
30% {
	color: white;
	transform: rotate(180deg);
}
50% {
	color: gold;
	transform: rotate(360deg);
}
90% {
	color: white;
	transform: rotate(360deg);
}
100% {
	color: transparent;
    text-shadow: none;
	transform: rotate(360deg);
}
}

/* ANIMAZIONE CON MOVIMENTO DENTRO BOX */
.anim_moveinside {
    animation: moveinside 3s infinite;
    display: inline-block;
    margin-left: 96px;
    font-family: rave;
    font-size: 1.3em;
    letter-spacing: 0.1em;
    margin-top: 4px;
    text-shadow: 0px 1px 3px #010101;
}
@keyframes moveinside {
0% {
	color: #67f300;
	padding: 3px 0px 0px 10px;
	transform: rotate(0deg);
}
50% {
	color: darkgreen;
	padding: 0px 10px 3px 0px;
	transform: rotate(2deg);
}
60% {
	color: white;
	transform: rotate(0deg);
}
70% {
	color: #67f300;
	transform: rotate(-2deg);
}
80% {
	color: white;
	padding: 0px 10px 3px 0px;
	transform: rotate(2deg);
}
90% {
	color: #67f300;
	transform: rotate(-2deg);
}
100% {
	color: #67f300;
	padding: 3px 0px 0px 10px;
	transform: rotate(0deg);
}
}

.info {
    font-family: fontawesome,swiss,arial;
    font-weight: bold;
    font-size: 0.9rem;
    color: #c8cecf;
    text-align: justify;
    padding: 2px 5px 2px 20px;
    border: 2px solid #1f8487;
    border-radius: 5px;
    position: relative;
    background: #073f7145;
    box-shadow: 0px 0px 5px #010203;
}
.info::before {
    content: "";
    padding-right: 5px;
    color: #8af393;
    font-size: 1.4rem;
    vertical-align: top;
    position: absolute;
    left: -2px;
    top: -3px;
    text-shadow: 0px 0px 3px #010101;
}
button.mx_btn {
    border: 1px solid #013459;
    background: #044343;
    color: beige;
    font-family: fontawesome,swiss,arial;
    border-radius: 5px;
    box-shadow: 0px 1px 4px inset cyan;
    padding: 4px 5px;
    position: relative;
    cursor: pointer;
    z-index: 12;
}
button.mx_btn:hover {
    border: 1px solid cyan;
    color: white;
    background: #056969;
}