/* Minification failed. Returning unminified contents.
(5668,27): run-time error CSS1019: Unexpected token, found ' '
(5668,27): run-time error CSS1019: Unexpected token, found ' '
(5668,27): run-time error CSS1042: Expected function, found ' '
(5668,27): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(5701,26): run-time error CSS1019: Unexpected token, found ' '
(5701,26): run-time error CSS1019: Unexpected token, found ' '
(5701,26): run-time error CSS1042: Expected function, found ' '
(5701,26): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(5734,27): run-time error CSS1019: Unexpected token, found ' '
(5734,27): run-time error CSS1019: Unexpected token, found ' '
(5734,27): run-time error CSS1042: Expected function, found ' '
(5734,27): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(5766,26): run-time error CSS1019: Unexpected token, found ' '
(5766,26): run-time error CSS1019: Unexpected token, found ' '
(5766,26): run-time error CSS1042: Expected function, found ' '
(5766,26): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(5797,27): run-time error CSS1019: Unexpected token, found ' '
(5797,27): run-time error CSS1019: Unexpected token, found ' '
(5797,27): run-time error CSS1042: Expected function, found ' '
(5797,27): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(5838,26): run-time error CSS1019: Unexpected token, found ' '
(5838,26): run-time error CSS1019: Unexpected token, found ' '
(5838,26): run-time error CSS1042: Expected function, found ' '
(5838,26): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(5881,27): run-time error CSS1019: Unexpected token, found ' '
(5881,27): run-time error CSS1019: Unexpected token, found ' '
(5881,27): run-time error CSS1042: Expected function, found ' '
(5881,27): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(5923,26): run-time error CSS1019: Unexpected token, found ' '
(5923,26): run-time error CSS1019: Unexpected token, found ' '
(5923,26): run-time error CSS1042: Expected function, found ' '
(5923,26): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
 */
.page-header{font-size:1.75em;font-weight:bold;}.page-header:after{content:"";height:2px;background:#000;display:block;}.return-container{float:right;}.edit-user-container{margin:20px;display:inline-block;}.edit-user-container form{width:35em;display:inline-block;}.edit-user-container #EditUserForm{margin-left:10px;width:38em;border-right:1px solid;}.edit-user-container #EditUserForm .form-row{margin:5px 0;}.edit-user-container #EditUserForm .form-row label{display:inline-block;width:7em;text-align:right;}.edit-user-container #EditUserForm .form-row label:after{content:":";}.edit-user-container #EditUserForm .form-row .form-display{font-size:1.2em;display:inline-block;color:#000;margin-left:5px;}.edit-user-container .edit-role-container{width:20em;position:absolute;display:inline-block;top:30em;right:65em;}.edit-user-container .return-container{float:right;}.copy-grid-section{text-align:center;}
/*---------- Default Settings Start----------*/
html {
    background-color: #e2e2e2;
    margin: 0;
    padding: 0;
}

body {
    background-color: #32333F;
    border-top: solid 10px #000;
    color: #333;
    font-size: .85em;
    font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
}

a {
    color: #333;
    outline: none;
    padding-left: 3px;
    padding-right: 3px;
    text-decoration: underline;
}

    /*a:link, a:visited,
    a:active, a:hover {
        color: #333;
    }*/

    a:hover {
        background-color: #c7d1d6;
    }

header, footer, hgroup,
nav, section {
    display: block;
}

mark {
    background-color: #a6dbed;
    padding-left: 5px;
    padding-right: 5px;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.clear-fix:after {
    content: ".";
    clear: both;
    display: block;
    height: 0;
    visibility: hidden;
}

h1, h2, h3,
h4, h5, h6 {
    color: #000;
    margin-bottom: 0;
    padding-bottom: 0;
}

h1 {
    font-size: 2em;
}

h2 {
    font-size: 1.75em;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

    h5 a:link, h5 a:visited, h5 a:active {
        padding: 0;
        text-decoration: none;
    }

/*---------- Default Settings End----------*/


/*----------------------------------------------------------------
                            My added stuff
    ------------------------------------------------------------*/

/*---------- _Layout CSS Start ----------*/

header {
    /*background: #32333F;*/
}

#macrographLogo img#MGLogo {
    margin: 0 auto;
    max-width: 60%;
    position: relative;
}



/* ---------- login Start----------*/
#login {
    display: block;
    font-size: .85em;
    margin: 0 0 10px;
    margin-top: 2%;
    text-align: right;
}

    #login a.log-off,
    #login button {
        text-decoration: none;
    }

        #login a.username,
        #login button.username {
            background: none;
            margin: 0;
            padding: 0;
            text-decoration: underline;
            -moz-box-shadow: inset 0px 1px 0px 0px #d99157;
            -webkit-box-shadow: inset 0px 1px 0px 0px #d99157;
            box-shadow: inset 0px 1px 0px 0px #d99157;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #cf8627), color-stop(1, #ffab23));
            background: -moz-linear-gradient(top, #cf8627 5%, #ffab23 100%);
            background: -webkit-linear-gradient(top, #cf8627 5%, #ffab23 100%);
            background: -o-linear-gradient(top, #cf8627 5%, #ffab23 100%);
            /*background: -ms-linear-gradient(top, #cf8627 5%, #ffab23 100%);*/
            background: linear-gradient(to bottom, #cf8627 5%, #ffab23 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cf8627', endColorstr='#ffab23',GradientType=0);
            background-color: #cf8627;
            -moz-border-radius: 8px;
            -webkit-border-radius: 8px;
            border-radius: 8px;
            border: 1px solid #e08a43;
            display: inline-block;
            cursor: pointer;
            color: #333333;
            font-family: arial;
            font-size: 15px;
            font-weight: bold;
            padding: 4px 18px;
            text-decoration: none;
            text-shadow: -1px 1px 2px #ffc466;
        }

    #login ul {
        margin: 0 auto;
    }

    #login ul.unauthenticatedLogin li {
        display: inline;
        list-style: none;
        -moz-box-shadow: inset 0px 1px 0px 0px #d99157;
        -webkit-box-shadow: inset 0px 1px 0px 0px #d99157;
        box-shadow: inset 0px 1px 0px 0px #d99157;
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #cf8627), color-stop(1, #ffab23));
        background: -moz-linear-gradient(top, #cf8627 5%, #ffab23 100%);
        background: -webkit-linear-gradient(top, #cf8627 5%, #ffab23 100%);
        background: -o-linear-gradient(top, #cf8627 5%, #ffab23 100%);
        /*background: -ms-linear-gradient(top, #cf8627 5%, #ffab23 100%);*/
        background: linear-gradient(to bottom, #cf8627 5%, #ffab23 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cf8627', endColorstr='#ffab23',GradientType=0);
        background-color: #cf8627;
        -moz-border-radius: 8px;
        -webkit-border-radius: 8px;
        border-radius: 8px;
        border: 1px solid #e08a43;
        display: inline-block;
        cursor: pointer;
        color: #333333;
        font-family: arial;
        font-size: 15px;
        font-weight: bold;
        padding: 4px 18px;
        text-decoration: none;
        text-shadow: -1px 1px 2px #ffc466;
    }
        #login ul.unauthenticatedLogin li a {
            text-decoration: none;
        }
        #login ul.unauthenticatedLogin li a:hover {
            background: none;
        }
        #login ul.unauthenticatedLogin li a:active {
            position: relative;
            top: 1px;
        }

#loginDiv {
    max-width: 40%;
    float: right;
    position: relative;
}

#login .dropdown {
    display: inline-block;
}
/* ---------- login End----------*/


/*---------- Navigation Menu Start ----------*/
.nav {
    width: auto;
}
.mainMenuButton {
    text-decoration: none;
    -moz-box-shadow: inset 0px 0px 1px 0px #3dc21b;
    -webkit-box-shadow: inset 0px 0px 1px 0px #3dc21b;
    box-shadow: inset 0px 0px 1px 0px #3dc21b;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #10a337), color-stop(1, #5cbf2a));
    background: -moz-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
    background: -webkit-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
    background: -o-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
    /*background: -ms-linear-gradient(top, #10a337 5%, #5cbf2a 100%);*/
    background: linear-gradient(to bottom, #10a337 5%, #5cbf2a 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#10a337', endColorstr='#5cbf2a',GradientType=0);
    background-color: #10a337;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #18ab29;
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    font-family: arial;
    font-size: 1.1em;
    font-weight: bold;
    padding: 4px 13px;
    text-decoration: none;
    text-shadow: -1px -1px 2px #2f6627;
    margin:0 auto !important;
}
.mainMenuButton:hover {
    background: rgba(12, 104, 2, 0.1) !important;
}

.mainMenuButton.highlight {
    background: none;
            margin: 0;
            padding: 0;
            text-decoration: underline;
            -moz-box-shadow: inset 0px 1px 0px 0px #d99157;
            -webkit-box-shadow: inset 0px 1px 0px 0px #d99157;
            box-shadow: inset 0px 1px 0px 0px #d99157;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #cf8627), color-stop(1, #ffab23));
            background: -moz-linear-gradient(top, #cf8627 5%, #ffab23 100%);
            background: -webkit-linear-gradient(top, #cf8627 5%, #ffab23 100%);
            background: -o-linear-gradient(top, #cf8627 5%, #ffab23 100%);
            /*background: -ms-linear-gradient(top, #cf8627 5%, #ffab23 100%);*/
            background: linear-gradient(to bottom, #cf8627 5%, #ffab23 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cf8627', endColorstr='#ffab23',GradientType=0);
            background-color: #cf8627;
            border: 1px solid #e08a43;
            color: #333333;
            font-family: arial;
            font-weight: bold;
            padding: 4px 18px;
            text-decoration: none;
            text-shadow: -1px 1px 2px #ffc466;
}
.mainMenuButton.highlight:hover {
    background: #cf8627 !important;
}
.dropdown-menu {
    padding:0px !important;
}
.dropdown-menu li {
    width:100%;
}

.dropdown-menu li a {
    text-decoration:none;
}
.dropdown-menu li a:hover {
    padding:1px 18px !important;
    border:2px solid #10a337;

}
ul#menu {
    font-size: 1.3em;
    font-weight: 600;
    margin: 0 0 5px;
    padding: 0;
    text-align: center;
    width: 100%;
}

    ul#menu li {
        list-style: none;
        display: inline-block;
        
    }
    /*ul#menu li a:hover {
                box-shadow: inset 0px 0px 1px 0px #3dc21b;
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #10a337), color-stop(1, #5cbf2a));
                background: -moz-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
                background: -webkit-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
                background: -o-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
                background: -ms-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
                background: linear-gradient(to bottom, #10a337 5%, #5cbf2a 100%);
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#10a337', endColorstr='#5cbf2a',GradientType=0);
                background-color: #10a337;
            }*/
        /*ul#menu li a {
            color: #fff;
            text-decoration: none;
            -moz-box-shadow: inset 0px 0px 1px 0px #3dc21b;
            -webkit-box-shadow: inset 0px 0px 1px 0px #3dc21b;
            box-shadow: inset 0px 0px 1px 0px #3dc21b;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #10a337), color-stop(1, #5cbf2a));
            background: -moz-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
            background: -webkit-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
            background: -o-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
            background: -ms-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
            background: linear-gradient(to bottom, #10a337 5%, #5cbf2a 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#10a337', endColorstr='#5cbf2a',GradientType=0);
            background-color: #10a337;
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            border-radius: 5px;
            border: 1px solid #18ab29;
            display: inline-block;
            cursor: pointer;
            color: #ffffff;
            font-family: arial;
            font-size: 1.1em;
            font-weight: bold;
            padding: 4px 13px;
            text-decoration: none;
            text-shadow: -1px -1px 2px #2f6627;
        }

            

            ul#menu li a:active {
                position: relative;
                top: 1px;
            }*/
/*---------- Navigation Menu End ----------*/

/*---------- Footer Start ----------*/
#footerCopyright {
    text-align: center;
}

.footerBox {
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

    .footerBox .footerCol {
        width: 23%;
        position: relative;
        float: left;
    }

        .footerBox .footerCol .footerHeader {
            font-family: Constantia;
            font-size: 1.5em;
            float: left;
            width: 100%;
        }

        .footerBox .footerCol .footerList {
            padding: 2%;
            margin-left: 2%;
            margin-right: 2%;
            width: 100%;
        }
/*---------- Footer End ----------*/

/*---------- _Layout CSS End ----------*/

/*---------- Home/Index CSS Start ----------*/

#welcomeText {
    margin: 0 auto;
    float: right;
    margin-right: 1%;
}

    #welcomeText #welcomeHeader {
        text-align: center;
    }

    #welcomeText #welcomeBody {
        margin-left: auto;
        margin-right: auto;
        padding-left: 5%;
    }

.homeHeader {
    font-family: Constantia;
    font-size: 2.5em;
    padding-left: 5%;
}

#sampleGraphs {
    float: left;
    max-width: 50%;
    max-height: 50%;
}

    #sampleGraphs a img {
        max-width: 100%;
        margin: 0 auto;
    }



ul#navBar {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    float: left;
    text-align: center;
    overflow: hidden;
}

    ul#navBar li {
        float: left;
        margin-right: 10px;
    }

    ul#navBar a {
        text-transform: uppercase;
        color: #fff;
        font-size: 14px;
        padding: 10px 15px;
        line-height: 18px;
        text-decoration: none;
        border-radius: 20px;
        display: block;
    }

        ul#navBar a:hover {
            background: rgba(0,0,0,0.2);
        }

        ul#navBar a:active, ul a.active {
            background: rgba(0,0,0,0.3);
        }

#GrandOpenBanner {
    background-color: #D58A26;
    margin: 0 auto;
    width: 100%;
    text-align: center;
    font-family: "Copperplate Gothic Light", 'Copperplate Gothic', Copperplate;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
    padding:10px 0px;
    margin-bottom:20px;
}

    #GrandOpenBanner h2 {
        margin-bottom: 0.5%;
    }

.sampleGraph {
    max-width: 100%;
    cursor: zoom-in;
}
#CODLink {
    cursor:pointer;
    margin:0;
    font-size: 34px;
}
#GrandOpenBanner:hover {
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #D58A26), color-stop(1, #C37814));
    background: -moz-linear-gradient(top, #D58A26 5%, #C37814 100%);
    background: -webkit-linear-gradient(top, #D58A26 5%, #C37814 100%);
    background: -o-linear-gradient(top, #D58A26 5%, #C37814 100%);
    /*background: -ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);*/
    background: linear-gradient(to bottom, #D58A26 5%, #C37814 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D58A26', endColorstr='#C37814',GradientType=0);
    background-color: #D58A26;
}

#chartOfTheDay {
    width: 100%;
    float: none;
    margin: 0 auto;
    margin-top: 3%;
    vertical-align: central;
}

    #chartOfTheDay span {
        margin: 0 auto;
        width: 100%;
    }


        #chartOfTheDay span a {
            -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
            -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
            box-shadow: inset 0px 1px 0px 0px #ffffff;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));
            background: -moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
            background: -webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
            background: -o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
            /*background: -ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);*/
            background: linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9',GradientType=0);
            background-color: #f9f9f9;
            -moz-border-radius: 6px;
            -webkit-border-radius: 6px;
            border-radius: 6px;
            border: 1px solid #dcdcdc;
            display: inline-block;
            cursor: pointer;
            color: #10a337;
            font-family: arial;
            font-size: 1.75em;
            font-weight: bold;
            padding: 6px 24px;
            text-decoration: none;
            text-shadow: 0px 1px 0px #ffffff;
            width: 100%;
            text-align: center;
        }

            #chartOfTheDay span a:hover {
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9));
                background: -moz-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
                background: -webkit-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
                background: -o-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
                /*background: -ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);*/
                background: linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9',GradientType=0);
                background-color: #e9e9e9;
            }

            #chartOfTheDay span a:active {
                position: relative;
                top: 1px;
            }

#registerLine {
    margin-top: 0.5%;
}

#testimonialTitle {
    border: 5px solid #32333F;
    text-align: center;
    font-family: "Copperplate Gothic Light", 'Copperplate Gothic', Copperplate;
}

