Dinakit Framework [CSS File]

@charset "utf-8";

/*
 * # Dinakit Framework 3.0 by @KaderBouyakoub <bkader@mail.com>
 * https://bitbucket.org/iangraphics/dinakit - http://dinakit.tk/
 * License - "Don't Be A Dick License" - DBAD by philsturgeon (http://www.dbad-license.org/)
 */

/*=================================================================
| [Table of contents]
|==================================================================
|
|   01. Imports
|   02. Basic styling
|   03. Alerts
|   04. Boxes
|   05. Breadcrumb
|   06. Browsers icons [PNG: https://mega.nz/#!zwxQDSKY]
|   07. Buttons
|   08. Collapse
|   09. Flags icons [PNG: https://mega.nz/#!WpoQCCra]
|   10. Forms
|   11. Gallery
|   12. Grid system
|   13. Hero unit
|   14. Images
|   15. Labels & Badges
|   16. List table
|   17. Media items
|   18. Menu
|   19. Modal
|   20. Pager
|   21. Pagination
|   22. Progress bar
|   23. Tables
|   24. Tabs
|   25. Tooltip
|   26. Typography
|   27. Useful classes
|
=================================================================*/

/*=================================================================
[01. Imports]
-------------------------------------------------------------------
!normalize.css v3.0.3 | MIT License | git.io/normalize
!Font Awesome 4.5.0 by @davegandy - http://fontawesome.io
!Raleway Font from Google Fonts
=================================================================*/
@import url(https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Raleway:400,100,200,300,500,600,700,800,900);

/*=================================================================
[02. Basic styling]
=================================================================*/

* {
            box-sizing: border-box;
       -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    outline: none;
}

html {
    font-size: 62.5%;
}

body {
    background-color: #fff;
    color           : #333;
    font            : 15px/1.6 "Raleway", Helvetica, Tahoma, Arial, sans-serif;
}

hr {
    border-width: 0;
    border-top: 1px solid #e1e1e1;
    margin-top: 2.0rem;
    margin-bottom: 2.5rem;
}

a {
    color: #1eaedb;
    text-decoration: none;
}

a:hover {
    color: #0fa0ce;
    text-decoration: underline;
}

/*=================================================================
[03. Alerts / .alert]
=================================================================*/

.alert {
    background-color: #fbeed5;
    color           : #c09853;
    margin-bottom   : 0.667em;
    padding         : 0.533em 2.333em 0.533em 0.933em;
    position        : relative;
    text-align      : left;
}

.alert:only-child {
    margin-bottom   : 0;
}

    .alert .alert-close {
        background     : none;
        border         : none;
        color          : inherit !important;
        line-height    : 1.5;
        margin         : 0;
        outline        : 0;
        padding        : 0;
        position       : absolute;
        right          : 0.333em;
        text-decoration: none;
        top            : 0;
    }

    .alert.alert-danger,
    .alert.alert-error,
    .alert.alert-red {
        background-color: #eed3d7;
        color           : #b94a48;
    }

    .alert.alert-info,
    .alert.alert-blue {
        background-color: #bce8f1;
        color           : #3a87ad;
    }

    .alert.alert-success,
    .alert.alert-green {
        background-color: #d6e9c6;
        color           : #468847;
    }

    .alert h1,
    .alert h2,
    .alert h3,
    .alert h4,
    .alert h5,
    .alert h6 {
        padding: 0;
        margin : 0 0 0.467em;
    }

/*=================================================================
[04. Boxes / .box]
=================================================================*/

.box {
    background-color: #fff;
    border-color    : #e5e6e9 #dfe0e4 #d0d1d5;
    border-style    : solid;
    border-width    : 1px;
}
.box + .box {
    margin-top      : 1.333em;
}


    .box .box-header {
        background-color: #f5f5f5;
        border-bottom   : 1px solid #ddd;
        padding         : 0.667em 2.333em 0.667em 1.000em;
        position        : relative;
    }

    .box.box-default .box-header {
        background-color: #f5f5f5;
    }

    .box .box-header:before,
    .box .box-header:after {
        content    : ".";
        display    : block;
        line-height: 0;
        overflow   : hidden;
    }
    .box .box-header:after {
        clear  : both;
    }

        .box .box-header .box-title {
            color        : inherit;
            font-size    : 1.067em;
            margin-bottom: 0;
            margin-top   : 0;
        }

        .box .box-header > small,
        .box .box-header > abbr {
            color  : #989898;
            display: block;
        }

        .box .box-header .box-action {
            color    : inherit;
            padding  : 0.133em 0.200em;
            position : absolute;
            right    : 0;
            top      : 0;
        }
            .box .box-header .box-action > a:link,
            .box .box-header .box-action > a:visited {
                color          : #c0c0c0;
                text-decoration: none;
            }
            .box .box-header .box-action > a + a {
                margin-left: 0.333em;
            }
            .box .box-header .box-action > a:active,
            .box .box-header .box-action > a:focus,
            .box .box-header .box-action > a:hover {
                color: #555;
            }

        .box .box-header .box-tag {
            background-color: #e5e5e5;
            bottom          : 1px;
            color           : #333;
            font-size       : 0.733em;
            font-weight     : 700;
            overflow        : hidden;
            padding         : 0.133em 0.200em;
            position        : absolute;
            right           : 1px;
            text-overflow   : ellipsis;
            text-transform  : lowercase;
            white-space     : nowrap;
        }
            .box .box-header .box-tag.tag-purple {
                background-color: #862165;
                color           : #fff ;
            }
            .box .box-header .box-tag.tag-blue {
                background-color: #4890a8;
                color           : #fff ;
            }
            .box .box-header .box-tag.tag-green {
                background-color: #5bb75b;
                color           : #fff ;
            }
            .box .box-header .box-tag.tag-orange {
                background-color: #faa732;
                color           : #fff ;
            }
            .box .box-header .box-tag.tag-red {
                background-color: #da4f49;
                color           : #fff ;
            }
            .box .box-header .box-tag.tag-pink {
                background-color: #db35c0;
                color           : #fff ;
            }
            .box .box-header .box-tag.tag-black {
                background-color: #363636;
                color           : #fff ;
            }
            .box .box-header .box-tag.tag-white {
                background-color: #fff;
                color           : #333 ;
            }

    .box .box-content {
        padding: 1.000em;
        line-height: inherit;
    }
    .box .box-content:before,
    .box .box-content:after {
        content: ' ';
        display: block;
        line-height: 0;
    }
    .box .box-content:after {
        clear: both;
    }
        .box .box-content > p + p {
            margin-top: 0.333em;
        }

    .box .box-footer {
        background-color: #f5f5f5;
        border-top      : 1px solid #ddd;
        padding         : 0.6667rem 1.000em;
    }
    .box .box-header:empty,
    .box .box-footer:empty {
        height: 0.200em;
        padding: 0;
    }
    .box .box-footer:before,
    .box .box-footer:after {
        content    : '.';
        display    : block;
        line-height: 0;
        overflow   : hidden;
    }
    .box .box-footer:after {
        clear: both;
    }

/*=================================================================
[05. Breadcrumb / .breadcrumb]
=================================================================*/

.breadcrumb {
    font-size       : inherit;
    list-style      : none;
    margin          : 0;
    padding         : 0.5333rem 1.000em;
}

.breadcrumb + .breadcrumb {
    margin-top: 1.000em;
}

    .breadcrumb > .item {
        *display: inline;
        *zoom   : 1;
        display : inline-block;
    }
    .breadcrumb > .item:after {
        color  : #aaa;
        content: "\00BB";
        padding: 0 5px 0 0.6667rem;
    }
    .breadcrumb > .item:last-child:after {
        content: none;
    }

    .breadcrumb > .item > a:link,
    .breadcrumb > .item > a:visited {
        text-decoration: none;
    }
    .breadcrumb > .item:hover > a,
    .breadcrumb > .item > a:hover,
    .breadcrumb > .item > a:active,
    .breadcrumb > .item > a:focus {
        color          : inherit;
        text-decoration: underline;
    }
    .breadcrumb > .item.active > span,
    .breadcrumb > .item.active > a {
        color          : #999 !important;
        cursor         : default;
        text-decoration: none !important;
    }

/*=================================================================
[06. Browsers / .browser]
=================================================================*/

.brw,
.browser {
    background-color   : transparent;
    background-image   : url(images/browsers.png);
    background-repeat  : no-repeat;
    border             : none;
    display            : inline-block;
    height             : 16px;
    outline            : 0;
    width              : 16px;
}

.brw.brw-an,
.browser.android {background-position: 0 0}
.brw.brw-ch,
.browser.chrome {background-position: -16px 0}
.brw.brw-ff,
.browser.firefox {background-position: -32px 0}
.brw.brw-ie,
.browser.ie {background-position: -48px 0}
.brw.brw-ns,
.browser.netscape {background-position: 0 -16px}
.brw.brw-op,
.browser.opera {background-position: -16px -16px}
.brw.brw-sf,
.browser.safari {background-position: -16px -32px}

/*=================================================================
[07. Buttons / .button]
=================================================================*/

.btn {
    *display           : inline;
    *zoom              : 1;
    background-color   : #E7E7E7;
    border             : 1px solid transparent;
    color              : #666;
    cursor             : pointer;
    display            : inline-block;
    font-family        : inherit;
    font-weight        : 400;
    line-height        : 1.5;
    margin             : 0;
    padding            : 0.467em 0.800em;
    position           : relative;
    text-align         : center;
    text-decoration    : none;
    vertical-align     : middle;
    white-space        : nowrap;
    width              : auto;
    border-radius      : 3px;
            transition : background-color .15s ease-in-out;
         -o-transition : background-color .15s ease-in-out;
        -ms-transition : background-color .15s ease-in-out;
       -moz-transition : background-color .15s ease-in-out;
    -webkit-transition : background-color .15s ease-in-out;
            user-select: none;
         -o-user-select: none;
        -ms-user-select: none;
       -moz-user-select: none;
    -webkit-user-select: none;
}

.btn:focus, .btn:active, .btn:hover {
    background-color: #e0e0e0;
    color           : #666;
    text-decoration    : none;
}

/**
* Buttons Groups
*/

.btn-group {
    display    : inline-block;
    line-height: 100%;
}
    .btn-group > .btn {
        display: inline-block;
        float  : left;
    }
    .btn-group > .btn + .btn {
        border-left: 1px solid rgba(255,255,255,.5);
        margin-left: 0;
    }
    .btn-group > .btn:first-child {
        border-radius: 3px 0 0 3px;
    }

    .btn-group > .btn:last-child {
        border-radius: 0 3px 3px 0;
    }

    .btn-group > .btn:only-child {
        border-radius: 3px;
    }

/**
* Button Sizes
*/

.btn.btn-tiny, .btn-group.btn-tiny > .btn {
    font-size: 0.5em;
    padding  : 0.067em 0.200em;
}

.btn.btn-mini, .btn-group.btn-mini > .btn {
    font-size: .71428571em;
    padding  : 0.200em 0.467em;
}

.btn.btn-small, .btn-group.btn-small > .btn {
    font-size  : .92857143em;
    padding    : 0.333em 0.6667rem;
    line-height: 1.315;
}

.btn.btn-large, .btn-group.btn-large > .btn {
    font-size: 1.14285714em;
    padding  : 0.6667rem 1.333em;
}

.btn.btn-xlarge, .btn-group.btn-xlarge > .btn {
    font-size: 1.28571429em;
    padding  : 1.000em 1.333em;
}

.btn.btn-block {
            box-sizing: border-box;
       -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    text-align        : center;
    width             : 100%;
}

/**
* Disabled Button
*/

.btn[disabled], .btn[disabled]:focus, .btn[disabled]:hover, .btn[disabled]:active,
.btn.disabled, .btn.disabled:focus, .btn.disabled:hover, .btn.disabled:active {
    background-color: #efefef;
    cursor          : default;
}

/**
* Button Link
*/

.btn.btn-link, .btn-group.btn-link > .btn {
    background: none;
    border    : none;
}

.btn.btn-link:focus, .btn.btn-link:active, .btn.btn-link:hover,
.btn-group.btn-link > .btn:focus, .btn-group.btn-link > .btn:active, .btn-group.btn-link > .btn:hover {
    text-decoration: underline;
}

/**
* Button Colors
*/

/* purple button */
.btn.btn-purple, .btn-group.btn-purple > .btn {
    background-color: #862165;
    color           : #fefefe !important;
}
.btn.btn-purple:active, .btn.btn-purple:focus, .btn.btn-purple:hover,
.btn-group.btn-purple > .btn:active, .btn-group.btn-purple > .btn:focus, .btn-group.btn-purple > .btn:hover {
    background-color: #751b59;
    color           : #fefefe !important;
}

/* blue button */
.btn.btn-primary, .btn-group.btn-primary > .btn,
.btn.btn-blue, .btn-group.btn-blue > .btn {
    background-color: #4890a8;
    color           : #fefefe !important;
}
.btn.btn-info:active, .btn.btn-info:focus, .btn.btn-info:hover,
.btn-group.btn-info > .btn:active, .btn-group.btn-info > .btn:focus, .btn-group.btn-info > .btn:hover,
.btn.btn-blue:active, .btn.btn-blue:focus, .btn.btn-blue:hover,
.btn-group.btn-blue > .btn:active, .btn-group.btn-blue > .btn:focus, .btn-group.btn-blue > .btn:hover {
    background-color: #186078;
    color           : #fefefe !important;
}

/* green button */
.btn.btn-success, .btn-group.btn-success > .btn,
.btn.btn-green, .btn-group.btn-green > .btn {
    background-color: #5bb75b;
    color           : #fefefe !important;
}
.btn.btn-success:active, .btn.btn-success:focus, .btn.btn-success:hover,
.btn-group.btn-success > .btn:active, .btn-group.btn-success > .btn:focus, .btn-group.btn-success > .btn:hover,
.btn.btn-green:active, .btn.btn-green:focus, .btn.btn-green:hover,
.btn-group.btn-green > .btn:active, .btn-group.btn-green > .btn:focus, .btn-group.btn-green > .btn:hover {
    background-color: #51a351;
    color           : #fefefe !important;
}

/* orange button */
.btn.btn-warning, .btn-group.btn-warning > .btn,
.btn.btn-orange, .btn-group.btn-orange > .btn {
    background-color: #faa732;
    color           : #fefefe !important;
}
.btn.btn-warning:active, .btn.btn-warning:focus, .btn.btn-warning:hover,
.btn-group.btn-warning > .btn:active, .btn-group.btn-warning > .btn:focus, .btn-group.btn-warning > .btn:hover,
.btn.btn-orange:active, .btn.btn-orange:focus, .btn.btn-orange:hover,
.btn-group.btn-orange > .btn:active, .btn-group.btn-orange > .btn:focus, .btn-group.btn-orange > .btn:hover {
    background-color: #f89406;
    color           : #fefefe !important;
}

/* red button */
.btn.btn-danger, .btn-group.btn-danger > .btn,
.btn.btn-red, .btn-group.btn-red > .btn {
    background-color: #da4f49;
    color           : #fefefe !important;
}
.btn.btn-danger:active, .btn.btn-danger:focus, .btn.btn-danger:hover,
.btn-group.btn-danger > .btn:active, .btn-group.btn-danger > .btn:focus, .btn-group.btn-danger > .btn:hover,
.btn.btn-red:active, .btn.btn-red:focus, .btn.btn-red:hover,
.btn-group.btn-red > .btn:active, .btn-group.btn-red > .btn:focus, .btn-group.btn-red > .btn:hover {
    background-color: #bd362f;
    color           : #fefefe !important;
}

