.textos {
    font-family: Tahoma;
    font-size: 11px;
    color: #484848;
    text-decoration: "none";
    height: 21px;
}

input {
    padding: 3px 3px 3px 3px;
    border: 1px solid #D4D4D4;
    border-radius: 4px;
    transition: 0.2s ease-out;
    font-family: 'Open Sans', sans-serif;
    color: #999;
}

textarea {
    padding: 3px 3px 3px 3px;
    border: 1px solid #D4D4D4;
    border-radius: 4px;
    transition: 0.2s ease-out;
    font-family: 'Open Sans', sans-serif;
    color: #999;
}

    input[type=text]:focus, textarea:focus {
        background-color: #FFFFE0;
        border: 1px solid #ccc;
    }

select {
    padding: 3px 3px 3px 3px;
    border: 1px solid #D4D4D4;
    border-radius: 4px;
    transition: 0.2s ease-out;
    font-family: 'Open Sans', sans-serif;
    color: #999;
}

    select:focus {
        background-color: #FFFFE0;
        border: 1px solid #ccc;
    }

.rows {
    background-color: #fff;
    min-height: 18px;
    border: 1px solid #D4D4D4;
    font-size: 10px;
}

.rowsN {
    border: 1px solid #ffffff;
    font-size: 10px;
    padding: 3px;
}

.Grid th {
    color: #fff;
    background-color: #bf0000;
}

.Grid, .Grid th, .Grid td {
    border: 1px solid #D4D4D4;
    font-size: 10px;
    padding: 3px;
}

.GridHD th {
    color: #fff;
    background-color: #444;
    height: 23px;
}

.Grid tr:hover {
    background-color: #eeeeee;
}

input[type="button"], input[type="submit"], button {
    padding: 3px 3px 3px 3px;
    border: 1px solid #D4D4D4;
    border-radius: 4px;
    transition: 0.2s ease-out;
    font-family: 'Open Sans', sans-serif;
    color: #6a6a6a;
    background-color: #f3f3f3;
}

​

#btnDetalleCC {
    border-radius: 10px;
    background-color: royalblue;
    border-color: royalblue;
}

.FixedHeader {
    position: absolute;
    font-weight: bold;
}

.codigo_barras {
    font-family: Code39-Digits;
    font-size: 40px;
}

.textos_lavado {
    font-family: Calibri;
    font-size: 19px;
    color: #000000;
    text-decoration: "none";
}

.textos_blancos {
    font-family: Arial;
    font-size: 14px;
    color: #FFFFFF;
    text-decoration: "none";
}

.textos_cajas {
    font-size: 11px;
    color: #6a6a6a;
    font-family: Arial;
    text-align: right;
}

.textos_impresion {
    font-size: 11px;
    color: #000000;
    font-family: Times New Roman;
}

.textovertical {
    background: #BF0000;
    vertical-align: text-top;
    vertical-align: top;
    writing-mode: tb-rl;
}

.textos_dibujo {
    font-family: Tahoma;
    font-size: 11px;
    color: #6a6a6a;
    text-decoration: "none";
}

.tablas {
    font-family: Tahoma;
    color: #264752;
    /*font:Univers 57 Condensed;*/
    font-size: 10px;
    text-transform: lowercase;
}

.cumpleanos {
    color: #264752;
    font: Univers 57 Condensed;
    font-size: 11px;
    text-transform: lowercase
}

.titulos_intra {
    font-size: 11px;
    font-family: Univers 57 Condensed;
}

.textos_mayusculas {
    font-size: 11px;
    /*font-weight:bold;*/
    color: #6a6a6a;
    font-family: Tahoma;
    text-transform: uppercase;
}

#message {
    font-family: Arial,Helvetica,sans-serif;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 105;
    text-align: center;
    font-weight: bold;
    font-size: 100%;
    color: black;
    padding: 10px 0px 10px 0px;
    background-color: #EFEFEF;
}

    #message span {
        text-align: center;
        width: 95%;
        float: left;
    }