#owl-Carousel {
    background: #32333F;
    margin-left: 0 auto;
}

    #owl-Carousel div.carouselContentDiv {
        background: #D9D9DA;
        border: 5px solid #32333F;
        /*border-right: 5px solid #32333F;
        border-top: 5px solid #32333F;*/
        padding: 5px;
    }

        #owl-Carousel div.carouselContentDiv p {
            margin: 0 auto;
            margin-left: 1%;
            margin-right: 1%;
            margin-top: 1%;
            font-size: 1.2em;
        }

            #owl-Carousel div.carouselContentDiv p i {
                margin-left: 5%;
            }

/*---------- Home/Index CSS End ----------*/

/*---------- Samples/Index CSS Start ----------*/

h3#MarketTitle {
    color: #D58A26;
    text-align: center;
    font-size: 1.3em;
    font-family: "Copperplate Gothic Light", 'Copperplate Gothic', Copperplate;
    font-weight: bold;
}
h3.marketTitle {
    color: #D58A26;
    text-align: center;
    font-size: 1.3em;
    font-family: "Copperplate Gothic Light", 'Copperplate Gothic', Copperplate;
    font-weight: bold;
    /*width:20%;*/
}
div.marketLink {
    text-align:center;
    width:100%;
    border:1px solid #D9D9DA;
}
div.marketLink a {
    text-decoration:none;
    width:100%;
    padding:10px 0px;
    background:#7A7A7A !important;
    font-size: 1.2em;
    margin:0px 2px auto !important;
}
    div.marketLink a:hover {
        border:2px solid #D58A26;
        padding:8px 0px !important;
        background:#D9D9DA !important;
        margin:0px 0px auto !important;

    }

.MarketSymbolSection .ui-accordion-content {
    padding:0px !important;
}
.MarketSymbolSection #links {
    background: #32333F !important;
}
    /*.MarketSymbolSection {
        width: 30% !important;
        margin:0 auto !important;
    }*/
/*#MenuTable tr:nth-child(even) {
        background-color: #C8C8C8;
    }

    #MenuTable tr:nth-child(odd) {
        background-color: #D9D9DA;
    }*/

.marketDiv {
    text-align: center;
    width: 100%;
}

.market {
    padding: 0;
    padding-top: 2%;
    padding-bottom: 2%;
    margin: 0 auto;
}

    .market a {
        text-decoration: none;
        display: block;
        width: 100%;
        height: 100%;
        padding: 0;
    }

#links {
    background: #c8c8c8;
    padding: 2%;
    max-width: 100%;
    max-height: 100%;
    display: block;
    overflow: hidden;
    text-align: center;
}
/*#links a img {
    position:relative;
    display:block;
    float:left;
}*/
.descBox {
    background: #c8c8c8;
    padding: 2%;
    padding-top: 0;
    border-top: solid 2px white;
    float: none;
    margin: 0 auto;
}

    .descBox table {
        margin: auto;
    }

        .descBox table tr {
            vertical-align: top;
        }

            .descBox table tr td {
                margin-left: 1%;
                margin-right: 1%;
            }

#links a {
    display: inline-block;
}


.marketGraph {
    text-align: center;
    position: relative;
    padding: 0;
    margin: 2%;
    float: left;
    width: 28%;
}

.marketTitle {
    font-size: 1.3em;
    font-family: "Copperplate Gothic Light", 'Copperplate Gothic', Copperplate;
    font-weight: bold;
    text-align: center;
}


/*---------- Samples/Index CSS End ----------*/

/*---------- UD CSS Start ----------*/
#RangeTableContainer {
    margin-top: 5%;
}

#DataRangeHeader {
    margin-bottom: 3%;
}

#DataRangeTable {
    width: 50%;
    border: 2px solid;
    border-collapse: collapse;
    margin: 0 auto;
}

    #DataRangeTable td {
        border: 2px solid;
        text-align: center;
        vertical-align: middle;
        padding: 5px;
        margin: 0 auto;
    }

    #DataRangeTable th {
        border: 2px solid;
        text-align: center;
        vertical-align: middle;
        padding: 5px;
        margin: 0 auto;
    }

    #DataRangeTable tr:nth-child(even) {
        background-color: #C8C8C8;
    }

/*---------- UD CSS End ----------*/

#RegisterForm {
    background-color: #32333F;
    color: #E99A25;
    margin: 0 auto;
    display: inline-block;
}

#RegisterButton {
    margin: 0 auto;
    display: block;
}

#captchaBox {
    background-color: #D9D9DA;
    margin: 0 auto;
}

p.lostPasswordLink {
    text-align: center;
}

.lostPasswordLink a {
    color: #E99A25;
}

.LoginForm {
    background-color: #32333F;
    color: #E99A25;
    margin: 0 auto;
    display: inline-block;
}

.howTo-container {
    width: 80%;
    height: 70%;
    position: relative;
    padding-bottom: 45.25%;
    padding-top: 30px;
    margin: 0 auto;
    margin-bottom: 2%;
    margin-top: 2%;
    overflow: hidden;
}

    .howTo-container iframe,
    .howTo-container object,
    .howTo-container embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        float: none;
        margin: 0 auto;
    }

#registerLine {
    margin-top: 0.5%;
}

.axis path, .axis line {
    fill: none;
    stroke: black;
    shape-rendering: crispEdges;
}

.axis text {
    font-family: sans-serif;
    font-size: 11px;
}

#tooltip {
    position: absolute;
    text-align: center;
    width: 40px;
    height: auto;
    padding: 10px;
    background-color: white;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    pointer-events: none;
}

    #tooltip.hidden {
        display: none;
    }

    #tooltip p {
        margin: 0;
        font-family: sans-serif;
        font-size: 16px;
        line-height: 20px;
    }

#patternContainer {
    margin: 2%;
}

.marketCol {
    width: 70%;
    position: relative;
    float: right;
}

.dlButton {
    position: relative;
    float: left;
}


#MenuTable {
    width: 100%;
    /*display: table;*/
    /*margin: 0 auto;*/
    background: #C8C8C8;
}

.chartPattern {
    max-width: 50%;
    float: left;
    display: block;
    background-position: 50% 50%;
}

.chartContainer {
    margin: 0 auto;
    display: table-row;
}

.marketGraphs {
    display: table;
    /*text-align: center;
    position: relative;
    padding: 0;
    margin: auto;
    margin-left:2%;
    float: left;
    width: 45%;*/
}

    /*#marketGraphs  {
        margin: 0 auto;
    }*/

    .marketGraphs a img {
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        max-width: 100%;
        /*margin: 0 auto;
            display:inline-block;*/
    }


ul.MemberMenu#MarketsMenu {
    margin: 0;
    text-align: center;
    padding: 0;
    font-size: 1em;
    font-weight: 500;
    position: relative;
}

ul#MarketsMenu {
    font-size: 1.3em;
    font-weight: 600;
    text-align: center;
    width: 65%;
    padding: 0;
    margin: 0 auto;
}

    ul#MarketsMenu li {
        list-style: none;
        display: inline-block;
        width: 100%;
        margin-bottom: 2%;
    }

        ul#MarketsMenu li a {
            color: #fff;
            width: inherit;
            text-decoration: none;
            -moz-box-shadow: inset 0px 0px 1px 0px #3dc21b;
            -webkit-box-shadow: inset 0px 0px 1px 0px #3dc21b;
            box-shadow: inset 0px 0px 1px 0px #3dc21b;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #10a337), color-stop(1, #5cbf2a));
            background: -moz-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
            background: -webkit-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
            background: -o-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
            /*background: -ms-linear-gradient(top, #10a337 5%, #5cbf2a 100%);*/
            background: linear-gradient(to bottom, #10a337 5%, #5cbf2a 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#10a337', endColorstr='#5cbf2a',GradientType=0);
            background-color: #10a337;
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            border-radius: 5px;
            border: 1px solid #18ab29;
            display: inline-block;
            cursor: pointer;
            color: #ffffff;
            font-family: arial;
            font-size: 1.1em;
            font-weight: bold;
            padding: 4px 13px;
            text-shadow: -1px -1px 2px #2f6627;
            margin: 0 auto;
        }

            ul#MarketsMenu li a:hover {
                /*background: none;*/
                box-shadow: inset 0px 0px 1px 0px #3dc21b;
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #10a337), color-stop(1, #5cbf2a));
                background: -moz-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
                background: -webkit-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
                background: -o-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
                /*background: -ms-linear-gradient(top, #10a337 5%, #5cbf2a 100%);*/
                background: linear-gradient(to bottom, #10a337 5%, #5cbf2a 100%);
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#10a337', endColorstr='#5cbf2a',GradientType=0);
                background-color: #10a337;
            }

            ul#MarketsMenu li a:active {
                position: relative;
                top: 1px;
            }

/*---------- Trade Results Start ----------*/

#TradeResultsMenu {
    margin-top:20px;
}

#TablesContainer {
    margin:0 auto;
    /*width:65%;*/
    /*border:3px solid #32333F !important;*/
}
#ProductName {
    font-size:45px;
    margin:0 auto;
    padding:20px 40px 0px 0px !important;
}
#SideTableContainer {
    float:left;
    margin:0 auto;
    margin-top:55px;
}
#ResultsTableContainer{
    float:left;
    margin:0 auto;
    vertical-align:bottom;
}
.aboveVariables {
    margin-bottom:10px !important;
}
#TopVariableTable{
    margin:0 auto;

}
#TopVariableTable tr td, #TopVariableTable tr th  {
    padding-left: 20px;
    padding-right: 20px;
    border:solid black 1px;
    text-align:center;  
}
#TopVariableTable tr th {
    border: none !important;
}

#TradeResultsTable {
    border:3px solid #333 !important;
}

#TradeResultsTable tr td, #TradeResultsTable tr th  {
    padding-left: 20px;
    padding-right: 20px;
    border:solid black 1px;
    text-align:center;  
}
#TradeResultsTable tr th {
    border-bottom: solid black 2px;
}


#NumTradesTable {
    /*border:3px solid #333 !important;*/
}

#NumTradesTable tr td, #NumTradesTable tr th  {
    padding-left: 20px;
    padding-right: 20px;
    border:solid black 1px;
    text-align:center;  
}
#NumTradesTable tr th {
    border: none !important;
}

#PercentTable tr td, #PercentTable tr th  {
    padding-left: 20px;
    padding-right: 20px;
    border:solid black 1px;
    text-align:center;  
}
#PercentTable tr th {
    border: none !important;
}
#TopTable tr td, #TopTable tr th  {
    padding-left: 20px;
    padding-right: 20px;
    border:solid black 1px;
    text-align:center;  
}
#TopTable tr th {
    border: none !important;
}

.sideHeader {
    padding-right:5px !important;
    text-align:right !important;
}
.blank-Cell {
    border:none !important;
}
/*---------- Trade Results End ----------*/

.slogan {
    margin: 0 auto;
    font-family: 'MV Boli';
    font-size: 1.2em;
    color: #C8C8C8;
    font-style: italic;
}

#welcomeText {
}

    #welcomeText p {
        font-family: 'Arno Pro SmText';
        font-size: 1.5em;
    }

.bodyText {
    font-family: 'Arno Pro SmText';
    font-size: 1.5em;
    padding-left: 6%;
}

#services {
    font-style: italic;
}

div.videoBox {
    background: #32333F;
    padding-top: 2%;
    padding-bottom: 2%;
    margin: 0 auto;
    margin-bottom: 2%;
    position: relative;
    /*width:50%;*/

}

.memType {
    font-size: 1.5em;
    font-family: "Copperplate Gothic Light", 'Copperplate Gothic', Copperplate;
    font-weight: bold;
    padding-left: 5%;
    margin-bottom: 2%;
}

.vidHeader {
    text-align: center;
    background: #D9D9DA;
    width:50%;
    margin: 0 auto;
    margin-bottom: 2%;
    padding-left: 0%;
}
/*#vidHeader {
    background-color: #32333F; 
}*/
.gbg {
}

.memInfo {
    font-size: 1.3em;
    font-family: 'Arno Pro SmText';
}

.classPreviewVideo {
    margin: 0 auto;
    width: 560px;
    margin-bottom: 2%;
}

.videoHeader {
    text-align: center;
    padding-bottom: 2%;
    font-size: 1.5em;
    font-family: 'Copperplate Gothic';
    font-weight: bold;
}


.video-container {
    width: 80%;
    height: 70%;
    position: relative;
    padding-bottom: 45.25%;
    padding-top: 30px;
    margin: 0 auto;
    margin-bottom: 2%;
    overflow: hidden;
}

    .video-container iframe,
    .video-container object,
    .video-container embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        float: none;
        margin: 0 auto;
    }

.video-Fcontainer {
    width: 80%;
    height: 70%;
    position: relative;
    padding-bottom: 45.25%;
    margin: 0 auto;
    overflow: hidden;
}

    .video-Fcontainer iframe,
    .video-Fcontainer object,
    .video-Fcontainer embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        float: none;
        margin: 0 auto;
    }

#vidL {
    float: left;
    width: 50%;
    margin: 0px auto 0px auto;
    vertical-align: middle;
}

#vidR {
    float: right;
    width: 50%;
    margin: 0px auto 0px auto;
    vertical-align: middle;
}



#accordVidTitle {
    text-align: center;
    font-family: Constantia;
    font-size: 1.5em;
    color: #D58A26;
}


#pdf {
    height: 820pt;
    float: right;
    max-height: 100%;
    margin: 2em auto;
    margin-right: 5em;
    position: relative;
}



object.pdfObject iframe {
    width: 100%;
    height: 820pt;
    float: left;
    max-height: 100%;
    margin: 0 auto;
    position: relative;
}

/*Account Management Start*/
#dropZone {
    border: double;
    margin-bottom: 1%;
}
#AccountManagerSection {
    /*display:none;*/
}
#AccountManager {
    text-align: center;
    margin: 0 auto;
}

    #AccountManager tr td {
        margin: 2%;
    }

    #AccountManager tr:nth-child(even) {
        background-color: #C8C8C8;
    }

div .custom-combobox {
    position: relative;
    display: inline-block;
}

div .custom-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    padding: 0;
    /* support: IE7 */
    *height: 1.7em;
    *top: 0.1em;
}

div .custom-combobox-input {
    margin: 0;
    padding: 0.3em;
}

.memberRow {
    padding-bottom: 2%;
    padding-top: 2%;
}

.message-success {
    display:none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background:#58BE2B;
    padding-bottom:20px;
    color:white;
    text-align:center;
    padding-top:20px;
    font-size: 1.7em;
    font-weight: bold;
    margin: 20px 0 10px 0;
    border:2px outset #58BE2B;
}
.message-failure {
    display:none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background:#FC0B09;
    padding-bottom:20px;
    color:white;
    text-align:center;
    padding-top:20px;
    font-size: 1.7em;
    font-weight: bold;
    margin: 20px 0 10px 0;
    border:2px outset #FC0B09;
}


#AccountManagementContainer {
    height:720px;
}
#AccountManagementContainer .homeHeader {
    margin-bottom:20px;
    margin-top:10px;
}


#AccountManagementMenu {
    float:left;
    width:20%;
    display:inline-block;
    border:outset #32333F 2px;
    margin-right:20px;
    margin-left:20px;
    background:#32333F;
}
#AccountManagementMenu .menu-container{
    margin:5px;
}
#AccountManagementMenu .menu-container .menu-section {
    display:block;
    border:2px inset #D9D9D9;
    padding:10px 0px;
    cursor:pointer;
}
#AccountManagementMenu .menu-container .menu-section:hover {
    /*border:2px outset #D9D9D9 !important;*/
    border:2px outset #FDBD3A !important;
}
#AccountManagementMenu .menu-container .menu-section .menu-item {
    font-size:1.5em;
    font-family: Constantia;
    display:inline;
    display:block;
    margin-left:5%;
    color:white;
    font-weight:bold;
}
#AccountManagementMenu .menu-container .menu-section .menu-item a {
    text-decoration:none;
    color:white;
}

#AccountManagementMenu .menu-container .menu-section.selected {
    border:2px outset #F8A623 !important;
    background:#F8A623;
}
#AccountManagementMenu .menu-container .menu-section.selected .menu-item {
    color:#32333F !important;
}


/*Account Management End*/



/*Create Chart Start*/
#CCContainer {
    float: none;
    margin: 0 auto;
}


#CreateChartForm {
    padding-left: 1%;
    padding-top: 2%;
    padding-bottom: 2%;
    max-width: 25%;
    float: left;
    background-color: #5b5b5b;
}

#BeginCalender {
    font-size: 1em;
}

#EndCalender {
    font-size: 1em;
}

/*#ProductDropDownList,
#ProductNameDropDownList {
    font-size: 0.75em;
}*/