/* pink button */
.btn.btn-pink, .btn-group.btn-pink > .btn {
    background-color: #db35c0;
    color           : #fefefe !important;
}
.btn.btn-pink:active, .btn.btn-pink:focus, .btn.btn-pink:hover,
.btn-group.btn-pink > .btn:active, .btn-group.btn-pink > .btn:focus, .btn-group.btn-pink > .btn:hover {
    background-color: #ba29a2;
    color           : #fefefe !important;
}

/* black button */
.btn.btn-inverse, .btn-group.btn-inverse > .btn,
.btn.btn-black, .btn-group.btn-black > .btn {
    background-color: #363636 !important;
    color           : #fefefe !important;
}
.btn.btn-inverse:active, .btn.btn-inverse:focus, .btn.btn-inverse:hover,
.btn-group.btn-inverse > .btn:active, .btn-group.btn-inverse > .btn:focus, .btn-group.btn-inverse > .btn:hover,
.btn.btn-black:active, .btn.btn-black:focus, .btn.btn-black:hover,
.btn-group.btn-black > .btn:active, .btn-group.btn-black > .btn:focus, .btn-group.btn-black > .btn:hover {
    background-color: #222222 !important;
}

/* white button */
.btn.btn-white, .btn-group.btn-white > .btn,
.btn.btn-white, .btn-group.btn-white > .btn {
    background-color: #fff;
    color           : #333 !important;
    text-shadow     : 0 1px #fff;
}
.btn.btn-white:active, .btn.btn-white:focus, .btn.btn-white:hover,
.btn-group.btn-white > .btn:active, .btn-group.btn-white > .btn:focus, .btn-group.btn-white > .btn:hover {
    background-color: #f9f9f9;
}

/**
* Social Network Buttons
*/

.btn.btn-dribbble,
.btn.btn-facebook,
.btn.btn-googleplus,
.btn.btn-linkedin,
.btn.btn-pinterest,
.btn.btn-rss,
.btn.btn-tumblr,
.btn.btn-twitter,
.btn.btn-github {
            transition: all .15s ease-in-out;
         -o-transition: all .15s ease-in-out;
        -ms-transition: all .15s ease-in-out;
       -moz-transition: all .15s ease-in-out;
    -webkit-transition: all .15s ease-in-out;
    color             : #fff !important;
}

