/* Minification failed. Returning unminified contents.
(210,70): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
 */
/*https://uncss-online.com/*/
/*https://stackoverflow.com/questions/6177492/most-standard-way-to-set-font-sizes-in-html-css*/
/*Kendo doesn't like directly set font-size: 1.3em

it could not calculate width and height precisely*/
/*html {
    font-size: 62.5%;
}*/



input::-webkit-input-placeholder {
    /* placeholder颜色  */
    color: #aab2bd;
    /* placeholder字体大小 
    font-size: 12px;
     placeholder位置  
    text-align: right;
    */
}


html,
body {
    /*font-size: 1.6em;*/
    /*font-size: 0.95em;*/
    /*font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;*/
    /*font-size: 11px;*/
    font-size: 1.4em;
    margin: 0px;
    padding: 0px;
    font-family: Arial,Helvetica,sans-serif;
    /*Dely: we have to keep height is 100% for avoid dual scroll bar*/
    height: 100%
}

nav:not(.mm-menu) {
    display: none;
}

/*.header,
.footer {
    text-align: center;
}

    .footer p {
        text-align: center;    
    }*/

.header {
    background: #777;
    font-size: 1em;
    display: inline-block;
    /*font-weight: bold;*/
    color: #fff;
    line-height: 35px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    height: 35px;
    padding: 0 50px;
}

    .header.fixed {
        position: fixed;
        top: 0;
        left: 0;
    }

    /*.footer.fixed {
        position: fixed;
        bottom: 0;
        left: 0;
    }*/

    .header a {
        display: block;
        width: 28px;
        height: 16px;
        padding: 11px 3px;
        position: absolute;
        top: 0;
        left: 0;
    }

        .header a:before,
        .header a:after {
            content: '';
            display: block;
            background: #fff;
            height: 2px;
        }

        .header a span {
            background: #fff;
            display: block;
            height: 2px;
            margin: 6px 0;
        }


.footer {
    height: 3%
}
/* Set width on the form input elements since they're 100% wide by default */
/*input,
button,
select,
textarea {
    max-width: 280px;
}*/
#example {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    overflow: hidden;
}

.dash-head {
    width: 100%;
    height: 40px;
    position: relative;
    display: none
}

    .dash-head .k-rpanel-toggle {
        position: absolute;
        width: 40px;
        height: 40px;
        top: 0px;
        left: 20px;
    }

.panel-wrap {
    max-width: 100%;
    background-color: #f5f5f5;
    border: 1px solid #e5e5e5;
}

#sidebar {
    margin: 0;
    padding: 0px;
    vertical-align: top;
    z-index: 9999;
}

@media (max-width: 1000px) {
    #sidebar {
        background: #fff;
        padding: 20px;
        border-left: 1px solid #e5e5e5;
        /* show sidebar in container, demo only*/
        position: absolute;
        top: 402px;
        bottom: 0;
    }

        #sidebar.k-rpanel-expanded {
            box-shadow: 0 0 10px rgba(0,0,0,.3);
        }
}

#main-content {
    overflow: hidden;
    margin: 0;
    padding: 20px;
    min-height: 580px;
    vertical-align: top;
}

/* WIDGETS */
.widget {
    margin: 0 0 20px;
    padding: 0;
    background-color: #ffffff;
    border: 1px solid #e7e7e7;
    border-radius: 3px;
}

    .widget div {
        padding: 10px;
        min-height: 50px;
    }

    .widget h3 {
        font-size: 12px;
        padding: 8px 10px;
        text-transform: uppercase;
        border-bottom: 1px solid #e7e7e7;
    }

        .widget h3 span {
            float: right;
        }

            .widget h3 span:hover {
                cursor: pointer;
                background-color: #e7e7e7;
                border-radius: 20px;
            }

/* PROFILE */
.profile-photo {
    width: 80px;
    height: 80px;
    margin: 10px auto;
    border-radius: 100px;
    border: 1px solid #e7e7e7;
    background: url(@Url.Content("~/content/web/Customers/ISLAT.jpg")) no-repeat 50% 50%;
}

#profile div {
    text-align: center;
}