.close-notify {
    white-space: nowrap;
    float: right;
    margin-right: 10px;
    color: #black;
    text-decoration: none;
    border: 2px #black solid;
    padding-left: 3px;
    padding-right: 3px;
}

    .close-notify a {
        color: #fff;
    }


.jquery-notify-bar {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 32768;
    background-color: #efefef;
    font-size: 18px;
    color: #000;
    text-align: center;
    font-family: Arial, Verdana, sans-serif;
    padding: 20px 0px;
    border-bottom: 1px solid #bbb;
    cursor: pointer;
}

    .jquery-notify-bar.error {
        color: #f00;
        background-color: #fdd;
    }

    .jquery-notify-bar.success {
        color: #060;
        background-color: #BBFFB6;
    }

.notify-bar-close {
    position: absolute;
    left: 95%;
    font-size: 11px;
}

.drp_pagina {
    font-family: Tahoma;
    font-size: 12px;
    color: #6a6a6a;
    text-decoration: "none";
    /*text-transform:lowercase*/
}

.titulos {
    font-family: Tahoma;
    font-size: 14px;
    color: #6a6a6a;
    text-decoration: "none";
    font-weight: bold
    /*text-transform:lowercase*/
}

.item {
    background: url(../imagenes/item_bg.gif);
    height: 129px;
    width: 170px;
}

.titulo_mas_grande {
    font-family: Tahoma;
    font-size: 18px;
    color: #000000;
    text-decoration: "none";
    font-weight: bold
    /*text-transform:lowercase*/
}

.textos_imp {
    font-family: Tahoma;
    font-size: 11px;
    color: #000000;
    text-decoration: "none";
    /*text-transform:lowercase*/
}

.textos_clausula {
    font-size: 14px;
    /*font-weight:bold;*/
    color: #000000;
    font-family: Arial;
}



.innerpage3 {
    font: normal 9px "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
    color: #6a6a6a;
    background-color: inherit;
}

.innerpage2 {
    font: normal 11px "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
    color: #6a6a6a;
    background-color: inherit;
}


.textos_arial_2 {
    font-size: 11px;
    /*font-weight:bold;*/
    color: #6a6a6a;
    font-family: Arial;
    text-transform: lowercase;
}

.textos_arial {
    font-size: 11px;
    /*font-weight:bold;*/
    color: #333;
    font-family: Arial;
}

.yui .ajax__calendar_container {
    background-color: #eeeeee;
    border: solid 1px #cccccc;
    font-family: tahoma;
    cursor: default;
    width: 205px;
    font-size: 11px;
    text-align: center;
    padding: 0px;
    /* filter:alpha(opacity=50);
    opacity:0.5;*/
}

.yui .ajax__calendar_body {
    height: 139px;
    width: 205px;
    position: relative;
    overflow: hidden;
}

.yui .ajax__calendar_days, .yui .ajax__calendar_months, .yui .ajax__calendar_years {
    top: 0px;
    left: 0px;
    height: 139px;
    width: 195px;
    padding: 5px;
    position: absolute;
    text-align: center;
}

    .yui .ajax__calendar_days table {
        border-spacing: 0;
        border-collapse: collapse;
        font: 100% tahoma;
        text-align: center;
    }

.yui .ajax__calendar_header {
    background: url(imagenes/sprite.png) repeat-x 0 0;
    height: 22px;
    width: 100%;
    font-size: 10pt;
    font-weight: bold;
    text-align: center;
    padding-top: 3px;
}

.yui .ajax__calendar_prev {
    margin-top: 2px;
    margin-left: 4px;
    height: 15px;
    width: 25px;
    cursor: pointer;
    float: left;
    background: url(imagenes/sprite.png) 0px -450px no-repeat;
}