#ProductDataForm {
    padding:15px;
    max-width: 25%;
    float: left;
    background-color: #5b5b5b;
}

.form-row {
    width: 100%;
    color: #D9D9DA;
    display: inline-block;
}

.form-row.alt {
    color: #5b5b5b;
    background-color: #D9D9DA;
}

.product-grid .form-row {
    background-color: #D9D9DA;
    color: #32333F;
    height:42px;
}
.product-grid .form-row.alt {
    background-color: #BBBBBB;
}
.allDayValue {
    color: #333;
    font-size: 1.2em;
    margin: 5px 0 0 10px;
    padding: 5px;
    display: inline-block;
}
/*2 Column Form Row*/
.form-row.two-columns .right-item {
    width: 50%;
    float: right;
}
.form-row.two-columns .left-item {
    width: 50%;
    float: left;
}
/*2 Column Form Row*/

/*3 Column Form Row*/
.form-row.three-columns .item {
    width:33%;
    float:left;
}
.form-row.three-columns .item.header {
    text-align:center;
}
    .form-row.three-columns .item.product-symbol {
        text-align:center;
        margin: 10px 0 10px 0;
        font-size:16px;
        font-weight:bold
    }
    .form-row.three-columns .item input {
        width:50%;
    }
/*3 Column Form Row*/




div.CC1I {
    width: 100%;
    color: #D9D9DA;
}

div.CC2I {
    width: 100%;
    color: #D9D9DA;
}

div.CCRI {
    width: 50%;
    float: right;
}

div.CCLI {
    width: 50%;
    float: left;
}

.expand {
    max-width: 100%;
    width: 100%;
    float: none;
    margin: 0 auto;
}

#showGraph {
    float: right;
    margin-right: 5%;
    margin-left: 5%;
    max-width: 60%;
    text-align: center;
}



#CreatedChart {
    max-width: 100%;
    z-index: -1;
}

#chartBox {
    width: 100%;
    height: 100%;
    position: relative;
}

#resizeDiv {
    border: 3px dashed black;
    background: rgba(255, 255, 255, 0.00);
    position: absolute;
    width: 100px;
}

#boxDIV {
    background: rgba(255, 255, 255, 0.00);
    height: 100px;
}

#box-wrapper {
    overflow: hidden;
    position: relative;
    cursor: crosshair;
    z-index: 3;
}

#crosshair-h {
    width: 100%;
    height: 2px;
    margin-top: -1px;
}

#crosshair-v {
    height: 100%;
    width: 2px;
    margin-left: -1px;
}

.hair {
    position: fixed;
    background-color: rgba(100,100,100,0.75);
    box-shadow: 0 0 5px rgb(100,100,100);
    pointer-events: none;
    z-index: 2;
}

#StartTimeDropDownList {
    width: 50%;
}

#EndTimeDropDownList {
    width: 50%;
}

#BeginCalender {
    width: 65%;
}

#EndCalender {
    width: 65%;
}

#CreateButton {
    display: block;
    margin: 0 auto;
    margin-top: 2%;
}

#GraphLegend {
    border: 1px solid;
    margin-bottom: 1%;
    margin-left: 2%;
}

    #GraphLegend td {
        text-align: center;
        vertical-align: middle;
        padding: 5px;
        margin: 0 auto;
        color: white;
    }

#GraphSummaryTable {
    width: 50%;
    border: 2px solid;
    border-collapse: collapse;
    margin: 0 auto;
}

    #GraphSummaryTable td {
        border: 2px solid;
        text-align: center;
        vertical-align: middle;
        padding: 5px;
        margin: 0 auto;
    }

    #GraphSummaryTable th {
        border: 2px solid;
        text-align: center;
        vertical-align: middle;
        padding: 5px;
        margin: 0 auto;
    }

    #GraphSummaryTable tr:nth-child(even) {
        background-color: #C8C8C8;
    }

/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with position:fixed. Width, height, top and left speak
   speak for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(217, 217, 218, 0.80) url('../../Images/graphics/ajax-loader.gif') 50% 50% no-repeat;
}
/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;
}

    /* Anytime the body has the loading class, our
   modal element will be visible */
    body.loading .modal {
        display: block;
    }


#GraphLegendContainer {
    float: left;
}

#enlargeChart {
    float: right;
    margin: 0 auto;
    margin-right: 2%;
    margin-top: 1%;
}

#toggleBox {
    float: right;
    margin: 0 auto;
    margin-right: 2%;
    margin-top: 1%;
}

#ExportAsCSV {
    float: right;
    margin: 0 auto;
    margin-right: 2%;
    margin-top: 1%;
}

#ExportBox {
    column-span: all;
}

/*Create Chart End*/
.aboutArticle {
    margin-left: 5%;
}

#johnPic {
    width: 30%;
    height: auto;
    margin: 0 auto;
    margin-left: 5%;
    margin-right: 2%;
    float: left;
    border: 5px solid #32333F;
    position: relative;
}

#vidSec {
    background-color: #656565;
}

/*Memberships CSS Start*/
div#registerLoginContainer {
    padding: 5%;
    margin-top: 5%;
    float: right;
    border: solid 3px #7F7F80;
    background: #32333F;
    color: white;
}

    div#registerLoginContainer div.registerLoginSection {
        font-size: 1.5em;
        font-family: 'Arno Pro SmText';
        margin-bottom: 1%;
        text-align: center;
    }

        div#registerLoginContainer div.registerLoginSection a {
            color: #ED9D24;
        }

div#servicesContainer {
    float: left;
    padding-left: 5%;
}

div#moreInfo {
    width: 100%;
    margin: 0 auto;
    display: inline;
    text-align: center;
}
/*Memberships CSS End*/



.col_1, .col_2, .col_3, .col_4, .col_5, .col_6, .col_7, .col_8, .col_9, .col_10, .col_11 {
    float: left;
    margin-right: 3.8%;
    position: relative;
}

.col_1 {
    width: 4.85%;
}
/* ie - 4.7% */
.col_2 {
    width: 13.5%;
}
/* ie - 13.2% */
.col_3 {
    width: 22.15%;
}
/* ie - 22.05% */
.col_4 {
    width: 30.8%;
}
/* ie - 30.6% */
.col_5 {
    width: 39.45%;
}
/* ie - 39% */
.col_6 {
    width: 48.1%;
}
/* ie - 48% */
.col_7 {
    width: 56.75%;
}
/* ie - 56.75% */
.col_8 {
    width: 65.4%;
}
/* ie - 61.6% */
.col_9 {
    width: 74.05%;
}
/* ie - 74.05% */
.col_10 {
    width: 82.7%;
}
/* ie - 82.7% */
.col_11 {
    width: 91.35%;
}
/* ie - 91.35% */
.col_12 {
    clear: both;
    width: 100%;
    float: left;
}

/* main layout
----------------------------------------------------------*/
.content-wrapper {
    margin: 0 auto;
    max-width: 85%;
}

#body {
    background-color: #32333F;
    clear: both;
    padding-bottom: 35px;
}

.main-content {
    /*background: url("../Images/accent.png") no-repeat;*/
    padding-left: 10px;
    padding-top: 30px;
    background-color: rgba(226, 226, 226, 0.95);
    padding: 20px 10px 20px 20px;
}

/*.featured + .main-content {
        background: url("../Images/heroAccent.png") no-repeat;
    }*/

/*header .content-wrapper {
    padding-top: 20px; 
}*/

footer {
    clear: both;
    background-color: #e2e2e2;
    font-size: .8em;
    height: 100px;
    bottom: 0;
}


/* site title
----------------------------------------------------------*/
.site-title {
    color: #c8c8c8;
    font-family: "Copperplate Gothic Light", 'Copperplate Gothic';
    font-size: 3.4em;
    margin: 0;
    margin-bottom: 1%;
}

    .site-title a, .site-title a:hover, .site-title a:active {
        background: none;
        color: #c8c8c8;
        outline: none;
        text-decoration: none;
    }




.linkbutton {
    display: inline;
    list-style: none;
    -moz-box-shadow: inset 0px 0px 1px 0px #3dc21b;
    -webkit-box-shadow: inset 0px 0px 1px 0px #3dc21b;
    box-shadow: inset 0px 0px 1px 0px #3dc21b;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #10a337), color-stop(1, #5cbf2a));
    background: -moz-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
    background: -webkit-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
    background: -o-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
    /*background: -ms-linear-gradient(top, #10a337 5%, #5cbf2a 100%);*/
    background: linear-gradient(to bottom, #10a337 5%, #5cbf2a 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#10a337', endColorstr='#5cbf2a',GradientType=0);
    background-color: #10a337;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #18ab29;
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    font-family: arial;
    font-size: 1.1em;
    font-weight: bold;
    padding: 4px 13px;
    text-decoration: none;
    text-shadow: -1px -1px 2px #2f6627;
}

/* page elements
----------------------------------------------------------*/
/* featured */
.featured {
    background-color: #32333F;
}

    .featured .content-wrapper {
        background-color: #7ac0da;
        /*background-image: -ms-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);*/
        background-image: -o-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #7ac0da), color-stop(1, #a4d4e6));
        background-image: -webkit-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        background-image: linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        color: #3e5667;
        padding: 20px 40px 30px 40px;
    }

    .featured hgroup.title h1, .featured hgroup.title h2 {
        color: #fff;
    }

    .featured p {
        font-size: 1.1em;
    }

/* page titles */
hgroup.title {
    margin-bottom: 10px;
}

    hgroup.title h1, hgroup.title h2 {
        display: inline;
    }

    hgroup.title h2 {
        font-weight: normal;
        margin-left: 3px;
    }

/* features */
section.feature {
    width: 300px;
    float: left;
    padding: 10px;
}

/* ordered list */
ol.round {
    list-style-type: none;
    padding-left: 0;
}

    ol.round li {
        margin: 25px 0;
        padding-left: 45px;
    }

        ol.round li.zero {
            background: url("../Images/orderedList0.png") no-repeat;
        }

        ol.round li.one {
            background: url("../Images/orderedList1.png") no-repeat;
        }

        ol.round li.two {
            background: url("../Images/orderedList2.png") no-repeat;
        }

        ol.round li.three {
            background: url("../Images/orderedList3.png") no-repeat;
        }

        ol.round li.four {
            background: url("../Images/orderedList4.png") no-repeat;
        }

        ol.round li.five {
            background: url("../Images/orderedList5.png") no-repeat;
        }

        ol.round li.six {
            background: url("../Images/orderedList6.png") no-repeat;
        }

        ol.round li.seven {
            background: url("../Images/orderedList7.png") no-repeat;
        }

        ol.round li.eight {
            background: url("../Images/orderedList8.png") no-repeat;
        }

        ol.round li.nine {
            background: url("../Images/orderedList9.png") no-repeat;
        }

/* content */
article {
    float: left;
    width: 70%;
}

aside {
    float: left;
    width: 25%;
}

    aside ul {
        list-style: none;
        padding: 0;
    }

        aside ul li {
            background: url("../Images/bullet.png") no-repeat 0 50%;
            padding: 2px 0 2px 20px;
        }

.label {
    font-weight: 700;
}

/* login page */
#loginForm {
    border-right: solid 2px #c8c8c8;
    float: left;
    width: 55%;
}

    #loginForm .validation-error {
        display: block;
        margin-left: 15px;
    }

    #loginForm .validation-summary-errors ul {
        margin: 0;
        padding: 0;
    }

    #loginForm .validation-summary-errors li {
        display: inline;
        list-style: none;
        margin: 0;
    }

    #loginForm input {
        width: 250px;
    }

        #loginForm input[type="checkbox"],
        #loginForm input[type="submit"],
        #loginForm input[type="button"],
        #loginForm button {
            width: auto;
        }

#socialLoginForm {
    margin-left: 40px;
    float: left;
    width: 40%;
}

    #socialLoginForm h2 {
        margin-bottom: 5px;
    }

#socialLoginList button {
    margin-bottom: 12px;
}

#logoutForm {
    display: inline;
    list-style: none;
    -moz-box-shadow: inset 0px 1px 0px 0px #d99157;
    -webkit-box-shadow: inset 0px 1px 0px 0px #d99157;
    box-shadow: inset 0px 1px 0px 0px #d99157;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #cf8627), color-stop(1, #ffab23));
    background: -moz-linear-gradient(top, #cf8627 5%, #ffab23 100%);
    background: -webkit-linear-gradient(top, #cf8627 5%, #ffab23 100%);
    background: -o-linear-gradient(top, #cf8627 5%, #ffab23 100%);
    /*background: -ms-linear-gradient(top, #cf8627 5%, #ffab23 100%);*/
    background: linear-gradient(to bottom, #cf8627 5%, #ffab23 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cf8627', endColorstr='#ffab23',GradientType=0);
    background-color: #cf8627;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    border: 1px solid #e08a43;
    display: inline-block;
    cursor: pointer;
    color: #333333;
    font-family: arial;
    font-size: 15px;
    font-weight: bold;
    padding: 4px 18px;
    text-decoration: none;
    text-shadow: -1px 1px 2px #ffc466;
}

    #logoutForm a:hover {
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffab23), color-stop(1, #cf8627));
        background: -moz-linear-gradient(top, #ffab23 5%, #cf8627 100%);
        background: -webkit-linear-gradient(top, #ffab23 5%, #cf8627 100%);
        background: -o-linear-gradient(top, #ffab23 5%, #cf8627 100%);
        /*background: -ms-linear-gradient(top, #ffab23 5%, #cf8627 100%);*/
        background: linear-gradient(to bottom, #ffab23 5%, #cf8627 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffab23', endColorstr='#cf8627',GradientType=0);
        background-color: #ffab23;
    }

    #logoutForm a:active {
        position: relative;
        top: 1px;
    }


/* contact */
.contact h3 {
    font-size: 1.2em;
}

.contact p {
    margin: 5px 0 0 10px;
}

.contact iframe {
    border: 1px solid #333;
    margin: 5px 0 0 10px;
}

/* forms */
fieldset {
    border: none;
    margin: 0;
    padding: 0;
}

    fieldset legend {
        display: none;
    }

    fieldset ol {
        padding: 0;
        list-style: none;
    }

        fieldset ol li {
            padding-bottom: 5px;
        }

label {
    display: block;
    font-size: 1.2em;
    font-weight: 600;
}

    label.checkbox {
        display: inline;
    }

input, textarea {
    border: 1px solid #e2e2e2;
    background: #fff;
    color: #333;
    font-size: 1.2em;
    margin: 5px 0 6px 0;
    padding: 5px;
    width: 300px;
}

textarea {
    font-family: inherit;
    width: 500px;
}

    input:focus, textarea:focus {
        border: 1px solid #7ac0da;
    }

input[type="checkbox"] {
    background: transparent;
    border: inherit;
    width: auto;
}

input[type="submit"],
input[type="button"],
button {
    background-color: #d3dce0;
    border: 1px solid #787878;
    cursor: pointer;
    font-size: 1.2em;
    font-weight: 600;
    padding: 7px;
    margin-right: 8px;
    width: auto;
}

td input[type="submit"],
td input[type="button"],
td button {
    font-size: 1em;
    padding: 4px;
    margin-right: 4px;
}

/* info and errors */
.message-info {
    border: 1px solid;
    clear: both;
    padding: 10px 20px;
}

.message-error {
    clear: both;
    color: #e80c4d;
    font-size: 1.1em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.error {
    color: #e80c4d;
}

/* styles for validation helpers */
.field-validation-error {
    color: #e80c4d;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #e80c4d;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}


/* tables
----------------------------------------------------------*/
table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 0.75em;
    border: 0 none;
}

th {
    font-size: 1.2em;
    text-align: left;
    border: none 0px;
    padding-left: 0;
}

    th a {
        display: block;
        position: relative;
    }

        th a:link, th a:visited, th a:active, th a:hover {
            color: #333;
            font-weight: 600;
            text-decoration: none;
            padding: 0;
        }

        th a:hover {
            color: #000;
        }

    th.asc a, th.desc a {
        margin-right: .75em;
    }

        th.asc a:after, th.desc a:after {
            display: block;
            position: absolute;
            right: 0em;
            top: 0;
            font-size: 0.75em;
        }

        th.asc a:after {
            content: '▲';
        }

        th.desc a:after {
            content: '▼';
        }

td {
    padding: 0.25em 2em 0.25em 0em;
    border: 0 none;
}

tr.pager td {
    padding: 0 0.25em 0 0;
}

/*--------------- Bootstrap Dropdown Css Start ---------------*/
.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  background-image: none;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  background-image: none;
}
.btn-success:hover,
.btn-success:focus,
.btn-success.focus,
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
  color: #fff;
  background-color: #449d44;
  border-color: #398439;
}
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
  background-image: none;
}
.btn-info:hover,
.btn-info:focus,
.btn-info.focus,
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  background-image: none;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning.focus,
.btn-warning:active,
.btn-warning.active,
.open > .dropdown-toggle.btn-warning {
  color: #fff;
  background-color: #ec971f;
  border-color: #d58512;
}
.btn-warning:active,
.btn-warning.active,
.open > .dropdown-toggle.btn-warning {
  background-image: none;
}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger.focus,
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  color: #fff;
  background-color: #c9302c;
  border-color: #ac2925;
}
.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
  background-image: none;
}
.dropup,
.dropdown {
  position: relative;
}
.dropdown-toggle:focus {
  outline: 0;
}
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  text-align: left;
  list-style: none;
  background-color: #fff;
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
          box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}