#profile h4 {
    width: auto;
    margin: 0 0 5px;
    font-size: 1.2em;
    color: #1f97f7;
}

#profile p {
    margin: 0 0 10px;
}


.k-rpanel-left {
    min-width: 0px !important;
    background-color: white;
}


/* element+element	div + p	Selects all <p> elements that are placed immediately after <div> elements */
.k-radio:checked + .k-radio-label {
    /*background: lightgreen;*/
    font-weight: bold;
}


.Score0 {
    width: 78px;
    height: 15px;
    background: url('/Content/Rating/0.png') no-repeat center;
}

.Score1 {
    width: 78px;
    height: 15px;
    background: url('/Content/Rating/1.png') no-repeat center;
}

.Score2 {
    width: 78px;
    height: 15px;
    background: url('/Content/Rating/2.png') no-repeat center;
}

.Score3 {
    width: 78px;
    height: 15px;
    background: url('/Content/Rating/3.png') no-repeat center;
}

.Score4 {
    width: 78px;
    height: 15px;
    background: url('/Content/Rating/4.png') no-repeat center;
}

.Score5 {
    width: 78px;
    height: 15px;
    background: url('/Content/Rating/5.png') no-repeat center;
}

.searchCustomerTextBox {
    width: 300px !important;
}

#paymentinfo {
    margin: 0 auto;
    color: #5e6977;
    font-size: 14px;
}

    #paymentinfo table {
        width: 80%;
        margin-left: 30px;
    }

.credit-card {
    width: 360px;
    height: 400px;
    margin: 60px auto 0;
    border: 1px solid #ddd;
    border-radius: 6px;
    background-color: #fff;
    box-shadow: 1px 2px 3px 0px rgba(0,0,0,0.10);
}

.card-number,
.paypal-btn,
.proceed-btn {
    height: 42px;
}

.card-number {
    font-size: 14px;
    font-weight: 100;
    line-height: 14px;
}

/* Card Number */

.card-number {
    width: 100%;
    margin-bottom: 10px;
    padding-left: 10px;
    border: 2px solid #e1e8ee;
    border-radius: 6px;
}

.month {
    width: 30%;
}

.year {
    width: 40%;
    margin-left: 10px;
}
/* Card Verification Field */
.cvv-input input {
    width: 145px;
    float: left;
    padding-left: 20px;
    border: 2px solid #e1e8ee;
    border-radius: 6px;
    background: #fff;
}

.cvv-details {
    float: right;
    margin-bottom: 20px;
    font-size: 12px;
    font-weight: 300;
    line-height: 16px;
}

    .cvv-details p {
        margin-top: 6px;
    }

/* Buttons Section */

.paypal-btn,
.proceed-btn {
    cursor: pointer;
    width: 100%;
    border-color: transparent;
    border-radius: 6px;
    font-size: 16px;
}

.proceed-btn {
    margin-bottom: 10px;
    margin-left: 30px;
    background: #7dc855;
}

.proceed-btn {
    text-decoration: none;
    cursor: pointer;
}

.proceed-btn {
    color: #fff;
}

.paypal-btn {
    color: rgba(242, 242, 242, 0.7);
}

.paypal-btn {
    background: #009cde;
}

.k-i-orderstatus {
    background-image: url(icons/orderstatus.png) !important;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.k-grid .prescriptiontable {
    overflow: auto !important;
    table-layout: initial !important;
    line-height: normal;
}


.prescriptiontable table
{
    width:auto !important
}
/*.k-grid .prescriptiontable thead tr td {
        font-weight: 900 !important;
    }*/
.k-grid .prescriptiontable tr td {
    width: 6em !important;
    height: 1em !important;
    padding: 0px !important;
    border: 0px !important;
    /*text-align: center !important;*/
}

    .k-grid .prescriptiontable .lensName {
        width: 20em !important;
    }

.prescriptiontable::-webkit-scrollbar {
    -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0.3) !important;
    border-radius: 1px !important;
    height: 6px !important;
    background-color: lightgray !important;
}
/*.prescriptiontable::-webkit-scrollbar-thumb {
    background-color: blue;
    border-radius: 2px !important;
}*/
.prescriptiontable::-webkit-scrollbar-thumb {
    border-radius: 3px !important;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3) !important;
    background-color: lightgray !important;
}