.yui .ajax__calendar_next {
    margin-top: 2px;
    margin-right: 4px;
    height: 15px;
    width: 25px;
    cursor: pointer;
    float: right;
    background: url(imagenes/sprite.png) 0px -500px no-repeat;
}

.yui .ajax__calendar_title {
    cursor: pointer;
    font-weight: bold;
    text-align: center;
}

.yui .ajax__calendar_footer, .yui .ajax__calendar_today {
    display: none;
}

.yui .ajax__calendar_dayname {
    padding-left: 3px;
    padding-right: 3px;
    margin-bottom: 5px;
    margin-left: 2px;
    margin-right: 2px;
    text-align: center;
    font-weight: 700;
    font-size: 10pt;
    color: #000;
    border-bottom: solid 1px #a6a6a6;
}

.yui .ajax__calendar_day, .yui .ajax__calendar_month, .yui .ajax__calendar_year {
    padding: 0px;
    color: #000;
    text-align: center;
    padding: 0pt 2px;
}

.yui .ajax__calendar_hover .ajax__calendar_day, .yui .ajax__calendar_hover .ajax__calendar_month, .yui .ajax__calendar_hover .ajax__calendar_year, .yui .ajax__calendar_hover .ajax__calendar_title {
    color: #0066cc;
}

.yui .ajax__calendar_other .ajax__calendar_day, .yui .ajax__calendar_other .ajax__calendar_year {
    color: #a6a6a6;
}

.yui .ajax__calendar_active .ajax__calendar_day {
    color: red;
    font-weight: bold;
}


.avisos {
    font-weight: bold;
    font-size: 50px;
    font-style: italic;
}

.hdr {
    height: 36px;
    background: transparent url("../imagenes/header_bg.png");
    padding-left: 5px;
    color: #FFFFFF
}

.ListSearchExtenderPrompt {
    font-style: italic;
    color: Red;
    background-color: white;
    height: 25;
    font-size: 14px;
    background-color: Black;
    color: White;
}

.negrita {
    font-weight: bold;
}

.textoArial {
    font-family: Arial, Helvetica, sans-serif;
}

.barra2 {
    background: url(../imagenes/head_bg4.jpg) repeat-x 0px 0px;
}

.barra8 {
    background: url(../imagenes/back_topbar.jpg) repeat-x 0px 0px;
}

.barra9 {
    background: url(../imagenes/back_navbar.jpg) repeat-x 0px 0px;
}

.letracapital:first-letter {
    font-size: 200%;
    font-weight: bold;
    font-family: Tahoma;
    font-size: 11px;
    color: #ff0000;
    text-decoration: "none";
    text-transform: lowercase;
}

body {
    margin: 0;
    padding: 0;
    font: 10px normal Verdana, Arial, Helvetica, sans-serif;
    height: 100%;
}

img {
    border: none;
}

h1 {
    font-size: 1.2em;
    padding: 5px 10px;
    color: #ccc;
    width: 940px;
    margin: 0 auto;
}

    h1 a {
        color: #fff;
    }

    h1 span {
        font-weight: normal;
    }

#footpanel {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 9999; /*--Keeps the panel on top of all other elements--*/
    background: #e3e2e2;
    border: 1px solid #c3c3c3;
    border-bottom: none;
    width: 94%;
    margin: 0 3%;
    /*filter:alpha(opacity=50);*/
}

*html #footpanel { /*--IE6 Hack - Fixed Positioning to the Bottom--*/
    margin-top: -1px; /*--Prevents IE6 from having an infinity scroll bar - due to 1px border on #footpanel--*/
    position: absolute;
    top: expression(eval(document.compatMode &&document.compatMode=='CSS1Compat') ?documentElement.scrollTop+(documentElement.clientHeight-this.clientHeight) : document.body.scrollTop +(document.body.clientHeight-this.clientHeight));
}

    #footpanel ul {
        padding: 0;
        margin: 0;
        float: left;
        width: 100%;
        list-style: none;
        border-top: 1px solid #fff; /*--Gives the bevel feel on the panel--*/
        font-size: 1.1em;
    }

        #footpanel ul li {
            padding: 0;
            margin: 0;
            float: left;
        }

            #footpanel ul li a {
                padding: 5px;
                float: left;
                text-indent: -9999px; /*--For text replacement - Shove text off of the page--*/
                height: 16px;
                width: 16px;
                text-decoration: none;
                color: #333;
                position: relative;
            }