.dropdown-menu.pull-right {
  right: 0;
  left: auto;
}
.dropdown-menu .divider {
  height: 1px;
  margin: 9px 0;
  overflow: hidden;
  background-color: #e5e5e5;
}
.dropdown-menu > li > a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333;
  white-space: nowrap;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  color: #262626;
  text-decoration: none;
  background-color: #f5f5f5;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  color: #fff;
  text-decoration: none;
  background-color: #337ab7;
  outline: 0;
}
.dropdown-menu > .disabled > a,
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
  color: #777;
}
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
  text-decoration: none;
  cursor: not-allowed;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.open > .dropdown-menu {
  display: block;
}
.dropdown-menu-right {
  right: 0;
  left: auto;
}
.dropdown-menu-left {
  right: auto;
  left: 0;
}
.dropdown-header {
  display: block;
  padding: 3px 20px;
  font-size: 12px;
  line-height: 1.42857143;
  color: #777;
  white-space: nowrap;
}
.dropdown-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 990;
}
.pull-right > .dropdown-menu {
  right: 0;
  left: auto;
}
.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
  content: "";
  border-top: 0;
  border-bottom: 4px solid;
}
.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
  top: auto;
  bottom: 100%;
  margin-bottom: 2px;
}
@media (min-width: 768px) {
  .navbar-right .dropdown-menu {
    right: 0;
    left: auto;
  }
  .navbar-right .dropdown-menu-left {
    right: auto;
    left: 0;
  }
}
.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
  border-radius: 0;
}
.btn-group > .btn:first-child {
  margin-left: 0;
}
.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
  outline: 0;
}
.btn-group > .btn + .dropdown-toggle {
  padding-right: 8px;
  padding-left: 8px;
}
.btn-group > .btn-lg + .dropdown-toggle {
  padding-right: 12px;
  padding-left: 12px;
}
.btn-group.open .dropdown-toggle {
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
          box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}
.btn-group.open .dropdown-toggle.btn-link {
  -webkit-box-shadow: none;
          box-shadow: none;
}
.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.btn-group-justified > .btn-group .dropdown-menu {
  left: auto;
}
.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group > .btn,
.input-group-btn:first-child > .dropdown-toggle,
.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle),
.input-group-btn:last-child > .btn-group:not(:last-child) > .btn {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group > .btn,
.input-group-btn:last-child > .dropdown-toggle,
.input-group-btn:first-child > .btn:not(:first-child),
.input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.nav-tabs.nav-justified > .dropdown .dropdown-menu {
  top: auto;
  left: auto;
}
.nav-justified > .dropdown .dropdown-menu {
  top: auto;
  left: auto;
}
.nav-tabs .dropdown-menu {
  margin-top: -1px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
@media (max-width: 767px) {
  .navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: transparent;
    border: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  .navbar-nav .open .dropdown-menu > li > a,
  .navbar-nav .open .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 25px;
  }
  .navbar-nav .open .dropdown-menu > li > a {
    line-height: 20px;
  }
  .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-nav .open .dropdown-menu > li > a:focus {
    background-image: none;
  }
}
.navbar-nav > li > .dropdown-menu {
  margin-top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
  margin-bottom: 0;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #777;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #333;
    background-color: transparent;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #555;
    background-color: #e7e7e7;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #ccc;
    background-color: transparent;
  }
}
@media (max-width: 767px) {
  .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
    border-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
    background-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
    color: #9d9d9d;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #fff;
    background-color: transparent;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #fff;
    background-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #444;
    background-color: transparent;
  }
}

.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}
.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
  content: "";
  border-top: 0;
  border-bottom: 4px solid;
}
.btn .caret {
  margin-left: 0;
}
.btn-lg .caret {
  border-width: 5px 5px 0;
  border-bottom-width: 0;
}
.dropup .btn-lg .caret {
  border-width: 0 5px 5px;
}

/*--------------- Bootstrap Dropdown Css End ---------------*/


/********************
*   Mobile Styles   *
********************/
@media only screen and (max-width: 850px) {


    /*My added in Mobile Styles*/
    #macrographLogo {
        width: 100%;
        margin: 0 auto;
    }

        #macrographLogo img#MGLogo {
            width: 100%;
            max-width: 80%;
        }

    #codSection {
        width: 100%;
        margin-bottom: 2%;
    }

    .slogan {
        margin: 0 auto;
        width: 100%;
        text-align: center;
    }

    #sampleGraphs {
        float: none;
        max-width: 100%;
        max-height: 100%;
        position: relative;
    }

    #welcomeText {
        width: 100%;
        float: none;
        max-width: 100%;
        max-height: 100%;
        text-align: center;
    }

    #accordionVid {
        position: relative;
    }

    .classPreviewVideo {
        margin: 0 auto;
        width: 69%;
        max-width: 50%;
        max-height: 50%;
        margin-bottom: 2%;
    }

    .footerCol {
        visibility: hidden;
        margin: 0 auto;
        height: 0;
    }

    #footerWrapper {
        visibility: hidden;
        height: 0;
    }

    #CreateChartForm {
        margin-left: 2%;
        padding-left: 2%;
        padding-top: 2%;
        padding-bottom: 2%;
        max-width: 30%;
        float: left;
        background-color: #5b5b5b;
        display: block;
    }

    div.CC1I {
        width: 100%;
        color: #D9D9DA;
    }

    div.CC2I {
        width: 100%;
        color: #D9D9DA;
    }

    div.CCRI {
        width: 100%;
        float: none;
    }

    div.CCLI {
        width: 100%;
        float: none;
    }

    #showGraph {
        float: right;
        margin-right: 10%;
    }


    #StartTimeDropDownList {
        width: 50%;
    }

    #EndTimeDropDownList {
        width: 50%;
    }

    #BeginCalender {
        width: 70%;
    }

    #EndCalender {
        width: 70%;
    }

    #CreateButton {
        display: block;
        margin: 0 auto;
        margin-top: 2%;
    }

    .descBox table tr td {
        display: block;
        margin: auto;
    }

    .MarketSymbolSection {
        width: 30% !important;
        margin:0 auto !important;
    }

    /* header
    ----------------------------------------------------------*/
    header .float-left,
    header .float-right {
        float: none;
    }

    /* logo */
    header .site-title {
        margin: 10px;
        text-align: center;
    }

    /* login */
    #login {
        font-size: .85em;
        margin: 0 0 12px;
        text-align: center;
    }

        #login ul {
            margin: 5px 0;
            padding: 0;
        }

        #login li {
            display: inline;
            list-style: none;
            margin: 0;
            padding: 0;
        }

        #login a {
            background: none;
            color: #999;
            font-weight: 600;
            margin: 2px;
            padding: 0;
        }

            #login a:hover {
                color: #333;
            }

    /* menu */
    nav {
        margin-bottom: 5px;
    }

    ul#menu {
        margin: 0;
        padding: 0;
        text-align: center;
    }

        ul#menu li {
            margin: 0;
            padding: 0;
        }


    /* main layout
    ----------------------------------------------------------*/
    .main-content,
    .featured + .main-content {
        background-position: 10px 0;
    }

    .content-wrapper {
        padding-right: 10px;
        padding-left: 10px;
    }

    .featured .content-wrapper {
        padding: 10px;
    }

    /* page content */
    article, aside {
        float: none;
        width: 100%;
    }

    /* ordered list */
    ol.round {
        list-style-type: none;
        padding-left: 0;
    }

        ol.round li {
            padding-left: 10px;
            margin: 25px 0;
        }

            ol.round li.zero,
            ol.round li.one,
            ol.round li.two,
            ol.round li.three,
            ol.round li.four,
            ol.round li.five,
            ol.round li.six,
            ol.round li.seven,
            ol.round li.eight,
            ol.round li.nine {
                background: none;
            }

    /* features */
    section.feature {
        float: none;
        padding: 10px;
        width: auto;
    }

        section.feature img {
            color: #999;
            content: attr(alt);
            font-size: 1.5em;
            font-weight: 600;
        }

    /* forms */
    input {
        width: 90%;
    }

    /* login page */
    #loginForm {
        border-right: none;
        float: none;
        width: auto;
    }

        #loginForm .validation-error {
            display: block;
            margin-left: 15px;
        }

    #socialLoginForm {
        margin-left: 0;
        float: none;
        width: auto;
    }

    /*Memberships Page*/
   div.col_5 {
        width:100% !important;
    }
    div#registerLoginContainer {
        width:auto;
        margin:auto;
        float:none;
    }


    div#servicesContainer {
        width:auto;
        float:none;
    }


    div.videoBox {
        max-width:100%;
        /*width:100%;*/

    }
    .classPreviewVideo {
        margin: 0 auto 2%;
        max-height: 50%;
        max-width: 100%;
        width: 100%;
    }
    /*Memberships Page*/

    /* footer
    ----------------------------------------------------------*/
    footer .float-left,
    footer .float-right {
        float: none;
    }

    footer {
        text-align: center;
        height: auto;
        padding: 10px 0;
    }

        footer p {
            margin: 0;
        }
}

/*---------- VERTEX Tabs Start ----------*/
.body-container {
    min-height:600px;
    display:inline-block;
    width:60%;
}

#SubscriptionSummary {
    display:none;
    width:33%;
    float:right;
}
#SubscriptionSummary .form-horizontal .form-row {
    margin-left:20px;
}

.subscription-steps {
}
.subscription-steps .subscription-step-title {
    color: #D58A26;
    text-align: left;
    font-size: 1.3em;
    font-family: "Copperplate Gothic Light", 'Copperplate Gothic', Copperplate;
    font-weight: bold;
}

.sectionHeader {
    font-family: Constantia;
    font-size: 2.5em;
    margin-top:10px;
}

.column-table {
    display:inline-block;
    width:100%;
    margin-left:45px;
}
.column-table .column-section  {
    display:inline-block;
    float: left;
    border: 1px solid black;
    margin-right:3px;
    width:140px;

}
.column-table .column-section .column-header {
    text-align:center;
    border-bottom: 1px solid black;
    background: #32333F;
    color: #F8A623;
    padding:5px;
    font-size:1.5em;
    font-family:"Copperplate Gothic Light", 'Copperplate Gothic', Copperplate;
}
.column-table .column-section .column-data.column-header {
    font-size:1em;
    
}
.column-table .column-section .column-data {
    
}

.column-table .column-section .column-data ul {
    padding:0px;
    margin:0px;
    list-style-type: none;
    color:black;
    /*height:175px;
    background:#32333F;*/
}
.column-table .column-section .column-data ul li {
    text-align:center;
    padding:3px 0px;
}
.column-table .column-section .column-data ul li:nth-child(even) {
    background:rgb(229, 229, 229) none repeat scroll 0% 0%;
}
.column-table .column-section .column-data ul li:nth-child(odd) {
    background:white;
}
.results-table tr td {
    text-align:center;
    border: 1px solid black;
    padding-right:0;
}
.results-table .header-row,
.results-table tr td.header-cell {
    text-align:center;
    border-bottom: 1px solid black;
    background: #32333F;
    color: #F8A623 !important;
    padding:5px;
    font-size:1em;
    font-family:"Copperplate Gothic Light", 'Copperplate Gothic', Copperplate;
}
.results-table {
    margin-left:45px;
}
.results-table tr.results-row:nth-child(even) {
    background:rgb(229, 229, 229) none repeat scroll 0% 0%;
}
.results-table tr.results-row:nth-child(odd) {
    background:white;
}
.results-table tr.results-row {
    color:black;
}
.results-table .header-row td {
    padding:10px;
    font-size:1em;
    background: #32333F;
}
.results-table tr.header-row td.main-header {
    font-size:1.2em;
    font-weight:bold;
}

.disclaimer {
    margin-left:45px;
}
.disclaimer p {
    margin-right:10%;
    font-style:italic;
    margin-top:0;

}

#VertexDescription {
    font-size:1.6em;
}
.vertex-description-container {
    padding-left: 6%;
}

.vertex-description-container .bodyText {
    padding-left:25px;
    margin-bottom:10px;
    margin-top:10px;
}
.vertex-description-container .vertex-list {
    font-size:1.3em;
    border: 2px outset black;
    display:inline-block;
    padding:5px 5px 5px 25px;
    margin:0;
    margin-left:45px;
    background:#32333F;
    color:white;
}
.vertex-description-container .vertex-list li {
    padding:5px 10px 5px 5px;
}

.vertex-description-container .vertex-list li span{
    color: black;
}
.vertex-description-container .vertex-list li:nth-child(odd) {background: #E5E5E5}
.vertex-description-container .vertex-list li:nth-child(even) {background: white}
.sub-choice-container .subscription-choices {
    font-size:1.3em;
    margin-top:5px;
}

.how-to-invest .bodyText {
    margin-top:5px;
}

.plans {
    /*margin-left:6%;*/
    /*margin-top:10px;*/

}
.plan-container {
    font-family: 'Arno Pro SmText';
    margin-bottom:5px;
    border:1px solid black;
    display:inline-block;
    width:32%;
    /*margin-right:10px;*/
}
.plan-container .plan-title {
    font-family: 'Arno Pro SmText';
    font-size: 3.5em;
    width:100%;
    text-align:center;
    padding-bottom:5px;
    border-bottom:1px solid black;
    background:#32333F;
    color:#F8A623;
}


.plan-container .plan-breakdown {
    font-size: 4.5em;
    font-weight:bold;
    text-align:center;
    padding-top:10px;
    background:white;
}
.plan-container .plan-breakdown:before {
    content:"$";
}
.plan-container .plan-breakdown:after {
    content:".00";
    font-size: 30px;
    bottom: 20px;
    position:relative;
    margin-left:2px;
}

.plan-container .plan-per-month {
    text-align:center;
    font-size: 2em;
    bottom: 10px;
    font-style:italic;
    background:white;
    padding-bottom: 10px;
}
/*.plan-container .overall-price .total {
    float:left;
    margin-left:10px;

}*/
.plan-container .overall-price {
    padding-top:5px;
    text-align:center;
    font-size: 3em;
    background:white;
}
    .plan-container .overall-price .plan-price:before {
        content:"Total:";
        font-size: 25px;
        bottom:8px;
        position:relative;
        right:10px;

    }
.plan-container .overall-price .plan-price:after {
    content:".00";
    font-size: 20px;
    bottom: 14px;
    position:relative;
    margin-left:2px;
}

.plan-container .sign-up {

}
@media only screen and (max-width: 1800px) {
  .plan-container .plan-title {
    font-size: 2em;
  }
  .plan-container .plan-breakdown {
      font-size: 3.5em;
  }
  .sign-up #registerLink {
      font-size: 1.5em;
  }
  .plan-container .overall-price {
      font-size: 2.5em;
  }
  .plan-container .overall-price .plan-price::before {
      font-size: 18px;
  }
  .vertex-description-container {
      padding-left:0;
  }
}
.subscribe-button {
    border:none;
    border-top: 2px solid #787878; 
    border-bottom: 2px solid #787878; 
    margin:0px;
    background-color: #F8A623;
    cursor: pointer;
    font-size: 2em;
    padding: 7px;
    display: block;
    text-decoration:none;
    text-align:center;
    color:#32333F;
    font-weight:bold;
    font-family: 'Arno Pro SmText';
}

.gray-out {
    
    opacity:0.2;
}