.container {
    /*width: 98% !important;*/
}

.form-wizard {
    padding-top: 0px;
}

.top-scroller {
    position: fixed;
    bottom: 30px;
    right: 15px;
    font-size: 1em;
    display: none;
    z-index: 2;
    text-align: center;
    cursor: pointer;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    background: rgba(0,0,0,.35);
    color: #fff;
    line-height: 40px;
}

    .top-scroller:hover {
        background: rgba(0,0,0,.6);
    }

.container {
    max-width: 100% !important;
}

.reportitem {
    width: 22%;
    height: 100px;
    margin: 3px;
    padding: 10px;
    float: left;
    border: solid 1px #e5e5e5;
    border-radius: 10px;
}

.reportitemTitle {
    font-weight: 600;
    font-size: 18px;
}

.reportitemValue {
    font-weight: 600;
    font-size: 22px;
}

.reportitemCompareValue {
    font-size: 16px;
}

.plusRatio {
    color: green;
    font-size: 12px;
    font-weight: 600;
    vertical-align: top;
}

.minusRatio {
    color: red;
    font-size: 12px;
    font-weight: 600;
    vertical-align: text-top;
}

.sanjiao_down {
    width: 0;
    height: 0;
    overflow: hidden;
    vertical-align: middle;
    margin-left: 10px;
    font-size: 0;
    line-height: 0;
    border-width: 6px;
    border-style: solid;
    margin-left: 15px;
    border-color: #f30 transparent transparent transparent;
}

.sanjiao_up {
    width: 0;
    height: 0;
    overflow: hidden;
    vertical-align: text-top;
    font-size: 0;
    margin-left: 10px;
    line-height: 0;
    border-width: 6px;
    border-style: solid;
    margin-left:15px;
    border-color: transparent transparent green transparent;
}

.reportItemLink {
    float: right;
    cursor: pointer;
}

html {
    font-size: 62.5%;
}

.wizard {
    font-size: 1.6rem;
    font-family: "Source Sans Pro", sans-serif;
    color: #2c3f4c;
    background-color: #ffffff;
}

a {
    text-decoration: none;
}

section {
    /* used just to separate different styles */
    border-bottom: 1px solid #e6e6e6;
    padding: 4em 0;
}

    section h2 {
        width: 90%;
        margin: 0 auto 2em;
        color: #2c3f4c;
        font-size: 2rem;
        font-weight: 700;
        text-align: center;
    }

@media only screen and (min-width: 1170px) {
    section {
        padding: 6em 0;
    }

        section h2 {
            margin: 0 auto 3em;
        }
}


/* -------------------------------- 

Basic Style

-------------------------------- */
.cd-breadcrumb, .cd-multi-steps {
    width: 90%;
    padding: 0.5em 1em;
    background-color: #edeff0;
    border-radius: .25em;
}

    .cd-breadcrumb:after, .cd-multi-steps:after {
        content: "";
        display: table;
        clear: both;
    }

    .cd-breadcrumb li, .cd-multi-steps li {
        display: inline-block;
        float: left;
        margin: 0.5em 0;
    }

        .cd-breadcrumb li::after, .cd-multi-steps li::after {
            /* this is the separator between items */
            display: inline-block;
            content: '\00bb';
            margin: 0 .6em;
            color: #959fa5;
        }

        .cd-breadcrumb li:last-of-type::after, .cd-multi-steps li:last-of-type::after {
            /* hide separator after the last item */
            display: none;
        }

        .cd-breadcrumb li > *, .cd-multi-steps li > * {
            /* single step */
            display: inline-block;
            font-size: 1.4rem;
            color: #2c3f4c;
        }

        .cd-breadcrumb li.current > *, .cd-multi-steps li.current > * {
            /* selected step */
            color: #96c03d;
        }

.no-touch .cd-breadcrumb a:hover, .no-touch .cd-multi-steps a:hover {
    /* steps already visited */
    color: #96c03d;
}