/* dribbble */
.btn-group.btn-dribbble > .btn, .btn.btn-dribbble {
    background      :     -ms-linear-gradient(top,#ea4c89,#c93764);
    background      :    -moz-linear-gradient(top,#ea4c89,#c93764);
    background      : -webkit-linear-gradient(top,#ea4c89,#c93764);
    background-color: #c93764;
    text-shadow     : 0 -1px -1px #9d2849;
}
.btn.btn-dribbble:active, .btn.btn-dribbble:focus, .btn.btn-dribbble:hover,
.btn-group.btn-dribbble > .btn:active, .btn-group.btn-dribbble > .btn:focus, .btn-group.btn-dribbble > .btn:hover {
    background: #c93764;
}

/* facebook */
.btn-group.btn-facebook > .btn, .btn.btn-facebook {
    background      :     -ms-linear-gradient(top,#3b5998,#2b4170);
    background      :    -moz-linear-gradient(top,#3b5998,#2b4170);
    background      : -webkit-linear-gradient(top,#3b5998,#2b4170);
    background-color: #2b4170;
    text-shadow     : 0 -1px -1px #1f2f52;
}
.btn.btn-facebook:active, .btn.btn-facebook:focus, .btn.btn-facebook:hover,
.btn-group.btn-facebook > .btn:active, .btn-group.btn-facebook > .btn:focus, .btn-group.btn-facebook > .btn:hover {
    background: #2b4170;
}

/* googleplus */
.btn-group.btn-googleplus > .btn, .btn.btn-googleplus {
    background      :     -ms-linear-gradient(top,#e64522,#c33219);
    background      :    -moz-linear-gradient(top,#e64522,#c33219);
    background      : -webkit-linear-gradient(top,#e64522,#c33219);
    background-color: #c33219;
    text-shadow     : 0 -1px -1px #972412;
}
.btn.btn-googleplus:active, .btn.btn-googleplus:focus, .btn.btn-googleplus:hover,
.btn-group.btn-googleplus > .btn:active, .btn-group.btn-googleplus > .btn:focus, .btn-group.btn-googleplus > .btn:hover {
    background: #c33219;
}

/* linkedin */
.btn-group.btn-linkedin > .btn, .btn.btn-linkedin {
    background      :     -ms-linear-gradient(top,#009cda,#0073b2);
    background      :    -moz-linear-gradient(top,#009cda,#0073b2);
    background      : -webkit-linear-gradient(top,#009cda,#0073b2);
    background-color: #0073b2;
    text-shadow     : 0 -1px -1px #005486;
}
.btn.btn-linkedin:active, .btn.btn-linkedin:focus, .btn.btn-linkedin:hover,
.btn-group.btn-linkedin > .btn:active, .btn-group.btn-linkedin > .btn:focus, .btn-group.btn-linkedin > .btn:hover {
    background: #0073b2;
}

/* pinterest */
.btn-group.btn-pinterest > .btn, .btn.btn-pinterest {
    background      :     -ms-linear-gradient(top,#cb2027,#a0171c);
    background      :    -moz-linear-gradient(top,#cb2027,#a0171c);
    background      : -webkit-linear-gradient(top,#cb2027,#a0171c);
    background-color: #a0171c;
    text-shadow     : 0 -1px -1px #761114;
}
.btn.btn-pinterest:active, .btn.btn-pinterest:focus, .btn.btn-pinterest:hover,
.btn-group.btn-pinterest > .btn:active, .btn-group.btn-pinterest > .btn:focus, .btn-group.btn-pinterest > .btn:hover {
    background: #a0171c;
}

/* rss */
.btn-group.btn-rss > .btn, .btn.btn-rss {
    background      :     -ms-linear-gradient(top,#e88845,#e2733d);
    background      :    -moz-linear-gradient(top,#e88845,#e2733d);
    background      : -webkit-linear-gradient(top,#e88845,#e2733d);
    background-color: #e2733d;
    text-shadow     :0 -1px -1px #9a4824;
}
.btn.btn-rss:active, .btn.btn-rss:focus, .btn.btn-rss:hover,
.btn-group.btn-rss > .btn:active, .btn-group.btn-rss > .btn:focus, .btn-group.btn-rss > .btn:hover {
    background: #e2733d;
}

/* tumblr */
.btn-group.btn-tumblr > .btn, .btn.btn-tumblr {
    background      :     -ms-linear-gradient(top,#3a5876,#2c4762);
    background      :    -moz-linear-gradient(top,#3a5876,#2c4762);
    background      : -webkit-linear-gradient(top,#3a5876,#2c4762);
    background-color: #2c4762;
    text-shadow     : 0 -1px -1px #203448;
}
.btn.btn-tumblr:active, .btn.btn-tumblr:focus, .btn.btn-tumblr:hover,
.btn-group.btn-tumblr > .btn:active, .btn-group.btn-tumblr > .btn:focus, .btn-group.btn-tumblr > .btn:hover {
    background: #2c4762;
}

/* twitter */
.btn-group.btn-twitter > .btn, .btn.btn-twitter {
    background      :     -ms-linear-gradient(top,#00aced,#0081ce);
    background      :    -moz-linear-gradient(top,#00aced,#0081ce);
    background      : -webkit-linear-gradient(top,#00aced,#0081ce);
    background-color: #0081ce;
    text-shadow     : 0 -1px -1px #005ea3;
}
.btn.btn-twitter:active, .btn.btn-twitter:focus, .btn.btn-twitter:hover,
.btn-group.btn-twitter > .btn:active, .btn-group.btn-twitter > .btn:focus, .btn-group.btn-twitter > .btn:hover {
    background: #0081ce;
}

/* github */
.btn-group.btn-github > .btn, .btn.btn-github {
    background      :     -ms-linear-gradient(top,#333,#111);
    background      :    -moz-linear-gradient(top,#333,#111);
    background      : -webkit-linear-gradient(top,#333,#111);
    background-color: #333;
    text-shadow     : 0 -1px -1px #005ea3;
}
.btn.btn-github:active, .btn.btn-github:focus, .btn.btn-github:hover,
.btn-group.btn-github > .btn:active, .btn-group.btn-github > .btn:focus, .btn-group.btn-github > .btn:hover {
    background: #111;
}

/**
* Buttons Shapes
*/

/* button pill | 50em border radius */
.btn-group.btn-pill > .btn:first-child {
            border-radius: 50em 0 0 50em;
         -o-border-radius: 50em 0 0 50em;
        -ms-border-radius: 50em 0 0 50em;
       -moz-border-radius: 50em 0 0 50em;
    -webkit-border-radius: 50em 0 0 50em;
}

.btn-group.btn-pill > .btn:last-child {
            border-radius: 0 50em 50em 0;
         -o-border-radius: 0 50em 50em 0;
        -ms-border-radius: 0 50em 50em 0;
       -moz-border-radius: 0 50em 50em 0;
    -webkit-border-radius: 0 50em 50em 0;
}

.btn-group.btn-pill > .btn:only-child, .btn.btn-pill {
            border-radius: 50em;
         -o-border-radius: 50em;
        -ms-border-radius: 50em;
       -moz-border-radius: 50em;
    -webkit-border-radius: 50em;
}

/* button circle */
.btn.btn-circle {
            border-radius: 240px;
         -o-border-radius: 240px;
        -ms-border-radius: 240px;
       -moz-border-radius: 240px;
    -webkit-border-radius: 240px;
    height               : 120px;
    line-height          : 120px;
    overflow             : hidden;
    text-overflow        : ellipsis;
    white-space          : nowrap;
    padding              : 0 5px;
    width                : 120px;
}

/*=================================================================
[09. Collapse / .collapse]
=================================================================*/

.collapse {
    display: block;
    max-width: 100%;
}

.collapse + .collapse {
    margin-top: 1.000em;
}

    .collapse > .title {
        display: block;
        cursor: pointer;
        color: #989898;
        padding: 7px 0;
    }

    .collapse > .title:before {
        content: "\f0da";
        display: inline-block;
        font-family: FontAwesome;
        width: 11px;
        margin-right: 1px;
    }

    .collapse > .title.active,
    .collapse > .title:hover {
        color: inherit;
    }

    .collapse > .title.active:before {
        content: "\f0d7";
    }

    .collapse > .content {
        display: none;
        padding: 7px 0 14px;
    }
    .collapse > .content.active {
        display: block;
    }

.collapse.styled {
    border-radius: 3px;
    background-color: #fff;
    border: 1px solid #eee;
}

    .collapse.styled > .title {
        margin: 0;
        padding: 7px 14px;
        border-top: 1px solid #eee;
    }

    .collapse.styled > .title:first-child {
        border-top: none;
    }

    .collapse.styled > .content {
        padding: 7px 14px 14px;
    }

/*=================================================================
[09. Flags / .flag]
=================================================================*/

.flag {
    background-color : transparent;
    background-image : url(images/flags.png);
    background-repeat: no-repeat;
    border           : none;
    display          : inline-block;
    height           : 11px;
    outline          : 0;
    width            : 16px;
}

.flag.flag-ad {background-position: -16px 0}
.flag.flag-ae {background-position: -32px 0}
.flag.flag-af {background-position: -48px 0}
.flag.flag-ag {background-position: -64px 0}
.flag.flag-ai {background-position: -80px 0}
.flag.flag-al {background-position: -96px 0}
.flag.flag-am {background-position: -112px 0}
.flag.flag-an {background-position: -128px 0}
.flag.flag-ao {background-position: -144px 0}
.flag.flag-ar {background-position: -160px 0}
.flag.flag-as {background-position: -176px 0}
.flag.flag-at {background-position: -192px 0}
.flag.flag-au {background-position: -208px 0}
.flag.flag-aw {background-position: -224px 0}
.flag.flag-az {background-position: -240px 0}
.flag.flag-ba {background-position: 0 -11px}
.flag.flag-bb {background-position: -16px -11px}
.flag.flag-bd {background-position: -32px -11px}
.flag.flag-be {background-position: -48px -11px}
.flag.flag-bf {background-position: -64px -11px}
.flag.flag-bg {background-position: -80px -11px}
.flag.flag-bh {background-position: -96px -11px}
.flag.flag-bi {background-position: -112px -11px}
.flag.flag-bj {background-position: -128px -11px}
.flag.flag-bm {background-position: -144px -11px}
.flag.flag-bn {background-position: -160px -11px}
.flag.flag-bo {background-position: -176px -11px}
.flag.flag-br {background-position: -192px -11px}
.flag.flag-bs {background-position: -208px -11px}
.flag.flag-bt {background-position: -224px -11px}
.flag.flag-bv {background-position: -240px -11px}
.flag.flag-bw {background-position: 0 -22px}
.flag.flag-by {background-position: -16px -22px}
.flag.flag-bz {background-position: -32px -22px}
.flag.flag-ca {background-position: -48px -22px}
.flag.flag-catalonia {background-position: -64px -22px}
.flag.flag-cd {background-position: -80px -22px}
.flag.flag-cf {background-position: -96px -22px}
.flag.flag-cg {background-position: -112px -22px}
.flag.flag-ch {background-position: -128px -22px}
.flag.flag-ci {background-position: -144px -22px}
.flag.flag-ck {background-position: -160px -22px}
.flag.flag-cl {background-position: -176px -22px}
.flag.flag-cm {background-position: -192px -22px}
.flag.flag-cn {background-position: -208px -22px}
.flag.flag-co {background-position: -224px -22px}
.flag.flag-cr {background-position: -240px -22px}
.flag.flag-cu {background-position: 0 -33px}
.flag.flag-cv {background-position: -16px -33px}
.flag.flag-cw {background-position: -32px -33px}
.flag.flag-cy {background-position: -48px -33px}
.flag.flag-cz {background-position: -64px -33px}
.flag.flag-de {background-position: -80px -33px}
.flag.flag-dj {background-position: -96px -33px}
.flag.flag-dk {background-position: -112px -33px}
.flag.flag-dm {background-position: -128px -33px}
.flag.flag-do {background-position: -144px -33px}
.flag.flag-dz {background-position: -160px -33px}
.flag.flag-ec {background-position: -176px -33px}
.flag.flag-ee {background-position: -192px -33px}
.flag.flag-eg {background-position: -208px -33px}
.flag.flag-eh {background-position: -224px -33px}
.flag.flag-england {background-position: -240px -33px}
.flag.flag-er {background-position: 0 -44px}
.flag.flag-es {background-position: -16px -44px}
.flag.flag-et {background-position: -32px -44px}
.flag.flag-eu {background-position: -48px -44px}
.flag.flag-fi {background-position: -64px -44px}
.flag.flag-fj {background-position: -80px -44px}
.flag.flag-fk {background-position: -96px -44px}
.flag.flag-fm {background-position: -112px -44px}
.flag.flag-fo {background-position: -128px -44px}
.flag.flag-fr {background-position: -144px -44px}
.flag.flag-ga {background-position: -160px -44px}
.flag.flag-gb {background-position: -176px -44px}
.flag.flag-gd {background-position: -192px -44px}
.flag.flag-ge {background-position: -208px -44px}
.flag.flag-gf {background-position: -224px -44px}
.flag.flag-gg {background-position: -240px -44px}
.flag.flag-gh {background-position: 0 -55px}
.flag.flag-gi {background-position: -16px -55px}
.flag.flag-gl {background-position: -32px -55px}
.flag.flag-gm {background-position: -48px -55px}
.flag.flag-gn {background-position: -64px -55px}
.flag.flag-gp {background-position: -80px -55px}
.flag.flag-gq {background-position: -96px -55px}
.flag.flag-gr {background-position: -112px -55px}
.flag.flag-gs {background-position: -128px -55px}
.flag.flag-gt {background-position: -144px -55px}
.flag.flag-gu {background-position: -160px -55px}
.flag.flag-gw {background-position: -176px -55px}
.flag.flag-gy {background-position: -192px -55px}
.flag.flag-hk {background-position: -208px -55px}
.flag.flag-hm {background-position: -224px -55px}
.flag.flag-hn {background-position: -240px -55px}
.flag.flag-hr {background-position: 0 -66px}
.flag.flag-ht {background-position: -16px -66px}
.flag.flag-hu {background-position: -32px -66px}
.flag.flag-ic {background-position: -48px -66px}
.flag.flag-id {background-position: -64px -66px}
.flag.flag-ie {background-position: -80px -66px}
.flag.flag-il {background-position: -96px -66px}
.flag.flag-im {background-position: -112px -66px}
.flag.flag-in {background-position: -128px -66px}
.flag.flag-io {background-position: -144px -66px}
.flag.flag-iq {background-position: -160px -66px}
.flag.flag-ir {background-position: -176px -66px}
.flag.flag-is {background-position: -192px -66px}
.flag.flag-it {background-position: -208px -66px}
.flag.flag-je {background-position: -224px -66px}
.flag.flag-jm {background-position: -240px -66px}
.flag.flag-jo {background-position: 0 -77px}
.flag.flag-jp {background-position: -16px -77px}
.flag.flag-ke {background-position: -32px -77px}
.flag.flag-kg {background-position: -48px -77px}
.flag.flag-kh {background-position: -64px -77px}
.flag.flag-ki {background-position: -80px -77px}
.flag.flag-km {background-position: -96px -77px}
.flag.flag-kn {background-position: -112px -77px}
.flag.flag-kp {background-position: -128px -77px}
.flag.flag-kr {background-position: -144px -77px}
.flag.flag-kurdistan {background-position: -160px -77px}
.flag.flag-kw {background-position: -176px -77px}
.flag.flag-ky {background-position: -192px -77px}
.flag.flag-kz {background-position: -208px -77px}
.flag.flag-la {background-position: -224px -77px}
.flag.flag-lb {background-position: -240px -77px}
.flag.flag-lc {background-position: 0 -88px}
.flag.flag-li {background-position: -16px -88px}
.flag.flag-lk {background-position: -32px -88px}
.flag.flag-lr {background-position: -48px -88px}
.flag.flag-ls {background-position: -64px -88px}
.flag.flag-lt {background-position: -80px -88px}
.flag.flag-lu {background-position: -96px -88px}
.flag.flag-lv {background-position: -112px -88px}
.flag.flag-ly {background-position: -128px -88px}
.flag.flag-ma {background-position: -144px -88px}
.flag.flag-mc {background-position: -160px -88px}
.flag.flag-md {background-position: -176px -88px}
.flag.flag-me {background-position: -192px -88px}
.flag.flag-mg {background-position: -208px -88px}
.flag.flag-mh {background-position: -224px -88px}
.flag.flag-mk {background-position: -240px -88px}
.flag.flag-ml {background-position: 0 -99px}
.flag.flag-mm {background-position: -16px -99px}
.flag.flag-mn {background-position: -32px -99px}
.flag.flag-mo {background-position: -48px -99px}
.flag.flag-mp {background-position: -64px -99px}
.flag.flag-mq {background-position: -80px -99px}
.flag.flag-mr {background-position: -96px -99px}
.flag.flag-ms {background-position: -112px -99px}
.flag.flag-mt {background-position: -128px -99px}
.flag.flag-mu {background-position: -144px -99px}
.flag.flag-mv {background-position: -160px -99px}
.flag.flag-mw {background-position: -176px -99px}
.flag.flag-mx {background-position: -192px -99px}
.flag.flag-my {background-position: -208px -99px}
.flag.flag-mz {background-position: -224px -99px}
.flag.flag-na {background-position: -240px -99px}
.flag.flag-nc {background-position: 0 -110px}
.flag.flag-ne {background-position: -16px -110px}
.flag.flag-nf {background-position: -32px -110px}
.flag.flag-ng {background-position: -48px -110px}
.flag.flag-ni {background-position: -64px -110px}
.flag.flag-nl {background-position: -80px -110px}
.flag.flag-no {background-position: -96px -110px}
.flag.flag-np {background-position: -112px -110px}
.flag.flag-nr {background-position: -128px -110px}
.flag.flag-nu {background-position: -144px -110px}
.flag.flag-nz {background-position: -160px -110px}
.flag.flag-om {background-position: -176px -110px}
.flag.flag-pa {background-position: -192px -110px}
.flag.flag-pe {background-position: -208px -110px}
.flag.flag-pf {background-position: -224px -110px}
.flag.flag-pg {background-position: -240px -110px}
.flag.flag-ph {background-position: 0 -121px}
.flag.flag-pk {background-position: -16px -121px}
.flag.flag-pl {background-position: -32px -121px}
.flag.flag-pm {background-position: -48px -121px}
.flag.flag-pn {background-position: -64px -121px}
.flag.flag-pr {background-position: -80px -121px}
.flag.flag-ps {background-position: -96px -121px}
.flag.flag-pt {background-position: -112px -121px}
.flag.flag-pw {background-position: -128px -121px}
.flag.flag-py {background-position: -144px -121px}
.flag.flag-qa {background-position: -160px -121px}
.flag.flag-re {background-position: -176px -121px}
.flag.flag-ro {background-position: -192px -121px}
.flag.flag-rs {background-position: -208px -121px}
.flag.flag-ru {background-position: -224px -121px}
.flag.flag-rw {background-position: -240px -121px}
.flag.flag-sa {background-position: 0 -132px}
.flag.flag-sb {background-position: -16px -132px}
.flag.flag-sc {background-position: -32px -132px}
.flag.flag-scotland {background-position: -48px -132px}
.flag.flag-sd {background-position: -64px -132px}
.flag.flag-se {background-position: -80px -132px}
.flag.flag-sg {background-position: -96px -132px}
.flag.flag-sh {background-position: -112px -132px}
.flag.flag-si {background-position: -128px -132px}
.flag.flag-sk {background-position: -144px -132px}
.flag.flag-sl {background-position: -160px -132px}
.flag.flag-sm {background-position: -176px -132px}
.flag.flag-sn {background-position: -192px -132px}
.flag.flag-so {background-position: -208px -132px}
.flag.flag-somaliland {background-position: -224px -132px}
.flag.flag-sr {background-position: -240px -132px}
.flag.flag-ss {background-position: 0 -143px}
.flag.flag-st {background-position: -16px -143px}
.flag.flag-sv {background-position: -32px -143px}
.flag.flag-sx {background-position: -48px -143px}
.flag.flag-sy {background-position: -64px -143px}
.flag.flag-sz {background-position: -80px -143px}
.flag.flag-tc {background-position: -96px -143px}
.flag.flag-td {background-position: -112px -143px}
.flag.flag-tf {background-position: -128px -143px}
.flag.flag-tg {background-position: -144px -143px}
.flag.flag-th {background-position: -160px -143px}
.flag.flag-tibet {background-position: -176px -143px}
.flag.flag-tj {background-position: -192px -143px}
.flag.flag-tk {background-position: -208px -143px}
.flag.flag-tl {background-position: -224px -143px}
.flag.flag-tm {background-position: -240px -143px}
.flag.flag-tn {background-position: 0 -154px}
.flag.flag-to {background-position: -16px -154px}
.flag.flag-tr {background-position: -32px -154px}
.flag.flag-tt {background-position: -48px -154px}
.flag.flag-tv {background-position: -64px -154px}
.flag.flag-tw {background-position: -80px -154px}
.flag.flag-tz {background-position: -96px -154px}
.flag.flag-ua {background-position: -112px -154px}
.flag.flag-ug {background-position: -128px -154px}
.flag.flag-um {background-position: -144px -154px}
.flag.flag-us {background-position: -160px -154px}
.flag.flag-uy {background-position: -176px -154px}
.flag.flag-uz {background-position: -192px -154px}
.flag.flag-va {background-position: -208px -154px}
.flag.flag-vc {background-position: -224px -154px}
.flag.flag-ve {background-position: -240px -154px}
.flag.flag-vg {background-position: 0 -165px}
.flag.flag-vi {background-position: -16px -165px}
.flag.flag-vn {background-position: -32px -165px}
.flag.flag-vu {background-position: -48px -165px}
.flag.flag-wales {background-position: -64px -165px}
.flag.flag-wf {background-position: -80px -165px}
.flag.flag-ws {background-position: -96px -165px}
.flag.flag-xk {background-position: -112px -165px}
.flag.flag-ye {background-position: -128px -165px}
.flag.flag-yt {background-position: -144px -165px}
.flag.flag-za {background-position: -160px -165px}
.flag.flag-zanzibar {background-position: -176px -165px}
.flag.flag-zm {background-position: -192px -165px}
.flag.flag-zw {background-position: -208px -165px}

/*=================================================================
[10. Forms]
=================================================================*/

.form,
form {
    margin : 0;
    padding: 0;
}

fieldset {
    border : 1px solid silver;
    margin : 0 2px;
    padding: .35em .625em .75em;
}

legend {
    *margin-left : -7px;
    border       : none;
    border-bottom: 1px solid #CCCCCC;
    display      : block;
    font-size    : 1.3em;
    margin-bottom: .5em;
    padding      : 0;
    white-space  : normal;
    width        : 100%;
}

select {
    width: auto;
}

textarea {
    resize: vertical;
}
textarea.no-resize {
    resize: none;
}

.form-control,
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] {
    margin                     : 0;
    max-width                  : 100%;
    -webkit-box-flex           : 0;
    -webkit-flex               : 0 1 auto;
        -ms-flex               : 0 1 auto;
            flex               : 0 1 auto;
    outline                    : 0;
    -webkit-tap-highlight-color: rgba(255,255,255,0);
    text-align                 : left;
    line-height                : 1.2;
    padding                    : 0.467em 0.800em;
    background                 : #fff;
    border                     : 1px solid rgba(0,0,0,.15);
    color                      : rgba(0,0,0,.8);
    border-radius              : 3px;
    -webkit-transition         : background-color .2s ease,box-shadow .2s ease,border-color .2s ease;
       -moz-transition         : background-color .2s ease,box-shadow .2s ease,border-color .2s ease;
        -ms-transition         : background-color .2s ease,box-shadow .2s ease,border-color .2s ease;
         -o-transition         : background-color .2s ease,box-shadow .2s ease,border-color .2s ease;
            transition         : background-color .2s ease,box-shadow .2s ease,border-color .2s ease;
    -webkit-box-shadow         : none;
       -moz-box-shadow         : none;
        -ms-box-shadow         : none;
         -o-box-shadow         : none;
            box-shadow         : none;
}

.form-control:focus,
select:focus,
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus {
    border-color: #66afe9;
    background  : #fff;
    box-shadow  : none;
}

input[type=text],
input[type=email],
input[type=search],
input[type=password] {
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}

input[type="checkbox"] {
    margin-left   : 0;
    margin-right  : 5px;
    margin-top    : 1px;
    vertical-align: top;
}

label {
    display      : inline-block;
    max-width    : 100%;
    margin-bottom: 5px;
    font-weight  : 700;
}

.form-group {
    clear: both;
}

.form-group + .form-group {
    margin-top: 5px;
}

@media (min-width: 768px) {
    .form-group + .form-group {
        margin-top: 15px;
    }
}

.checkbox {
    display: inline-block;
    vertical-align: top;
    zoom: 1; /* Fix for IE7 */
    *display: inline; /* Fix for IE7 */
}
.checkbox > input[type="checkbox"] {display:none;visibility:hidden}
.checkbox > label {
    cursor: pointer !important;
    position: relative;
    padding-left: 26px;
    margin-bottom: 0;
}

/** SIMPLE CHECKBOX **/

.checkbox > label:before {
    content: " ";
    display: block;
    width: 16px;
    height: 16px;
    background-color: #fff;
    box-shadow: 0 0 1px #555;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 3px;
}
.checkbox:hover > label:before {
    box-shadow: 0 0 1px #111;
}

.checkbox.checked > label:after {
    content: "\f00c";
    font-family: FontAwesome;
    font-size: 0.813em;
    position: absolute;
    top: -1px;
    left: 2px;
}

/** TOGGLE CHECKBOX **/

.checkbox.cb-slider > label {padding-left: 37px}


.checkbox.cb-slider > label:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 32px;
    height: 16px;
    background-color: rgba(0,0,0,.05);
    z-index: 1;
    border-radius: 50em;
    margin-right: 0.6667rem;
    box-shadow: none;
}

.checkbox.cb-slider:hover > label:before {background-color: rgba(0,0,0,.1)}
.checkbox.cb-slider.checked > label:before {background-color: rgba(0,0,0,.3);}
.checkbox.cb-slider.cb-purple.checked > label:before {background-color: #862165}
.checkbox.cb-slider.cb-blue.checked > label:before {background-color: #4890a8}
.checkbox.cb-slider.cb-green.checked > label:before {background-color: #5bb75b}
.checkbox.cb-slider.cb-orange.checked > label:before {background-color: #faa732}
.checkbox.cb-slider.cb-red.checked > label:before {background-color: #da4f49}
.checkbox.cb-slider.cb-pink.checked > label:before {background-color: #db35c0}
.checkbox.cb-slider.cb-black.checked > label:before {background-color: #363636}
.checkbox.cb-slider.cb-white.checked > label:before {background-color: #fff}

.checkbox.cb-slider > label:after {
    content: " ";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 16px;
    width: 16px;
    background-color: #fff;
    box-shadow: 0 1px 2px 0 rgba(34,36,38,.15), 0 0 0 1px rgba(34,36,38,.15) inset;
    z-index: 2;
    border-radius: 50em;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
}
.checkbox.cb-slider.checked > label:after {
    left: auto;
    left: 16px;
}

/*
 * Full Width Form
 */
form.form-fluid,
.form.form-fluid {
    width: 100%;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

/**
 * Inline Form
 */

.form.form-inline {
    display: block;
}
.form.form-inline > .form-group {
    display       : inline-block;
    margin-bottom : 0;
    vertical-align: middle;
}

.form.form-inline select,
.form.form-inline textarea,
.form.form-inline input[type="text"],
.form.form-inline input[type="password"],
.form.form-inline input[type="datetime"],
.form.form-inline input[type="datetime-local"],
.form.form-inline input[type="date"],
.form.form-inline input[type="month"],
.form.form-inline input[type="time"],
.form.form-inline input[type="week"],
.form.form-inline input[type="number"],
.form.form-inline input[type="email"],
.form.form-inline input[type="url"],
.form.form-inline input[type="search"],
.form.form-inline input[type="tel"],
.form.form-inline input[type="color"],
.form.form-inline .form-control {
    display: inline-block;
    widows: auto;
    vertical-align: middle;
}

/**
* Aligned Form
*/

.form.form-aligned {}
    .form.form-aligned .form-group {
        *zoom   : 1;
        position: relative;
        width   : 100%;
    }

    .form.form-aligned .form-group:before,
    .form.form-aligned .form-group:after {
        content    : ".";
        display    : block;
        line-height: 0;
        overflow   : hidden;
    }
    .form.form-aligned .form-group:after {
        clear: both;
    }
    .form.form-aligned label {
        display: block;
        text-align: left;
        margin-bottom: 5px;
    }
    .form.form-aligned .form-group select,
    .form.form-aligned .form-group textarea,
    .form.form-aligned .form-group input[type="text"],
    .form.form-aligned .form-group input[type="password"],
    .form.form-aligned .form-group input[type="datetime"],
    .form.form-aligned .form-group input[type="datetime-local"],
    .form.form-aligned .form-group input[type="date"],
    .form.form-aligned .form-group input[type="month"],
    .form.form-aligned .form-group input[type="time"],
    .form.form-aligned .form-group input[type="week"],
    .form.form-aligned .form-group input[type="number"],
    .form.form-aligned .form-group input[type="email"],
    .form.form-aligned .form-group input[type="url"],
    .form.form-aligned .form-group input[type="search"],
    .form.form-aligned .form-group input[type="tel"],
    .form.form-aligned .form-group input[type="color"],
    .form.form-aligned .form-group .form-control {
        display: block;
    }
    .form .form-group .form-help {
        color    : #999;
        display  : block;
        font-size: 0.8em;
        padding  : 3px 0;
    }
    .form .form-group .form-help:empty {
        display: none;
    }

/**
* Stacked Form
*/

.form.form-stacked {}
    .form.form-stacked > .form-group {
        position     : relative;
        margin-bottom: 0.6667rem;
    }
    .form.form-stacked > .form-group > label:not(.checkbox) {
        display   : none;
        visibility: hidden;
    }
    .form.form-stacked > .form-group > label.checkbox {
        display      : block;
        margin-bottom: 0.6667rem;
    }

    .form.form-stacked > .form-group > select,
    .form.form-stacked > .form-group > textarea,
    .form.form-stacked > .form-group > input[type="text"],
    .form.form-stacked > .form-group > input[type="password"],
    .form.form-stacked > .form-group > input[type="datetime"],
    .form.form-stacked > .form-group > input[type="datetime-local"],
    .form.form-stacked > .form-group > input[type="date"],
    .form.form-stacked > .form-group > input[type="month"],
    .form.form-stacked > .form-group > input[type="time"],
    .form.form-stacked > .form-group > input[type="week"],
    .form.form-stacked > .form-group > input[type="number"],
    .form.form-stacked > .form-group > input[type="email"],
    .form.form-stacked > .form-group > input[type="url"],
    .form.form-stacked > .form-group > input[type="search"],
    .form.form-stacked > .form-group > input[type="tel"],
    .form.form-stacked > .form-group > input[type="color"],
    .form.form-stacked > .form-group > .form-control {
        display      : block;
        width        : 100%;
    }

/**
* Input with icons
*/
.form .form-group.group-icon {
    position: relative;
}

    .form .form-group.group-icon > select,
    .form .form-group.group-icon > textarea,
    .form .form-group.group-icon > input[type="text"],
    .form .form-group.group-icon > input[type="password"],
    .form .form-group.group-icon > input[type="datetime"],
    .form .form-group.group-icon > input[type="datetime-local"],
    .form .form-group.group-icon > input[type="date"],
    .form .form-group.group-icon > input[type="month"],
    .form .form-group.group-icon > input[type="time"],
    .form .form-group.group-icon > input[type="week"],
    .form .form-group.group-icon > input[type="number"],
    .form .form-group.group-icon > input[type="email"],
    .form .form-group.group-icon > input[type="url"],
    .form .form-group.group-icon > input[type="search"],
    .form .form-group.group-icon > input[type="tel"],
    .form .form-group.group-icon > input[type="color"],
    .form .form-group.group-icon > .form-control {
    padding-left: 34px;
}

    .form .form-group.group-icon.icon-right > select,
    .form .form-group.group-icon.icon-right > textarea,
    .form .form-group.group-icon.icon-right > input[type="text"],
    .form .form-group.group-icon.icon-right > input[type="password"],
    .form .form-group.group-icon.icon-right > input[type="datetime"],
    .form .form-group.group-icon.icon-right > input[type="datetime-local"],
    .form .form-group.group-icon.icon-right > input[type="date"],
    .form .form-group.group-icon.icon-right > input[type="month"],
    .form .form-group.group-icon.icon-right > input[type="time"],
    .form .form-group.group-icon.icon-right > input[type="week"],
    .form .form-group.group-icon.icon-right > input[type="number"],
    .form .form-group.group-icon.icon-right > input[type="email"],
    .form .form-group.group-icon.icon-right > input[type="url"],
    .form .form-group.group-icon.icon-right > input[type="search"],
    .form .form-group.group-icon.icon-right > input[type="tel"],
    .form .form-group.group-icon.icon-right > input[type="color"],
    .form .form-group.group-icon.icon-right > .form-control {
    padding-left: 0.6667rem;
    padding-right: 34px;
}

.form .form-group.group-icon > .form-icon {
    display    : block;
    position   : absolute;
    left       : 0;
    top        : 0;
    padding    : 0 0.8rem;
    margin     : 0;
    width      : 34px;
    text-align: center;
    line-height: 29px;
}
.form .form-group.group-icon.icon-right > .form-icon {
    right: 0;
    left : auto;
    top  : 0;
}

/**
* Input Sizes
*/

select.input-mini,
textarea.input-mini,
input[type="text"].input-mini,
input[type="password"].input-mini,
input[type="datetime"].input-mini,
input[type="datetime-local"].input-mini,
input[type="date"].input-mini,
input[type="month"].input-mini,
input[type="time"].input-mini,
input[type="week"].input-mini,
input[type="number"].input-mini,
input[type="email"].input-mini,
input[type="url"].input-mini,
input[type="search"].input-mini,
input[type="tel"].input-mini,
input[type="color"].input-mini {
    font-size: .71428571em;
    padding  : 0.200em 0.333em;
    width    : 60px;
}

select.input-small,
textarea.input-small,
input[type="text"].input-small,
input[type="password"].input-small,
input[type="datetime"].input-small,
input[type="datetime-local"].input-small,
input[type="date"].input-small,
input[type="month"].input-small,
input[type="time"].input-small,
input[type="week"].input-small,
input[type="number"].input-small,
input[type="email"].input-small,
input[type="url"].input-small,
input[type="search"].input-small,
input[type="tel"].input-small,
input[type="color"].input-small {
    font-size: .92857143em;
    padding  : 0.333em 0.6667rem;
    width    : 90px;
}

select.input-large,
textarea.input-large,
input[type="text"].input-large,
input[type="password"].input-large,
input[type="datetime"].input-large,
input[type="datetime-local"].input-large,
input[type="date"].input-large,
input[type="month"].input-large,
input[type="time"].input-large,
input[type="week"].input-large,
input[type="number"].input-large,
input[type="email"].input-large,
input[type="url"].input-large,
input[type="search"].input-large,
input[type="tel"].input-large,
input[type="color"].input-large {
    font-size: 1.14285714em;
    padding  : 0.6667rem 1.000em;
    width    : 210px;
}

select.input-xlarge,
textarea.input-xlarge,
input[type="text"].input-xlarge,
input[type="password"].input-xlarge,
input[type="datetime"].input-xlarge,
input[type="datetime-local"].input-xlarge,
input[type="date"].input-xlarge,
input[type="month"].input-xlarge,
input[type="time"].input-xlarge,
input[type="week"].input-xlarge,
input[type="number"].input-xlarge,
input[type="email"].input-xlarge,
input[type="url"].input-xlarge,
input[type="search"].input-xlarge,
input[type="tel"].input-xlarge,
input[type="color"].input-xlarge {
    font-size: 1.28571429em;
    padding  : 1.000em 1.333em;
    width    : 268px;
}

select.input-block,
textarea.input-block,
input[type="text"].input-block,
input[type="password"].input-block,
input[type="datetime"].input-block,
input[type="datetime-local"].input-block,
input[type="date"].input-block,
input[type="month"].input-block,
input[type="time"].input-block,
input[type="week"].input-block,
input[type="number"].input-block,
input[type="email"].input-block,
input[type="url"].input-block,
input[type="search"].input-block,
input[type="tel"].input-block,
input[type="color"].input-block {
    width: 100%;
    display: block !important;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

/**
* Input Colors (Alerts)
*/

.form .form-group.form-warning input:not([type="checkbox"]),
input:not([type="checkbox"]).warning {
    border-color    : #dbb1b1;
    color           : #d95c5c;
}

.form .form-group.form-error input:not([type="checkbox"]),
input:not([type="checkbox"]).error {
    border-color    : #b94a48 !important;
    color           : #b94a48 !important;
}

.form .form-group.form-success input:not([type="checkbox"]),
input:not([type="checkbox"]).success {
    border-color    : #468847;
    color           : #468847;
}

.form .form-group.form-info input:not([type="checkbox"]),
input:not([type="checkbox"]).info {
    border-color    : #3a87ad;
    color           : #3a87ad;
}

input[type="radio"] {
    vertical-align: middle;
}

/*=================================================================
[11. Gallery / .gallery]
=================================================================*/

.gallery {
    *zoom     : 1;
    list-style: none;
    margin    : 0;
    padding   : 0 0;
}
.gallery:before,
.gallery:after {
    content    : " ";
    display    : block;
    line-height: 0;
}
.gallery:after {
    clear: both;
}

    .gallery .item {
        background-color: #fff;
        display         : inline-block;
        padding         : 2px;
        position        : relative;
        z-index         : 1;
        overflow        : hidden;
    }
    .gallery .item:hover {
        z-index: 9999;
    }

        .gallery .item img {
            display  : block;
            max-width: 100%;
            width    : 100%;
            height   : auto;
            z-index  : 2;
        }

        .gallery .item .caption {
            background-color: #fff;
            bottom          : 2px;
            color           : inherit;
            display         : block;
            font-size       : inherit;
            left            : 2px;
            margin          : 0;
            padding         : 2px 5px;
            position        : absolute;
            z-index         : 3;
        }
        .gallery .item .caption.top {
            top   : 2px;
            bottom: auto;
        }
        .gallery .item .caption.bottom {
            bottom: 2px;
            top   : auto;
        }
        .gallery .item .caption.left {
            left  : 2px;
            right : auto;
        }
        .gallery .item .caption.right {
            left  : auto;
            right : 2px;
        }

        .gallery .item .caption.center {
            left: 0;
            right: 0;
            margin-left: auto;
            margin-right: auto;
        }

        .gallery .item .caption.purple {
            background-color: #862165;
            color           : #fefefe !important;
        }
        .gallery .item .caption.blue {
            background-color: #4890a8;
            color           : #fefefe !important;
        }
        .gallery .item .caption.green {
            background-color: #5bb75b;
            color           : #fefefe !important;
        }
        .gallery .item .caption.orange {
            background-color: #faa732;
            color           : #fefefe !important;
        }
        .gallery .item .caption.red {
            background-color: #da4f49;
            color           : #fefefe !important;
        }
        .gallery .item .caption.pink {
            background-color: #db35c0;
            color           : #fefefe !important;
        }
        .gallery .item .caption.black {
            background-color: #363636 !important;
            color           : #fefefe !important;
        }

/*=================================================================
[12. Grid System]
=================================================================*/

/**
* Container
*/
.container-fluid,
.container {
    position  : relative;
    width     : 100%;
    margin    : 0 auto;
    padding   : 0 4%;
    clear     : both;
    box-sizing: border-box;
}

.container-fluid {
    max-width: 100%;
}

.container {
    max-width: 1140px;
}

/**
* Row
*/
.container-fluid:before,
.container-fluid:after,
.container:before,
.container:after,
.row:before,
.row:after {
    content: "";
    display: table;
    clear  : both;
}

.container-fluid:after,
.container:after,
.row:after {
    clear: both;
}

.row {zoom: 1}

@media (min-width: 400px) {
  .container {
    width: 85%;
    padding: 0; }
}

@media (min-width: 550px) {
  .container {
    width: 80%; }
}

/**
* Row
*/
.row {
    *zoom: 1;
}
.row:before,
.row:after {
    content    : ".";
    display    : block;
    line-height: 0;
    overflow   : hidden;
}
.row:after {
    clear: both;
}
.row + .row {
    margin-top: 1.000em;
}

/**
* Columns
*/
.col-x-1, .col-x-2, .col-x-3, .col-x-4, .col-x-5, .col-x-6, .col-x-7, .col-x-8, .col-x-9, .col-x-10, .col-x-11, .col-x-12,
.col-s-1, .col-s-2, .col-s-3, .col-s-4, .col-s-5, .col-s-6, .col-s-7, .col-s-8, .col-s-9, .col-s-10, .col-s-11, .col-s-12,
.col-m-1, .col-m-2, .col-m-3, .col-m-4, .col-m-5, .col-m-6, .col-m-7, .col-m-8, .col-m-9, .col-m-10, .col-m-11, .col-m-12,
.col-l-1, .col-l-2, .col-l-3, .col-l-4, .col-l-5, .col-l-6, .col-l-7, .col-l-8, .col-l-9, .col-l-10, .col-l-11, .col-l-12 {
    position: relative;
    min-height: 1px;
    width: 100%;
    float: left;
    box-sizing: border-box;
}

.col-x-1 {width: 4.66666666667%}
.col-x-2 {width: 13.3333333333%}
.col-x-3 {width: 22%}
.col-x-4 {width: 30.6666666667%}
.col-x-5 {width: 39.3333333333%}
.col-x-6 {width: 48%}
.col-x-7 {width: 56.6666666667%}
.col-x-8 {width: 65.3333333333%}
.col-x-9 {width: 74.0%}
.col-x-10 {width: 82.6666666667%}
.col-x-11 {width: 91.3333333333%}
.col-x-12 {width: 100%; margin-left: 0}
/* pushes */
.push-col-x-1 {left: 8.66666666667%}
.push-col-x-2 {left: 17.3333333333%}
.push-col-x-3 {left: 26%}
.push-col-x-4 {left: 34.6666666667%}
.push-col-x-5 {left: 43.3333333333%}
.push-col-x-6 {left: 52%}
.push-col-x-7 {left: 60.6666666667%}
.push-col-x-8 {left: 69.3333333333%}
.push-col-x-9 {left: 78.0%}
.push-col-x-10 {left: 86.6666666667%}
.push-col-x-11 {left: 95.3333333333%}

@media (min-width: 768px) {
    .col-x-1, .col-x-2, .col-x-3, .col-x-4, .col-x-5, .col-x-6, .col-x-7, .col-x-8, .col-x-9, .col-x-10, .col-x-11, .col-x-12,
    .col-s-1, .col-s-2, .col-s-3, .col-s-4, .col-s-5, .col-s-6, .col-s-7, .col-s-8, .col-s-9, .col-s-10, .col-s-11, .col-s-12,
    .col-m-1, .col-m-2, .col-m-3, .col-m-4, .col-m-5, .col-m-6, .col-m-7, .col-m-8, .col-m-9, .col-m-10, .col-m-11, .col-m-12,
    .col-l-1, .col-l-2, .col-l-3, .col-l-4, .col-l-5, .col-l-6, .col-l-7, .col-l-8, .col-l-9, .col-l-10, .col-l-11, .col-l-12 {
        margin-left: 4% !important;
    }
    .col-x-1:first-child, .col-x-2:first-child, .col-x-3:first-child, .col-x-4:first-child, .col-x-5:first-child, .col-x-6:first-child,
    .col-x-7:first-child, .col-x-8:first-child, .col-x-9:first-child, .col-x-10:first-child, .col-x-11:first-child, .col-x-12:first-child,

    .col-s-1:first-child, .col-s-2:first-child, .col-s-3:first-child, .col-s-4:first-child, .col-s-5:first-child, .col-s-6:first-child,
    .col-s-7:first-child, .col-s-8:first-child, .col-s-9:first-child, .col-s-10:first-child, .col-s-11:first-child, .col-s-12:first-child,

    .col-m-1:first-child, .col-m-2:first-child, .col-m-3:first-child, .col-m-4:first-child, .col-m-5:first-child, .col-m-6:first-child,
    .col-m-7:first-child, .col-m-8:first-child, .col-m-9:first-child, .col-m-10:first-child, .col-m-11:first-child, .col-m-12:first-child,

    .col-l-1:first-child, .col-l-2:first-child, .col-l-3:first-child, .col-l-4:first-child, .col-l-5:first-child, .col-l-6:first-child,
    .col-l-7:first-child, .col-l-8:first-child, .col-l-9:first-child, .col-l-10:first-child, .col-l-11:first-child, .col-l-12:first-child {
        margin-left: 0 !important;
    }
}

@media (max-width: 768px) {
    *[class*="col-"] + *[class*="col-"] {
        margin-top: 2%;
    }
}

@media (min-width: 768px) {
    .col-s-1 {width: 4.66666666667%}
    .col-s-2 {width: 13.3333333333%}
    .col-s-3 {width: 22%}
    .col-s-4 {width: 30.6666666667%}
    .col-s-5 {width: 39.3333333333%}
    .col-s-6 {width: 48%}
    .col-s-7 {width: 56.6666666667%}
    .col-s-8 {width: 65.3333333333%}
    .col-s-9 {width: 74.0%}
    .col-s-10 {width: 82.6666666667%}
    .col-s-11 {width: 91.3333333333%}
    .col-s-12 {width: 100%; margin-left: 0}
    /* pushes */
    .push-col-s-1 {left: 8.66666666667%}
    .push-col-s-2 {left: 17.3333333333%}
    .push-col-s-3 {left: 26%}
    .push-col-s-4 {left: 34.6666666667%}
    .push-col-s-5 {left: 43.3333333333%}
    .push-col-s-6 {left: 52%}
    .push-col-s-7 {left: 60.6666666667%}
    .push-col-s-8 {left: 69.3333333333%}
    .push-col-s-9 {left: 78.0%}
    .push-col-s-10 {left: 86.6666666667%}
    .push-col-s-11 {left: 95.3333333333%}
}
@media (min-width: 992px) {
    .col-m-1 {width: 4.66666666667%}
    .col-m-2 {width: 13.3333333333%}
    .col-m-3 {width: 22%}
    .col-m-4 {width: 30.6666666667%}
    .col-m-5 {width: 39.3333333333%}
    .col-m-6 {width: 48%}
    .col-m-7 {width: 56.6666666667%}
    .col-m-8 {width: 65.3333333333%}
    .col-m-9 {width: 74.0%}
    .col-m-10 {width: 82.6666666667%}
    .col-m-11 {width: 91.3333333333%}
    .col-m-12 {width: 100%; margin-left: 0}
    /* pushes */
    .push-col-m-1 {left: 8.66666666667%}
    .push-col-m-2 {left: 17.3333333333%}
    .push-col-m-3 {left: 26%}
    .push-col-m-4 {left: 34.6666666667%}
    .push-col-m-5 {left: 43.3333333333%}
    .push-col-m-6 {left: 52%}
    .push-col-m-7 {left: 60.6666666667%}
    .push-col-m-8 {left: 69.3333333333%}
    .push-col-m-9 {left: 78.0%}
    .push-col-m-10 {left: 86.6666666667%}
    .push-col-m-11 {left: 95.3333333333%}
}
@media (min-width: 1200px) {
    .col-l-1 {width: 4.66666666667%}
    .col-l-2 {width: 13.3333333333%}
    .col-l-3 {width: 22%}
    .col-l-4 {width: 30.6666666667%}
    .col-l-5 {width: 39.3333333333%}
    .col-l-6 {width: 48%}
    .col-l-7 {width: 56.6666666667%}
    .col-l-8 {width: 65.3333333333%}
    .col-l-9 {width: 74.0%}
    .col-l-10 {width: 82.6666666667%}
    .col-l-11 {width: 91.3333333333%}
    .col-l-12 {width: 100%; margin-left: 0}
    /* pushes */
    .push-col-l-1 {left: 8.66666666667%}
    .push-col-l-2 {left: 17.3333333333%}
    .push-col-l-3 {left: 26%}
    .push-col-l-4 {left: 34.6666666667%}
    .push-col-l-5 {left: 43.3333333333%}
    .push-col-l-6 {left: 52%}
    .push-col-l-7 {left: 60.6666666667%}
    .push-col-l-8 {left: 69.3333333333%}
    .push-col-l-9 {left: 78.0%}
    .push-col-l-10 {left: 86.6666666667%}
    .push-col-l-11 {left: 95.3333333333%}
}

*[class*="col-"].col-centered {
    margin: 0 auto;
    float: none;
}

/*=================================================================
[13. Hero Unit / .hero ]
=================================================================*/

.hero {
    background-color: #eee;
    color           : inherit;
    padding         : 2rem;
}

.container .hero {
    border-radius: 3px;
}

.hero + .hero {
    margin-top   : 1.333rem;
}

.hero h1,
.hero .h1 {
    color: inherit;
}

.hero p {
    font-size    : 1.4em;
    font-weight  : 300;
    margin-bottom: 1.000em;
}

.hero hr {
    border-top-color: #d5d5d5
}

.hero .container {
    max-width: 100%;
}

@media (min-width: 768px) {
    .hero { padding-bottom: 48px; padding-top: 48px; }
    .hero h1, .hero .h1 { font-size: 63px; }
}

@media (min-width: 992px) {
    .hero { padding-bottom: 30px; padding-top: 30px; }
    .hero h1, .hero .h1 { font-size: 63px; }
}

/*=================================================================
[14. Images]
=================================================================*/

img {
    vertical-align: bottom;
    border        : 0;
}

.img {
    display: block;
}
/* image with rounded corners */
.img.rounded,
img.rounded {
            border-radius: 6px;
         -o-border-radius: 6px;
        -ms-border-radius: 6px;
       -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}

/* image circle */
.img.circle,
img.circle {
        border-radius: 50%;
     -o-border-radius: 50%;
    -ms-border-radius: 50%;
   -moz-border-radius: 50%;
-webkit-border-radius: 50%;
}

/* image as thumbnail */
.img.thumbnail,
img.thumbnail {
    background-color     : #fff;
    background-image     : none;
    border               : 1px solid #ddd;
    padding              : 2px;
}

/* fluid/responsibe image */
.img.fluid,
img.fluid{
    display  : block;
    height   : auto;
    max-width: 100%;
}

/* vertical align */
.img.valign-top,
img.valign-top {
    display       : inline-block;
    vertical-align: top;
}

.img.valign-middle,
img.valign-middle {
    display       : inline-block;
    vertical-align: middle;
}

.img.valign-bottom,
img.valign-bottom {
    display       : inline-block;
    vertical-align: bottom;
}

/*=================================================================
[15. Labels and Badges / .label & .badge]
=================================================================*/

.label,
.badge {
    background-color     : #e8e8e8;
    color                : #555;
    display              : inline-block;
    font-size            : 0.8em;
    font-weight          : bold;
    line-height          : 1;
    text-decoration      : none;
    white-space          : nowrap;
    text-transform       : none;
    font-weight          : 700;
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
        -ms-border-radius: 3px;
         -o-border-radius: 3px;
            border-radius: 3px;
    -webkit-transition   : background .2s ease;
       -moz-transition   : background .2s ease;
        -ms-transition   : background .2s ease;
         -o-transition   : background .2s ease;
            transition   : background .2s ease;
}

.label.label-image {
    position      : relative;
    width         : auto;
    max-width     : 100%;
    vertical-align: baseline;
    text-transform: none;
    padding       : 0.4667rem 0.6667rem 0.4667rem 0.4rem;
}
.label.label-image > img {
    -webkit-border-radius: 3px 0 0 3px;
       -moz-border-radius: 3px 0 0 3px;
        -ms-border-radius: 3px 0 0 3px;
         -o-border-radius: 3px 0 0 3px;
            border-radiuspx 0 0 3px;
    display: inline-block;
    vertical-align: top;
    margin: -0.4667rem 0.4rem -0.4667rem -0.4rem;
}

.label {
    padding: .5em .7em;
    margin: .1em;
    vertical-align  : baseline;
}

.badge {
    padding              : 2px 5px;
    margin               : 1px 2px;
    min-width            : 0.6667rem;
    text-align           : center;
    vertical-align       : middle;
    white-space          : nowrap;
    -webkit-border-radius: 2em;
       -moz-border-radius: 2em;
        -ms-border-radius: 2em;
         -o-border-radius: 2em;
            border-radius: 2em;
}

.label + .label,
.label + .badge,
.badge + .label,
.badge + .badge {
    margin-left: 5px;
}

.label > .label-close,
.badge > .badge-close {
    cursor            : pointer;
    margin-right      : 0;
    margin-left       : .5em;
    opacity           : .3;
    -webkit-transition: background .2s ease;
    transition        : background .2s ease;
}
.label > .label-close:hover,
.badge > .badge-close:hover {
    opacity           : .7;
}

/**
* Empty Labels and Badges
*/
.label:empty,
.badge:empty {
    display   : none;
    visibility: hidden;
}

/**
* Link labels and badges
*/
a.label:hover,
a.label:focus,
a.badge:hover,
a.badge:focus {
    background-color: #E0E0E0;
    cursor          : pointer;
    text-decoration : none;
}

/**
* Labels and Badges Colors
*/

/* purple */
.label.label-purple,
.badge.badge-purple {
    background-color: #862165;
    color           : #fff;
}
a.label.label-purple:focus,
a.label.label-purple:active,
a.label.label-purple:hover,
a.badge.badge-purple:focus,
a.badge.badge-purple:active,
a.badge.badge-purple:hover {
    background-color: #862165;
    color           : #fff;
}

/* blue */
.label.label-blue,
.badge.badge-blue {
    background-color: #4890a8;
    color           : #fff;
}
a.label.label-blue:focus,
a.label.label-blue:active,
a.label.label-blue:hover,
a.badge.badge-blue:focus,
a.badge.badge-blue:active,
a.badge.badge-blue:hover {
    background-color: #186078;
    color           : #fff;
}

/* green */
.label.label-green,
.badge.badge-green {
    background-color: #5bb75b;
    color           : #fff;
}
a.label.label-green:focus,
a.label.label-green:active,
a.label.label-green:hover,
a.badge.badge-green:focus,
a.badge.badge-green:active,
a.badge.badge-green:hover {
    background-color: #51a351;
    color           : #fff;
}

/* orange */
.label.label-orange,
.badge.badge-orange {
    background-color: #faa732;
    color           : #fff;
}
a.label.label-orange:focus,
a.label.label-orange:active,
a.label.label-orange:hover,
a.badge.badge-orange:focus,
a.badge.badge-orange:active,
a.badge.badge-orange:hover {
    background-color: #f89406;
    color           : #fff;
}

/* red */
.label.label-red,
.badge.badge-red {
    background-color: #da4f49;
    color           : #fff;
}
a.label.label-red:focus,
a.label.label-red:active,
a.label.label-red:hover,
a.badge.badge-red:focus,
a.badge.badge-red:active,
a.badge.badge-red:hover {
    background-color: #bd362f;
    color           : #fff;
}

/* pink */
.label.label-pink,
.badge.badge-pink {
    background-color: #db35c0;
    color           : #fff;
}
a.label.label-pink:focus,
a.label.label-pink:active,
a.label.label-pink:hover,
a.badge.badge-pink:focus,
a.badge.badge-pink:active,
a.badge.badge-pink:hover {
    background-color: #ba29a2;
    color           : #fff;
}

/* black */
.label.label-black,
.badge.badge-black {
    background-color: #363636;
    color           : #fff;
}
a.label.label-black:focus,
a.label.label-black:active,
a.label.label-black:hover,
a.badge.badge-black:focus,
a.badge.badge-black:active,
a.badge.badge-black:hover {
    background-color: #222222;
    color           : #fff;
}

/* white */
.label.label-white,
.badge.badge-white {
    background-color: #fff;
    color           : #666;
}
a.label.label-white:focus,
a.label.label-white:active,
a.label.label-white:hover,
a.badge.badge-white:focus,
a.badge.badge-white:active,
a.badge.badge-white:hover {
    background-color: #eee;
    color           : #333;
}

/*=================================================================
[16. List table / .list-table]
=================================================================*/

.list-table {
    list-style: none;
    margin    : 0;
    padding   : 0;
    text-align: left;
}
    .list-table > .item {
        background-color: #fff;
        border          : 1px solid #ddd;
        display         : block;
        margin-bottom   : -1px;
        padding         : 0.4667rem 0.6667rem;
        position        : relative;
        text-decoration : none;
    }
    .list-table.hovered > .item:hover,
    .list-table > a.item:active,
    .list-table > a.item:focus,
    .list-table > a.item:hover {
        background-color: #f5f5f5;
        text-decoration: none;
    }
    .list-table > .item > .badge,
    .list-table > .item > .label {
        float: right;
    }

/*=================================================================
[17. Media / .media]
=================================================================*/

.media {
    display : block;
    padding : 0.3333rem 1.000em 0.3333rem 0.3333rem;
    position: relative;
}
.media:before, .media:after {
    content: " ";
    display: block;
}
.media:after {
    clear: both;
}
.media + .media {
    margin-top: 0.6667rem;
}
    .media > .media-object {
        display     : block;
        float       : left;
        margin-right: 0.6667rem;
    }
    .media > .media-content {
        overflow: hidden;
        zoom    : 1;
        padding: 0;
    }
    .media > .media-content > .media-title {
        display  : block;
        font-size: 0.8667em;
        padding  : 0;
    }
    .media > .media-content > .media-title > small {
        color      : #989898;
        float      : right;
        font-size  : 0.7333em;
        font-weight: normal;
    }
    .media > .media-content > .media-subtitle {
        color      : #87868c;
        display    : block;
        font-weight: 400;
        font-size  : 0.6667em;
        padding    : 0;
    }

    .media > .media-action {
        position: absolute;
        top: 0.3333rem;
        right: 0.3333rem;
    }

        .media > .media-action > a:link,
        .media > .media-action > a:visited {}

        .media > .media-action > a:focus,
        .media > .media-action > a:active,
        .media > .media-action > a:hover {}

/*=================================================================
[18. Menu / .menu]
=================================================================*/

.menu {
    list-style-type : none;
    display         : block;
    background-color: transparent;
    margin          : 0.3333rem 0;
    padding: 0;
}
.menu:after {
    content: ".";
    line-height: 0;
    display: block;
    overflow: hidden;
}
.menu.menu-rounded {
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
        -ms-border-radius: 3px;
         -o-border-radius: 3px;
            border-radius: 3px;
}

.menu:only-child {
    margin: 0;
}

.menu > li {
    position       : relative;
    display        : inline-block;
    vertical-align : middle;
    text-decoration: none;
    float          : left;
}

.menu > li.divider {
    display         : inline-block;
    width           : 1px;
    padding         : 0.4667rem 0;
    background-color: #ddd;
}
.menu > li.header {
    padding   : 0.4667rem 0.8rem;
    border    : none;
    background: #f9f9f9;
    color     : #ccc;
}
.menu > li.header > span,
.menu > li.header > a {
    padding: 0;
}

.menu > li:not(.header) > span,
.menu > li:not(.header) > a {
    display: block;
    padding: 0.4667rem 0.8rem;
}

.menu:not(.menu-vertical) > li > a > i.fa {
    float: none;
}
.menu:not(.menu-vertical) > li i.fa.fa-caret-right,
.menu:not(.menu-vertical) > li i.fa.fa-caret-left,
.menu:not(.menu-vertical) > li i.fa.fa-caret-up,
.menu:not(.menu-vertical) > li i.fa.fa-caret-down,
.menu:not(.menu-vertical) > li i.fa.fa-angle-right,
.menu:not(.menu-vertical) > li i.fa.fa-angle-left,
.menu:not(.menu-vertical) > li i.fa.fa-angle-up,
.menu:not(.menu-vertical) > li i.fa.fa-angle-down {
    opacity: .5
}

.menu:not(.menu-vertical) > li.active > a > i.fa,
.menu:not(.menu-vertical) > li.active > span > i.fa,
.menu:not(.menu-vertical) > li:hover > a > i.fa,
.menu:not(.menu-vertical) > li:hover > span > i.fa,
.menu:not(.menu-vertical) > li > a:focus > i.fa,
.menu:not(.menu-vertical) > li > a:active > i.fa,
.menu:not(.menu-vertical) > li > a:hover > i.fa {
    opacity: 1;
}
.menu.menu-top > li > ul {
    top: 0;
    bottom: auto;
}

.btn-dropdown > ul,
.menu > li > ul {
    padding              : 0.3333rem 0;
    position             : absolute;
    top                  : 100%;
    left                 : 0;
    z-index              : 1050;
    display              : none;
    margin-top           : 0;
    background-color     : #fff;
    -webkit-border-radius: 3px;
            border-radius: 3px;
    -webkit-box-shadow   : 0 1px 3px 0 rgba(0,0,0,.3);
            box-shadow   : 0 1px 3px 0 rgba(0,0,0,.3);
}

.btn-dropdown > ul.menu-right,
.menu.menu-right > li > ul {
    top: 100%;
    left: auto;
    right: 0;
}

.btn-dropdown > ul.menu-top,
.menu.menu-top > li > ul {
    top: auto !important;
    bottom: 100% !important;
}

.btn-dropdown > ul > li,
.menu > li > ul > li {
    display  : block;
    min-width: 120px;
    width: auto;
    padding  : 0;
}

.btn-dropdown > ul.menu-auto > li,
.menu > li > ul.menu-auto > li {
    min-width: 0;
}

.btn-dropdown > ul > li.divider {
    display: block;
    height: 1px;
    background-color: #ddd;
    margin: 0.3333rem 0;
    overflow: hidden;
    padding: 0;
}

.btn-dropdown > ul > li > span,
.btn-dropdown > ul > li > a:link,
.btn-dropdown > ul > li > a:visited,
.menu > li > span,
.menu > li > a {
    color          : #555;
    text-decoration: none;
    text-align     : left;
    cursor         : pointer;
}

.btn-dropdown > ul > li a > img,
.menu > li a > img {
    vertical-align: middle;
}

.menu > li > ul > li.header {
    padding: 0.467em 0.800em;
    font-weight: 700;
    color: rgba(0,0,0,.8);
}

.menu > li > ul > li:first-child.header {
    margin-top           : -0.3333rem;
    -webkit-border-radius: 0.3333rem 0.3333rem 0 0;
    border-radius        : 0.3333rem 0.3333rem 0 0;
}

.menu > li > ul > li:last-child.header {
    margin-bottom           : -0.3333rem;
    -webkit-border-radius: 0 0 0.3333rem 0.3333rem;
    border-radius        : 0 0 0.3333rem 0.3333rem;
}

.btn-dropdown > ul > li:not(.header) > a,
.menu > li ul > li:not(.header) > a {
    display        : block;
    padding        : 0.467em 0.800em;
    text-decoration: none;
    color          : rgba(0,0,0,.8);
    overflow        : hidden;
    text-overflow   : ellipsis;
    white-space     : nowrap;
}

.btn-dropdown ul li > a > img,
.btn-dropdown ul li > span > img,
.menu li > span > img,
.menu li > a > img {
    vertical-align: middle;
}

.btn-dropdown > ul > li:not(.header).active > a,
.btn-dropdown > ul > li:not(.header):hover > a,
.btn-dropdown > ul > li:not(.header) > a:focus,
.btn-dropdown > ul > li:not(.header) > a:hover,
.menu > li:not(.header).active > a,
.menu > li:not(.header).active > span,
.menu > li:not(.header):hover > a,
.menu > li:not(.header):hover > span,
.menu > li:not(.header) > a:hover,
.menu > li:not(.header) > a:focus,
.menu > li:not(.header) ul > li:not(.header):hover > a,
.menu > li:not(.header) ul > li:not(.header):hover > span,
.menu > li:not(.header) ul > li:not(.header).active > a,
.menu > li:not(.header) ul > li:not(.header).active > span,
.menu > li:not(.header) ul > li:not(.header) > a:hover,
.menu > li:not(.header) ul > li:not(.header) > a:focus {
    background-color: rgba(0,0,0,.05);
    color: rgba(0,0,0,.95);
}

/* vertical menu */
.menu.menu-vertical {}

.menu.menu-vertical > li {
    display: block;
    padding: 0;
    float: none;
}

.menu.menu-vertical > li:not(.header) > span,
.menu.menu-vertical > li:not(.header) > a {
    position        : relative;
    background-color: #fff;
    color           : #555;
    display         : block;
    padding         : 7px 1.000em;
    position        : relative;
    text-decoration : none;
    overflow        : hidden;
    text-overflow   : ellipsis;
    white-space     : nowrap;
    cursor          : pointer;
}
.menu.menu-vertical > li + li {
    border-top: 1px solid #f9f9f9;
}

.menu.menu-vertical > li > span,
.menu.menu-vertical > li.active > a,
.menu.menu-vertical > li:hover > a,
.menu.menu-vertical > li.active > a,
.menu.menu-vertical > li > a:active,
.menu.menu-vertical > li > a:focus,
.menu.menu-vertical > li > a:hover {
    background-color: #f5f5f5;
    text-decoration: none;
}
.menu.menu-vertical > li:not(.header) > span {
    color  : #666;
    padding: 7px;
}
.menu.menu-vertical > li.header {
    padding       : 7px;
    text-transform: uppercase;
    font-size     : 0.8em
}
.menu.menu-vertical > li.divider {
    height          : 1px;
    width           : 100%;
    margin          : 5px 0;
    overflow        : hidden;
    background-color: #fff;
}

.menu.menu-vertical > li > span > .badge,
.menu.menu-vertical > li > span > .label,
.menu.menu-vertical > li > a > .badge,
.menu.menu-vertical > li > a > .label {
    position: absolute;
    right   : 1.000em;
    top     : 3px;
}

.menu > li > ul > li > ul,
.menu.menu-vertical > li > ul {
    top: 0;
    left: 100%;
}

.btn-dropdown.open > ul,
.menu > li.active > ul,
.menu > li:hover > ul {
    display: block;
}

.menu > li > ul > li.divider {
    height: 1px;
    margin: 5px 0;
    overflow: hidden;
    background-color: #e5e5e5;
}

.btn-dropdown {
    display : inline-block;
    position: relative;
}

.menu.menu-inline {
    display: inline-block;
}

/*=================================================================
[19. Modal / .modal]
=================================================================*/

.modal {
    background-color: rgba(0,0,0,.85);
    height          : 100%;
    position        : fixed;
    left            : 0;
    top             : 0;
    right           : 0;
    bottom          : 0;
    width           : 100%;
    z-index         : 1051;
    display         : none;
    visibility      : hidden;
}
.modal.open {
    display   : block;
    visibility: visible;
}

.modal .modal-inner {
    background-color: #f5f5f5;
    margin          : 75px auto;
    width           : 600px;
}

@media (max-width: 767px) {
    .modal .modal-inner {
        margin          : 20% auto;
        width           : 95%;
    }
}

.modal .modal-inner > .modal-header {
    padding : 0.6667rem 1.000em;
    position: relative;
}

.modal .modal-inner .modal-header .modal-close {
    color          : #999;
    position       : absolute;
    right          : 0.6667rem;
    text-decoration: none;
    top            : 5px;
}

.modal .modal-inner .modal-header .modal-close:hover {
    color: #333;
}

.modal .modal-inner .modal-header .modal-title {
    color      : #666;
    font-size  : 1.2em;
    font-weight: 500;
    margin     : 0;
    padding    : 0;
}

.modal .modal-inner .modal-content {
    background   : #fff;
    border-bottom: 1px solid #ccc;
    border-top   : 1px solid #ccc;
    padding      : 0.6667rem 1.000em;
    overflow-x   : hidden;
    overflow-y   : auto;
}

.modal .modal-inner .modal-footer {
    padding : 0.6667rem 1.000em;
    position: relative;
}

/*=================================================================
[20. Pager / .pager]
=================================================================*/

.pager {
    list-style-type: none;
    margin-top     : 5px;
    margin-bottom  : 5px;
    padding        : 0;
    text-align     : center;
}

.pager:before,
.pager:after {
    content    : ".";
    display    : block;
    line-height: 0;
    overflow   : hidden;
}

.pager:after {
    clear: both;
}

.pager > li {
    display: inline;
}

.pager > li > a,
.pager > li > span {
    background-color: #fff;
    display         : inline-block;
    padding         : 0.4rem 0.9333rem;
    text-decoration : none;
    border: 1px solid #ddd;
}

.pager > li:first-child > a,
.pager > li:first-child > span {
    border-radius: 50em 0 0 50em;
}

.pager > li:last-child > a,
.pager > li:last-child > span {
    border-radius: 0 50em 50em 0;
}

.pager > li:hover > a,
.pager > li > a:active,
.pager > li > a:hover,
.pager > li > a:focus {
    background-color: #e0e0e0;
    text-decoration : none !important;
}


/* pager mini */
.pager.pager-mini > li > a,
.pager.pager-mini > li > span {
    font-size: 0.714em;
    padding  : 0.214em 0.500em;
}

/* pager small */
.pager.pager-small > li > a,
.pager.pager-small > li > span {
    font-size: 0.857em;
    padding  : 0.429em 0.714em;
}

/* pager large */
.pager.pager-large > li > a,
.pager.pager-large > li > span {
    font-size: 1.286em;
    padding  : 0.786em 1.357em;
}

/* pager link */
.pager.pager-link > li a,
.pager.pager-link > li span {
    background: none;
    border    : none;
}
.pager.pager-link > li a:active,
.pager.pager-link > li a:focus,
.pager.pager-link > li a:hover {
    text-decoration: underline !important;
}

/* pager color */

/* purple pager */
.pager.pager-purple > li > a,
.pager.pager-purple > li > span {
    background-color: #862165;
    border-color    : #751b59;
    color           : #fff !important;
}
.pager.pager-purple > li > a:hover,
.pager.pager-purple > li > a:active,
.pager.pager-purple > li > a:focus {
    background-color: #751b59;
}
.pager.pager-purple > li.active > a,
.pager.pager-purple > li.active > span {
    background-color: #f3bbe1;
    color: #751b59 !important;
}

/* blue pager */
.pager.pager-blue > li > a,
.pager.pager-blue > li > span {
    background-color: #4890a8;
    border-color    : #186078;
    color           : #fff !important;
}
.pager.pager-blue > li > a:hover,
.pager.pager-blue > li > a:active,
.pager.pager-blue > li > a:focus {
    background-color: #186078;
}
.pager.pager-blue > li.active > a,
.pager.pager-blue > li.active > span {
    background-color: #b5e2f1;
    color: #4890a8 !important;
}

/* green pager */
.pager.pager-green > li > a,
.pager.pager-green > li > span {
    background-color: #5bb75b;
    border-color    : #51a351;
    color           : #fff !important;
}
.pager.pager-green > li > a:hover,
.pager.pager-green > li > a:active,
.pager.pager-green > li > a:focus {
    background-color: #51a351;
}
.pager.pager-green > li.active > a,
.pager.pager-green > li.active > span {
    background-color: #bcffbc;
    color: #5bb75b;
}

/* orange pager */
.pager.pager-orange > li > a,
.pager.pager-orange > li > span {
    background-color: #faa732;
    color           : #fff !important;
}
.pager.pager-orange > li > a:hover,
.pager.pager-orange > li > a:active,
.pager.pager-orange > li > a:focus {
    background-color: #f89406;
}
.pager.pager-orange > li.active > a,
.pager.pager-orange > li.active > span {
    background-color: #fee3bd;
    color: #faa732;
}

/* red pager */
.pager.pager-red > li > a,
.pager.pager-red > li > span {
    background-color: #da4f49;
    border-color    : #bd362f;
    color           : #fff !important;
}
.pager.pager-red > li > a:hover,
.pager.pager-red > li > a:active,
.pager.pager-red > li > a:focus {
    background-color: #bd362f;
}
.pager.pager-red > li.active > a,
.pager.pager-red > li.active > span {
    background-color: #fff0f0;
    color: #da4f49;
}

/* pink pager */
.pager.pager-pink > li > a,
.pager.pager-pink > li > span {
    background-color: #db35c0;
    color           : #fff !important;
}
.pager.pager-pink > li > a:hover,
.pager.pager-pink > li > a:active,
.pager.pager-pink > li > a:focus {
    background-color: #ba29a2;
}
.pager.pager-pink > li.active > a,
.pager.pager-pink > li.active > span {
    background-color: #fcd1f5;
    color: #db35c0 !important;
}

/* black pager */
.pager.pager-black > li > a,
.pager.pager-black > li > span {
    background-color: #363636 ;
    color           : #fff !important;
}
.pager.pager-black > li > a:hover,
.pager.pager-black > li > a:active,
.pager.pager-black > li > a:focus {
    background-color: #222222;
}
.pager.pager-black > li.active > a,
.pager.pager-black > li.active > span {
    background-color: #dfdfdf;
    color: #363636 !important;
}

/* white pager */
.pager.pager-white > li > a,
.pager.pager-white > li > span {
    background-color: #fff;
    color           : #333 !important;
}
.pager.pager-white > li > a:hover,
.pager.pager-white > li > a:active,
.pager.pager-white > li > a:focus {
    background-color: #f9f9f9;
}
.pager.pager-white > li.active > a,
.pager.pager-white > li.active > span {
    background-color: #f9f9f9;
    color: #999 !important;
}

/*=================================================================
[21. Pagination / .pagination]
=================================================================*/

.pagination {
    list-style-type: none;
    margin-top     : 5px;
    margin-bottom  : 5px;
    padding        : 0;
    border-radius  : 3px;
}

.pagination > li {display: inline}

.pagination > li > a:link,
.pagination > li > a:visited,
.pagination > li > span {
    background-color: #fff;
    border          : 1px solid #ddd;
    color           : #337ab7;
    position        : relative;
    line-height     : 1.429em;
    padding         : 0.6667rem 16px;
    text-decoration : none !important;
    margin-left     : -4px;
}

.pagination > li:first-child > a {
    margin-left: 0;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.pagination > li:last-child > a {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.pagination > li.disabled > a,
.pagination > li.active > a,
.pagination > li.disabled > span,
.pagination > li.active > span {
    color : #999 !important;
    cursor: default;
    background-color: #eee;
}

.pagination > li > a:active,
.pagination > li > a:hover,
.pagination > li > a:focus {
    background-color: #eee;
    color           : #23527c;
    text-decoration : none;
}

.pagination > li.disabled > span,
.pagination > li.disabled > a,
.pagination > li.disabled > a:hover,
.pagination > li.disabled > a:focus {
    background-color: transparent;
    color           : #999999;
    cursor          : default;
}

.pagination.push-center {
    text-align: center;
}

.pagination.push-right {
    text-align: right;
}

.pagination.push-left {
    text-align: left;
}

.pagination.pagination-mini > li > a,
.pagination.pagination-mini > li > span {
    font-size: 0.714em;
    padding  : 0.214em 0.500em;
}

.pagination.pagination-small > li > a,
.pagination.pagination-small > li > span {
    font-size: 0.857em;
    padding  : 0.429em 0.714em;
}

.pagination.pagination-large > li > a,
.pagination.pagination-large > li > span {
    font-size: 1.286em;
    padding  : 0.786em 1.357em;
}
.pagination.pagination-link > li > a,
.pagination.pagination-link > li > span {
    background: none;
    border    : none;
}
.pagination.pagination-link > li > a:active,
.pagination.pagination-link > li > a:focus,
.pagination.pagination-link > li > a:hover {
    text-decoration: underline;
}

/*=================================================================
[22. Progress bar / .progress]
=================================================================*/

.progress {
    background-color: #fff;
    border          : 1px solid #ddd;
    min-height      : 1.000em;
    margin-top      : 5px;
    margin-bottom   : 5px;
    overflow        : hidden;
}

/* progress bar fill */
.fill {
    display           : inline-block;
    min-height        : 1.000em;
    vertical-align    : top;
    zoom              : 1;
    *display          : inline;
    float             : left;
    background-color  : #ddd;
    background-size   : 2.857em 2.857em ;
    height            : 100%;
    -webkit-transition: width 1s;
       -moz-transition: width 1s;
        -ms-transition: width 1s;
         -o-transition: width 1s;
            transition: width 1s;
}
.fill[data-fill]:before {
    color      : #333;
    content    : attr(data-fill);
    display    : block;
    font-size  : 0.857em;
    line-height: 1.4;
    text-align : center;
    text-shadow: 0 0.071em #fff;
}

/* rounded progress bar */
.progress.progress-rounded {
            border-radius: 50em;
         -o-border-radius: 50em;
        -ms-border-radius: 50em;
       -moz-border-radius: 50em;
    -webkit-border-radius: 50em;
}
.progress.progress-rounded > .fill:only-child {
            border-radius: 50em;
         -o-border-radius: 50em;
        -ms-border-radius: 50em;
       -moz-border-radius: 50em;
    -webkit-border-radius: 50em;
}
.progress.progress-rounded > .fill:first-child {
            border-radius: 50em 0 0 50em;
         -o-border-radius: 50em 0 0 50em;
        -ms-border-radius: 50em 0 0 50em;
       -moz-border-radius: 50em 0 0 50em;
    -webkit-border-radius: 50em 0 0 50em;
}
.progress.progress-rounded > .fill:last-child {
            border-radius: 0 50em 50em 0;
         -o-border-radius: 0 50em 50em 0;
        -ms-border-radius: 0 50em 50em 0;
       -moz-border-radius: 0 50em 50em 0;
    -webkit-border-radius: 0 50em 50em 0;
}

/* striped brogress bar */
.progress.progress-striped > .fill {
    background-image:         linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image:      -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image:     -ms-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image:    -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
            animation: animate-progress 2s linear infinite;
         -o-animation: animate-progress 2s linear infinite;
        -ms-animation: animate-progress 2s linear infinite;
       -moz-animation: animate-progress 2s linear infinite;
    -webkit-animation: animate-progress 2s linear infinite;
}

@keyframes animate-progress {
      from { background-position: 0 0; }
      to { background-position: 2.857em 0; }
}

@-o-keyframes animate-progress {
      from { background-position: 0 0; }
      to { background-position: 2.857em 0; }
}

@-ms-keyframes animate-progress {
      from { background-position: 0 0; }
      to { background-position: 2.857em 0; }
}

@-moz-keyframes animate-progress {
      from { background-position: 0 0; }
      to { background-position: 2.857em 0; }
}

@-webkit-keyframes animate-progress {
      from { background-position: 0 0; }
      to { background-position: 2.857em 0; }
}

/* purple progress bar */
.progress > .fill.fill-purple,
.progress.progress-purple > .fill {
    background-color: #862165;
}

/* blue progress bar */
.progress > .fill.fill-blue,
.progress.progress-blue > .fill {
    background-color: #4890a8;
}

/* green progress bar */
.progress > .fill.fill-green,
.progress.progress-green > .fill {
    background-color: #5bb75b;
}

/* orange progress bar */
.progress > .fill.fill-orange,
.progress.progress-orange > .fill {
    background-color: #faa732;
}

/* red progress bar */
.progress > .fill.fill-red,
.progress.progress-red > .fill {
    background-color: #da4f49;
}

/* pink progress bar */
.progress > .fill.fill-pink,
.progress.progress-pink > .fill {
    background-color: #db35c0;
}

/* black progress bar */
.progress > .fill.fill-black,
.progress.progress-black > .fill {
    background-color: #363636;
}

/* white progress bar */
.progress.progress-white {
    background-color: #e5e5e5;
    border-color    : #fff;
}
.progress > .fill.fill-white,
.progress.progress-white > .fill {
    background-color: #fff;
}

.progress > .fill.fill-purple:before,
.progress.progress-purple > .fill:before,
.progress > .fill.fill-blue:before,
.progress.progress-blue > .fill:before,
.progress > .fill.fill-green:before,
.progress.progress-green > .fill:before,
.progress > .fill.fill-orange:before,
.progress.progress-orange > .fill:before,
.progress > .fill.fill-red:before,
.progress.progress-red > .fill:before,
.progress > .fill.fill-pink:before,
.progress.progress-pink > .fill:before,
.progress > .fill.fill-black:before,
.progress.progress-black > .fill:before {
    color      : #fff;
    text-shadow: 0 1px #000;
}

/*=================================================================
[23. Tables / .table]
=================================================================*/

table {
    border-collapse: collapse;
    border-spacing : 0;
}
.table {
    border-collapse: collapse;
    border-spacing : 0;
    max-width      : 100%;
    width          :100%;
}
.table + .table {
    margin-top: 0.6667rem;
}
.table td {
    border-top    : 1px solid #ddd;
    line-height   : 20px;
    padding       : 0.5333rem;
    text-align    : left;
    vertical-align: top;
}
.table th {
    font-weight: 700;
}

.table > thead > tr > th {
    border-bottom : 1px solid #ddd;
    vertical-align: bottom;
}

.table tbody + tbody {
    border-top: 2px solid #ddd;
}
.table .table {
    background: #fff;
}

/* compact table */
.table.table-compact {}
.table.table-compact th,
.table.table-compact td {
    padding: 4px 5px;
}

/* bordered table */
.table.table-bordered {
    *border-collapse     : collapse;
            border-radius: 4px;
         -o-border-radius: 4px;
        -ms-border-radius: 4px;
       -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border               : 1px solid #ddd;
    border-collapse      : separate;
    border-left          : 0;
}
.table.table-bordered th,
.table.table-bordered td {
    border-left: 1px solid #ddd;
}
.table.table-bordered thead:first-child tr:first-child>th:first-child,
.table.table-bordered tbody:first-child tr:first-child>td:first-child,
.table.table-bordered tbody:first-child tr:first-child>th:first-child {
            border-radius: 3px 0 0;
         -o-border-radius: 3px 0 0 0;
        -ms-border-radius: 3px 0 0 0;
       -moz-border-radius: 3px 0 0 0;
    -webkit-border-radius: 3px 0 0 0;
}
.table.table-bordered thead:first-child tr:first-child>th:last-child,
.table.table-bordered tbody:first-child tr:first-child>td:last-child,
.table.table-bordered tbody:first-child tr:first-child>th:last-child {
            border-radius: 0 3px 0 0;
         -o-border-radius: 0 3px 0 0;
        -ms-border-radius: 0 3px 0 0;
       -moz-border-radius: 0 3px 0 0;
    -webkit-border-radius: 0 3px 0 0;
}
.table.table-bordered thead:last-child tr:last-child>th:first-child,
.table.table-bordered tbody:last-child tr:last-child>td:first-child,
.table.table-bordered tbody:last-child tr:last-child>th:first-child,
.table.table-bordered tfoot:last-child tr:last-child>td:first-child,
.table.table-bordered tfoot:last-child tr:last-child>th:first-child {
            border-radius: 0 0 0 3px;
         -o-border-radius: 0 0 0 3px;
        -ms-border-radius: 0 0 0 3px;
       -moz-border-radius: 0 0 0 3px;
    -webkit-border-radius: 0 0 0 3px;
}
.table.table-bordered thead:last-child tr:last-child>th:last-child,
.table.table-bordered tbody:last-child tr:last-child>td:last-child,
.table.table-bordered tbody:last-child tr:last-child>th:last-child,
.table.table-bordered tfoot:last-child tr:last-child>td:last-child,
.table.table-bordered tfoot:last-child tr:last-child>th:last-child{
            border-radius: 0 0 3px;
         -o-border-radius: 0 0 3px 0;
        -ms-border-radius: 0 0 3px 0;
       -moz-border-radius: 0 0 3px 0;
    -webkit-border-radius: 0 0 3px 0;
}
.table.table-bordered tfoot + tbody:last-child tr:last-child td:first-child {
            border-radius: 0;
         -o-border-radius: 0;
        -ms-border-radius: 0;
       -moz-border-radius: 0;
    -webkit-border-radius: 0;
}
.table.table-bordered tfoot + tbody:last-child tr:last-child td:last-child {
            border-radius: 0;
         -o-border-radius: 0;
        -ms-border-radius: 0;
       -moz-border-radius: 0;
    -webkit-border-radius: 0;
}

/* striped table */
.table.table-striped tbody > tr:nth-child(odd) > td,
table.table-striped tbody > tr:nth-child(odd) > th {
    background-color: #f9f9f9;
}

/* hovered table */
.table.table-hovered tbody tr:hover > td,
table.table-hovered tbody tr:hover > th {
    background-color: #f5f5f5;
}

/**
* Colored Table Rows
*/

/* purple */
.table tr.purple {
    background-color: rgba(134,33,101,.3);
    text-shadow     : 0 1px #eee;
}

/* blue */
.table tr.blue {
    background-color: rgba(72,144,168,.3);
    text-shadow     : 0 1px #eee;
}

/* green */
.table tr.green {
    background-color: rgba(91,183,91,.3);
    text-shadow     : 0 1px #eee;
}

/* orange */
.table tr.orange {
    background-color: rgba(250,167,50,.3);
    text-shadow     : 0 1px #eee;
}

/* red */
.table tr.red {
    background-color: rgba(218,79,73,.3);
    text-shadow     : 0 1px #eee;
}

/* pink */
.table tr.pink {
    background-color: rgba(219,53,192,.3);
    text-shadow     : 0 1px #eee;
}

/* black */
.table tr.black {
    background-color: rgba(0,0,0,.3);
    text-shadow     : 0 1px #eee;
}

/* white */
.table tr.white {
    background-color: rgba(0,0,0,.3);
    text-shadow     : 0 1px #eee;
}

/*=================================================================
[24. Tabs / .tab-group]
=================================================================*/

.tabs {
    display      : block;
    margin-bottom: 20px;
}

.tabs:last-child {
    margin-bottom: 0;
}

.tabs:before,
.tabs:after {
    content    : "";
    display    : block;
    height     : 0;
    line-height: 0;
}

.tabs:after {
    clear: both;
}

.tabs > .controls {
    border-bottom: 1px solid #ddd;
    display      : block;
    list-style   : none;
    margin       : 0;
    padding      : 0;
}
.tabs > .controls:before,
.tabs > .controls:after {
    content    : "";
    display    : block;
    height     : 0;
    line-height: 0;
}
.tabs > .controls:after {
    clear: both;
}

.tabs > .controls > .item {
    color           : #333;
    text-decoration : none;
    display         : inline-block;
    margin-right    : -2.5px;
    padding         : 7px 16px 5px;
    position        : relative;
    background-color: #fff;
    border-top      : 1px solid #ddd;
    border-right    : 1px solid #ddd;
}
.tabs > .controls > .item:first-child {
    border-left: 1px solid #ddd;
}
.tabs > .controls > .item:last-child {
    border-right: 1px solid #ddd;
}
.tabs > .controls > .item:hover,
.tabs > .controls > .item.active {
    background-color: #f9f9f9;
}
.tabs > .controls > .item.disabled {
    background: none;
    color     : #999;
    cursor    : default;
    border-color: transparent;
}

.tabs > .content {
    background-color: #fff;
    overflow        : hidden;
    border          : 1px solid #ddd;
    border-top      : none;
    padding         : 0;
}

.tabs > .content:before,
.tabs > .content:after {
    content    : "";
    display    : block;
    height     : 0;
    line-height: 0;
}

.tabs > .content:after {
    clear: both;
}

.tabs > .content > .item {
    display   : none;
    opacity   : 0;
    padding   : 0.6667rem 1.000em;
    visibility: hidden;
}

.tabs > .content > .item.active {
    display   : block;
    opacity   : 1;
    visibility: visible;
}

/*=================================================================
[25. Tooltip / .tooltip]
=================================================================*/

.tooltip,
[data-tooltip] {
    position: relative;
    display: inline-block;
}
.tooltip:before,
.tooltip:after,
[data-tooltip]:before,
[data-tooltip]:after {
    position: absolute;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: hidden;
    opacity: 0;
    z-index: 9997;
    pointer-events: none;
}
.tooltip:hover:before,
.tooltip:hover:after,
.tooltip:focus:before,
.tooltip:focus:after,
[data-tooltip]:hover:before,
[data-tooltip]:focus:before,
[data-tooltip]:hover:after,
[data-tooltip]:focus:after {
    visibility: visible;
    opacity: 1;
}
.tooltip:before,
[data-tooltip]:before {
    content: '';
    position: absolute;
    background: transparent;
    border: 6px solid transparent;
    z-index: 9998;
}
.tooltip:after,
[data-tooltip]:after {
    content      : attr(data-tooltip);
    background   : #383838;
    color        : #fff;
    text-shadow  : 0 -1px 0 #000;
    padding      : 6px 8px;
    font-weight  : normal;
    line-height  : 14px;
    white-space  : nowrap;
    z-index      : 9999;
    font-size    : 12px;
    border-radius: 3px;
}
.tooltip-top:before {
    border-top-color: #383838;
}
.tooltip-bottom:before {
    border-bottom-color: #383838;
}
.tooltip-left:before {
    border-left-color: #383838;
}
.tooltip-right:before {
    border-right-color: #383838;
}
.tooltip-top:before {
    margin-bottom: -12px;
}
.tooltip-top:after {
    margin-left: -18px;
}
.tooltip-top:before,
.tooltip-top:after {
    bottom: 100%;
    left: 50%;
}
.tooltip-top:hover:after,
.tooltip-top:hover:before,
.tooltip-top:focus:after,
.tooltip-top:focus:before {
    -webkit-transform: translateY(-8px);
    -moz-transform: translateY(-8px);
    transform: translateY(-8px);
}
.tooltip-bottom:before {
    margin-top: -12px;
}
.tooltip-bottom:after {
    margin-left: -18px;
}
.tooltip-bottom:before,
.tooltip-bottom:after {
    top: 100%;
    left: 50%;
}
.tooltip-bottom:hover:after,
.tooltip-bottom:hover:before,
.tooltip-bottom:focus:after,
.tooltip-bottom:focus:before {
    -webkit-transform: translateY(8px);
    -moz-transform: translateY(8px);
    transform: translateY(8px);
}
.tooltip-right:before {
    margin-left: -12px;
    margin-bottom: -6px;
}
.tooltip-right:after {
    margin-bottom: -14px;
}
.tooltip-right:before,
.tooltip-right:after {
    left: 100%;
    bottom: 50%;
}
.tooltip-right:hover:after,
.tooltip-right:hover:before,
.tooltip-right:focus:after,
.tooltip-right:focus:before {
    -webkit-transform: translateX(8px);
    -moz-transform: translateX(8px);
    transform: translateX(8px);
}
/**
 * left tooltip
 */

.tooltip-left:before {
    margin-right: -12px;
    margin-bottom: -6px;
}
.tooltip-left:after {
    margin-bottom: -14px;
}
.tooltip-left:before,
.tooltip-left:after {
    right: 100%;
    bottom: 50%;
}
.tooltip-left:hover:after,
.tooltip-left:hover:before,
.tooltip-left:focus:after,
.tooltip-left:focus:before {
    -webkit-transform: translateX(-8px);
    -moz-transform: translateX(-8px);
    transform: translateX(-8px);
}
.tooltip-error:after {
    background-color: #468847;
    color: #d6e9c6;
    text-shadow: none;
}
.tooltip-error.tooltip-top:before {
    border-top-color: #468847;
}
.tooltip-error.tooltip-bottom:before {
    border-bottom-color: #468847;
}
.tooltip-error.tooltip-left:before {
    border-left-color: #468847;
}
.tooltip-error.tooltip-right:before {
    border-right-color: #468847;
}
.tooltip-warning:after {
    background-color: #c09853;
    color: #fbeed5;
    text-shadow: none;
}
.tooltip-warning.tooltip-top:before {
    border-top-color: #c09853;
}
.tooltip-warning.tooltip-bottom:before {
    border-bottom-color: #c09853;
}
.tooltip-warning.tooltip-left:before {
    border-left-color: #c09853;
}
.tooltip-warning.tooltip-right:before {
    border-right-color: #c09853;
}
.tooltip-info:after {
    background-color: #3a87ad;
    color: #bce8f1;
    text-shadow: none
}
.tooltip-info.tooltip-top:before {
    border-top-color: #3a87ad;
}
.tooltip-info.tooltip-bottom:before {
    border-bottom-color: #3a87ad;
}
.tooltip-info.tooltip-left:before {
    border-left-color: #3a87ad;
}
.tooltip-info.tooltip-right:before {
    border-right-color: #3a87ad;
}
.tooltip-success:after {
    background-color: #468847;
    color: #d6e9c6;
    text-shadow: none;
}
.tooltip-success.tooltip-top:before {
    border-top-color: #468847;
}
.tooltip-success.tooltip-bottom:before {
    border-bottom-color: #468847;
}
.tooltip-success.tooltip-left:before {
    border-left-color: #468847;
}
.tooltip-success.tooltip-right:before {
    border-right-color: #468847;
}

/**
 * Keeps a tooltip always visible
 */
.tooltip-always:after,
.tooltip-always:before {
    opacity: 1;
    visibility: visible;
}
.tooltip-always.tooltip-top:after,
.tooltip-always.tooltip-top:before {
    -webkit-transform: translateY(-8px);
    -moz-transform: translateY(-8px);
    transform: translateY(-8px);
}
.tooltip-always.tooltip-bottom:after,
.tooltip-always.tooltip-bottom:before {
    -webkit-transform: translateY(8px);
    -moz-transform: translateY(8px);
    transform: translateY(8px);
}
.tooltip-always.tooltip-left:after,
.tooltip-always.tooltip-left:before {
    -webkit-transform: translateX(-8px);
    -moz-transform: translateX(-8px);
    transform: translateX(-8px);
}
.tooltip-always.tooltip-right:after,
.tooltip-always.tooltip-right:before {
    -webkit-transform: translateX(8px);
    -moz-transform: translateX(8px);
    transform: translateX(8px);
}

/**
 * Adds bouncing animation to tooltip
 */
.tooltip-bounce:before,
.tooltip-bounce:after {
    -webkit-transition: opacity 0.3s ease, visibility 0.3s ease, -webkit-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
       -moz-transition: opacity 0.3s ease, visibility 0.3s ease, -moz-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
            transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
}

/*=================================================================
[26. Typography]
=================================================================*/

/* headings */
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
    margin-top   : 0;
    margin-bottom: 2rem;
    font-weight  : 400;
}

h1, .h1 {
    font-size     : 4.0rem;
    line-height   : 1.2;
    letter-spacing: -.1rem;
}
h2, .h2 {
    font-size     : 3.6rem;
    line-height   : 1.25;
    letter-spacing: -.1rem;
}
h3, .h3 {
    font-size     : 3.0rem;
    line-height   : 1.3;
    letter-spacing: -.1rem;
}
h4, .h4 {
    font-size     : 2.4rem;
    line-height   : 1.35;
    letter-spacing: -.08rem;
}
h5, .h5 {
    font-size     : 1.8rem;
    line-height   : 1.5;
    letter-spacing: -.05rem;
}
h6, .h6 {
    font-size     : 1.5rem;
    line-height   : 1.6;
    letter-spacing: 0;
}

/* Larger than phablet */
@media (min-width: 550px) {
    h1 {
        font-size: 5.0rem;
    }
    h2 {
        font-size: 4.2rem;
    }
    h3 {
        font-size: 3.6rem;
    }
    h4 {
        font-size: 3.0rem;
    }
    h5 {
        font-size: 2.4rem;
    }
    h6 {
        font-size: 1.5rem;
    }
}

small,
.small {
    font-size: 80%;
}

h1 small, h1 .small, .h1 small, .h1 .small,
h2 small, h2 .small, .h2 small, .h2 .small,
h3 small, h3 .small, .h3 small, .h3 .small,
h4 small, h4 .small, .h4 small, .h4 .small,
h5 small, h5 .small, .h5 small, .h5 .small,
h6 small, h6 .small, .h6 small, .h6 .small {
    box-sizing : border-box;
    display: block;
    font-weight: 400;
    color      : #999;
    line-height: 1;
}
h1 small, h1 .small, .h1 small, .h1 .small,
h2 small, h2 .small, .h2 small, .h2 .small,
h3 small, h3 .small, .h3 small, .h3 .small {
    font-size: 65%;
}

h4 small, h4 .small, .h4 small, .h4 .small,
h5 small, h5 .small, .h5 small, .h5 .small,
h6 small, h6 .small, .h6 small, .h6 .small {
    font-size: 75%;
}

h1 > small {
    font-size: 1.14285714rem;
}

/* paragraphs */
p {
    margin: 0 0 0.6667rem;
}
p:last-child {
    margin-bottom: 0;
}

/* --- */
strong, b, .bold {
    font-weight: 700 !important;
}
i:not(.fa), em, .italic {
    font-style: italic !important;
}
cite {
    font-style: normal;
}

/* abbreviation */
abbr[title] {
    border-bottom: 1px dotted #999;
    cursor       : help;
}

/* address */
address {
    font-style   : normal;
    margin-bottom: 0.6667rem;
}
address:last-child {
    margin-bottom: 0;
}

/* blockquote */
blockquote {
    border-left: 5px solid #e5e5e5;
    margin     : 0 0 20px;
    padding    : 0 0 0 1.000em;
}
blockquote:before,blockquote:after {
    content    : "";
    display    : block;
    height     : 0;
    line-height: 0;
}
blockquote:after {
    clear: both;
}
blockquote p {
    font-size    : 17.5px;
    font-weight  : 300;
    line-height  : 1.25;
    margin-bottom: 0;
}
blockquote footer, blockquote small, blockquote .small {
    color      : #999;
    display    : block;
    font-size  : 80%;
    line-height: 20px;
}
blockquote footer:before, blockquote small:before, blockquote .small:before {
    content:"\2014 \00A0";
}
blockquote.right {
    border-left  : 0;
    border-right : 5px solid #e5e5e5;
    float        : right;
    padding-left : 0;
    padding-right: 1.000em;
}
blockquote.right p,
blockquote.right footer,
 blockquote.right small,
 blockquote.right .small {
    text-align: right;
}

blockquote.right footer:before,
blockquote.right small:before,
blockquote.right .small:before {
    content:""
}
blockquote.right footer:after,
blockquote.right small:after,
blockquote.right .small:after {
    content:"\00A0 \2014";
}

/* lists */
.list-nostyle {
    list-style  : none;
    padding-left: 0;
}
/* list inline */
.list-inline {
    list-style  : none;
    margin-left : -5px;
    padding-left: 0;
}
.list-inline > li {
    display: inline-block;
}
.list-inline > li + li {
    margin-left : 5px;
}

/* code */
code, .code {
    background-color: #f9f2f4;
    color           : #da4f49;
    font-size       : 90%;
    padding         : 0.1333rem 0.2667rem;
    white-space     : nowrap;
}

/* pre */
pre {
    background-color: #f5f5f5;
    border          : 1px solid #ccc;
    color           : #333;
    display         : block;
    font-size       : 13px;
    line-height     : 1.42857143;
    padding         : 9.5px;
    word-break      : break-all;
    word-wrap       : break-word;
}

/* description */

dl {}
dl dt, dl dd {
    line-height: 20px;
}
dl dt {
    font-weight: 700;
}
dl dd {
    margin-left: 0.6667rem;
}
dl.inline:after {
    content    : ".";
    line-height: 0;
    display    : block;
    overflow   : hidden;
}
dl.inline dt {
    clear        : left;
    float        : left;
    overflow     : hidden;
    text-align   : right;
    text-overflow: ellipsis;
    white-space  : nowrap;
    width        : auto;
}
dl.inline dd {
    float: left;
}

/*=================================================================
[27. Useful Classes]
=================================================================*/

/* clear float */
.clearfix:before,
.clearfix:after {
    content    : " ";
    display    : block;
    height     : 0;
    line-height: 0;
}
.clearfix:after {
    clear: both;
}

/* element float */
.float-left { float: left !important; }
.float-right { float: right !important; }
.float-auto { float: auto !important; }
.float-none { float: none !important; }

/* text align */
.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }
.text-justify { text-align: justify !important; }

/*-------------------------------------------------------------------
// !Text Colors
//-----------------------------------------------------------------*/

/* muted text */
.text-muted { color: #777 !important; }

/* purple */
.text-purple { color: #862165 !important; }

/* blue & info text */
.text-info,
.text-blue { color: #4890a8 !important; }

/* success and green text */
.text-success,
.text-green { color: #5bb75b !important; }

/* warning and orange text */
.text-warning,
.text-orange { color: #faa732 !important; }

/* error and red text */
.text-error,
.text-red { color: #da4f49 !important; }

/* text pink */
.text-pink { color: #db35c0 !important; }

/* blac text */
.text-black { color: #363636 !important; }

/* white text */
.text-white { color: #fff !important; }

/*-------------------------------------------------------------------
// !Text Transform
//-----------------------------------------------------------------*/

/* uppercase */
.uppercase { text-transform: uppercase !important; }

/* lowercase */
.lowercase { text-transform: lowercase !important; }

/* center element */
.centered { margin: 0 auto; }

/*-------------------------------------------------------------------
// !Hidden Elements
//-----------------------------------------------------------------*/
.show { display: block !important; }
.hide { display: none !important; visibility: hidden !important; }
.invisible { visibility: hidden !important; }
*[hidden] { display: none !important; visibility: hidden !important; }
*[required]:focus { outline-color: #da4f49; }

@media (max-width: 767px) {
    .show-x-block { display: block !important; }
    .show-x-inline { display: inline !important; }
    .show-x-inline-block { display: inline-block !important; }
    .hide-x,
    .show-s-block,
    .show-s-inline,
    .show-s-inline-block,
    .show-m-block,
    .show-m-inline,
    .show-m-inline-block,
    .show-l-block,
    .show-l-inline,
    .show-l-inline-block { display: none !important; }
}
@media (min-width: 768px) and (max-width: 991px) {
    .show-s-block { display: block !important; }
    .show-s-inline { display: inline !important; }
    .show-s-inline-block { display: inline-block !important; }
    .hide-s,
    .show-x-block,
    .show-x-inline,
    .show-m-inline-block,
    .show-l-block,
    .show-l-inline,
    .show-l-inline-block { display: none !important; }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .show-m-block { display: block !important; }
    .show-m-inline { display: inline !important; }
    .show-m-inline-block { display: inline-block !important; }
    .hide-m,
    .show-x-block,
    .show-x-inline,
    .show-x-inline-block,
    .show-s-block,
    .show-s-inline,
    .show-s-inline-block,
    .show-l-block,
    .show-l-inline,
    .show-l-inline-block { display: none !important; }
}
@media (min-width: 1200px) {
    .show-l-block { display: block !important; }
    .show-l-inline { display: inline !important; }
    .show-l-inline-block { display: inline-block !important; }
    .hide-l,
    .show-x-block,
    .show-x-inline,
    .show-x-inline-block,
    .show-s-block,
    .show-s-inline,
    .show-s-inline-block,
    .show-m-block,
    .show-m-inline,
    .show-m-inline-block { display: none !important; }
}

/*-------------------------------------------------------------------
// !Backgrounds
//-----------------------------------------------------------------*/

.bg-none { background: none !important; }
.bg-purple { background-color: #862165; color: #fff ; }
.bg-blue { background-color: #4890a8; color: #fff ; }
.bg-green { background-color: #5bb75b; color: #fff ; }
.bg-orange { background-color: #faa732; color: #fff ; }
.bg-red { background-color: #da4f49; color: #fff ; }
.bg-pink { background-color: #db35c0; color: #fff ; }
.bg-black { background-color: #363636; color: #fff ; }
.bg-white { background-color: #fff; color: #363636 ; }

/*-------------------------------------------------------------------
// !Borders
//-----------------------------------------------------------------*/

.border-none { border: none !important; }
.border-purple { border-color: #862165 !important; }
.border-blue { border-color: #4890a8 !important; }
.border-green { border-color: #5bb75b !important; }
.border-orange { border-color: #faa732 !important; }
.border-red { border-color: #da4f49 !important; }
.border-pink { border-color: #db35c0 !important; }
.border-black { border-color: #363636 !important; }
.border-white { border-color: #fff !important; }