.plan-container .sign-up .subscribe-button:hover {
    background-color: #FCC643 !important;
}
.form-horizontal {

}
.form-horizontal .form-row {

}
.form-horizontal .form-row label {
    color:black;
}

.comfirm-form .form-row label {
    font-size:.8em;
}

/*---------- Credit Card Form ----------*/
.subscription-step {
    text-align:center;
    vertical-align:middle;
    /*margin-top:25px;*/
    width: 100%;
}
.subscription-step .CC-form {
    text-align:left;
    width: 100%;
    height: 100%;
}
    .subscription-step .CC-form .form-row {
        margin-left:20%;
        display:inline-block;
        width:50%;
    }
#Step1 {

}

.subscription-step .CC-form .form-row .label {

}

.subscription-step .form-horizontal {

}
.CC-form {
    /*border:1px solid black;*/
    /*border:3px solid #F8A623;
    display:inline-block;
    background:#32333F;*/
    display: inline-block;
margin-top: 20px;
background: #D9D9D9;
padding: 10px 0;
border: 2px outset #D9D9D9;
}
.CC-form .form-row {
    margin:10px 20px 10px 20px;
    display:block;
}
.CC-form .form-row label {
    font-size:1.5em;
    font-family: 'Arno Pro SmText';
}
.CC-form .form-row.expireDate {
    margin-top:0;
}
.CC-form .form-row input {
    border:3px #D9D9D9 outset;
}
.subscription-step .form-horizontal .form-row .CCN-container {
    display:inline-block;
}
.subscription-step .form-horizontal .form-row .CVC-container {
    display:inline-block;
}
.subscription-step .form-horizontal .form-row .CVC-container input {
    width:50px;
}

.subscription-step .form-horizontal .form-row .expireMonth {
    width:60%;
}

.subscription-step .form-horizontal .expireDate #txtExpiryMonth,
.subscription-step .form-horizontal .expireDate #txtExpiryYear {
    width:50px;
}
.billingInfo {
    display:inline-block;
}

#UpdateSubscriptionForm {

}
#UpdateSubscriptionForm .form-row .edit-mode {
    display:none;
}
#UpdateSubscriptionForm .form-row label:after {
    content:":";
}
#UpdateSubscriptionForm .button-container span.change-plan-button {
    background-color: #d3dce0;
    border: 1px solid #787878;
    cursor: pointer;
    font-size: 1.2em;
    font-weight: 600;
    padding: 7px;
    margin-right: 8px;
    width: auto;
}
#UpdateSubscriptionForm .button-container #UpdatePlanButton {
    display:none;
}
#CancelChange {
    display:none;
}
#UpdateSubscriptionForm .button-container #CancelPlan {

}

.dialog-confirm .modal-header {
    font-weight:bold;
    font-size:1.5em;
}
.dialog-confirm .modal-body {

}
.modal-container {
    display:none;
}

#SubscriptionContainer {
    display:inline-block;
    width:70%;

}
#UpdateCCForm {
    margin-top:10px;

}
#UpdateCCForm .form-row label:after {
    content:":";
}
#UpdateCCForm .form-row .edit-mode {
    display:none;
}

#UpdateCCForm .form-row .view-mode {
    display:inline-block;
}
#UpdateCCForm .button-container #CancelCCChange,
#UpdateCCForm .button-container #UpdateCardBtn,
#AddCard {
} 
#UpdateCard {
    display:none;
}
#UpdateCCForm .form-row .ccn {
}
#UpdateCCForm .form-row .CCN-container {
    margin-left:15px;
}
#UpdateCCForm .form-row .CCN-container input {

}
#UpdateCCForm .form-row .cvc {
    width:50px;
}
#UpdateCCForm .form-row .cvc label {
    text-align:left;
}
#UpdateCCForm .form-row .CVC-container {
    display:inline-block;
    width:20%;
}
#UpdateCCForm .form-row .CVC-container input {
    width:50px;
}
#UpdateCCForm .form-row .month label {
    text-align:left;
    width:auto;
}
#UpdateCCForm .form-row .month-container {
    margin-left:15px;
    display:block;
}
#UpdateCCForm .form-row .month-container input {
    width:100px;
}

#UpdateCCForm .form-row .year-container {
    margin-left:5%;
    display:inline-block;
}
#UpdateCCForm .form-row .year-container input {
        width:100px;


}
/*#Last4Display:before {
    content: "***********";
}*/

.account-form {
    border:2px outset #32333F;
    background:#32333F;
    display:inline-block;
    width:70%;
    padding-top:10px;
}
.account-form .section-header {
    font-family: Constantia;
    font-size: 2em;
    margin:0;
    padding-bottom:5px;
    margin-left:4%;
    color:#F8A623;
}
.account-form .form-row {
    padding-left:5%;
    margin:0px 10px;
    display:block;
    width:initial;
    background:#C3C3C4;
    padding-top:5px;
    padding-bottom:5px;
}
    .account-form .form-row:nth-child(even) {
        background:#D6D6D7;
    }
.account-form .form-row .form-display {
    color:black;
}
.account-form .form-row label {
    display:inline-block;
    text-align:right;
    width:170px;
    margin-right:10px
}
.account-form .form-row input {
    border:2px #D9D9D9 outset;
}
.account-form .button-container {
    margin:5px 12%;
}
    

.account-form .button-container input,
.account-form .button-container span {
    margin:10px;
}
.account-form .button-container input:hover,
.account-form .button-container span:hover {
        margin:8px;
        border:3px #F8A623 outset;
    }
.form-horizontal.user-info {
    display:inline-block;
    margin-top:20px;
    background:#D9D9D9;
    padding:10px 0;
    border:2px outset #D9D9D9;

}
.form-horizontal.user-info .form-row {
    display:inline-block;
}
.form-horizontal.user-info .form-row label {
    /*text-align:left;*/
    margin-left:19%;
}
.form-horizontal.user-info .form-row input {
    border:3px #D9D9D9 outset;
    margin-left:20%;

}

.plan-info {

}
.plan-info .form-row,
.address-info .form-row {
    color:black;
}
.plan-info .form-row label {

}
.plan-info .form-row span,
.address-info .form-row span {
    margin-left:10px;
}
.plan-info .form-row span.cents,
.plan-info .form-row span#PlanPrice {
    margin-left:0 !important;
}

.summary-header {
    margin-top:10px;
    font-size:1.3em;
    margin-left:10px;
}

.Subscription-submit {
    width:100%;
    margin-top:15px;
    display: inline-block;
    text-align:center;
}

.Subscription-submit .payment-button {
    box-shadow: 0px 0px 1px 0px rgb(61, 194, 27) inset;
    background: rgb(16, 163, 55) linear-gradient(to bottom, rgb(16, 163, 55) 5%, rgb(92, 191, 42) 100%) repeat scroll 0% 0%;
    border-radius: 5px;
    border: 1px solid rgb(24, 171, 41);
    display: inline-block;
    cursor: pointer;
    color: rgb(255, 255, 255);
    font-family: arial;
    font-size: 2em;
    font-weight: bold;
    padding: 4px 13px;
    text-decoration: none;
    text-shadow: -1px -1px 2px rgb(47, 102, 39);
    margin: 0px auto !important;
    width:60%;
    text-align:center;
    /*margin-right:50%;
    margin-left:50%;*/
}

.view-summary-container {
    width:100%;
    font-size:2em;
    box-shadow: 0px 0px 1px 0px rgb(61, 194, 27) inset;
    background: rgb(16, 163, 55) linear-gradient(to bottom, rgb(16, 163, 55) 5%, rgb(92, 191, 42) 100%) repeat scroll 0% 0%;
    border-radius: 5px;
    border: 1px solid rgb(24, 171, 41);
    display: inline-block;
    cursor: pointer;
    color: rgb(255, 255, 255);
    font-family: arial;
    font-size: 2em;
    font-weight: bold;
    padding: 4px 13px;
    text-decoration: none;
    text-shadow: -1px -1px 2px rgb(47, 102, 39);
    margin: 0px auto !important;
    width:60%;
    text-align:center;
    margin-top:20px !important;
}
.Subscription-submit .payment-button:hover, 
.view-summary-container:hover {
    background: rgb(16, 163, 55) linear-gradient(to bottom, rgb(92, 191, 42) 100%,  rgb(16, 163, 55) 5%) repeat scroll 0% 0%;
}

.view-summary-container .view-summary {

}
#AcceptTermsModal {
    display:none;
    width:80%;
    background:white;
}
#AcceptTerms {

}
#AcceptTerms #AcceptTermsButton {
    color:blue;
    text-decoration:underline;
    cursor:pointer;
}
.stripe-powered {
    background: url("../Images/big.png") no-repeat;
    display:inline-block;
    width:150px;
    height:40px;
}
#TermsAndPaymentContainer {
    width:100%;
    display:none;
    text-align:center;
}
#TermsAndPaymentContainer #Terms {
    text-align:left;
    margin-right:10%;
    margin-left:10%;
}
#TermsAndPaymentContainer #Terms p {
    text-align:left;
}
#TermsAndPaymentContainer #Terms span {
    vertical-align:bottom;

}



 
/*---------- Credit Card Form ----------*/

/*.plan-container .name-breakdown-container {
    float:left;
    width:80%;
    border:1px solid;
    display:inline-block;
}

.plan-container .plan-name {
    display:inline-block;
    font-size: 2.5em;
    /*width:85%;*/
/*}
.plan-container .plan-name:after {
    content: "";
    margin-left:5px;
    margin-right:5px;
}
.plan-container .plan-price {
    float:right;

    display:inline-block;
    font-size: 2.5em;
    width:100px;
}
.plan-container .plan-breakdown {
    width:100%;
    font-size: 2.5em;
    margin-left:1%;
    text-align:center
}*/
/*
.plan-container .plan-breakdown:after {
    content:"/Month";
}

.plan-container  .breakdown-text {
    font-size: 2.5em;
    display:inline;
}*/

/*---------- VERTEX Tabs End ----------*/
.radio-container {
    background: #BBBBBB;
    color:black;
}
.radio-row {
    display:inline;
}

    .radio-row label {
        width: 120px;
        text-align: right;
        display: inline-block;
    }

    .radio-row input {
        display: inline;
        width:50px;
    }
.checkbox-row {
    display: block;
    background: #BBBBBB;
}
    .checkbox-row label {
        margin-left: 5px;
        margin-right: 5px;
        color: black;
        display: inline;
    }

/*---------- User Search ----------*/

/*!
 * Hover.css (http://ianlunn.co.uk/)
 * Version: 1.0.6
 * Author: Ian Lunn @IanLunn
 * Author URL: http://ianlunn.co.uk/
 * Github: https://github.com/IanLunn/Hover

 * Made available under a MIT License:
 * http://www.opensource.org/licenses/mit-license.php

 * Hover.css Copyright Ian Lunn 2014.
 */

/* Default styles for the demo buttons */