.cd-breadcrumb.custom-separator li::after, .cd-multi-steps.custom-separator li::after {
    /* replace the default arrow separator with a custom icon */
    content: '';
    height: 16px;
    width: 16px;
    background: url(../img/cd-custom-separator.svg) no-repeat center center;
    vertical-align: middle;
}

.cd-breadcrumb.custom-icons li > *::before, .cd-multi-steps.custom-icons li > *::before {
    /* add a custom icon before each item */
    content: '';
    display: inline-block;
    height: 20px;
    width: 20px;
    margin-right: .4em;
    margin-top: -2px;
    background: url(../img/cd-custom-icons-01.svg) no-repeat 0 0;
    vertical-align: middle;
}

.cd-breadcrumb.custom-icons li:not(.current):nth-of-type(2) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(2) > *::before {
    /* change custom icon using image sprites */
    background-position: -20px 0;
}

.cd-breadcrumb.custom-icons li:not(.current):nth-of-type(3) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(3) > *::before {
    background-position: -40px 0;
}

.cd-breadcrumb.custom-icons li:not(.current):nth-of-type(4) > *::before, .cd-multi-steps.custom-icons li:not(.current):nth-of-type(4) > *::before {
    background-position: -60px 0;
}

.cd-breadcrumb.custom-icons li.current:first-of-type > *::before, .cd-multi-steps.custom-icons li.current:first-of-type > *::before {
    /* change custom icon for the current item */
    background-position: 0 -20px;
}

.cd-breadcrumb.custom-icons li.current:nth-of-type(2) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(2) > *::before {
    background-position: -20px -20px;
}

.cd-breadcrumb.custom-icons li.current:nth-of-type(3) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(3) > *::before {
    background-position: -40px -20px;
}

.cd-breadcrumb.custom-icons li.current:nth-of-type(4) > *::before, .cd-multi-steps.custom-icons li.current:nth-of-type(4) > *::before {
    background-position: -60px -20px;
}

@media only screen and (min-width: 768px) {
    .cd-breadcrumb, .cd-multi-steps {
        padding: 0 1.2em;
    }

        .cd-breadcrumb li, .cd-multi-steps li {
            margin: 1.2em 0;
        }

            .cd-breadcrumb li::after, .cd-multi-steps li::after {
                margin: 0 1em;
            }

            .cd-breadcrumb li > *, .cd-multi-steps li > * {
                font-size: 1.6rem;
            }
}

/* -------------------------------- 

Triangle breadcrumb

-------------------------------- */
@media only screen and (min-width: 768px) {
    .cd-breadcrumb.triangle {
        /* reset basic style */
        background-color: transparent;
        padding: 0;
    }



        .cd-breadcrumb.triangle li:last-of-type {
            margin-right: 0;
        }

        .cd-breadcrumb.triangle li > * {
            position: relative;
            padding: 1em .8em 1em 2.5em;
            color: #2c3f4c;
            background-color: #edeff0;
            /* the border color is used to style its ::after pseudo-element */
            border-color: #edeff0;
        }

        .cd-breadcrumb.triangle li.current > * {
            /* selected step */
            color: #ffffff;
            background-color: #6693AA;
            border-color: #6693AA;
        }

        .cd-breadcrumb.triangle li:first-of-type > * {
            padding-left: 1.6em;
            border-radius: .25em 0 0 .25em;
        }

        .cd-breadcrumb.triangle li:last-of-type > * {
            padding-right: 1.6em;
            border-radius: 0 .25em .25em 0;
        }

    .no-touch .cd-breadcrumb.triangle a:hover {
        /* steps already visited */
        color: #ffffff;
        background-color: #2c3f4c;
        border-color: #2c3f4c;
    }

    .cd-breadcrumb.triangle li::after, .cd-breadcrumb.triangle li > *::after {
        /* 
    	li > *::after is the colored triangle after each item
    	li::after is the white separator between two items
    */
        content: '';
        position: absolute;
        top: 0;
        left: 100%;
        content: '';
        height: 0;
        width: 0;
        /* 48px is the height of the <a> element */
        border: 24px solid transparent;
        border-right-width: 0;
        border-left-width: 20px;
    }

    .cd-breadcrumb.triangle li::after {
        /* this is the white separator between two items */
        z-index: 1;
        -webkit-transform: translateX(4px);
        -moz-transform: translateX(4px);
        -ms-transform: translateX(4px);
        -o-transform: translateX(4px);
        transform: translateX(4px);
        border-left-color: #ffffff;
        /* reset style */
        margin: 0;
    }

    .cd-breadcrumb.triangle li > *::after {
        /* this is the colored triangle after each element */
        z-index: 2;
        border-left-color: inherit;
    }

    .cd-breadcrumb.triangle li:last-of-type::after, .cd-breadcrumb.triangle li:last-of-type > *::after {
        /* hide the triangle after the last step */
        display: none;
    }

    .cd-breadcrumb.triangle.custom-separator li::after {
        /* reset style */
        background-image: none;
    }

    .cd-breadcrumb.triangle.custom-icons li::after, .cd-breadcrumb.triangle.custom-icons li > *::after {
        /* 50px is the height of the <a> element */
        border-top-width: 25px;
        border-bottom-width: 25px;
    }

    @-moz-document url-prefix() {
        .cd-breadcrumb.triangle li::after,
        .cd-breadcrumb.triangle li > *::after {
            /* fix a bug on Firefix - tooth edge on css triangle */
            border-left-style: dashed;
        }
    }
}


