
body {
    font-size: 13px;
}
/***************************************************************************************************
Columnas */ 

        /*******************************************************************************************
        Flexbox */

            .wk-cols { width: 100%; }

            @media (min-width: 757px) {

                .wk-cols { display: flex; }

                .wk-col.wk-col-1 {flex-basis: 12.5%; max-width: 12.5%; }
                .wk-col.wk-col-2 {flex-basis: 25%; max-width: 25%; }
                .wk-col.wk-col-2e {flex-basis: 50%;  max-width: 50%; }
                .wk-col.wk-col-3 {flex-basis: 37.5%; max-width: 37.5%; }
                .wk-col.wk-col-3e {flex-basis: 33.33%;  max-width: 33.33%; }
                .wk-col.wk-col-4 {flex-basis: 50%; max-width: 50%; }
                .wk-col.wk-col-4e {flex-basis: 25%; max-width: 25%; }
                .wk-col.wk-col-5 {flex-basis: 62.5%; max-width: 62.5%; }
                .wk-col.wk-col-5e {flex-basis: 20%; max-width: 20%; }
                .wk-col.wk-col-6 {flex-basis: 75%; max-width: 75%; }
                .wk-col.wk-col-6e {flex-basis: 16.66%; max-width: 16.66%; }
                .wk-col.wk-col-7 {flex-basis: 87.5%; max-width: 87.5% }
                .wk-col.wk-col-7e {flex-basis: 14.28%; max-width: 14.28%; }
                .wk-col.wk-col-8 {flex-basis: 100%; max-width: 100%; }
                .wk-col.wk-col-8e {flex-basis: 12.5%; max-width: 12.5%; }

                .wk-col {flex: 1; }

            } 

            @media (max-width: 756px) {
                .wk-cols.wk-cols-m { display: flex; }       
            }

                .wk-cols-m .wk-col-1 {flex-basis: 12.5%; }
                .wk-cols-m .wk-col-2 {flex-basis: 25%; }
                .wk-cols-m .wk-col-2e {flex-basis: 50%; }
                .wk-cols-m .wk-col-3 {flex-basis: 37.5%; }
                .wk-cols-m .wk-col-3e {flex-basis: 33.33%; }
                .wk-cols-m .wk-col-4 {flex-basis: 50%; }
                .wk-cols-m .wk-col-4e {flex-basis: 25%; }
                .wk-cols-m .wk-col-5 {flex-basis: 62.5%; }
                .wk-cols-m .wk-col-5e {flex-basis: 20%; }
                .wk-cols-m .wk-col-6 {flex-basis: 75%; }
                .wk-cols-m .wk-col-6e {flex-basis: 16.66%; }
                .wk-cols-m .wk-col-7 {flex-basis: 87.5%; }
                .wk-cols-m .wk-col-7e {flex-basis: 14.28%; }
                .wk-cols-m .wk-col-8 {flex-basis: 100%; }
                .wk-cols-m .wk-col-8e {flex-basis: 12.5%; }

            @media (max-width: 320px) {
                .wk-cols-m .wk-col { flex-basis: 50%; }
            }

            .wk-rows { width: 100%; }
            .wk-rows > * { width: 100%; max-width: initial; display: block; }

        /*******************************************************************************************
        No-flexbox */

            .no-flexbox .wk-cols:after { content: ""; display: table; clear: both; }
            .no-flexbox .wk-col { float: left; box-sizing: border-box; width: 100%; }

            .no-flexbox .wk-col-1 {max-width: 12.5%; }
            .no-flexbox .wk-col-2 {max-width: 25%; }
            .no-flexbox .wk-col-2e {max-width: 50%; }
            .no-flexbox .wk-col-3 {max-width: 37.5%; }
            .no-flexbox .wk-col-3e {max-width: 33.33%; }
            .no-flexbox .wk-col-4 {max-width: 50%; }
            .no-flexbox .wk-col-4e {max-width: 25%; }
            .no-flexbox .wk-col-5 {max-width: 62.5%; }
            .no-flexbox .wk-col-5e {max-width: 20%; }
            .no-flexbox .wk-col-6 {max-width: 75%; }
            .no-flexbox .wk-col-6e {max-width: 16.66%; }
            .no-flexbox .wk-col-7 {max-width: 87.5%; }
            .no-flexbox .wk-col-7e {max-width: 14.28%; }
            .no-flexbox .wk-col-8 {max-width: 100%; }
            .no-flexbox .wk-col-8e {max-width: 12.5%; }

            @media (max-width: 756px) {
                .no-flexbox .wk-cols:not(.wk-cols-m) .wk-col { float: none; max-width: 100%;}
            }

            .no-flexbox .wk-col-m.wk-col-1,
            .no-flexbox .wk-col-m.wk-col-2, 
            .no-flexbox .wk-col-m.wk-col-3, 
            .no-flexbox .wk-col-m.wk-col-4, 
            .no-flexbox .wk-col-m.wk-col-5, 
            .no-flexbox .wk-col-m.wk-col-6, 
            .no-flexbox .wk-col-m.wk-col-7, 
            .no-flexbox .wk-col-m.wk-col-8 {
                float: left !important; 
            }

            .no-flexbox .wk-col-m.wk-col-1 {width: 12.5%; max-width: 12.5%; }
            .no-flexbox .wk-col-m.wk-col-2 {width: 25%; max-width: 25%; }
            .no-flexbox .wk-col-m.wk-col-2e {width: 50%; max-width: 50%; }
            .no-flexbox .wk-col-m.wk-col-3 {width: 37.5%; max-width: 37.5%; }
            .no-flexbox .wk-col-m.wk-col-3e {width: 33.33%; }
            .no-flexbox .wk-col-m.wk-col-4 {width: 50%; max-width: 50%; }
            .no-flexbox .wk-col-m.wk-col-4 {width: 25%; max-width: 25%; }
            .no-flexbox .wk-col-m.wk-col-5 {width: 62.5%; max-width: 62.5%; }
            .no-flexbox .wk-col-m.wk-col-5e { max-width: 20%; }
            .no-flexbox .wk-col-m.wk-col-6 {width: 75%; max-width: 75%; }
            .no-flexbox .wk-col-m.wk-col-6e {width: 16.66%; max-width: 16.66%; }
            .no-flexbox .wk-col-m.wk-col-7 {width: 87.5%; max-width: 87.5%; }
            .no-flexbox .wk-col-m.wk-col-7e {width: 14.28%; max-width: 14.28%; }
            .no-flexbox .wk-col-m.wk-col-8 {width: 100%; max-width: 100%; }
            .no-flexbox .wk-col-m.wk-col-8e {width: 12.5%; max-width: 12.5%; }