.button {
  margin: 1em;
  cursor: pointer;
  background: #e1e1e1;
  text-decoration: none;
  color: #666666;
  /* Prevent highlight colour when element is tapped */
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* 2D TRANSITIONS */

/* Grow */

.grow {
  display: block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);

  background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #10a337), color-stop(1, #5cbf2a));
  background:-moz-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
  background:-webkit-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
  background:-o-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
  background:-ms-linear-gradient(top, #10a337 5%, #5cbf2a 100%);
  background:linear-gradient(to bottom, #10a337 5%, #5cbf2a 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#10a337', endColorstr='#5cbf2a',GradientType=0);

}

.grow:hover {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);


}

/* Shrink */

.shrink {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.shrink:hover {
  -webkit-transform: scale(0.9);
  -ms-transform: scale(0.9);
  transform: scale(0.9);
}

/* Pulse */

@-webkit-keyframes pulse {
  25% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  75% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

@keyframes pulse {
  25% {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  75% {
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
  }
}

.pulse {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.pulse:hover {
  -webkit-animation-name: pulse;
  animation-name: pulse;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

/* Pulse Grow */

@-webkit-keyframes pulse-grow {
  to {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}

@keyframes pulse-grow {
  to {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }
}

.pulse-grow {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.pulse-grow:hover {
  -webkit-animation-name: pulse-grow;
  animation-name: pulse-grow;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

/* Pulse Shrink */

@-webkit-keyframes pulse-shrink {
  to {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

@keyframes pulse-shrink {
  to {
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
  }
}

.pulse-shrink {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.pulse-shrink:hover {
  -webkit-animation-name: pulse-shrink;
  animation-name: pulse-shrink;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

/* Push */

@-webkit-keyframes push {
  50% {
    -webkit-transform: scale(0.90);
    transform: scale(0.90);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes push {
  50% {
    -webkit-transform: scale(0.90);
    -ms-transform: scale(0.90);
    transform: scale(0.90);
  }

  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.push {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.push:active {
  -webkit-animation-name: push;
  animation-name: push;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Pop */

@-webkit-keyframes pop {
  50% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pop {
  50% {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
  }

  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.pop {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.pop:hover {
  -webkit-animation-name: pop;
  animation-name: pop;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Rotate */

.rotate {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.rotate:hover {
  -webkit-transform: rotate(4deg);
  -ms-transform: rotate(4deg);
  transform: rotate(4deg);
}

/* Grow Rotate */

.grow-rotate {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.grow-rotate:hover {
  -webkit-transform: scale(1.1) rotate(4deg);
  -ms-transform: scale(1.1) rotate(4deg);
  transform: scale(1.1) rotate(4deg);
}

/* Float */

.float {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.float:hover {
  -webkit-transform: translateY(-5px);
  -ms-transform: translateY(-5px);
  transform: translateY(-5px);
}

/* Sink */

.sink {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.sink:hover {
  -webkit-transform: translateY(5px);
  -ms-transform: translateY(5px);
  transform: translateY(5px);
}

/* Hover */

@-webkit-keyframes hover {
  50% {
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
  }

  100% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
}

@keyframes hover {
  50% {
    -webkit-transform: translateY(-3px);
    -ms-transform: translateY(-3px);
    transform: translateY(-3px);
  }

  100% {
    -webkit-transform: translateY(-6px);
    -ms-transform: translateY(-6px);
    transform: translateY(-6px);
  }
}

.hover {
  display: inline-block;
  -webkit-transition-duration: .5s;
  transition-duration: .5s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.hover:hover {
  -webkit-transform: translateY(-6px);
  -ms-transform: translateY(-6px);
  transform: translateY(-6px);
  -webkit-animation-name: hover;
  animation-name: hover;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

/* Hang */

@-webkit-keyframes hang {
  50% {
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
  }

  100% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
}

@keyframes hang {
  50% {
    -webkit-transform: translateY(3px);
    -ms-transform: translateY(3px);
    transform: translateY(3px);
  }

  100% {
    -webkit-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
  }
}

.hang {
  display: inline-block;
  -webkit-transition-duration: .5s;
  transition-duration: .5s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.hang:hover {
  -webkit-transform: translateY(6px);
  -ms-transform: translateY(6px);
  transform: translateY(6px);
  -webkit-animation-name: hang;
  animation-name: hang;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

/* Skew */

.skew {
  display: block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.skew:hover {
  -webkit-transform: skew(-10deg);
  -ms-transform: skew(-10deg);
  transform: skew(-10deg);
}

/* Skew Forward */

.skew-forward {
  display: block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform-origin: 0 100%;
  -ms-transform-origin: 0 100%;
  transform-origin: 0 100%;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.skew-forward:hover {
  -webkit-transform: skew(-10deg);
  -ms-transform: skew(-10deg);
  transform: skew(-10deg);
}

/* Skew Backward */

.skew-backward {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform-origin: 0 100%;
  -ms-transform-origin: 0 100%;
  transform-origin: 0 100%;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.skew-backward:hover {
  -webkit-transform: skew(10deg);
  -ms-transform: skew(10deg);
  transform: skew(10deg);
}

/* Wobble Vertical */

@-webkit-keyframes wobble-vertical {
  16.65% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }

  33.3% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }

  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }

  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }

  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes wobble-vertical {
  16.65% {
    -webkit-transform: translateY(8px);
    -ms-transform: translateY(8px);
    transform: translateY(8px);
  }

  33.3% {
    -webkit-transform: translateY(-6px);
    -ms-transform: translateY(-6px);
    transform: translateY(-6px);
  }

  49.95% {
    -webkit-transform: translateY(4px);
    -ms-transform: translateY(4px);
    transform: translateY(4px);
  }

  66.6% {
    -webkit-transform: translateY(-2px);
    -ms-transform: translateY(-2px);
    transform: translateY(-2px);
  }

  83.25% {
    -webkit-transform: translateY(1px);
    -ms-transform: translateY(1px);
    transform: translateY(1px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.wobble-vertical {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.wobble-vertical:hover {
  -webkit-animation-name: wobble-vertical;
  animation-name: wobble-vertical;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Wobble Horizontal */

@-webkit-keyframes wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }

  33.3% {
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px);
  }

  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }

  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }

  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(8px);
    -ms-transform: translateX(8px);
    transform: translateX(8px);
  }

  33.3% {
    -webkit-transform: translateX(-6px);
    -ms-transform: translateX(-6px);
    transform: translateX(-6px);
  }

  49.95% {
    -webkit-transform: translateX(4px);
    -ms-transform: translateX(4px);
    transform: translateX(4px);
  }

  66.6% {
    -webkit-transform: translateX(-2px);
    -ms-transform: translateX(-2px);
    transform: translateX(-2px);
  }

  83.25% {
    -webkit-transform: translateX(1px);
    -ms-transform: translateX(1px);
    transform: translateX(1px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.wobble-horizontal {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.wobble-horizontal:hover {
  -webkit-animation-name: wobble-horizontal;
  animation-name: wobble-horizontal;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Wobble To Bottom Right */

@-webkit-keyframes wobble-to-bottom-right {
  16.65% {
    -webkit-transform: translate(8px, 8px);
    transform: translate(8px, 8px);
  }

  33.3% {
    -webkit-transform: translate(-6px, -6px);
    transform: translate(-6px, -6px);
  }

  49.95% {
    -webkit-transform: translate(4px, 4px);
    transform: translate(4px, 4px);
  }

  66.6% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }

  83.25% {
    -webkit-transform: translate(1px, 1px);
    transform: translate(1px, 1px);
  }

  100% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

@keyframes wobble-to-bottom-right {
  16.65% {
    -webkit-transform: translate(8px, 8px);
    -ms-transform: translate(8px, 8px);
    transform: translate(8px, 8px);
  }

  33.3% {
    -webkit-transform: translate(-6px, -6px);
    -ms-transform: translate(-6px, -6px);
    transform: translate(-6px, -6px);
  }

  49.95% {
    -webkit-transform: translate(4px, 4px);
    -ms-transform: translate(4px, 4px);
    transform: translate(4px, 4px);
  }

  66.6% {
    -webkit-transform: translate(-2px, -2px);
    -ms-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }

  83.25% {
    -webkit-transform: translate(1px, 1px);
    -ms-transform: translate(1px, 1px);
    transform: translate(1px, 1px);
  }

  100% {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

.wobble-to-bottom-right {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.wobble-to-bottom-right:hover {
  -webkit-animation-name: wobble-to-bottom-right;
  animation-name: wobble-to-bottom-right;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Wobble To Top Right */

@-webkit-keyframes wobble-to-top-right {
  16.65% {
    -webkit-transform: translate(8px, -8px);
    transform: translate(8px, -8px);
  }

  33.3% {
    -webkit-transform: translate(-6px, 6px);
    transform: translate(-6px, 6px);
  }

  49.95% {
    -webkit-transform: translate(4px, -4px);
    transform: translate(4px, -4px);
  }

  66.6% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }

  83.25% {
    -webkit-transform: translate(1px, -1px);
    transform: translate(1px, -1px);
  }

  100% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

@keyframes wobble-to-top-right {
  16.65% {
    -webkit-transform: translate(8px, -8px);
    -ms-transform: translate(8px, -8px);
    transform: translate(8px, -8px);
  }

  33.3% {
    -webkit-transform: translate(-6px, 6px);
    -ms-transform: translate(-6px, 6px);
    transform: translate(-6px, 6px);
  }

  49.95% {
    -webkit-transform: translate(4px, -4px);
    -ms-transform: translate(4px, -4px);
    transform: translate(4px, -4px);
  }

  66.6% {
    -webkit-transform: translate(-2px, 2px);
    -ms-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }

  83.25% {
    -webkit-transform: translate(1px, -1px);
    -ms-transform: translate(1px, -1px);
    transform: translate(1px, -1px);
  }

  100% {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

.wobble-to-top-right {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.wobble-to-top-right:hover {
  -webkit-animation-name: wobble-to-top-right;
  animation-name: wobble-to-top-right;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Wobble Top */

@-webkit-keyframes wobble-top {
  16.65% {
    -webkit-transform: skew(-12deg);
    transform: skew(-12deg);
  }

  33.3% {
    -webkit-transform: skew(10deg);
    transform: skew(10deg);
  }

  49.95% {
    -webkit-transform: skew(-6deg);
    transform: skew(-6deg);
  }

  66.6% {
    -webkit-transform: skew(4deg);
    transform: skew(4deg);
  }

  83.25% {
    -webkit-transform: skew(-2deg);
    transform: skew(-2deg);
  }

  100% {
    -webkit-transform: skew(0);
    transform: skew(0);
  }
}

@keyframes wobble-top {
  16.65% {
    -webkit-transform: skew(-12deg);
    -ms-transform: skew(-12deg);
    transform: skew(-12deg);
  }

  33.3% {
    -webkit-transform: skew(10deg);
    -ms-transform: skew(10deg);
    transform: skew(10deg);
  }

  49.95% {
    -webkit-transform: skew(-6deg);
    -ms-transform: skew(-6deg);
    transform: skew(-6deg);
  }

  66.6% {
    -webkit-transform: skew(4deg);
    -ms-transform: skew(4deg);
    transform: skew(4deg);
  }

  83.25% {
    -webkit-transform: skew(-2deg);
    -ms-transform: skew(-2deg);
    transform: skew(-2deg);
  }

  100% {
    -webkit-transform: skew(0);
    -ms-transform: skew(0);
    transform: skew(0);
  }
}

.wobble-top {
  display: inline-block;
  -webkit-transform-origin: 0 100%;
  -ms-transform-origin: 0 100%;
  transform-origin: 0 100%;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.wobble-top:hover {
  -webkit-animation-name: wobble-top;
  animation-name: wobble-top;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Wobble Bottom */

@-webkit-keyframes wobble-bottom {
  16.65% {
    -webkit-transform: skew(-12deg);
    transform: skew(-12deg);
  }

  33.3% {
    -webkit-transform: skew(10deg);
    transform: skew(10deg);
  }

  49.95% {
    -webkit-transform: skew(-6deg);
    transform: skew(-6deg);
  }

  66.6% {
    -webkit-transform: skew(4deg);
    transform: skew(4deg);
  }

  83.25% {
    -webkit-transform: skew(-2deg);
    transform: skew(-2deg);
  }

  100% {
    -webkit-transform: skew(0);
    transform: skew(0);
  }
}

@keyframes wobble-bottom {
  16.65% {
    -webkit-transform: skew(-12deg);
    -ms-transform: skew(-12deg);
    transform: skew(-12deg);
  }

  33.3% {
    -webkit-transform: skew(10deg);
    -ms-transform: skew(10deg);
    transform: skew(10deg);
  }

  49.95% {
    -webkit-transform: skew(-6deg);
    -ms-transform: skew(-6deg);
    transform: skew(-6deg);
  }

  66.6% {
    -webkit-transform: skew(4deg);
    -ms-transform: skew(4deg);
    transform: skew(4deg);
  }

  83.25% {
    -webkit-transform: skew(-2deg);
    -ms-transform: skew(-2deg);
    transform: skew(-2deg);
  }

  100% {
    -webkit-transform: skew(0);
    -ms-transform: skew(0);
    transform: skew(0);
  }
}

.wobble-bottom {
  display: inline-block;
  -webkit-transform-origin: 100% 0;
  -ms-transform-origin: 100% 0;
  transform-origin: 100% 0;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.wobble-bottom:hover {
  -webkit-animation-name: wobble-bottom;
  animation-name: wobble-bottom;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Wobble Skew */

@-webkit-keyframes wobble-skew {
  16.65% {
    -webkit-transform: skew(-12deg);
    transform: skew(-12deg);
  }

  33.3% {
    -webkit-transform: skew(10deg);
    transform: skew(10deg);
  }

  49.95% {
    -webkit-transform: skew(-6deg);
    transform: skew(-6deg);
  }

  66.6% {
    -webkit-transform: skew(4deg);
    transform: skew(4deg);
  }

  83.25% {
    -webkit-transform: skew(-2deg);
    transform: skew(-2deg);
  }

  100% {
    -webkit-transform: skew(0);
    transform: skew(0);
  }
}

@keyframes wobble-skew {
  16.65% {
    -webkit-transform: skew(-12deg);
    -ms-transform: skew(-12deg);
    transform: skew(-12deg);
  }

  33.3% {
    -webkit-transform: skew(10deg);
    -ms-transform: skew(10deg);
    transform: skew(10deg);
  }

  49.95% {
    -webkit-transform: skew(-6deg);
    -ms-transform: skew(-6deg);
    transform: skew(-6deg);
  }

  66.6% {
    -webkit-transform: skew(4deg);
    -ms-transform: skew(4deg);
    transform: skew(4deg);
  }

  83.25% {
    -webkit-transform: skew(-2deg);
    -ms-transform: skew(-2deg);
    transform: skew(-2deg);
  }

  100% {
    -webkit-transform: skew(0);
    -ms-transform: skew(0);
    transform: skew(0);
  }
}

.wobble-skew {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.wobble-skew:hover {
  -webkit-animation-name: wobble-skew;
  animation-name: wobble-skew;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Buzz */

@-webkit-keyframes buzz {
  50% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }

  100% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
}

@keyframes buzz {
  50% {
    -webkit-transform: translateX(3px) rotate(2deg);
    -ms-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }

  100% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    -ms-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
}

.buzz {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.buzz:hover {
  -webkit-animation-name: buzz;
  animation-name: buzz;
  -webkit-animation-duration: .15s;
  animation-duration: .15s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

/* Buzz Out */

@-webkit-keyframes buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }

  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }

  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }

  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }

  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }

  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }

  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }

  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }

  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }

  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}

@keyframes buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    -ms-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }

  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    -ms-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }

  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    -ms-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }

  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    -ms-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }

  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    -ms-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }

  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    -ms-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }

  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    -ms-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }

  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    -ms-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }

  90% {
    -webkit-transform: translateX(1px) rotate(0);
    -ms-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }

  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    -ms-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}

.buzz-out {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.buzz-out:hover {
  -webkit-animation-name: buzz-out;
  animation-name: buzz-out;
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* BORDER TRANSITIONS */

/* Border Fade */

.border-fade {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: box-shadow;
  transition-property: box-shadow;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
  /* Hack to improve aliasing on mobile/tablet devices */
}

.border-fade:hover {
  box-shadow: inset 0 0 0 4px #666666, 0 0 1px rgba(0, 0, 0, 0);
  /* Hack to improve aliasing on mobile/tablet devices */
}

/* Hollow */

.hollow {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: background;
  transition-property: background;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: inset 0 0 0 4px #e1e1e1, 0 0 1px rgba(0, 0, 0, 0);
  /* Hack to improve aliasing on mobile/tablet devices */
}

.hollow:hover {
  background: none;
}

/* Trim */

.trim {
  display: block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.trim:before {
  content: '';
  position: absolute;
  border: black solid 4px;
  top: 4px;
  left: 4px;
  right: 4px;
  bottom: 4px;
  opacity: 0;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: opacity;
  transition-property: opacity;
}

.trim:hover:before {
  opacity: 1;
}

/* Outline Outward */

.outline-outward {
  display: block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.outline-outward:before {
  content: '';
  position: absolute;
  border: #32333F solid 4px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-transition-duration: .3s;
  transition-duration: .3s;
  -webkit-transition-property: top, right, bottom, left;
  transition-property: top, right, bottom, left;
}

.outline-outward:hover:before {
  top: -8px;
  right: -8px;
  bottom: -8px;
  left: -8px;
}

/* Outline Inward */

.outline-inward {
  display: block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.outline-inward:before {
  content: '';
  position: absolute;
  border: #32333F solid 4px;
  top: -16px;
  right: -16px;
  bottom: -16px;
  left: -16px;
  opacity: 0;
  -webkit-transition-duration: .3s;
  transition-duration: .3s;
  -webkit-transition-property: top, right, bottom, left;
  transition-property: top, right, bottom, left;
}

.outline-inward:hover:before {
  top: -8px;
  right: -8px;
  bottom: -8px;
  left: -8px;
  opacity: 1;
}

/* Round Corners */

.round-corners {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: border-radius;
  transition-property: border-radius;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.round-corners:hover {
  border-radius: 1em;
}

/* SHADOW/GLOW TRANSITIONS */

/* Glow */

.glow {
  display: block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: box-shadow;
  transition-property: box-shadow;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.glow:hover {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
}

/* Box Shadow Outset */

.box-shadow-outset {
  display: block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: box-shadow;
  transition-property: box-shadow;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0);
}

.box-shadow-outset:hover {
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6);
}

/* Box Shadow Inset */

.box-shadow-inset {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: box-shadow;
  transition-property: box-shadow;
  box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.6), 0 0 1px rgba(0, 0, 0, 0);
  /* Hack to improve aliasing on mobile/tablet devices */
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}

.box-shadow-inset:hover {
  box-shadow: inset 2px 2px 2px rgba(0, 0, 0, 0.6), 0 0 1px rgba(0, 0, 0, 0);
  /* Hack to improve aliasing on mobile/tablet devices */
}

/* Float Shadow */

.float-shadow {
  display: block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0px 0 0 rgba(0, 0, 0, 0);
}


.float-shadow:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 15px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%);
  /* W3C */
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform, opacity;
  transition-property: transform, opacity;
}

.float-shadow:hover {
  -webkit-transform: translateY(-5px);
  -ms-transform: translateY(-5px);
  transform: translateY(-5px);
  margin-bottom:0;
  /* move the element up by 5px */
}

.float-shadow:hover:before {
  opacity: 1;
  -webkit-transform: translateY(5px);
  -ms-transform: translateY(5px);
  transform: translateY(5px);
  /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */
}

/* Hover Shadow */

@keyframes hover {
  50% {
    -webkit-transform: translateY(-3px);
    -ms-transform: translateY(-3px);
    transform: translateY(-3px);
  }

  100% {
    -webkit-transform: translateY(-6px);
    -ms-transform: translateY(-6px);
    transform: translateY(-6px);
  }
}

@-webkit-keyframes hover-shadow {
  0% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }

  50% {
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }
}

@keyframes hover-shadow {
  0% {
    -webkit-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }

  50% {
    -webkit-transform: translateY(3px);
    -ms-transform: translateY(3px);
    transform: translateY(3px);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }
}

.hover-shadow {
  display: inline-block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.hover-shadow:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  /* W3C */
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform, opacity;
  transition-property: transform, opacity;
}

.hover-shadow:hover {
  -webkit-transform: translateY(-6px);
  -ms-transform: translateY(-6px);
  transform: translateY(-6px);
  -webkit-animation-name: hover;
  animation-name: hover;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

.hover-shadow:hover:before {
  opacity: .4;
  -webkit-transform: translateY(6px);
  -ms-transform: translateY(6px);
  transform: translateY(6px);
  -webkit-animation-name: hover-shadow;
  animation-name: hover-shadow;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-delay: .3s;
  animation-delay: .3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

/* Shadow Radial */

.shadow-radial {
  display: block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.shadow-radial:before,
.shadow-radial:after {
  pointer-events: none;
  position: absolute;
  content: '';
  left: 0;
  width: 100%;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background-repeat: no-repeat;
  height: 5px;
  opacity: 0;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: opacity;
  transition-property: opacity;
}

.shadow-radial:before {
  bottom: 100%;
  background: -webkit-radial-gradient(50% 150%, ellipse, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at 50% 150%, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%);
}

.shadow-radial:after {
  top: 100%;
  background: -webkit-radial-gradient(50% -50%, ellipse, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at 50% -50%, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 80%);
}

.shadow-radial:hover:before,
.shadow-radial:hover:after {
  opacity: 1;
}

/* SPEECH BUBBLES */

/* Bubble Top */

.bubble-top {
  display: inline-block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.bubble-top:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  border-style: solid;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  left: -webkit-calc(50% - 10px);
  left: calc(50% - 10px);
  border-width: 0 10px 10px 10px;
  border-color: transparent transparent #e1e1e1 transparent;
  -webkit-transition-property: top;
  transition-property: top;
}

.bubble-top:hover:before {
  top: -10px;
}

/* Bubble Right */

.bubble-right {
  display: inline-block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.bubble-right:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  border-style: solid;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: right;
  transition-property: right;
  top: -webkit-calc(50% - 10px);
  top: calc(50% - 10px);
  right: 0;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent #e1e1e1;
}

.bubble-right:hover:before {
  right: -10px;
  border-color: transparent transparent transparent #32333F;
}

/* Bubble Bottom */

.bubble-bottom {
  display: inline-block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.bubble-bottom:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  border-style: solid;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: bottom;
  transition-property: bottom;
  left: -webkit-calc(50% - 10px);
  left: calc(50% - 10px);
  bottom: 0;
  border-width: 10px 10px 0 10px;
  border-color: #e1e1e1 transparent transparent transparent;
}

.bubble-bottom:hover:before {
  bottom: -10px;
}

/* Bubble Left */

.bubble-left {
  display: inline-block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.bubble-left:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  border-style: solid;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: left;
  transition-property: left;
  top: -webkit-calc(50% - 10px);
  top: calc(50% - 10px);
  left: 0;
  border-width: 10px 10px 10px 0;
  border-color: transparent #e1e1e1 transparent transparent;
}

.bubble-left:hover:before {
  left: -10px;
}

/* Bubble Float Top */

.bubble-float-top {
  display: inline-block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.bubble-float-top:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  left: -webkit-calc(50% - 10px);
  left: calc(50% - 10px);
  top: 0;
  border-style: solid;
  border-width: 0 10px 10px 10px;
  border-color: transparent transparent #e1e1e1 transparent;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: top;
  transition-property: top;
}

.bubble-float-top:hover {
  -webkit-transform: translateY(5px) translateZ(0);
  -ms-transform: translateY(5px) translateZ(0);
  transform: translateY(5px) translateZ(0);
}

.bubble-float-top:hover:before {
  top: -10px;
}

/* Bubble Float Right */

.bubble-float-right {
  display: block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.bubble-float-right:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  top: -webkit-calc(50% - 10px);
  top: calc(50% - 10px);
  right: 0;
  content: '';
  border-style: solid;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent #e1e1e1;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: right;
  transition-property: right;
}

.bubble-float-right:hover {
  -webkit-transform: translateX(-5px);
  -ms-transform: translateX(-5px);
  transform: translateX(-5px);
}

.bubble-float-right:hover:before {
  right: -10px;
}

/* Bubble Float Bottom */

.bubble-float-bottom {
  display: inline-block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.bubble-float-bottom:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  left: -webkit-calc(50% - 10px);
  left: calc(50% - 10px);
  bottom: 0;
  border-style: solid;
  border-width: 10px 10px 0 10px;
  border-color: #e1e1e1 transparent transparent transparent;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: bottom;
  transition-property: bottom;
}

.bubble-float-bottom:hover {
  -webkit-transform: translateY(-5px) translateZ(0);
  -ms-transform: translateY(-5px) translateZ(0);
  transform: translateY(-5px) translateZ(0);
}

.bubble-float-bottom:hover:before {
  bottom: -10px;
}

/* Bubble Float Left */

.bubble-float-left {
  display: inline-block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.bubble-float-left:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: -webkit-calc(50% - 10px);
  top: calc(50% - 10px);
  left: 0;
  border-style: solid;
  border-width: 10px 10px 10px 0;
  border-color: transparent #e1e1e1 transparent transparent;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: left;
  transition-property: left;
}

.bubble-float-left:hover {
  -webkit-transform: translateX(5px);
  -ms-transform: translateX(5px);
  transform: translateX(5px);
}

.bubble-float-left:hover:before {
  left: -10px;
}

/* CURLS */

/* Curl Top Left */

.curl-top-left {
  display: inline-block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.curl-top-left:before {
  pointer-events: none;
  position: absolute;
  content: '';
  height: 0;
  width: 0;
  top: 0;
  left: 0;
  background: white;
  /* IE9 */
  background: -webkit-linear-gradient(315deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
  background: linear-gradient(135deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#000000');
  /*For IE7-8-9*/
  z-index: 1000;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: width, height;
  transition-property: width, height;
}

.curl-top-left:hover:before {
  width: 25px;
  height: 25px;
}

/* Curl Top Right */

.curl-top-right {
  display: inline-block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.curl-top-right:before {
  pointer-events: none;
  position: absolute;
  content: '';
  height: 0;
  width: 0;
  top: 0;
  right: 0;
  background: white;
  /* IE9 */
  background: -webkit-linear-gradient(225deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
  background: linear-gradient(225deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
  box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.4);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: width, height;
  transition-property: width, height;
}

.curl-top-right:hover:before {
  width: 25px;
  height: 25px;
}

/* Curl Bottom Right */

.curl-bottom-right {
  display: inline-block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.curl-bottom-right:before {
  pointer-events: none;
  position: absolute;
  content: '';
  height: 0;
  width: 0;
  bottom: 0;
  right: 0;
  background: white;
  /* IE9 */
  background: -webkit-linear-gradient(135deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
  background: linear-gradient(315deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
  box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.4);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: width, height;
  transition-property: width, height;
}

.curl-bottom-right:hover:before {
  width: 25px;
  height: 25px;
}

/* Curl Bottom Left */

.curl-bottom-left {
  display: inline-block;
  position: relative;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.curl-bottom-left:before {
  pointer-events: none;
  position: absolute;
  content: '';
  height: 0;
  width: 0;
  bottom: 0;
  left: 0;
  background: white;
  /* IE9 */
  background: -webkit-linear-gradient(45deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
  background: linear-gradient(45deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
  box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.4);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: width, height;
  transition-property: width, height;
}

.curl-bottom-left:hover:before {
  width: 25px;
  height: 25px;
}
.ui-timepicker-wrapper {
	overflow-y: auto;
	height: 150px;
	width: 6.5em;
	background: #fff;
	border: 1px solid #ddd;
	-webkit-box-shadow:0 5px 10px rgba(0,0,0,0.2);
	-moz-box-shadow:0 5px 10px rgba(0,0,0,0.2);
	box-shadow:0 5px 10px rgba(0,0,0,0.2);
	outline: none;
	z-index: 10001;
	margin: 0;
}

.ui-timepicker-wrapper.ui-timepicker-with-duration {
	width: 11em;
}

.ui-timepicker-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ui-timepicker-duration {
	margin-left: 5px; color: #888;
}

.ui-timepicker-list:hover .ui-timepicker-duration {
	color: #888;
}

.ui-timepicker-list li {
	padding: 3px 0 3px 5px;
	cursor: pointer;
	white-space: nowrap;
	color: #000;
	list-style: none;
	margin: 0;
}

.ui-timepicker-list:hover .ui-timepicker-selected {
	background: #fff; color: #000;
}

li.ui-timepicker-selected,
.ui-timepicker-list li:hover,
.ui-timepicker-list .ui-timepicker-selected:hover {
	background: #1980EC; color: #fff;
}

li.ui-timepicker-selected .ui-timepicker-duration,
.ui-timepicker-list li:hover .ui-timepicker-duration {
	color: #ccc;
}

.ui-timepicker-list li.ui-timepicker-disabled,
.ui-timepicker-list li.ui-timepicker-disabled:hover,
.ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled {
	color: #888;
	cursor: default;
}

.ui-timepicker-list li.ui-timepicker-disabled:hover,
.ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled {
	background: #f2f2f2;
}

/* Styles for basic forms
-----------------------------------------------------------*/
fieldset { border: 1px solid #ddd; padding: 0 1.4em 1.4em 1.4em; margin: 0 0 1.5em 0; }

legend { font-size: 1.2em; font-weight: bold; }

textarea { min-height: 75px; }

.editor-label { margin: 1em 0 0 0; }

.editor-field { margin: 0.5em 0 0 0; }


/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error { color: #f00; }

.field-validation-valid { display: none; }

.input-validation-error { border: 1px solid #f00; background-color: #fee; }

.validation-summary-errors { font-weight: bold; color: #f00; }

.validation-summary-valid { display: none; }

/* The MIT License */
.dropzone,
.dropzone *,
.dropzone-previews,
.dropzone-previews * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.dropzone { position: relative; border: 1px solid rgba(0,0,0,0.08); background: rgba(0,0,0,0.02); padding: 1em; }
    .dropzone.dz-clickable { cursor: pointer; }
        .dropzone.dz-clickable .dz-message,
        .dropzone.dz-clickable .dz-message span { cursor: pointer; }
        .dropzone.dz-clickable * { cursor: default; }
    .dropzone .dz-message { opacity: 1; -ms-filter: none; filter: none; }
    .dropzone.dz-drag-hover { border-color: rgba(0,0,0,0.15); background: rgba(0,0,0,0.04); }
    .dropzone.dz-started .dz-message { display: none; }
    .dropzone .dz-preview,
    .dropzone-previews .dz-preview { background: rgba(255,255,255,0.8); position: relative; display: inline-block; margin: 17px; vertical-align: top; border: 1px solid #acacac; padding: 6px 6px 6px 6px; }
        .dropzone .dz-preview.dz-file-preview [data-dz-thumbnail],
        .dropzone-previews .dz-preview.dz-file-preview [data-dz-thumbnail] { display: none; }
        .dropzone .dz-preview .dz-details,
        .dropzone-previews .dz-preview .dz-details { width: 100px; height: 100px; position: relative; background: #ebebeb; padding: 5px; margin-bottom: 22px; }
            .dropzone .dz-preview .dz-details .dz-filename,
            .dropzone-previews .dz-preview .dz-details .dz-filename { overflow: hidden; height: 100%; }
            .dropzone .dz-preview .dz-details img,
            .dropzone-previews .dz-preview .dz-details img { position: absolute; top: 0; left: 0; width: 100px; height: 100px; }
            .dropzone .dz-preview .dz-details .dz-size,
            .dropzone-previews .dz-preview .dz-details .dz-size { position: absolute; bottom: -28px; left: 3px; height: 28px; line-height: 28px; }
        .dropzone .dz-preview.dz-error .dz-error-mark,
        .dropzone-previews .dz-preview.dz-error .dz-error-mark { display: block; }
        .dropzone .dz-preview.dz-success .dz-success-mark,
        .dropzone-previews .dz-preview.dz-success .dz-success-mark { display: block; }
        .dropzone .dz-preview:hover .dz-details img,
        .dropzone-previews .dz-preview:hover .dz-details img { display: none; }
        .dropzone .dz-preview .dz-success-mark,
        .dropzone-previews .dz-preview .dz-success-mark,
        .dropzone .dz-preview .dz-error-mark,
        .dropzone-previews .dz-preview .dz-error-mark { display: none; position: absolute; width: 40px; height: 40px; font-size: 30px; text-align: center; right: -10px; top: -10px; }
        .dropzone .dz-preview .dz-success-mark,
        .dropzone-previews .dz-preview .dz-success-mark { color: #8cc657; }
        .dropzone .dz-preview .dz-error-mark,
        .dropzone-previews .dz-preview .dz-error-mark { color: #ee162d; }
        .dropzone .dz-preview .dz-progress,
        .dropzone-previews .dz-preview .dz-progress { position: absolute; top: 100px; left: 6px; right: 6px; height: 6px; background: #d7d7d7; display: none; }
            .dropzone .dz-preview .dz-progress .dz-upload,
            .dropzone-previews .dz-preview .dz-progress .dz-upload { position: absolute; top: 0; bottom: 0; left: 0; width: 0%; background-color: #8cc657; }
        .dropzone .dz-preview.dz-processing .dz-progress,
        .dropzone-previews .dz-preview.dz-processing .dz-progress { display: block; }
        .dropzone .dz-preview .dz-error-message,
        .dropzone-previews .dz-preview .dz-error-message { display: none; position: absolute; top: -5px; left: -20px; background: rgba(245,245,245,0.8); padding: 8px 10px; color: #800; min-width: 140px; max-width: 500px; z-index: 500; }
        .dropzone .dz-preview:hover.dz-error .dz-error-message,
        .dropzone-previews .dz-preview:hover.dz-error .dz-error-message { display: block; }
.dropzone { border: 1px solid rgba(0,0,0,0.03); min-height: 360px; -webkit-border-radius: 3px; border-radius: 3px; background: rgba(0,0,0,0.03); padding: 23px; }
    .dropzone .dz-default.dz-message { opacity: 1; -ms-filter: none; filter: none; -webkit-transition: opacity 0.3s ease-in-out; -moz-transition: opacity 0.3s ease-in-out; -o-transition: opacity 0.3s ease-in-out; -ms-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; background-image: url("../images/spritemap.png"); background-repeat: no-repeat; background-position: 0 0; position: absolute; width: 428px; height: 123px; margin-left: -214px; margin-top: -61.5px; top: 50%; left: 50%; }

@media all and (-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:1.5/1),(min-device-pixel-ratio:1.5),(min-resolution:138dpi),(min-resolution:1.5dppx) {
    .dropzone .dz-default.dz-message { background-image: url("../images/spritemap@2x.png"); -webkit-background-size: 428px 406px; -moz-background-size: 428px 406px; background-size: 428px 406px; }
}

.dropzone .dz-default.dz-message span { display: none; }
.dropzone.dz-square .dz-default.dz-message { background-position: 0 -123px; width: 268px; margin-left: -134px; height: 174px; margin-top: -87px; }
.dropzone.dz-drag-hover .dz-message { opacity: 0.15; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=15)"; filter: alpha(opacity=15); }
.dropzone.dz-started .dz-message { display: block; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); }
.dropzone .dz-preview,
.dropzone-previews .dz-preview { -webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.16); box-shadow: 1px 1px 4px rgba(0,0,0,0.16); font-size: 14px; }
    .dropzone .dz-preview.dz-image-preview:hover .dz-details img,
    .dropzone-previews .dz-preview.dz-image-preview:hover .dz-details img { display: block; opacity: 0.1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"; filter: alpha(opacity=10); }
    .dropzone .dz-preview.dz-success .dz-success-mark,
    .dropzone-previews .dz-preview.dz-success .dz-success-mark { opacity: 1; -ms-filter: none; filter: none; }
    .dropzone .dz-preview.dz-error .dz-error-mark,
    .dropzone-previews .dz-preview.dz-error .dz-error-mark { opacity: 1; -ms-filter: none; filter: none; }
    .dropzone .dz-preview.dz-error .dz-progress .dz-upload,
    .dropzone-previews .dz-preview.dz-error .dz-progress .dz-upload { background: #ee1e2d; }
    .dropzone .dz-preview .dz-error-mark,
    .dropzone-previews .dz-preview .dz-error-mark,
    .dropzone .dz-preview .dz-success-mark,
    .dropzone-previews .dz-preview .dz-success-mark { display: block; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -webkit-transition: opacity 0.4s ease-in-out; -moz-transition: opacity 0.4s ease-in-out; -o-transition: opacity 0.4s ease-in-out; -ms-transition: opacity 0.4s ease-in-out; transition: opacity 0.4s ease-in-out; background-image: url("../images/spritemap.png"); background-repeat: no-repeat; }

@media all and (-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:1.5/1),(min-device-pixel-ratio:1.5),(min-resolution:138dpi),(min-resolution:1.5dppx) {
    .dropzone .dz-preview .dz-error-mark,
    .dropzone-previews .dz-preview .dz-error-mark,
    .dropzone .dz-preview .dz-success-mark,
    .dropzone-previews .dz-preview .dz-success-mark { background-image: url("../images/spritemap@2x.png"); -webkit-background-size: 428px 406px; -moz-background-size: 428px 406px; background-size: 428px 406px; }
}

.dropzone .dz-preview .dz-error-mark span,
.dropzone-previews .dz-preview .dz-error-mark span,
.dropzone .dz-preview .dz-success-mark span,
.dropzone-previews .dz-preview .dz-success-mark span { display: none; }
.dropzone .dz-preview .dz-error-mark,
.dropzone-previews .dz-preview .dz-error-mark { background-position: -268px -123px; }
.dropzone .dz-preview .dz-success-mark,
.dropzone-previews .dz-preview .dz-success-mark { background-position: -268px -163px; }
.dropzone .dz-preview .dz-progress .dz-upload,
.dropzone-previews .dz-preview .dz-progress .dz-upload { -webkit-animation: loading 0.4s linear infinite; -moz-animation: loading 0.4s linear infinite; -o-animation: loading 0.4s linear infinite; -ms-animation: loading 0.4s linear infinite; animation: loading 0.4s linear infinite; -webkit-transition: width 0.3s ease-in-out; -moz-transition: width 0.3s ease-in-out; -o-transition: width 0.3s ease-in-out; -ms-transition: width 0.3s ease-in-out; transition: width 0.3s ease-in-out; -webkit-border-radius: 2px; border-radius: 2px; position: absolute; top: 0; left: 0; width: 0%; height: 100%; background-image: url("../images/spritemap.png"); background-repeat: repeat-x; background-position: 0px -400px; }

@media all and (-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:1.5/1),(min-device-pixel-ratio:1.5),(min-resolution:138dpi),(min-resolution:1.5dppx) {
    .dropzone .dz-preview .dz-progress .dz-upload,
    .dropzone-previews .dz-preview .dz-progress .dz-upload { background-image: url("../images/spritemap@2x.png"); -webkit-background-size: 428px 406px; -moz-background-size: 428px 406px; background-size: 428px 406px; }
}

.dropzone .dz-preview.dz-success .dz-progress,
.dropzone-previews .dz-preview.dz-success .dz-progress { display: block; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -webkit-transition: opacity 0.4s ease-in-out; -moz-transition: opacity 0.4s ease-in-out; -o-transition: opacity 0.4s ease-in-out; -ms-transition: opacity 0.4s ease-in-out; transition: opacity 0.4s ease-in-out; }
.dropzone .dz-preview .dz-error-message,
.dropzone-previews .dz-preview .dz-error-message { display: block; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -webkit-transition: opacity 0.3s ease-in-out; -moz-transition: opacity 0.3s ease-in-out; -o-transition: opacity 0.3s ease-in-out; -ms-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; }
.dropzone .dz-preview:hover.dz-error .dz-error-message,
.dropzone-previews .dz-preview:hover.dz-error .dz-error-message { opacity: 1; -ms-filter: none; filter: none; }
.dropzone a.dz-remove,
.dropzone-previews a.dz-remove { background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fafafa), color-stop(1, #eee)); background-image: -webkit-linear-gradient(top, #fafafa 0, #eee 100%); background-image: -moz-linear-gradient(top, #fafafa 0, #eee 100%); background-image: -o-linear-gradient(top, #fafafa 0, #eee 100%); background-image: -ms-linear-gradient(top, #fafafa 0, #eee 100%); background-image: linear-gradient(top, #fafafa 0, #eee 100%); -webkit-border-radius: 2px; border-radius: 2px; border: 1px solid #eee; text-decoration: none; display: block; padding: 4px 5px; text-align: center; color: #aaa; margin-top: 26px; }
    .dropzone a.dz-remove:hover,
    .dropzone-previews a.dz-remove:hover { color: #666; }

@-moz-keyframes loading {
    0% { background-position: 0 -400px; }

    100% { background-position: -7px -400px; }
}

@-webkit-keyframes loading {
    0% { background-position: 0 -400px; }

    100% { background-position: -7px -400px; }
}

@-o-keyframes loading {
    0% { background-position: 0 -400px; }

    100% { background-position: -7px -400px; }
}

@-ms-keyframes loading {
    0% { background-position: 0 -400px; }

    100% { background-position: -7px -400px; }
}

@keyframes loading {
    0% { background-position: 0 -400px; }

    100% { background-position: -7px -400px; }
}


table.dataTable{width:100%;margin:0 auto;clear:both;border-collapse:separate;border-spacing:0}table.dataTable thead th,table.dataTable tfoot th{font-weight:bold}table.dataTable thead th,table.dataTable thead td{padding:10px 18px;border-bottom:1px solid #111}table.dataTable thead th:active,table.dataTable thead td:active{outline:none}table.dataTable tfoot th,table.dataTable tfoot td{padding:10px 18px 6px 18px;border-top:1px solid #111}table.dataTable thead .sorting,table.dataTable thead .sorting_asc,table.dataTable thead .sorting_desc{cursor:pointer;*cursor:hand}table.dataTable thead .sorting,table.dataTable thead .sorting_asc,table.dataTable thead .sorting_desc,table.dataTable thead .sorting_asc_disabled,table.dataTable thead .sorting_desc_disabled{background-repeat:no-repeat;background-position:center right}table.dataTable thead .sorting{background-image:url("../images/sort_both.png")}table.dataTable thead .sorting_asc{background-image:url("../images/sort_asc.png")}table.dataTable thead .sorting_desc{background-image:url("../images/sort_desc.png")}table.dataTable thead .sorting_asc_disabled{background-image:url("../images/sort_asc_disabled.png")}table.dataTable thead .sorting_desc_disabled{background-image:url("../images/sort_desc_disabled.png")}table.dataTable tbody tr{background-color:#ffffff}table.dataTable tbody tr.selected{background-color:#B0BED9}table.dataTable tbody th,table.dataTable tbody td{padding:8px 10px}table.dataTable.row-border tbody th,table.dataTable.row-border tbody td,table.dataTable.display tbody th,table.dataTable.display tbody td{border-top:1px solid #ddd}table.dataTable.row-border tbody tr:first-child th,table.dataTable.row-border tbody tr:first-child td,table.dataTable.display tbody tr:first-child th,table.dataTable.display tbody tr:first-child td{border-top:none}table.dataTable.cell-border tbody th,table.dataTable.cell-border tbody td{border-top:1px solid #ddd;border-right:1px solid #ddd}table.dataTable.cell-border tbody tr th:first-child,table.dataTable.cell-border tbody tr td:first-child{border-left:1px solid #ddd}table.dataTable.cell-border tbody tr:first-child th,table.dataTable.cell-border tbody tr:first-child td{border-top:none}table.dataTable.stripe tbody tr.odd,table.dataTable.display tbody tr.odd{background-color:#f9f9f9}table.dataTable.stripe tbody tr.odd.selected,table.dataTable.display tbody tr.odd.selected{background-color:#acbad4}table.dataTable.hover tbody tr:hover,table.dataTable.display tbody tr:hover{background-color:#f6f6f6}table.dataTable.hover tbody tr:hover.selected,table.dataTable.display tbody tr:hover.selected{background-color:#aab7d1}table.dataTable.order-column tbody tr>.sorting_1,table.dataTable.order-column tbody tr>.sorting_2,table.dataTable.order-column tbody tr>.sorting_3,table.dataTable.display tbody tr>.sorting_1,table.dataTable.display tbody tr>.sorting_2,table.dataTable.display tbody tr>.sorting_3{background-color:#fafafa}table.dataTable.order-column tbody tr.selected>.sorting_1,table.dataTable.order-column tbody tr.selected>.sorting_2,table.dataTable.order-column tbody tr.selected>.sorting_3,table.dataTable.display tbody tr.selected>.sorting_1,table.dataTable.display tbody tr.selected>.sorting_2,table.dataTable.display tbody tr.selected>.sorting_3{background-color:#acbad5}table.dataTable.display tbody tr.odd>.sorting_1,table.dataTable.order-column.stripe tbody tr.odd>.sorting_1{background-color:#f1f1f1}table.dataTable.display tbody tr.odd>.sorting_2,table.dataTable.order-column.stripe tbody tr.odd>.sorting_2{background-color:#f3f3f3}table.dataTable.display tbody tr.odd>.sorting_3,table.dataTable.order-column.stripe tbody tr.odd>.sorting_3{background-color:whitesmoke}table.dataTable.display tbody tr.odd.selected>.sorting_1,table.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_1{background-color:#a6b4cd}table.dataTable.display tbody tr.odd.selected>.sorting_2,table.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_2{background-color:#a8b5cf}table.dataTable.display tbody tr.odd.selected>.sorting_3,table.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_3{background-color:#a9b7d1}table.dataTable.display tbody tr.even>.sorting_1,table.dataTable.order-column.stripe tbody tr.even>.sorting_1{background-color:#fafafa}table.dataTable.display tbody tr.even>.sorting_2,table.dataTable.order-column.stripe tbody tr.even>.sorting_2{background-color:#fcfcfc}table.dataTable.display tbody tr.even>.sorting_3,table.dataTable.order-column.stripe tbody tr.even>.sorting_3{background-color:#fefefe}table.dataTable.display tbody tr.even.selected>.sorting_1,table.dataTable.order-column.stripe tbody tr.even.selected>.sorting_1{background-color:#acbad5}table.dataTable.display tbody tr.even.selected>.sorting_2,table.dataTable.order-column.stripe tbody tr.even.selected>.sorting_2{background-color:#aebcd6}table.dataTable.display tbody tr.even.selected>.sorting_3,table.dataTable.order-column.stripe tbody tr.even.selected>.sorting_3{background-color:#afbdd8}table.dataTable.display tbody tr:hover>.sorting_1,table.dataTable.order-column.hover tbody tr:hover>.sorting_1{background-color:#eaeaea}table.dataTable.display tbody tr:hover>.sorting_2,table.dataTable.order-column.hover tbody tr:hover>.sorting_2{background-color:#ececec}table.dataTable.display tbody tr:hover>.sorting_3,table.dataTable.order-column.hover tbody tr:hover>.sorting_3{background-color:#efefef}table.dataTable.display tbody tr:hover.selected>.sorting_1,table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_1{background-color:#a2aec7}table.dataTable.display tbody tr:hover.selected>.sorting_2,table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_2{background-color:#a3b0c9}table.dataTable.display tbody tr:hover.selected>.sorting_3,table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_3{background-color:#a5b2cb}table.dataTable.no-footer{border-bottom:1px solid #111}table.dataTable.nowrap th,table.dataTable.nowrap td{white-space:nowrap}table.dataTable.compact thead th,table.dataTable.compact thead td{padding:4px 17px 4px 4px}table.dataTable.compact tfoot th,table.dataTable.compact tfoot td{padding:4px}table.dataTable.compact tbody th,table.dataTable.compact tbody td{padding:4px}table.dataTable th.dt-left,table.dataTable td.dt-left{text-align:left}table.dataTable th.dt-center,table.dataTable td.dt-center,table.dataTable td.dataTables_empty{text-align:center}table.dataTable th.dt-right,table.dataTable td.dt-right{text-align:right}table.dataTable th.dt-justify,table.dataTable td.dt-justify{text-align:justify}table.dataTable th.dt-nowrap,table.dataTable td.dt-nowrap{white-space:nowrap}table.dataTable thead th.dt-head-left,table.dataTable thead td.dt-head-left,table.dataTable tfoot th.dt-head-left,table.dataTable tfoot td.dt-head-left{text-align:left}table.dataTable thead th.dt-head-center,table.dataTable thead td.dt-head-center,table.dataTable tfoot th.dt-head-center,table.dataTable tfoot td.dt-head-center{text-align:center}table.dataTable thead th.dt-head-right,table.dataTable thead td.dt-head-right,table.dataTable tfoot th.dt-head-right,table.dataTable tfoot td.dt-head-right{text-align:right}table.dataTable thead th.dt-head-justify,table.dataTable thead td.dt-head-justify,table.dataTable tfoot th.dt-head-justify,table.dataTable tfoot td.dt-head-justify{text-align:justify}table.dataTable thead th.dt-head-nowrap,table.dataTable thead td.dt-head-nowrap,table.dataTable tfoot th.dt-head-nowrap,table.dataTable tfoot td.dt-head-nowrap{white-space:nowrap}table.dataTable tbody th.dt-body-left,table.dataTable tbody td.dt-body-left{text-align:left}table.dataTable tbody th.dt-body-center,table.dataTable tbody td.dt-body-center{text-align:center}table.dataTable tbody th.dt-body-right,table.dataTable tbody td.dt-body-right{text-align:right}table.dataTable tbody th.dt-body-justify,table.dataTable tbody td.dt-body-justify{text-align:justify}table.dataTable tbody th.dt-body-nowrap,table.dataTable tbody td.dt-body-nowrap{white-space:nowrap}table.dataTable,table.dataTable th,table.dataTable td{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.dataTables_wrapper{position:relative;clear:both;*zoom:1;zoom:1}.dataTables_wrapper .dataTables_length{float:left}.dataTables_wrapper .dataTables_filter{float:right;text-align:right}.dataTables_wrapper .dataTables_filter input{margin-left:0.5em}.dataTables_wrapper .dataTables_info{clear:both;float:left;padding-top:0.755em}.dataTables_wrapper .dataTables_paginate{float:right;text-align:right;padding-top:0.25em}.dataTables_wrapper .dataTables_paginate .paginate_button{box-sizing:border-box;display:inline-block;min-width:1.5em;padding:0.5em 1em;margin-left:2px;text-align:center;text-decoration:none !important;cursor:pointer;*cursor:hand;color:#333 !important;border:1px solid transparent;border-radius:2px}.dataTables_wrapper .dataTables_paginate .paginate_button.current,.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{color:#333 !important;border:1px solid #979797;background-color:white;background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #dcdcdc));background:-webkit-linear-gradient(top, #fff 0%, #dcdcdc 100%);background:-moz-linear-gradient(top, #fff 0%, #dcdcdc 100%);background:-ms-linear-gradient(top, #fff 0%, #dcdcdc 100%);background:-o-linear-gradient(top, #fff 0%, #dcdcdc 100%);background:linear-gradient(to bottom, #fff 0%, #dcdcdc 100%)}.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active{cursor:default;color:#666 !important;border:1px solid transparent;background:transparent;box-shadow:none}.dataTables_wrapper .dataTables_paginate .paginate_button:hover{color:white !important;border:1px solid #111;background-color:#585858;background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #585858), color-stop(100%, #111));background:-webkit-linear-gradient(top, #585858 0%, #111 100%);background:-moz-linear-gradient(top, #585858 0%, #111 100%);background:-ms-linear-gradient(top, #585858 0%, #111 100%);background:-o-linear-gradient(top, #585858 0%, #111 100%);background:linear-gradient(to bottom, #585858 0%, #111 100%)}.dataTables_wrapper .dataTables_paginate .paginate_button:active{outline:none;background-color:#2b2b2b;background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #2b2b2b), color-stop(100%, #0c0c0c));background:-webkit-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);background:-moz-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);background:-ms-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);background:-o-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);background:linear-gradient(to bottom, #2b2b2b 0%, #0c0c0c 100%);box-shadow:inset 0 0 3px #111}.dataTables_wrapper .dataTables_paginate .ellipsis{padding:0 1em}.dataTables_wrapper .dataTables_processing{position:absolute;top:50%;left:50%;width:100%;height:40px;margin-left:-50%;margin-top:-25px;padding-top:20px;text-align:center;font-size:1.2em;background-color:white;background:-webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255,255,255,0)), color-stop(25%, rgba(255,255,255,0.9)), color-stop(75%, rgba(255,255,255,0.9)), color-stop(100%, rgba(255,255,255,0)));background:-webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 25%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%);background:-moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 25%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%);background:-ms-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 25%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%);background:-o-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 25%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%);background:linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 25%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%)}.dataTables_wrapper .dataTables_length,.dataTables_wrapper .dataTables_filter,.dataTables_wrapper .dataTables_info,.dataTables_wrapper .dataTables_processing,.dataTables_wrapper .dataTables_paginate{color:#333}.dataTables_wrapper .dataTables_scroll{clear:both}.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody{*margin-top:-1px;-webkit-overflow-scrolling:touch}.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody th,.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody td{vertical-align:middle}.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody th>div.dataTables_sizing,.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody td>div.dataTables_sizing{height:0;overflow:hidden;margin:0 !important;padding:0 !important}.dataTables_wrapper.no-footer .dataTables_scrollBody{border-bottom:1px solid #111}.dataTables_wrapper.no-footer div.dataTables_scrollHead table,.dataTables_wrapper.no-footer div.dataTables_scrollBody table{border-bottom:none}.dataTables_wrapper:after{visibility:hidden;display:block;content:"";clear:both;height:0}@media screen and (max-width: 767px){.dataTables_wrapper .dataTables_info,.dataTables_wrapper .dataTables_paginate{float:none;text-align:center}.dataTables_wrapper .dataTables_paginate{margin-top:0.5em}}@media screen and (max-width: 640px){.dataTables_wrapper .dataTables_length,.dataTables_wrapper .dataTables_filter{float:none;text-align:center}.dataTables_wrapper .dataTables_filter{margin-top:0.5em}}