.wizardButton button {
    background-color: #6693AA;
}

.cd-breadcrumb.triangle li {
    position: relative;
    padding: 0;
    margin: 4px 4px 4px 0;
    width: 23%;
}

    .cd-breadcrumb.triangle li a {
        width: 75%;
        cursor: pointer;
    }

.wizardButton button {
    line-height: 45px;
    min-width: 100px;
}


.previousButton {
    position: absolute;
    left: 20px;
    bottom: 30px;
}

.nextButton, .finishButton {
    position: absolute;
    right: 20px;
    bottom: 30px;
}



.cd-breadcrumb.triangle li.visited > * {
    color: #ffffff;
    background-color: green;
    border-color: green;
}


    .listview .k-state-selected {
        background-color: rgba(0,0,0,0.75);
        margin: 0 15px;
    }
/*.product:hover {
            visibility: visible;
            width: 60px;
            height: 130px;
            color: #fff;
            margin: 0 15px;
            background-color: rgba(0,0,0,0.75);
            transition: background .2s linear, color .2s linear;
            -moz-transition: background .2s linear, color .2s linear;
            -webkit-transition: background .2s linear, color .2s linear;
            -o-transition: background .2s linear, color .2s linear;
        }*/
.k-listview:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.wizardButton {
    bottom: 20px;
    height: 100px;
    margin-top: 10px;
    position: relative;
}

.wizardContent {
    height: 83%;
}

@media (max-width:768px) {
    .cd-breadcrumb.triangle li {
        width: 100%;
    }
}

.listView {
    padding: 10px 5px;
    margin-bottom: -1px;
    height: 300px;
    /* Avoid cutout if font or line is bigger */
    font: inherit;
}

.productNoColor {
    float: left;
    position: relative;
    width: 80px;
    height: 120px;
    margin: 6px;
    padding: 2px;
    cursor: pointer;
    border: 0.6px solid;
    text-align: center;
    vertical-align: central;
    font-size: 10px;
    vertical-align: central;
    line-height: 20px;
}

    .productNoColor h3 {
        margin: 0px;
        padding: 0px;
    }

.product {
    float: left;
    position: relative;
    width: 80px;
    height: 123px;
    margin: 6px;
    padding: 0px;
    cursor: pointer;
    border: 0.6px solid;
}

    .product h3 {
        margin: 0px;
        font-size: 12px;
        line-height:initial !important;
        height: 46px !important;
    }

    .product span {
        width: 100%;
        height: 80px;
        display: inline-block
    }

    .product div {
        margin: 0px;
        padding: 0px;
    }


.listview .k-state-selected {
    background-color: rgba(0,0,0,0.75);
    margin: 0 15px;
}
/*.product:hover {
            visibility: visible;
            width: 60px;
            height: 130px;
            color: #fff;
            margin: 0 15px;
            background-color: rgba(0,0,0,0.75);
            transition: background .2s linear, color .2s linear;
            -moz-transition: background .2s linear, color .2s linear;
            -webkit-transition: background .2s linear, color .2s linear;
            -o-transition: background .2s linear, color .2s linear;
        }*/
