/**
*** Components
*   
*** @ 2017, Muzaffer Dede
*   
*** Lexionlu Design Firm
*   
*** Components Style 
*/

/*Imports*/
@import url('https://fonts.googleapis.com/css?family=Montserrat:300');

a {
    color: inherit;
}

    a:hover {
        text-decoration: none;
        color: initial;
        color: #ed301c;
    }

    a:focus {
        color: inherit;
        text-decoration: inherit;
    }

li {
    list-style: none;
}

button {
    outline: none;
}

input[type="password"] {
    font-family: "Arial","微軟正黑體", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif,Calibri;
}

select, input {
    background: none;
    -webkit-appearance: none;
    border: none;
}

    select::-ms-expand {
        display: none;
    }

a.back-to {
    position: fixed;
    bottom: 3rem;
    right: 0.5rem;
    z-index: 20;
    padding: 0.2rem 0.5rem;
    color: inherit;
    text-decoration: none;
    background: rgba(233, 230, 225, 0.5);
    border-radius: 0.2rem;
    display: none;
}

    a.back-to i {
        color: #ed301c;
        font-size: 1.5rem;
        display: inline-block;
        padding-left: 0.5rem;
    }

    a.back-to.-down {
        display: block;
    }

a.click-me {
    position: fixed;
    bottom: 8rem;
    right: 0.5rem;
    z-index: 20;
    text-decoration: none;
    display: block;
    background: url(img/click-me.png) no-repeat center;
    width: 10rem;
    height: 10rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-direction: column;
    font-size: 2rem;
    font-weight: bold;
    background-size: 100%;
}

    a.click-me.-second {
        background: url(img/click-me-second.png) no-repeat center;
        background-size: 100%;
    }



/*Titles*/
section .content-title {
    margin-bottom: 1rem;
}

section h2,
section h3,
section h4 {
    margin-bottom: 0.5rem;
}

section h1 {
    font-size: 2.5rem;
    font-weight: normal;
    text-align: center;
    margin: auto auto;
    color: #84b2e1;
}

section h2 {
    font-size: 1.25rem;
}

section h3 {
    font-size: 1.125rem;
}

section h4 {
    font-size: 1rem;
}
/*#Titles*/


/*Content*/
section {
    margin-bottom: 1rem;
    overflow: hidden;
}

    section.-block {
        padding: 0.5rem;
        padding-top: 2rem;
    }


    section p {
        line-height: 2;
        margin-bottom: 1.5rem;
    }

        section p a {
            text-decoration: underline;
        }

    section .highlight {
        color: #1490e6;
    }

    section p strong {
        color: #ed301c;
    }

    section ol,
    section ul {
        margin-left: 1.25rem;
        margin-bottom: 1rem;
    }

    section li {
        list-style: inherit;
        margin-bottom: 0.5rem;
    }


        section li p {
            margin-bottom: 0;
        }

    section ol li li {
        list-style: lower-alpha;
    }

    section ol.cl-list {
        margin: 0;
        margin-top: 2rem;
        font-size: 1.375rem;
    }

        section ol.cl-list li {
            list-style: none;
            padding: 0.5rem 0;
            padding-left: 6rem;
            position: relative;
            overflow: hidden;
            min-height: 4rem;
            margin-bottom: 1rem;
        }

            section ol.cl-list li p {
                line-height: 3rem;
            }

            section ol.cl-list li i {
                font-style: normal;
                position: absolute;
                left: 0;
                top: 0;
                height: 4rem;
                width: 4rem;
                border-radius: 4rem;
                line-height: 4rem;
                text-align: center;
                background: #ffebe9;
            }
/*#Content*/


/*Text Aligns*/
.text-left {
    text-align: left;
}

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

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

/*Font sizes*/
.-fs-1 {
    font-size: 1.375rem;
}

.-fs-2 {
    font-size: 1.625rem;
}
/*Containers*/
.base {
    max-width: 1200px;
    margin: 0 auto;
    box-sizing: border-box;
}