html #footpanel ul li a:hover {
    background-color: #fff;
}

html #footpanel ul li a.active { /*--Active state when sub-panel is open--*/
    background-color: #fff;
    height: 17px;
    margin-top: -2px; /*--Push it up 2px to attach the active button to sub-panel--*/
    border: 1px solid #555;
    border-top: none;
    z-index: 200; /*--Keeps the active link on top of the sub-panel--*/
    position: relative;
}

#footpanel a.tienda {
    background: url(../imagenes/tienda.gif) no-repeat 15px center;
    width: 46px;
    padding-left: 40px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.home {
    background: url(../imagenes/home.gif) no-repeat 15px center;
    width: 36px;
    padding-left: 36px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.cumple {
    background: url(../imagenes/cumple.gif) no-repeat 15px center;
    width: 60px;
    padding-left: 40px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.indi {
    background: url(../imagenes/indi3.gif) no-repeat 10px center;
    width: 58px;
    padding-left: 40px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.help {
    background: url(../imagenes/help.gif) no-repeat 15px center;
    width: 40px;
    padding-left: 40px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.online {
    background: url(../imagenes/online.gif) no-repeat 15px center;
    width: 36px;
    padding-left: 36px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.audio {
    background: url(../imagenes/audio.gif) no-repeat 15px center;
    width: 40px;
    padding-left: 40px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.bol {
    background: url(../imagenes/bol.gif) no-repeat 15px center;
    width: 40px;
    padding-left: 40px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.video {
    background: url(../imagenes/video.gif) no-repeat 15px center;
    width: 40px;
    padding-left: 40px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.portal {
    background: url(../imagenes/portal.gif) no-repeat 15px center;
    width: 88px;
    padding-left: 40px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.portal_ {
    background: url(../imagenes/portal.gif) no-repeat 15px center;
    width: 70px;
    padding-left: 40px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel a.giros {
    background: url(../imagenes/giros.gif) no-repeat 15px center;
    width: 50px;
    padding-left: 40px;
    border-right: 1px solid #bbb;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}


a.indi_old {
    background: url(../imagenes/indi.gif) no-repeat center center;
}

#footpanel a.chat {
    background: url(balloon.png) no-repeat 15px center;
    width: 126px;
    border-left: 1px solid #bbb;
    border-right: 1px solid #bbb;
    padding-left: 40px;
    text-indent: 0; /*--Reset text indent since there will be a combination of both text and image--*/
}

#footpanel li#chatpanel, #footpanel li#alertpanel {
    float: right;
}
/*--Right align the chat and alert panels--*/
#footpanel a small {
    text-align: center;
    width: 70px;
    background: url(../imagenes/pop_arrow.gif) no-repeat center bottom;
    padding: 5px 5px 11px;
    display: none; /*--Hide by default--*/
    color: #fff;
    font-size: 1em;
    text-indent: 0;
}

#footpanel a:hover small {
    display: block; /*--Show on hover--*/
    position: absolute;
    top: -35px; /*--Position tooltip 35px above the list item--*/
    left: 50%;
    margin-left: -40px; /*--Center the tooltip--*/
    z-index: 9999;
}


/*******************************************************************************/
.boton {
    background-color: #7F8085;
    color: #EEEEEE;
    font-family: Tahoma;
    font-size: 11px;
    border-style: solid;
    border-width: 1px
}

.barra {
    background: url(../imagenes/barra3.jpg) repeat-x 0px 0px;
}

.menu {
    border-left: 1px dotted # 000;
    border-bottom: 1px dotted # 000;
    float: right;
    width: 250px;
    background-color: #FF99CC;
    margin: 0px 0px 20px 20px;
}

.textos_pequeños {
    font-family: Tahoma;
    font-size: 11px;
    color: #6a6a6a;
    text-decoration: "none";
    text-transform: lowercase
}

.panel {
    scrollbar-face-color: #CCCCCC;
    scrollbar-arrow-color: #FFFFFF;
    scrollbar-track-color: #E8E8E8;
    scrollbar-shadow-color: '';
    scrollbar-highlight-color: '';
    scrollbar-3dlight-color: '';
    scrollbar-darkshadow-Color: '';
}

.textos_reportes {
    font-family: Tahoma;
    font-size: 10px;
    color: #6a6a6a;
    /*text-transform:lowercase;*/
}

.minusculas {
    text-transform: lowercase;
    font-size: 11px;
}

.titulo_grande {
    font-family: Tahoma;
    font-size: 12px;
    color: #6a6a6a;
    text-decoration: "none";
    font-weight: bold
    /*text-transform:lowercase*/
}

.textoError {
    font-family: Arial, Sans-Serif;
    background-color: #D4340C;
    color: White;
    border-color: White;
    padding: 2px;
    font-size: 11px
}

.textos_seleccionados {
    font-family: Tahoma;
    font-size: 11px;
    color: #FFFFFF;
    text-decoration: "none";
    /*text-transform:lowercase*/
}

.textos_barra {
    font-family: Tahoma;
    font-size: 11px;
    color: #6a6a6a;
    text-decoration: "none";
    /*text-transform:lowercase*/
}

.titulos {
    font-family: Tahoma;
    font-size: 14px;
    color: #6a6a6a;
    text-decoration: "none";
    font-weight: bold
    /*text-transform:lowercase*/
}

.separacion {
    padding: 5px;
}

.titulos_grilla {
    background: url(../imagenes/barra3_foo.jpg);
    border-color: #e0e0e0 #e0e0e0 #e0e0e0 #e0e0e0;
    border-style: solid solid solid solid;
    border-width: 1px 1px 1px 1px;
    color: #000;
    padding: 4px 5px 4px 10px;
    vertical-align: bottom;
    font-size: 20px;
    font-family: Univers 57 Condensed;
    font-size: 11px;
    color: #E8E8E8;
    vertical-align: middle;
    text-align: center;
}

.titulos_menu {
    background: url(../imagenes/sprite.png) repeat-x 0px 0px;
    border-color: #e0e0e0 #e0e0e0 #e0e0e0 #e0e0e0;
    border-style: solid solid solid solid;
    border-width: 1px 1px 1px 1px;
    color: #000;
    padding: 4px 5px 4px 10px;
    vertical-align: bottom;
    text-align: left;
    font-size: 20px;
    font-family: Univers 57 Condensed;
    font-size: 11px;
    color: #6a6a6a;
    vertical-align: middle;
}


/* Accordion */
.accordionHeader {
    /*background: url(../imagenes/barra.jpg) repeat-x 0px 0px;*/
    background-color: #EEEEEE;
    border: 1px solid #CCCCCC;
    color: #6a6a6a;
    font-family: Tahoma;
    font-size: 11px;
    padding: 4px;
    margin-top: 5px;
    cursor: pointer;
    height: 24px;
    /* text-transform:uppercase;*/
}

.accordionHeaderSelected {
    border: 1px solid #CCCCCC;
    background-color: #EEEEEE;
    color: #BF0000;
    font-family: Tahoma;
    font-size: 11px;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;
    /*text-transform:uppercase;*/
}

#master_content .accordionHeader a {
    color: #FFFFFF;
    background: none;
    text-decoration: none;
}

    #master_content .accordionHeader a:hover {
        background: none;
        text-decoration: underline;
    }

#master_content .accordionHeaderSelected a {
    color: #FFFFFF;
    background: none;
    text-decoration: none;
}

    #master_content .accordionHeaderSelected a:hover {
        background: none;
        text-decoration: underline;
    }

.accordionContent {
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    border-top: none;
    padding: 5px;
    padding-top: 10px;
    font: 11px Tahoma;
    font-size: 11px;
    color: #6a6a6a;
}

.modalpopup {
    font-family: arial,helvetica,clean,sans-serif;
    font-size: small;
    padding: 2px 3px;
    display: block;
    position: absolute;
}

.modalBackground {
    background-color: Gray;
    filter: alpha(opacity=50);
    opacity: 0.5;
}

.CajaDialogo {
    background-color: #EFEFEF;
    border-width: 1px;
    border-style: outset;
    border-color: #CCCCCC;
    padding: 2px;
    width: 500px;
    font-family: Tahoma;
    font-size: 11px;
}

.FondoAplicacion {
    background-color: Black;
    filter: alpha(opacity=50);
    opacity: 0.5;
}

.ImageCategoriesNavBar {
    padding: 3px;
}

.Item {
    color: #666666;
    font-family: verdana;
    font-size: 12px;
    border: solid 1px #f3f3f3;
    cursor: pointer;
}

.ItemHover {
    background-color: #E3E3E3;
    color: #666666;
    font-family: verdana;
    font-size: 12px;
    border: solid 1px white;
    border-right-color: #CCCCCC;
    border-bottom-color: #CCCCCC;
    cursor: pointer;
}

.ItemSelected {
    background-color: #E3E3E3;
    color: #666666;
    font-family: verdana;
    font-size: 12px;
    border: solid 1px white;
    border-left-color: #CCCCCC;
    border-top-color: #CCCCCC;
    cursor: default;
}


/*tabs*/
.Thumbnail {
    border: 1px solid #DDDDDD;
    cursor: pointer;
}

.ThumbnailHover {
    border: 1px solid #AAAAAA;
    cursor: pointer;
}

.ThumbnailSelected {
    border: 1px solid #DD3409;
    cursor: pointer;
}

.ScrollItem {
    color: black;
    border: 1px solid #919B9C;
    font-family: MS Sans Serif, Verdana;
    font-size: 10px;
    cursor: pointer;
    height: 71px;
}

.ScrollItemHover {
    color: black;
    border: 1px solid #919B9C;
    background-color: #E3E3E3;
    font-family: MS Sans Serif, Verdana;
    font-size: 10px;
    cursor: pointer;
    height: 71px;
}

.ScrollItemActive {
    color: black;
    background-color: #E3E3E3;
    border: 1px solid #DD3409;
    font-family: MS Sans Serif, Verdana;
    font-size: 10px;
    cursor: pointer;
    height: 71px;
}


fieldset {
    color: #6a6a6a;
    background-color: #f3f3f3;
    padding: 2px;
    border: solid 1px #d3d3d3;
    width: 98%;
}

legend {
    color: #fff;
    font-weight: bold;
    font-size: 11px;
    background-color: #BF0000;
    padding: 2px 6px;
    margin-bottom: 12px;
    border: solid 1px #d3d3d3;
}

grvRV tr.rowHover:hover {
    background-color: Yellow;
    font-family: Arial;
}
/* SCROLL */
::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

::-webkit-scrollbar-track {
    background: #e6e6e6;
    /* border-radius: 10px; */
}

::-webkit-scrollbar-thumb {
    background: #D4001B;
    border-radius: 10px;
}

    ::-webkit-scrollbar-thumb:HOVER {
        background: #D4001B;
    }


.preloader {
    width: 20px;
    height: 20px;
    border: 10px solid #eee;
    border-top: 10px solid #666;
    border-radius: 50%;
    animation-name: girar;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes girar {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}