.k-listview:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.wizardButton {
    bottom: 20px;
    height: 100px;
}

.wizardContent {
    height: 83%;
}

/*Refer:https://www.w3schools.com/howto/howto_css_switch.asp */

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

    .switch input {
        display: none;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 5px;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: green;
}

input:focus + .slider {
    box-shadow: 0 0 1px green;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

/*!	
 * jQuery mmenu
 * mmenu.frebsite.nl
 *
 * Copyright (c) Fred Heusschen
 */.mm-hidden{display:none!important}.mm-wrapper{overflow-x:hidden;position:relative}.mm-menu{box-sizing:border-box;background:inherit;display:block;padding:0;margin:0;position:absolute;left:0;right:0;top:0;bottom:0;z-index:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.mm-menu a,.mm-menu a:active,.mm-menu a:hover,.mm-menu a:link,.mm-menu a:visited{color:inherit;text-decoration:none}.mm-panels,.mm-panels>.mm-panel{position:absolute;left:0;right:0;top:0;bottom:0;z-index:0}.mm-panel,.mm-panels{background:inherit;border-color:inherit;box-sizing:border-box;margin:0}.mm-panels{overflow:hidden}.mm-panel{-webkit-overflow-scrolling:touch;overflow:scroll;overflow-x:hidden;overflow-y:auto;padding:0 20px;-webkit-transform:translate(100%,0);-ms-transform:translate(100%,0);transform:translate(100%,0);-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);transition:-webkit-transform .4s ease;transition:transform .4s ease;transition:transform .4s ease,-webkit-transform .4s ease;-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left}.mm-panel:not(.mm-hidden){display:block}.mm-panel:after,.mm-panel:before{content:'';display:block;height:20px}.mm-panel_has-navbar{padding-top:40px}.mm-panel_opened{z-index:1;-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.mm-panel_opened-parent{-webkit-transform:translate(-30%,0);-ms-transform:translate(-30%,0);transform:translate(-30%,0);-webkit-transform:translate3d(-30%,0,0);transform:translate3d(-30%,0,0)}.mm-panel_highest{z-index:2}.mm-panel_noanimation{transition:none!important}.mm-panel_noanimation.mm-panel_opened-parent{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.mm-listitem_vertical>.mm-panel{-webkit-transform:none!important;-ms-transform:none!important;transform:none!important;display:none;padding:10px 0 10px 10px}.mm-listitem_vertical>.mm-panel:after,.mm-listitem_vertical>.mm-panel:before{content:none;display:none}.mm-listitem_opened>.mm-panel{display:block}.mm-listitem_vertical>.mm-btn_next{box-sizing:border-box;height:40px;bottom:auto}.mm-listitem_vertical .mm-listitem:last-child:after{border-color:transparent}.mm-listitem_opened>.mm-btn_next:after{-webkit-transform:rotate(225deg);-ms-transform:rotate(225deg);transform:rotate(225deg);right:19px}.mm-btn{box-sizing:border-box;width:40px;height:40px;position:absolute;top:0;z-index:1}.mm-btn_fullwidth{width:100%}.mm-btn_clear:after,.mm-btn_clear:before,.mm-btn_close:after,.mm-btn_close:before{content:'';border:2px solid transparent;box-sizing:content-box;display:block;width:5px;height:5px;margin:auto;position:absolute;top:0;bottom:0;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg)}.mm-btn_clear:before,.mm-btn_close:before{border-right:none;border-bottom:none;right:18px}.mm-btn_clear:after,.mm-btn_close:after{border-left:none;border-top:none;right:25px}.mm-btn_next:after,.mm-btn_prev:before{content:'';border-top:2px solid transparent;border-left:2px solid transparent;box-sizing:content-box;display:block;width:8px;height:8px;margin:auto;position:absolute;top:0;bottom:0}.mm-btn_prev:before{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);left:23px;right:auto}.mm-btn_next:after{-webkit-transform:rotate(135deg);-ms-transform:rotate(135deg);transform:rotate(135deg);right:23px;left:auto}.mm-navbar{border-bottom:1px solid;border-color:inherit;text-align:center;line-height:20px;display:none;height:40px;padding:0 40px;margin:0;position:absolute;top:0;left:0;right:0;opacity:1;transition:opacity .4s ease}.mm-navbar>*{box-sizing:border-box;display:block;padding:10px 0}.mm-navbar a,.mm-navbar a:hover{text-decoration:none}.mm-navbar__title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mm-navbar__btn:first-child{left:0}.mm-navbar__btn:last-child{text-align:right;right:0}.mm-panel_has-navbar .mm-navbar{display:block}.mm-listitem,.mm-listview{list-style:none;display:block;padding:0;margin:0}.mm-listitem,.mm-listitem .mm-btn_next,.mm-listitem .mm-btn_next:before,.mm-listitem:after,.mm-listview{border-color:inherit}.mm-listview{font:inherit;line-height:20px}.mm-panels>.mm-panel>.mm-listview{margin:20px -20px}.mm-panels>.mm-panel>.mm-listview:first-child,.mm-panels>.mm-panel>.mm-navbar+.mm-listview{margin-top:-20px}.mm-listitem{position:relative}.mm-listitem:after{content:'';border-bottom-width:1px;border-bottom-style:solid;display:block;position:absolute;left:0;right:0;bottom:0}.mm-listitem:after{left:20px}.mm-listitem a,.mm-listitem a:hover{text-decoration:none}.mm-listitem>a,.mm-listitem>span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:inherit;display:block;padding:10px 10px 10px 20px;margin:0}.mm-listitem .mm-btn_next{background:rgba(3,2,1,0);padding:0;position:absolute;right:0;top:0;bottom:0;z-index:2}.mm-listitem .mm-btn_next:before{content:'';border-left-width:1px;border-left-style:solid;display:block;position:absolute;top:0;bottom:0;left:0}.mm-listitem .mm-btn_next:not(.mm-btn_fullwidth){width:50px}.mm-listitem .mm-btn_next:not(.mm-btn_fullwidth)+a,.mm-listitem .mm-btn_next:not(.mm-btn_fullwidth)+span{margin-right:50px}.mm-listitem .mm-btn_fullwidth:before{border-left:none}.mm-listitem .mm-btn_fullwidth+a,.mm-listitem .mm-btn_fullwidth+span{padding-right:50px}.mm-listitem_divider{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:75%;text-transform:uppercase;padding:5px 10px 5px 20px}.mm-listitem_divider:after{content:' ';display:none;position:static;display:inline-block}.mm-listitem_spacer{padding-top:40px}.mm-listitem_spacer>.mm-btn_next{top:40px}.mm-menu{background:#f3f3f3;border-color:rgba(0,0,0,.1);color:rgba(0,0,0,.75)}.mm-menu .mm-navbar a,.mm-menu .mm-navbar>*{color:rgba(0,0,0,.3)}.mm-menu .mm-btn:after,.mm-menu .mm-btn:before{border-color:rgba(0,0,0,.3)}.mm-menu .mm-listview .mm-btn_next:after{border-color:rgba(0,0,0,.3)}.mm-menu .mm-listview a:not(.mm-btn_next){-webkit-tap-highlight-color:rgba(255,255,255,.4);tap-highlight-color:rgba(255,255,255,.4)}.mm-menu .mm-listitem_selected>a:not(.mm-btn_next),.mm-menu .mm-listitem_selected>span{background:rgba(255,255,255,.4)}.mm-menu .mm-listitem_opened>.mm-btn_next,.mm-menu .mm-listitem_opened>.mm-panel{background:rgba(0,0,0,.05)}.mm-menu .mm-listitem_divider{background:rgba(0,0,0,.05)}
.mm-page{box-sizing:border-box;position:relative;height:100%}.mm-slideout{transition:-webkit-transform .4s ease;transition:transform .4s ease;transition:transform .4s ease,-webkit-transform .4s ease;z-index:1}.mm-wrapper_opened{overflow-x:hidden;position:relative}.mm-wrapper_background .mm-page{background:inherit}.mm-menu_offcanvas{display:none;position:fixed;right:auto;z-index:0}.mm-menu_offcanvas.mm-menu_opened{display:block}.mm-menu_offcanvas.mm-menu_opened.mm-no-csstransforms{z-index:10}.mm-menu_offcanvas{width:80%;min-width:140px;max-width:440px}.mm-wrapper_opening .mm-menu_offcanvas.mm-menu_opened~.mm-slideout{-webkit-transform:translate(80vw,0);-ms-transform:translate(80vw,0);transform:translate(80vw,0);-webkit-transform:translate3d(80vw,0,0);transform:translate3d(80vw,0,0)}@media all and (max-width:175px){.mm-wrapper_opening .mm-menu_offcanvas.mm-menu_opened~.mm-slideout{-webkit-transform:translate(140px,0);-ms-transform:translate(140px,0);transform:translate(140px,0);-webkit-transform:translate3d(140px,0,0);transform:translate3d(140px,0,0)}}@media all and (min-width:550px){.mm-wrapper_opening .mm-menu_offcanvas.mm-menu_opened~.mm-slideout{-webkit-transform:translate(440px,0);-ms-transform:translate(440px,0);transform:translate(440px,0);-webkit-transform:translate3d(440px,0,0);transform:translate3d(440px,0,0)}}.mm-page__blocker{background:rgba(3,2,1,0);display:none;width:100%;height:100%;position:fixed;top:0;left:0;z-index:2}.mm-wrapper_blocking{overflow:hidden}.mm-wrapper_blocking body{overflow:hidden}.mm-wrapper_blocking .mm-page__blocker{display:block}
.mm-sronly{border:0!important;clip:rect(1px,1px,1px,1px)!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;white-space:nowrap!important;width:1px!important;min-width:1px!important;height:1px!important;min-height:1px!important;padding:0!important;overflow:hidden!important;position:absolute!important}
.cancel-on-png, .cancel-off-png, .star-on-png, .star-off-png, .star-half-png {
  font-size: 2em;
}

@font-face {
  font-family: "raty";
  font-style: normal;
  font-weight: normal;
  src: url("./fonts/raty.eot");
  src: url("./fonts/raty.eot?#iefix") format("embedded-opentype");
  src: url("./fonts/raty.svg#raty") format("svg");
  src: url("./fonts/raty.ttf") format("truetype");
  src: url("./fonts/raty.woff") format("woff");
}

.cancel-on-png, .cancel-off-png, .star-on-png, .star-off-png, .star-half-png {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-family: "raty";
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  line-height: 1;
  speak: none;
  text-transform: none;
}

.cancel-on-png:before {
  content: "\e600";
}

.cancel-off-png:before {
  content: "\e601";
}

.star-on-png:before {
  content: "\f005";
}

.star-off-png:before {
  content: "\f006";
}

.star-half-png:before {
  content: "\f123";
}

/*header {
    padding: 8em 0;
}

header, footer {
    color: white;
    background: #448AFF;
    background-image: url("background.png");
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.51);
}

h1.title {
    font-size: 4em;
    font-weight: bold;
}

pre {
    background: #212121;
    color: white;
}

header p {
    font-size: 1.4em;
}

footer {
    padding: 50px 0;
    text-align: center;
    font-size: 1.1em;
    margin-top: 3em;
}

    footer a {
        color: white;
    }

        footer a:hover {
            color: white;
        }*/

.sidebar.left {
    z-index: 99999999999;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 350px;
    overflow-y: auto;
    overflow-x: auto;
    height: 100%;
    background: white;
}

.sidebar.right {
    z-index: 9999999999999999;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 350px;
    overflow-y: auto;
    overflow-x: auto;
    height: 100%;
    background: white;
}

.sidebar.bottom {
    left: 0;
    right: 0;
    bottom: 0;
    height: 270px;
    background: white;
}

.sidebar.top {
    left: 0;
    right: 0;
    top: 0;
    height: 270px;
    background: #03A9F4;
}

.sidebars > .sidebar {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.64);
    position: fixed;
    color: white;
    padding: 30px;
    font-size: 2em;
    text-align: center;
}