/***************************************************************************************************
Flex items*/

    .wk-flex-item { display: flex; } 
        /* Flex direction */
            .wk-flex-column { flex-direction: column; } 
            .wk-flex-column-reverse { flex-direction: column-reverse; } 
            .wk-flex-row { flex-direction: row; } 
            .wk-flex-row-reverse { flex-direction: row-reveser; }
        /* Flex justify */
            .wk-flex-justify-center { justify-content: center; } 
            .wk-flex-justify-start { justify-content: flex-start; } 
            .wk-flex-justify-end { justify-content: flex-end; } 
            .wk-flex-justify-around { justify-content: space-around; } 
            .wk-flex-justify-between { justify-content: space-between; } 
            .wk-flex-justify-initial { justify-content: initial; } 
            .wk-flex-align-center { align-items: center; } 
        /* Flex align */
            .wk-flex-align-start { align-items: flex-start; } 
            .wk-flex-align-end { align-items: flex-end; } 
            .wk-flex-align-baseline { align-items: baseline; } 
            .wk-flex-align-strech { align-items: strech; } 
            .wk-flex-align-initial { align-items: initial; } 
        /* Flex wrap */
            .wk-flex-wrap { flex-wrap: wrap; } 
            .wk-flex-nowrap { flex-wrap: nowrap; } 
            .wk-flex-wrap-reverse { flex-wrap: wrap-reverse; } 
            .wk-flex-wrap-initial { flex-wrap: initial; }
        /* Flex length */
            .wk-flex-length-1 { flex: 1; } 
            .wk-flex-length-1-auto { flex: 1 auto; } 
        /* No flex-box*/
            .no-flexbox .wk-flex-item > * { display: inline-block; }
            .no-flexbox .wk-flex-justify-center { text-align: center; }
            .no-flexbox .wk-flex-justify-start { text-align: left; }
            .no-flexbox .wk-flex-justify-end { text-align: right; }

/***************************************************************************************************
Text align */

        .wk-text-right {text-align: right; }
        
        .wk-text-left {text-align: left; }
        
        .wk-text-center {text-align: center; }


/***************************************************************************************************
Inine - block */

        .wk-block-item {display: block; }

        .wk-inline-item {display: inline; }

        .wk-inline-block-item {display: inline-block; }


/***************************************************************************************************
Sidebar */

        @media all and (min-width: 757px) {
            
            .wk-sidebar {
            max-width: 256px;
            }
        }

/***************************************************************************************************
Imágenes */
      
        .wk-img-responsive {
        width: 100%;
        height: auto;
        }