.action-box {
    overflow: hidden;
    margin-bottom: 1rem;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

    .action-box > .btn {
        margin: 0.5rem;
    }

.flex {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}


.-justify-sb {
    justify-content: space-between;
}

.-justify-ctr {
    justify-content: center;
}

.flex.-eaqule > div {
    width: 100%;
    box-sizing: border-box;
}

/*Containers*/


/*Buttons*/
.btn {
    padding: 0.844rem 2rem;
    background: none;
    border: 1px solid transparent;
    text-decoration: none;
    border-radius: 0.25rem;
    font-size: 1.25rem;
    box-sizing: border-box;
    color: inherit;
    display: inline-block;
    text-align: center;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
}

    .btn i {
        display: inline-block;
        vertical-align: middle;
        margin-right: 0.25rem;
    }

    .btn:hover {
        text-decoration: none;
        color: #ed301c;
    }

    .btn.-default {
        text-decoration: underline;
        color: #ed301c;
    }

        .btn.-default:hover {
            text-decoration: none;
            color: inherit;
        }

    .btn.-primary {
        border-color: #ed301c;
        color: #ed301c;
        box-shadow: inset 0 -5px 0px 0px #ecb5bb;
    }

        .btn.-primary:hover,
        .btn.-primary.active {
            background: #ed301c;
            color: #fff;
            box-shadow: none;
            text-decoration: none;
        }

    .btn.-secondary {
        border-color: #85b2df;
        color: #85b2df;
        box-shadow: inset 0 -5px 0px 0px #85b2df;
    }

        .btn.-secondary:hover,
        .btn.-secondary.active {
            background: #85b2df;
            color: #fff;
        }

    .btn.-negative {
        border-color: #a99c94;
        color: #a99c94;
        box-shadow: inset 0 -5px 0px 0px #a99c94;
    }

        .btn.-negative:hover,
        .btn.-negative.active {
            background: #a99c94;
            color: #fff;
        }

    .btn.-disabled {
        background-color: #ececec;
        border-color: #ececec;
        color: #c7c7c7;
        box-shadow: inset 0 -5px 0px 0px #ccc;
    }


.pure-btn {
    background: no-repeat;
    font-size: 2rem;
    border: none;
    color: #a99c94;
}

    .pure-btn:hover {
        color: #ed301c;
    }

/*#Buttons*/

/*Channel Layers*/
.layer-tabs {
    margin-bottom: 1rem;
    padding: 0 0.5rem;
}

    .layer-tabs > .link-wrap-trigger {
        width: 100%;
        background: no-repeat;
        text-decoration: none;
        box-sizing: border-box;
        padding: 0.813rem 1rem;
        border: 0;
        text-decoration: none;
        font-size: 1.25rem;
        box-sizing: border-box;
        display: none;
        text-align: left;
        overflow: hidden;
        position: relative;
    }

        .layer-tabs > .link-wrap-trigger:after {
            content: "\f055";
            top: 0;
            bottom: 0;
            line-height: 3.5rem;
            right: 1rem;
            position: absolute;
            font-family: FontAwesome;
            color: #a99c94;
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .layer-tabs > .link-wrap-trigger.triggered:after {
            content: "\f056";
        }

.first.layer-tabs > .link-wrap-trigger {
    margin-bottom: 1rem;
    background: #ed301c;
    color: #fff;
}

    .first.layer-tabs > .link-wrap-trigger:after {
        content: "\f0d7";
        color: #fff;
    }

    .first.layer-tabs > .link-wrap-trigger.triggered:after {
        content: "\f0d8";
    }

.second.layer-tabs > .link-wrap-trigger,
.third.layer-tabs > .link-wrap-trigger {
    color: #ed301c;
    border-bottom: 1px solid #aba19f;
}

.third.layer-tabs > .link-wrap-trigger {
    padding-left: 3rem;
    font-size: 1.2rem;
}

    .second.layer-tabs > .link-wrap-trigger i:before,
    .third.layer-tabs > .link-wrap-trigger i:before {
        content: "\f055";
        color: #aba19f;
    }



    .second.layer-tabs > .link-wrap-trigger:before,
    .third.layer-tabs > .link-wrap-trigger:before {
        content: "\f0c8";
        font-family: FontAwesome;
        font-size: 0.5rem;
        vertical-align: middle;
        margin-right: 1rem;
        display: inline-block;
        vertical-align: middle;
        line-height: normal;
    }

.second.layer-tabs > .link-wrap-trigger:before {
    content: "\f111";
    display: inline-block;
}


.link-wrapper {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.first.layer-tabs .link-wrapper > * {
    margin: 0.5rem;
    display: block;
    text-align: center;
    min-width: 14rem;
    border-bottom-width: 1px;
    box-shadow: none;
}

.second.layer-tabs .link-wrapper,
.third.layer-tabs .link-wrapper {
    border-bottom: 1px solid #ccc;
    flex-wrap: wrap;
    padding-bottom: 1rem;
}

    .second.layer-tabs .link-wrapper a,
    .third.layer-tabs .link-wrapper a {
        padding-left: 1rem;
        position: relative;
        margin: 0.5rem 1rem;
        display: inline-block;
        font-size: 1.375rem;
        display: block;
    }

        .second.layer-tabs .link-wrapper a:before,
        .third.layer-tabs .link-wrapper a:before {
            content: "\f111";
            font-family: FontAwesome;
            top: 0;
            left: 0;
            position: absolute;
            font-size: 0.4rem;
            vertical-align: middle;
            flex-direction: column;
            justify-content: center;
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            height: 1.7rem;
        }

        .third.layer-tabs .link-wrapper a:before {
            content: "";
            border-left: 2px solid #65afe3;
            top: 0.3rem;
            bottom: 0.3rem;
            height: 1rem;
        }

    .third.layer-tabs .link-wrapper a {
        margin-left: 0;
    }

        .third.layer-tabs .link-wrapper a:first-child:before {
            display: none;
        }

        .second.layer-tabs .link-wrapper a.active,
        .third.layer-tabs .link-wrapper a.active {
            color: #ed301c;
        }

    .second.layer-tabs .link-wrapper a:before {
        border-left: 1px solid #65afe3;
        content: "";
        bottom: 0;
        top: auto;
        height: 1rem;
    }

    .second.layer-tabs .link-wrapper a:after {
        border-bottom: 2px solid #65afe3;
        content: "";
        bottom: 0;
        right: 0;
        left: 0;
        position: absolute;
    }

    .third.layer-tabs .link-wrapper a {
        font-size: 1.2rem;
    }

.layer-tabs.-scrollable {
    padding: 0 3rem;
    position: relative;
}

    .layer-tabs.-scrollable .-scroll-control {
        position: absolute;
        top: calc(50% - 1.5rem);
        width: 3rem;
        height: 3rem;
        overflow: hidden;
        text-indent: -999px;
    }

        .layer-tabs.-scrollable .-scroll-control:after {
            content: "";
            width: 3rem;
            height: 3rem;
            top: 0;
            border-right: 1px solid #333;
            border-bottom: 1px solid #333;
            transform: rotate(-45deg);
            z-index: 20;
            position: absolute;
            display: block;
            text-indent: 0;
        }

        .layer-tabs.-scrollable .-scroll-control.-prev {
            left: 0;
        }

        .layer-tabs.-scrollable .-scroll-control.-next {
            right: 0;
        }

        .layer-tabs.-scrollable .-scroll-control.-prev:after {
            transform: rotate(135deg);
            left: 1rem;
        }

        .layer-tabs.-scrollable .-scroll-control.-next:after {
            transform: rotate(-45deg);
            right: 1rem;
        }

        .layer-tabs.-scrollable .-scroll-control:hover:after {
            border-color: #ed301c;
        }

    .layer-tabs.-scrollable .link-wrapper {
        justify-content: flex-start;
        flex-wrap: nowrap;
        overflow: auto;
        padding-bottom: 0;
    }

        .layer-tabs.-scrollable .link-wrapper a {
            white-space: nowrap;
            display: block;
        }

    .layer-tabs.-scrollable ::-webkit-scrollbar {
        display: none;
    }

/*#Channel Layers*/


/*Content Table*/
.table-chart-wrapper {
    position: relative;
    background: #fff;
}

    .table-chart-wrapper:after {
        display: none;
        content: "\f101";
        font-family: FontAwesome;
        right: 0.5rem;
        top: calc(50% + 1rem);
        width: 2.5rem;
        height: 2.5rem;
        background-color: #eee;
        border-radius: 2.5rem;
        font-size: 1.7rem;
        text-align: center;
        color: #ed301c;
        position: absolute;
        animation: scrollTip 0.5s infinite forwards alternate;
    }

@-webkit-keyframes scrollTip {
    0% {
        right: 0;
    }

    100% {
        right: 0.5rem;
    }
}

@-moz-keyframes scrollTip {
    0% {
        right: 0;
    }

    100% {
        right: 0.5rem;
    }
}

@-o-keyframes scrollTip {
    0% {
        right: 0;
    }

    100% {
        right: 0.5rem;
    }
}

@keyframes scrollTip {
    0% {
        right: 0;
    }

    100% {
        right: 0.5rem;
    }
}

.table-chart {
    overflow: hidden;
    margin-bottom: 1rem;
    position: relative;
}

    .table-chart .rows {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        background: #ffffff;
        justify-content: center;
    }

        .table-chart .rows:nth-child(odd) {
            background: #fcfbfb;
        }

        .table-chart .rows .colm {
            width: 100%;
            padding: 1rem 0.5rem;
            max-width: 13.3rem;
        }

        .table-chart .rows.title-rows .colm {
            font-weight: bold;
        }

        .table-chart .rows .colm img {
            height: 1.2rem;
            vertical-align: middle;
            width: 2rem;
            margin-right: 1rem;
            display: inline-block;
        }

        .table-chart .rows .colm span {
            vertical-align: middle;
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
        }

        .table-chart .rows .colm strong {
            display: none;
        }
/*#Content Table*/


/*Data Table*/
.data-table {
    overflow: auto;
    position: relative;
    margin-bottom: 1rem;
}

    .data-table table {
        width: 100%;
        border: 0;
        background: none;
        border-collapse: collapse;
        border-spacing: 0;
    }

        .data-table table td,
        .data-table table th {
            padding: 1rem;
            border: 1px solid #e9e9e9;
        }

        .data-table table tr th {
            background: #f5f2ed;
            font-weight: normal;
        }

        .data-table table td .table-input {
            position: relative;
            background: #eeeeee;
            padding: 0.25rem;
            border-radius: 0.25rem;
            text-align: left;
            box-sizing: border-box;
        }

            .data-table table td .table-input select {
                height: 3.05rem;
                width: 100%;
                padding: 0 1rem;
                box-sizing: border-box;
            }

            .data-table table td .table-input.-input input {
                height: 3.05rem;
                width: 100%;
                padding: 0 1rem;
                box-sizing: border-box;
            }

            .data-table table td .table-input.-select:after {
                content: "\f0d7";
                position: absolute;
                top: 0;
                bottom: 0;
                right: 0.5rem;
                line-height: 2.8rem;
                font-family: FontAwesome;
            }

        .data-table table td .table-input-box {
            position: relative;
        }

            .data-table table td .table-input-box input {
                opacity: 0;
                height: 1px;
                width: 1px;
                top: 0;
                left: 0;
                position: absolute;
            }

            .data-table table td .table-input-box label {
                padding-left: 2rem;
                height: 2rem;
                display: inline-block;
                vertical-align: middle;
                position: relative;
                box-sizing: border-box;
                cursor: pointer;
            }

                .data-table table td .table-input-box label::after {
                    content: "";
                    position: absolute;
                    right: 0;
                    bottom: 0;
                    top: 0;
                    left: 0;
                    right: 0;
                    text-align: center;
                    font-family: FontAwesome;
                    font-size: 1.6rem;
                    color: #afaca6;
                }

            .data-table table td .table-input-box input[type="checkbox"] + label::after {
                content: "\f096";
            }

            .data-table table td .table-input-box input[type="radio"] + label::after {
                content: "\f10c";
            }

            .data-table table td .table-input-box input[type="checkbox"]:checked + label::after {
                content: "\f046";
                color: #f97951;
            }

            .data-table table td .table-input-box input[type="radio"]:checked + label::after {
                content: "\f192";
                color: #f97951;
            }


/*#Data Table*/

/*Breadcrumb*/
.breadcrumb-wrapper {
    background: #f9f9f9;
    padding: 1rem;
}

    .breadcrumb-wrapper a,
    .breadcrumb-wrapper span {
        margin: 0.5rem;
        display: inline-block;
    }

    .breadcrumb-wrapper span {
        color: #ed301c;
    }

    .breadcrumb-wrapper i {
        font-style: normal;
    }
/*#Breadcrumb*/

/*Notes*/
.note {
    padding: 1rem;
    margin-bottom: 1rem;
    overflow: hidden;
    font-size: 1rem;
}

    .note.-area {
        color: #1490e6;
        padding: 0;
        margin-bottom: 0;
    }

    .note .note-title h2 {
        font-size: 1rem;
    }

    .note.-policy {
        background: #fdeeee;
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .note.-announcement {
        background: #fef7ed;
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .note.-page {
        background: #edfdfe;
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .note p, .note ol, .note ul {
        margin-bottom: 0rem;
    }

/*#Notes*/

/*Tab Panels*/

.tab-panels {
    position: relative;
}

    .tab-panels .accordion-wrap-trigger {
        display: block;
        width: 100%;
        padding: 1rem 1.5rem;
        color: #fff;
        font-size: 1.375rem;
        background: #65afe3;
        border: 1px solid #65afe3;
        border-bottom: none;
        text-align: left;
        position: relative;
        display: none;
    }

        .tab-panels .accordion-wrap-trigger:after {
            content: "\f0d7";
            top: 0;
            bottom: 0;
            line-height: 3.5rem;
            right: 1rem;
            position: absolute;
            font-family: FontAwesome;
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            justify-content: center;
            align-items: center;
        }

    .tab-panels .tabs {
        margin: 0;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
    }

        .tab-panels .tabs li {
            list-style: none;
            border: 1px solid #65afe3;
            margin-right: -1px;
            margin-bottom: 0;
        }

            .tab-panels .tabs li:first-child {
                border-radius: 0.25rem 0 0 0;
            }

            .tab-panels .tabs li:last-child {
                border-radius: 0 0.25rem 0 0;
            }

            .tab-panels .tabs li a {
                padding: 0.844rem 1.5rem;
                display: block;
                color: #65afe3;
                font-size: 1.375rem;
            }

                .tab-panels .tabs li.active a,
                .tab-panels .tabs li a:hover {
                    background: #65afe3;
                    color: #fff;
                }

    .tab-panels .panels {
        margin-top: -1px;
        border: 1px solid #65afe3;
        padding: 1rem;
        border-radius: 0 .25rem .25rem .25rem;
    }

        .tab-panels .panels .panel {
            display: none;
        }

            .tab-panels .panels .panel.active {
                display: block;
            }

/*#Tab Panels*/

/*Accordion*/
.accordion-wrapper {
    overflow: hidden;
}

    .accordion-wrapper .item {
        overflow: hidden;
    }

        .accordion-wrapper .item .accordion-trigger {
            font-size: 1.125rem;
            font-weight: bold;
            padding: 0.5rem 0;
            padding-right: 2rem;
            position: relative;
            display: block;
            border-bottom: 1px solid #65afe3;
            margin-bottom: 0.5rem;
        }

            .accordion-wrapper .item .accordion-trigger:after {
                top: 0;
                right: 0;
                line-height: 2.5rem;
                right: 0rem;
                position: absolute;
                font-family: FontAwesome;
                color: #65afe3;
                content: "\f147";
                font-size: 2rem;
                font-weight: normal;
                display: -webkit-box;
                display: -moz-box;
                display: -ms-flexbox;
                display: -webkit-flex;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
            }

            .accordion-wrapper .item .accordion-trigger.collapsed {
                border-bottom: 0;
            }

                .accordion-wrapper .item .accordion-trigger.collapsed:after {
                    content: "\f196";
                }
/*#Accordion*/


/*Alerts*/
.alert {
    padding: 1rem 2rem;
    padding-bottom: 0;
    margin-bottom: 1rem;
    position: relative;
    padding-left: 5rem;
    overflow: hidden;
    min-height: 4.2rem;
}

    .alert h2 {
        font-size: 1.125rem;
    }

    .alert:after {
        font-family: FontAwesome;
        position: absolute;
        left: 1rem;
        top: 0;
        width: 3rem;
        font-size: 3rem;
        color: #fff;
        text-align: center;
    }

    .alert.-success {
        background: #d9e3cc;
    }

    .alert.-error {
        background: #ffdddc;
    }

    .alert.-warning {
        background: #fdeab0;
    }

    .alert.-info {
        background: #d3ebf9;
    }

    .alert.-success:after {
        content: "\f058";
    }

    .alert.-error:after {
        content: "\f057";
    }

    .alert.-warning:after {
        content: "\f05a";
    }

    .alert.-info:after {
        content: "\f071";
    }

/*#Alerts*/


/*Steps*/
.steps {
    overflow: hidden;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 1px solid #dfdfdf;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
}

    .steps .step {
        width: 100%;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 0.5rem;
    }

        .steps .step span.step-no {
            display: block;
            margin: auto;
            height: 5rem;
            width: 5rem;
            font-size: 2rem;
            background: #feddda;
            border-radius: 5rem;
            text-align: center;
            line-height: 5rem;
            margin-bottom: 1rem;
        }

        .steps .step span.step-label {
            text-align: center;
        }
/*#Steps*/

/*Scrollbox*/
.scroll-box {
    max-height: 20rem;
    overflow: auto;
    border: 1px solid #eee;
    padding: 1rem;
}
/*#Scrollbox*/


/*Fancy Block*/
.-fancy-block {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    min-height: 37.5004em;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

    .-fancy-block.-a {
        background-image: url(img/banners/fancy-a.jpg);
        color: #fff;
        line-height: 3rem;
    }

        .-fancy-block.-a p {
            font-size: 1.75rem;
            padding: 1rem;
        }

    .-fancy-block.-b {
        background-image: url(img/banners/fancy-b.jpg);
        justify-content: flex-end;
        color: #fff;
    }

    .-fancy-block.-c {
        background-image: url(img/banners/fancy-c.jpg);
    }

    .-fancy-block.-d {
        background-image: url(img/banners/fancy-d.jpg);
        justify-content: flex-end;
        color: #fff;
    }

    .-fancy-block.-e {
        background-image: url(img/banners/fancy-e.jpg);
    }

    .-fancy-block.-f {
        background-image: url(img/banners/fancy-f.jpg);
        justify-content: flex-end;
    }

    .-fancy-block.-g {
        background-image: url(img/banners/fancy-g.jpg);
    }

    .-fancy-block.-h {
        background-image: url(img/banners/fancy-h.jpg);
        justify-content: flex-end;
    }

    .-fancy-block.-i {
        background-image: url(img/banners/fancy-i.jpg);
    }

    .-fancy-block .-side {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        max-width: 50%;
        width: 50%;
        padding: 1rem;
        box-sizing: border-box;
    }

    .-fancy-block.-c .-side {
        background: #ebd1ce;
    }

    .-fancy-block.-d .-side {
        background: rgba(94,153,250,0.38);
    }

    .-fancy-block.-e .-side, .-fancy-block.-g .-side {
        background: rgba(233,66,51,0.64);
    }

    .-fancy-block.-i .-side {
        background: rgba(137,113,96,0.64);
    }

    .-fancy-block .-side span {
        font-size: 2.750rem;
        text-align: center;
    }

    .-fancy-block .-side a {
        font-size: 2.750rem;
        color: inherit;
        text-align: center;
    }

        .-fancy-block .-side a:hover {
            text-decoration: none;
        }

    .-fancy-block .-side span span {
        color: #ff6e5f;
    }

    .-fancy-block.-e .-side, .-fancy-block.-g .-side, .-fancy-block.-i .-side {
        color: #fff;
    }

    .-fancy-block .-side a:hover {
        color: #ed301c;
    }

    .-fancy-block .-side i {
        border-bottom: 2px solid transparent;
        display: block;
        width: 11rem;
        height: 10rem;
        background-repeat: no-repeat;
        background-position: center;
        margin-bottom: 2rem;
        background-image: url(img/icon-happy.svg);
    }

/*#Fancy Block*/

/*Confirm Box*/
.confirmation {
    padding: 1rem;
    position: relative;
}

    .confirmation label {
        padding-left: 2rem;
        display: inline-block;
        cursor: pointer;
        position: relative;
        line-height: 2rem;
    }

    .confirmation input {
        top: 0;
        opacity: 0;
        left: 0;
        position: absolute;
    }

    .confirmation label:after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        top: 0;
        left: 0;
        text-align: center;
        font-family: FontAwesome;
        font-size: 1.6rem;
        color: #afaca6;
    }

    .confirmation input + label::after {
        content: "\f096";
    }

    .confirmation input:checked + label::after {
        content: "\f046";
        color: #f97951;
    }

/*#Confirm Box*/


/*Dashboard*/
.dashboard {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 1rem;
}



    .dashboard .item {
        display: block;
        padding: 0.313rem;
        max-width: 22.6rem;
        box-sizing: border-box;
        margin: 1rem;
        margin-bottom: 1rem;
        font-size: 1.375rem;
    }

    .dashboard.-card-list {
        justify-content: flex-start;
    }

        .dashboard.-card-list .item {
            max-width: 16rem;
        }

        .dashboard.-card-list .item {
            margin: .99rem;
        }

    .dashboard .item .-top {
        text-align: center;
        margin-bottom: 1rem;
        font-size: 1.625rem;
    }

    .dashboard .item .-bottom {
        text-align: center;
    }

    .dashboard .item a span {
        text-align: center;
        display: block;
    }

    .dashboard .item img {
        max-width: 100%;
        display: block;
        margin: 0 auto;
        margin-bottom: 1rem;
    }

    .dashboard .item a {
        overflow: hidden;
    }

/*#Dashboard*/

/*Form*/
.form {
    overflow: hidden;
    margin-bottom: 1rem;
}

    .form .-row {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 0.5rem;
        overflow: hidden;
        align-items: flex-start;
    }

        .form .-row:last-child {
            margin-bottom: 0;
        }

        .form .-row .-colm {
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            flex-wrap: wrap;
            padding-right: 0.5rem;
            padding-bottom: 0.5rem;
            overflow: hidden;
            align-items: center;
        }

            .form .-row .-colm.-flex-colm {
                flex-direction: column;
                align-items: flex-start;
            }

            .form .-row .-colm.-size-x {
                width: 100%;
                margin-right: 0;
            }

            .form .-row .-colm.-size-l {
                width: 75%;
            }

            .form .-row .-colm.-size-m {
                width: 50%;
            }

            .form .-row .-colm.-size-s {
                width: 25%;
            }

            .form .-row .-colm .input {
                position: relative;
                margin-right: 0.5rem;
            }

            .form .-row .-colm.-size-x:last-child,
            .form .-row .-colm.-size-x:last-child > *:last-child {
                margin-right: 0;
                padding-right: 0;
            }


            .form .-row .-colm .input.-text,
            .form .-row .-colm .input.-button,
            .form .-row .-colm .input.-textarea,
            .form .-row .-colm .input.-select {
                box-sizing: border-box;
                padding: 0.25rem;
                background: #eeeeee;
                border: 1px solid transparent;
                border-radius: 0.25rem;
                position: relative;
                margin-right: 0.5rem;
                width: 100%;
            }
            
            .form .-row .-colm .input.-select-m {
                box-sizing: border-box;
                padding: 0.25rem;
                background: #eeeeee;
                border: 1px solid transparent;
                border-radius: 0.25rem;
                position: relative;
                margin-right: 0.5rem;
                width: 48.5%;
            }

            .form .-row .-colm .input.-has-error {
                border: 1px solid #ed301c !important;
            }

            .form .-row .-colm .input.active {
                border: 1px solid #ddd !important;
            }

            .form .-row .-colm .input.-datepicker {
                padding-right: 2rem;
            }

            .form .-row .-colm .input.-captcha img {
                display: block;
            }

            .form .-row .-colm .input.-button {
                background: none;
                border-radius: 0;
                padding: 0;
                border: 0;
            }

                .form .-row .-colm .input.-button .btn {
                    width: 100%;
                    display: block;
                }

            .form .-row .-colm .input.-textarea {
                width: 100%;
                height: auto;
            }

                .form .-row .-colm .input.-textarea textarea {
                    width: 100%;
                    min-height: 10rem;
                    resize: none;
                    padding: 0.75rem 0.5rem;
                    background: none;
                    border: none;
                    outline: none;
                    display: block;
                }


            .form .-row .-colm .input.-datepicker:after,
            .form .-row .-colm .input.-keyboard:after,
            .form .-row .-colm .input.-select:after {
                position: absolute;
                font-family: FontAwesome;
                top: 0;
                right: 0.5rem;
                bottom: 0;
                font-size: 1.3rem;
                vertical-align: middle;
                flex-direction: column;
                justify-content: center;
                display: -webkit-box;
                display: -moz-box;
                display: -ms-flexbox;
                display: -webkit-flex;
                display: flex;
            }

            .form .-row .-colm .input.-datepicker:after {
                content: "\f073";
            }

            .form .-row .-colm .input.-keyboard:after {
                content: "\f11c";
            }

            .form .-row .-colm .input.-select:after {
                content: "\f0d7";
            }

            .form .-row .-colm .input.-required:before {
                color: #ed301c;
                font-size: 0.5rem;
                vertical-align: text-top;
                margin-right: 0.2rem;
                content: "*";
                position: absolute;
                left: 0.25rem;
                top: 1rem;
                font-size: 1.5rem;
                transition: all 0.3s;
                -webkit-transition: all 0.3s;
                vertical-align: middle;
                flex-direction: column;
                justify-content: center;
                display: -webkit-box;
                display: -moz-box;
                display: -ms-flexbox;
                display: -webkit-flex;
                display: flex;
            }

            .form .-row .-colm .input.active.-required:before {
                top: 0rem;
            }

            .form .-row .-colm .input.-text input,
            .form .-row .-colm .input.-select select {
                padding: 0 0.5rem;
                box-sizing: border-box;
                background: none;
                border: none;
                width: 100%;
                display: block;
                outline: none;
                transition: all 0.3s;
                -webkit-transition: all 0.3s;
                position: relative;
                z-index: 20;
                height: 2.938rem;
            }

            .form .-row .-colm .input.-select select {
                padding-right: 1.5rem;
                height: 2.938rem;
            }
            
            .form .-row .-colm .input.-text input,
            .form .-row .-colm .input.-select-m select {
                padding: 0 0.5rem;
                box-sizing: border-box;
                background: none;
                border: none;
                width: 100%;
                display: block;
                outline: none;
                transition: all 0.3s;
                -webkit-transition: all 0.3s;
                position: relative;
                z-index: 20;
                height: 2.938rem;
            }

            .form .-row .-colm .input.-select-m select {
                padding-right: 1.5rem;
                height: 2.938rem;
            }


            .form .-row .-colm .input.-text.active input,
            .form .-row .-colm .input.-text input:focus {
                height: 1.938rem;
                margin-top: 1rem;
            }

            .form .-row .-colm .input.-textarea.active textarea,
            .form .-row .-colm .input.-textarea textarea:focus {
                margin-top: 1.5rem;
                min-height: 8.5rem;
            }

            .form .-row .-colm .input.-text.active > input + label,
            .form .-row .-colm .input.-text input:focus:focus + label,
            .form .-row .-colm .input.-textarea.active > textarea + label,
            .form .-row .-colm .input.-texarea textarea:focus:focus + label {
                top: 0.1rem;
                opacity: 1;
            }

            .form .-row .-colm .input.-text input:focus::-webkit-input-placeholder,
            .form .-row .-colm .input.-textarea textarea:focus::-webkit-input-placeholder {
                opacity: 0;
            }


            .form .-row .-colm .input.-text label,
            .form .-row .-colm .input.-textarea label {
                position: absolute;
                left: 0.25rem;
                font-size: 0.8rem;
                padding: 0.25rem 0.5rem;
                opacity: 0;
                top: 0.5rem;
                transition: all 0.3s;
                -webkit-transition: all 0.3s;
                line-height: 0.8rem;
                color: #333;
                z-index: 10;
            }

            .form .-row .-colm .input.-radio,
            .form .-row .-colm .input.-checkbox {
                box-sizing: border-box;
                padding: 0.25rem;
                border: 1px solid transparent;
                border-radius: 0.25rem;
                position: relative;
                margin-right: 0.5rem;
            }

                .form .-row .-colm .input.-radio input,
                .form .-row .-colm .input.-checkbox input {
                    position: absolute;
                    top: 0;
                    height: 0;
                    width: 0;
                    left: 0;
                    opacity: 0;
                }

                    .form .-row .-colm .input.-radio input + label,
                    .form .-row .-colm .input.-checkbox input + label {
                        padding: 0 0.25rem;
                        padding-left: 2rem;
                        line-height: 2.95rem;
                        display: inline-block;
                        position: relative;
                        cursor: pointer;
                    }

                        .form .-row .-colm .input.-radio input + label:before,
                        .form .-row .-colm .input.-checkbox input + label:before {
                            content: "";
                            position: absolute;
                            left: 0;
                            bottom: 0;
                            top: 0;
                            left: 0;
                            text-align: center;
                            font-family: FontAwesome;
                            font-size: 1.6rem;
                            color: #afaca6;
                        }


                        .form .-row .-colm .input.-radio input + label:before {
                            content: "\f10c";
                        }

                    .form .-row .-colm .input.-radio input:checked + label:before {
                        content: "\f192";
                        color: #f97951;
                    }



                    .form .-row .-colm .input.-checkbox input + label:before {
                        content: "\f096";
                    }

                    .form .-row .-colm .input.-checkbox input:checked + label:before {
                        content: "\f046";
                        color: #f97951;
                    }


            .form .-row .-colm .-label,
            .form .-row .-colm .-tip,
            .form .-row .-colm .-error {
                margin-right: 0.5rem;
                padding: 0.75rem 0.25rem;
                box-sizing: border-box;
                line-height: 2.1rem;
            }

            .form .-row .-colm .-label {
                font-weight: bold;
            }

            .form .-row .-colm .-error {
                color: #ed301c;
            }

            .form .-row .-colm .-tip > * {
                display: inline-block;
                margin-right: 0.5rem;
            }

            .form .-row .-colm .-tip i {
                font-size: 1.6rem;
                vertical-align: middle;
                margin-right: 0.5rem;
            }

            .form .-row .-colm .-tip .tooltip .tooltip-inner {
                background: #ed301c;
                font-size: 1rem;
                padding: 0.5rem 1rem;
            }

            .form .-row .-colm .-tip .tooltip .tooltip-inner {
                background: #ed301c;
            }

            .form .-row .-colm .-tip .tooltip.top .tooltip-arrow {
                border-top-color: #ed301c;
            }

/*#Form*/


/*Modal*/
.modal.-full-width .modal-dialog {
    max-width: 1200px;
    width: auto;
}

.modal .close {
    position: absolute;
    top: 0;
    right: 0;
    background: no-repeat;
    border: none;
    font-size: 2rem;
    padding: 1rem;
    line-height: 1rem;
}

.modal-header {
    background: #f5f2ed;
    border-radius: 0.25rem 0.25rem 0 0;
    min-height: 3.2rem;
}


.modal-content {
    border-radius: 0.25rem;
}

.modal .success-dialog {
    text-align: center;
}

    .modal .success-dialog i {
        color: #3ecc77;
        font-size: 5rem;
        margin-bottom: 1rem;
        display: block;
    }

.modal-footer {
    text-align: center;
}

/*#Modal*/

/*Login Form*/
.modal .login-widget {
    top: 0;
    margin-bottom: 0;
}
/*#Login Form*/



/*Google Map*/

.google-map-list {
    overflow: hidden;
    margin-bottom: 1rem;
}

    .google-map-list .item {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        text-decoration: none;
        color: inherit;
        font-size: 1.3rem;
        padding: 2rem 1rem;
        padding-left: 5rem;
        position: relative;
        display: block;
    }

        .google-map-list .item:before {
            content: "\f278";
            font-size: 2rem;
            font-family: FontAwesome;
            position: absolute;
            left: 1.6rem;
            top: 1.6rem;
            line-height: 3rem;
        }

        .google-map-list .item:after {
            content: "\f041";
            font-size: 1.5rem;
            padding-left: 0.5rem;
            color: #f97951;
            font-family: FontAwesome;
            position: absolute;
            left: 1.6rem;
            line-height: 2rem;
            top: 1.6rem;
        }

    .google-map-list a.item {
        background: #f5f2ef;
    }

        .google-map-list a.item:nth-child(even) {
            background: #e9e3de;
        }

        .google-map-list a.item:hover {
            background: #84b2e1;
            color: #fff;
        }

            .google-map-list a.item:hover:after {
                color: #fff;
            }


    .google-map-list .-secure strong:before,
    .google-map-list .-secure strong:after {
        right: 0;
        top: 0;
        content: "";
        height: 5.5rem;
        width: 5.5rem;
        background-size: 100%;
        position: absolute;
        background: url(img/secure.png) no-repeat top right;
    }

    .google-map-list .-secure strong:after {
        height: 2.5rem;
        width: 2.5rem;
        top: 0.3rem;
        right: 0.3rem;
    }

    .google-map-list .-secure strong:before {
        background: -moz-linear-gradient(45deg, rgba(132,178,225,0) 0%, rgba(132,178,225,0) 50%, rgba(132,178,225,1) 51%, rgba(132,178,225,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(45deg, rgba(132,178,225,0) 0%,rgba(132,178,225,0) 50%,rgba(132,178,225,1) 51%,rgba(132,178,225,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(45deg, rgba(132,178,225,0) 0%,rgba(132,178,225,0) 50%,rgba(132,178,225,1) 51%,rgba(132,178,225,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0084b2e1', endColorstr='#84b2e1',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    }

.google-map {
    overflow: hidden;
}

    .google-map iframe {
        width: 100%;
        border: 1px solid #ccc;
        min-height: 20rem;
    }

/*Image*/

.image {
    overflow: hidden;
    margin-bottom: 2rem;
}

    .image img {
        margin-bottom: 1rem;
        max-width: 100%;
    }

    .image.-left img {
        float: left;
        margin-right: 2rem;
    }

    .image.-right img {
        float: right;
        margin-left: 2rem;
    }

    .image.-center img {
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .image.-default img {
        display: block;
    }

/*Image-title*/
.image-title {
    overflow: hidden;
    font-size: 1.375rem;
}

    .image-title .-row {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        align-items: center;
        margin-bottom: 2rem;
    }

        .image-title .-row .-left {
            margin-right: 1rem;
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            align-items: center;
        }

            .image-title .-row .-left .-image {
                margin-right: 2rem;
                flex: 0 1 auto;
            }

                .image-title .-row .-left .-image img {
                    max-width: 100%;
                }

            .image-title .-row .-left .-title {
                font-size: 3rem;
                white-space: nowrap;
                flex: 1 1 auto;
            }

                .image-title .-row .-left .-title strong {
                    font-weight: normal;
                }

        .image-title .-row .-right {
            flex: 1;
        }

            .image-title .-row .-right p {
                margin-bottom: 0;
            }
/*Cards*/
.cards {
    overflow: hidden;
    margin-bottom: 1rem;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.card {
    box-sizing: border-box;
    background: #f5f2ef;
    border: 1px solid #dfdfdf;
    border-radius: 0.125rem;
}

    .card .-image img {
        width: 100%;
    }

    .card .-content {
        padding: 1rem;
    }

    .card .action-box {
        margin-bottom: 0;
    }

.cards.-vertical {
    flex-wrap: wrap;
    justify-content: center;
}

.cards.-horizontal {
    flex-wrap: nowrap;
    flex-direction: column;
}

.-horizontal .card {
    background: none;
    border: none;
}

.-vertical .card {
    width: 17.25rem;
    margin: 0.625rem;
}

    .-vertical .card .-header {
        background: #fff;
        padding: 1rem;
        padding-top: 2rem;
        text-align: center;
    }

    .-vertical .card .-image {
        margin-bottom: 0.5rem;
    }

    .-vertical .card .-content {
        margin-bottom: 0.5rem;
    }

.-horizontal .card {
    width: 100%;
    margin-bottom: 1rem;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: flex-start;
}

    .-horizontal .card.-flex-wrap {
        flex-wrap: wrap;
    }

    .-horizontal .card .-full-width {
        flex: 1 1 100%;
    }



    .-horizontal .card .-image {
        margin-bottom: 0.5rem;
    }

    .-horizontal .card .-content {
        margin-bottom: 0.5rem;
        flex: 1 1 50%;
    }

    .-horizontal .card .-selection {
        flex: 0 0 20%;
        padding: 1rem;
        box-sizing: border-box;
    }

.cards.-horizontal .action-box {
    justify-content: flex-end;
    flex: 0 0 30%;
    padding: 0.5rem;
}


/*#Cards*/

/*Compare*/
.compare {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    margin-bottom: 1rem;
    justify-content: space-between;
    flex-wrap: nowrap;
    overflow: auto;
}

    .compare .-colm {
        width: 18rem;
        padding: 0.25rem;
        box-sizing: border-box;
        flex: 0 0 18rem;
    }

        .compare .-colm .-header {
            position: relative;
            text-align: center;
            margin-bottom: 2rem;
        }

            .compare .-colm .-header button {
                top: 0;
                background: none;
                right: 0;
                position: absolute;
                border: none;
                font-size: 1.2rem;
                font-weight: normal;
            }

        .compare .-colm .-image {
            margin-bottom: 1rem;
        }

        .compare .-colm .-description {
            margin-bottom: 1rem;
        }

        .compare .-colm .btn {
            margin: 1rem;
            display: block;
        }

        .compare .-colm img {
            max-width: 100%;
        }

        .compare .-colm .-selected {
            box-sizing: border-box;
        }


        .compare .-colm .-selected {
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            justify-content: space-between;
            flex-direction: column;
            height: 100%;
            max-height: 40rem;
        }


        .compare .-colm .-selections {
            max-height: 40rem;
            overflow: auto;
        }

            .compare .-colm .-selections a {
                text-align: center;
                display: block;
                margin-bottom: 2rem;
            }

                .compare .-colm .-selections a img {
                    display: block;
                    margin-bottom: 1rem;
                }


        .compare .-colm .-empty {
            background: url(img/empty-card-bg.jpg) no-repeat center;
            background-size: contain;
            height: 100%;
            width: 100%;
        }

/*#Compare*/

/*News*/
.news-list {
    overflow: hidden;
    margin-bottom: 1rem;
}

    .news-list .-news {
        padding: 1rem 0;
        position: relative;
        margin-bottom: 1rem;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        border-bottom: 1px solid #dedede;
        max-width: 61rem;
        margin: 0 auto;
    }

        .news-list .-news .-channel {
            height: 3rem;
            text-align: center;
            width: 3rem;
            border-radius: 3rem;
            color: #fff;
            line-height: 3rem;
            margin-right: 1rem;
            flex: 0 0 3rem;
        }

            .news-list .-news .-channel.-c1 {
                background: #fc6565;
            }

            .news-list .-news .-channel.-c2 {
                background: #7ba1f7;
            }

            .news-list .-news .-channel.-c3 {
                background: #fac946;
            }

            .news-list .-news .-channel.-c4 {
                background: #a2cc79;
            }

            .news-list .-news .-channel.-c5 {
                background: #ce7ffb;
            }

            .news-list .-news .-channel.-c6 {
                background: #fa874f;
            }

            .news-list .-news .-channel.-c7 {
                background: #93c1ba;
            }

            .news-list .-news .-channel.-c8 {
                background: #48b0fa;
            }

        .news-list .-news a {
            font-size: 1.25rem;
            padding: 0.5rem;
        }

            .news-list .-news a span {
                display: block;
                font-size: 1rem;
            }

/*#News*/

/*Pagination*/
.pagination {
    text-align: center;
    padding: 1rem;
}

    .pagination a {
        margin: 0 0.5rem;
    }

/*#Pagination*/


/*Carousel*/
.carousel.-cards {
    margin-bottom: 2rem;
}


.carousel-control {
    background: none !important;
    color: #000;
    text-shadow: none;
    opacity: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
    bottom: auto;
    top: calc(25% - 1.5rem);
    height: 5rem;
    width: 5rem;
    text-align: center;
}

    .carousel-control:after {
        content: "";
        width: 3rem;
        height: 3rem;
        top: 0;
        border-right: 1px solid #333;
        border-bottom: 1px solid #333;
        transform: rotate(-45deg);
        z-index: 20;
    }

    .carousel-control.right:after {
        transform: rotate(-45deg);
    }

    .carousel-control.left:after {
        transform: rotate(135deg);
    }

.carousel.-cards {
    text-align: center;
}

.carousel .image {
    overflow: hidden;
}
/*#Carousel*/

/*Circle*/
.circles {
    overflow: hidden;
    margin-bottom: 1rem;
    margin-top: 1rem;
}

    .circles .-row {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        justify-content: space-around;
        flex-wrap: wrap;
        margin-bottom: 1rem;
    }

        .circles .-row:last-child {
            margin-bottom: 0;
        }

        .circles .-row .-item {
            margin: 1rem;
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            justify-content: flex-start;
            box-sizing: border-box;
            font-size: 1.375rem;
        }

    .circles.-full .-row .-item {
        width: 100%;
    }

    .circles .-row .-item span {
        font-size: 1.625rem;
        text-align: center;
        display: block;
    }

    .circles .-row .-item i {
        background: rgba(245, 112, 98, 0.32);
        height: 10rem;
        width: 10rem;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        justify-content: center;
        align-items: center;
        border-radius: 10rem;
        font-size: 3.4rem;
        color: #f57062;
        margin: 0 auto;
        margin-bottom: 1rem;
    }

        .circles .-row .-item i img {
            max-width: 100%;
        }

    .circles.-colored .-row .-item i {
        background: #edfdfe;
    }

    .circles .-row .-item:hover a i,
    .circles .-row .-item.active i {
        color: #fff;
        background: #f57062;
    }

    .circles .-row .-item .left a {
        display: block;
        text-align: center;
    }

    .circles .-row .-item .right {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        align-items: center;
        flex: 1;
        margin-left: 2rem;
    }

        .circles .-row .-item .right > * {
            width: 100%;
        }
/*#Circle*/

/*Shops*/
.shops {
    overflow: hidden;
    position: relative;
    border: 1px solid #f57062;
    padding: 1rem;
}

    .shops:after {
        content: "";
        position: absolute;
        top: 0;
        left: calc(50% - 1rem);
        width: 0;
        height: 0;
        border-left: 1rem solid transparent;
        border-right: 1rem solid transparent;
        border-top: 1rem solid #f57062;
    }

    .shops .-list {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

        .shops .-list .-item {
            width: 48.32%;
            border: 1px solid #ccc;
            margin: 0.84%;
            padding: 1rem;
            box-sizing: border-box;
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            align-items: center;
        }

            .shops .-list .-item .-left {
                flex: 0 0 40%;
                margin-right: 10%;
            }

                .shops .-list .-item .-left a {
                    display: block;
                    margin-bottom: 0.5rem;
                }

                .shops .-list .-item .-left img {
                    max-width: 100%;
                    margin: 0 auto;
                    display: block;
                }

            .shops .-list .-item .-right {
                flex: 1 1 50%;
            }

            .shops .-list .-item .-right {
                vertical-align: middle;
            }

                .shops .-list .-item .-right p {
                    margin-bottom: 0;
                }

                    .shops .-list .-item .-right p i {
                        margin-right: 0.5rem;
                        width: 1rem;
                        text-align: center;
                    }

/*#Shops*/

/*Scroll Block*/
.scroll-block {
    min-height: 30rem;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

    .scroll-block.-a {
        background-image: url(img/banners/a.jpg);
    }

    .scroll-block.-b {
        background-image: url(img/banners/b.jpg);
    }

    .scroll-block.-c {
        background: #84b2e1;
    }
/*#Scroll Block*/


/*ATM*/
.atm {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

    .atm > div {
        margin: 0.5rem 1rem;
        box-sizing: border-box;
    }

.keyboard {
    text-align: center;
    background: #fafafa;
    display: inline-block;
    padding: 1rem 2rem;
}


    .keyboard .-row button {
        margin: 0.5rem;
        display: inline-block;
        font-size: 1rem;
        width: 4rem;
        height: 3rem;
        padding: 0;
        box-shadow: none;
    }

.image-banners {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
}

    .image-banners a {
        display: block;
        margin: 0.5rem;
    }

        .image-banners a img {
            max-width: 100%;
        }
/*#ATM*/