/***************************************************************************************
Botones */
        button, input[type="submit"], .wk-button, .wk-button-o {
            font-family: inherit;
            font-size: inherit;
            color: inherit;
            text-decoration: inherit;
            padding: 6px 12px;
            margin: 12px 6px;
            background-color: gainsboro;
            box-shadow: 1px 1px 2px rgba(0,0,0,0.25);
            border: 0;
            border-radius: 3px;
            cursor: pointer;
            transition: all .25s linear;
        }
        
             input[type="submit"].wk-button-o,
            .wk-button-o {
                background-color: initial;
                border: 1px solid gainsboro;
                box-shadow: initial;
            }

        button:hover, 
        input[type="submit"]:hover,
        .wk-button:hover,
        .wk-button-o:hover {
            color: white;
            background-color: dodgerblue;
        }
        
            input[type="submit"].wk-button-o:hover,
            .wk-button-o:hover {
                color: inherit;
                background-color: initial;
                border: 1px solid gray;
                box-shadow: initial;
            }

                button .icon, 
                input[type="submit"] .icon, 
                .wk-button .icon, 
                .wk-button-o .icon, 
                .button .icon {
                font-size: 12px; 
                line-height: 2;
                opacity: .5;
                }

/***************************************************************************************************
Inputs */

        input[type="text"],
        input[type="text"],
        input[type="number"],
        input[type="password"] {
            height: 24px;
        }
        input[type="text"],
        input[type="number"],
        input[type="password"],
        textarea {
            padding: 0px 6px;
            margin: 12px 0;
            border-color: gainsboro;
            border-width: 1px;
            border-style: solid;
            border-radius: 2px;
        }

          textarea {
          display: block;
          }

/***************************************************************************************************
switches */

        .wk-checkbox,
        .wk-radio {
            display: none !important;
        }

        .wk-checkbox-label,
        .wk-radio-label {
            background-color: transparent;
            border-color: gainsboro;
            border-style: solid;
            border-width: 2px;
            border-radius: 20px;
            display: inline-block;
            vertical-align: middle;
            cursor: pointer;
            padding: 0px 2px;
            display: inline-flex;
            align-items: center;
            justify-content: flex-start;
            transition: .25s linear;
        }


        .wk-checkbox-label {
            width: 32px;
            height: 16px;    
        }

        .wk-radio-label {
            width: 14px;
            height: 16px;
            border-width: 1px;    
            justify-content: center;
        }


        .wk-checkbox + label i,
        .wk-radio + label i {
            background-color: #adadad;
            display: inline-block;
            border-radius: 22px;
            transition: .25s linear;
        }

        .wk-checkbox + label i {
            width: 14px;
            height: 14px;
        }

        .wk-radio + label i {
            width: 9px;
            height: 9px;
        }


        .wk-checkbox:checked + label i,
        .wk-radio:checked + label i {
            background-color: dodgerblue;
        }
       
        .wk-checkbox:checked + label i {
            transform: translateX(18px);
        }

        .no-flexbox .wk-checkbox:checked + label i {
            left: 20px;
        }

        .no-flexbox .wk-checkbox-label,
        .no-flexbox .wk-radio-label {
            position: relative;
        }    
        
        .no-flexbox .wk-checkbox + label i,
        .no-flexbox .wk-radio + label i {
            position: absolute;
            left: 2px;
            top: 1px;
        }

        .no-flexbox .wk-radio-label i {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;
        }

/***************************************************************************************************
'000' */

       


/***************************************************************************************************
Tabs */

        .tab-content-top,
        .tab-content-bottom,
        .tab-content-right,
        .tab-content-left {
              clear: both;
        }
              /* Left align*/
            .tab-content-left .wk-tabs {
            float: left;
            width: 120px;
            }

            .tab-content-left .wk-tabgroup {
            float: right;
            width: calc(100% - 120px);
            }

          /* Right align*/
            .tab-content-right .wk-tabs {
            float: right;
            width: 120px;
            }

            .tab-content-right .wk-tabgroup {
            float: left;
            width: calc(100% - 120px);
            }

          /* Top align */
            .tab-content-top .wk-tabs li {
            display: inline-block;
            }

              .wk-tabs {
          margin: 0;
          background: #ddd;
          }

          .wk-tabgroup {
          min-height: 300px;
          }

          .wk-tabs li {
          margin: 0;
          }

          .wk-tabs li a {
          display: block;
          padding: 12px;
          color: #888;
          text-decoration: none;
          -webkit-transition: all .15s linear;
          transition: all .15s linear;
          }

          .wk-tabs li:not(:last-child) {
          border-bottom: 1px solid rgba(255, 255, 255, 0.18);
          }

          .wk-tabs li a.active {
          background: white;
          }

          .wk-tabs li a:focus {
          box-shadow: none;
          }


/***************************************************************************************************
Solo para mòvil */

    @media ( min-width: 756px ) {
        .wk-m { display: none !important; }
    }

/***************************************************************************************************
Solo para desktop*/

    @media ( max-width: 756px ) {
        .wk-d { display: none !important; }
    }