/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */
@font-face {
    font-family: 'NanumBarunGothic';
    src: url('/assets/fonts/NanumBarunGothic.eot');
    src: url('/assets/fonts/NanumBarunGothic.eot') format('embedded-opentype'), url('/assets/fonts/NanumBarunGothic.woff') format('woff');
}

.font-accent{
    color: dodgerblue !important;
}

.fp-controlArrow {
    position: absolute;
    z-index: 4;
    top: 50%;
    cursor: pointer;
    width: 0;
    height: 0;
    border-style: solid;
    margin-top: -38px;
}

    .fp-controlArrow.fp-prev {
        left: 15px;
        width: 0;
        border-width: 38.5px 34px 38.5px 0;
        border-color: transparent lightgray transparent transparent;
    }

    .fp-controlArrow.fp-next {
        right: 15px;
        border-width: 38.5px 0 38.5px 34px;
        border-color: transparent transparent transparent lightgray;
    }

.main-title {
    margin-top: 30px;
}

.main-title .octicon {
    font-size: 2em;
}

a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
    margin-left: 10px !important;
}

.nav a {
    padding-left: 10px !important;
}

.navbar { 
    border-bottom: 2px solid #515151;
    height: auto;
}

#mobileMenuDivWrapper {
    height: 200px;
    max-height: 200px;
    width: 100%;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    mobile safari;
}

#navbar-close {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    background: no-repeat center center;
    background-size: 100% 100%;
    line-height: 1;
}

    #navbar-close .octicon {
        width: 25px;
        height: 25px;
        fill: white;
    }

.li .octicon {
    fill: #007bff;
}

li.s1 {
    list-style-type: lower-roman
}
/* 로마숫자 소문자으로된 목록 */
li.s2 {
    list-style-type: upper-roman
}
/* 로마숫자 대문자으로된 목록 */
li.s3 {
    list-style-type: lower-alpha
}
/* 알파벳 소문자으로된 목록 */
li.s4 {
    list-style-type: upper-alpha
}
/* 알파벳 대문자으로된 목록 */
li.s5 {
    list-style-type: disc
}
/* 점으로 된 목록 */
li.s6 {
    list-style-type: circle
}
/* 속이 하얀색 원으로 된 목록 */
li.s7 {
    list-style-type: square
}
/* 사각형으로 된 목록 */
li.s8 {
    list-style-type: decimal
}
/* 숫자로 된 목록 */
li.s9 {
    list-style-type: none
}
/* 아무 표시 없음 */

svg {
    fill: currentColor;
}

/* 모바일 화면일때 토글버튼 눌렸을때 색상 */
.navbar-toggle-clicked {
    background-color: deepskyblue;
}

/*.dropdown:hover > .dropdown-menu {
    display: block;
}*/
/*.nav li {
    border-right: 1px solid dodgerblue;
    border-bottom: 1px solid dodgerblue;
    border-top: 1px solid dodgerblue;
}*/
/* Sticky footer styles
-------------------------------------------------- */
html {
    font-size: 14px;
}
#wrapper {
    position: relative;
    height: 100%;
}


.footer {
    border-top: 2px solid #515151;
    position: relative;
    height: 100px;
    /*transform: translateY(-100%);*/
}

    .footer .container {
        padding: 40px 0 0 0;
        vertical-align: middle;
    }

.footer-menu {
    border-top: 2px solid #515151;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1030;
    background-color: #fff !important;
}

.footer-menu .container { padding: 1rem !important; }

.form-group.required .control-label:after {
    content: "ㆍ";
    font-weight: bold;
    color: orangered;
}

.form-check.required .form-check-label:after {
    content: "ㆍ";
    font-weight: bold;
    color: orangered;
}

.requiredSpan:after {
    content: "ㆍ";
    font-weight: bold;
    color: orangered;
}

.password {
    -webkit-text-security: disc;
}

.logo-text {
    color: yellow;
}

ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
    margin-top: -5px;
}
.nav-tabs-main .nav-link {
    border: 0 !important;
}

@media (min-width: 501px) {
    .btn-nav span { display: inline-block; }
    .toktok-header h3 { padding: 0 30px; }
}

@media (max-width: 991.98px) {
    .navbar.fixed-top .navbar-collapse {
        max-height: calc(100vh - 56px);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}

.card .card-header {
    font-size: 1.4em;
}

.product-title {
    font-size: 3em;
    font-weight: bold;
    font-family: 'Zen Kurenaido', sans-serif;
}

.product-finecare {
    color: dodgerblue;
}

.product-genie {
    color: mediumpurple;
}

.product-cms {
    color: cadetblue !important;
}

.product-card-body {
    font-size: 1.1em;
    min-height: 10em !important;
}

.product-cms-card-body {
    font-size: 1.1em;
    min-height: 15em !important;
}

/*
    제안서 다운로드 그리드
*/
.proposal-grid {
    position: fixed; /* Safari & IE */
    bottom: 8px;
    right: 150px !important;
    z-index: 100 !important;
}

.proposal-grid > a {
    margin: 10px;
    font-size: 20px;
    z-index: 9999 !important;
}

.proposal-grid > a > .octicon {
    width: 30px;
    height: 30px;
}


@media (max-width: 766px) {
    .table-responsive table,
    .table-responsive thead,
    .table-responsive tbody,
    .table-responsive tfoot,
    .table-responsive th,
    .table-responsive td,
    .table-responsive tr {
        display: block;
    }

    .table-responsive thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .table-responsive td {
        border-bottom: 1px solid #fff !important;
        position: relative;
        padding-left: 30% !important;
        white-space: normal;
        text-align: left;
    }

    .table-responsive tbody tr {
        border-bottom: 1px solid #aaaaaa !important;
    }

    .table-responsive tfoot tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .table-responsive td:before {
        position: absolute;
        top: 10px;
        left: 6px;
        width: 65%;
        padding-right: 10px;
        white-space: nowrap;
        text-overflow: ellipsis;
        text-align: left;
    }

    .table-responsive td:before {
        content: attr(data-title);
    }

    .table-responsive tr td img {
        display: block;
        width: 100%;
        height: auto;
    }

    .nav-fill .nav-item {
        text-align: left !important;
    }

    .right-top-fixed {
        display: none !important;
    }

    .scrolldown {
        display: none;
    }

    .nav .dropdown-menu {
        display: block;
        margin-left: 20px;
        border: 0 !important;
        margin-top: 0 !important;
    }

    .btn-nav span { display: none; }

    .toktok-header h3 {
        font-size: 1.2em !important;
        padding: 0 10px;
    }

    .right-bottom-fixed {
        position: fixed; /* Safari & IE */
        top: 10px !important;
        right: 80px !important;
        height: 58px;
        z-index: -100 !important;
    }

    

    #message-body h3 { font-size: 1.1em !important; }

    #message-body .card-text { font-size: 1em !important; }

    .card-body a { font-size: 1em !important; }

    .tt-namecard { font-size: 1em !important; }

    .navbar { height: auto; }

    .section h1 { font-size: 3em !important; }
    .section h2 {
        font-size: 2.3em !important;
    }
    .section h3 {
        font-size: 2em !important;
    }
    .section h4 {
        font-size: 1.5em !important;
    }

    .section .h4{
        font-size: 1em !important;
        line-height: 1.5 !important;
    }

    .section h5 li {
        font-size: 1em !important;
    }

    #section3 .card-body {
        height: 150px !important;
    }

    .card .card-header {
        font-size: 1.2em;
    }

    .price-card-body{
        height: 450px !important;
    }

/*    .card .card-body {
        min-height: auto !important;
    }*/

    .fullpage-responseve-content-top .section .fp-tableCell {
        vertical-align: top !important;
        height: auto !important;
    }

    .product-title {
        margin-top: 100px !important;
    }

    .mobile-display-none {
        display: none !important;
    }

    .proposal-grid {
        display: none !important;
    }
}
@media (max-width: 501px) {
    .section h1 {
        font-size: 2.5em !important;
    }

    .section h2 {
        font-size: 1.8em !important;
    }

    .section h3 {
        font-size: 1.5em !important;
    }

    .section .h4 {
        font-size: 1em !important;
        line-height: 1.5 !important;
    }

    .fp-controlArrow.fp-prev {
        left: 5px;        
    }

    .fp-controlArrow.fp-next {
        right: 5px;        
    }
}
    #fp-nav ul li a span, .fp-slidesNav ul li a span {
        /*background: dodgerblue;*/
    }

.main-container {
    padding-top: 50px;
    padding-bottom: 50px;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.rd-container {
    padding-top: 50px;
    padding-bottom: 50px;
    width: 100%;
    padding-right: 100px;
    padding-left: 100px;
    margin-right: auto;
    margin-left: auto;
}

.full-container {
    padding-top: 50px;
    padding-bottom: 50px;
    margin-right: 20px;
    margin-left: 20px;
}

    @media (min-width: 576px) {
        .main-container {
            max-width: 540px;
        }

    }

    @media (min-width: 768px) {
        .main-container {
            max-width: 720px;
        }
    }

    @media (min-width: 992px) {
        .main-container {
            max-width: 960px;
        }
    }

    @media (min-width: 1200px) {
        .main-container {
            max-width: 1140px;
        }
    }

    @media (max-width: 768px) {
        .rd-container {
            padding-right: 15px;
            padding-left: 15px;
        }
        #fc_navbar {
            width: max-content;
            z-index: -1;
            -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
            height: 400px;
            max-height: 400px;            
            overflow-y: scroll;
            -webkit-overflow-scrolling: touch;            
        }
    }

    @media (min-width: 1920px) {
        .rd-container {
            padding-right: 150px;
            padding-left: 150px;
        }
    }

    @media (min-width: 768px) {
        /*.table { font-size: 1em; }*/

        html {
            font-size: 1em;
        }

        .col-1 {
            width: 8.33%;
        }

        .col-2 {
            width: 16.66%;
        }

        .col-3 {
            width: 25%;
        }

        .col-4 {
            width: 33.33%;
        }

        .col-5 {
            width: 41.66%;
        }

        .col-6 {
            width: 50%;
        }

        .col-7 {
            width: 58.33%;
        }

        .col-8 {
            width: 66.66%;
        }

        .col-9 {
            width: 75%;
        }

        .col-10 {
            width: 83.33%;
        }

        .col-11 {
            width: 91.66%;
        }

        .col-12 {
            width: 100%;
        }

        .table td, .table th {
            font-size: 1em !important;
        }
    }


    table.dataTable tbody tr.selected {
        background-color: cornsilk;
    }

    .nav-tabs-main {
        border: 0;
    }

        .nav-tabs-main .nav-link:hover, .nav-tabs-main .nav-link:focus {
            border: 1px solid lightgray;
            color: cadetblue !important;
            font-size: 1em !important;
        }

        .nav-tabs-main .nav-link.active,
        .nav-tabs-main .nav-item.show .nav-link {
            border: 0;
            /*        border-top: 0;
        border-left: 0;
        border-right: 0;*/
            /*border-bottom: 3px solid dodgerblue;*/
            color: #17a2b8 !important;
            font-weight: bold;
            /*color: dodgerblue !important;*/
        }

    .nav-tabs-sub .nav-link {
        color: gray;
    }

        .nav-tabs-sub .nav-link.active,
        .nav-tabs-sub .nav-item.show .nav-link {
            color: dodgerblue;
        }

    .nav .octicon {
        width: 20px;
        height: 20px;
    }

    .nav-tabs-main .nav-item a {
        color: gray !important;
        font-size: 1em !important;
    }

    .border-top {
        border-top: 1px solid #e5e5e5;
    }

    .border-bottom {
        border-bottom: 1px solid #e5e5e5;
    }

    .box-shadow {
        box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
    }

    button.accept-policy {
        font-size: 1rem;
        line-height: inherit;
    }

    .card-fixed {
        position: relative; /* all child elements gets positioned relative to this element */
    }

    .card-header-fixed {
        position: fixed; /* stay fixed on top */
        top: 0;
        width: 100%;
        z-index: 1; /* needed to stay above other elements */
    }

    /* Sticky footer styles
-------------------------------------------------- */

    html {
        position: relative;
        min-height: 100%;
    }

    body {
        /* navbar fixed top content padding */
        padding-top: 85px;
        /* Margin bottom by footer height */
        font-family: 'NanumBarunGothic', 'serif';
    }

    dt {
        font-size: large;
    }

    dd {
        font-size: large;
    }

    /* octicon */

    .h5 .octicon {
        width: 25px;
        height: 25px;
    }

    .btn .octicon {
        width: 20px;
        height: 20px;
    }


    .btn-lg .octicon {
        width: 25px;
        height: 25px;
    }

    .btn-outline-primary .octicon {
        fill: #007bff;
    }

    .btn-outline-primary:hover .octicon {
        fill: #fff;
    }

    .btn-primary, .btn-info, .btn-danger, .btn-secondary .octicon {
        fill: #fff;
    }

    .btn-outline-secondary .octicon {
        fill: #6c757d;
    }

    .btn-outline-secondary:hover .octicon {
        fill: #fff;
    }

    .btn-outline-success .octicon {
        fill: #28a745;
    }

    .btn-outline-success:hover .octicon {
        fill: #fff;
    }

    .btn-outline-info .octicon {
        fill: #17a2b8;
    }

    .btn-outline-info:hover .octicon {
        fill: #fff;
    }

    .btn-outline-warning .octicon {
        fill: #ffc107;
    }

    .btn-outline-warning:hover .octicon {
        fill: black;
    }

    .btn-outline-danger .octicon {
        fill: #dc3545;
    }

    .btn-outline-danger:hover .octicon {
        fill: #fff;
    }

    /*업로드 버튼 디자인*/

    .input-file-container {
        width: 225px;
    }

    .js .input-file-trigger {
        display: block;
        padding: 14px 45px;
        background: #39D2B4;
        color: #fff;
        font-size: 1em;
        transition: all .4s;
        cursor: pointer;
    }

    .js .input-file {
        position: absolute;
        top: 0;
        left: 0;
        width: 225px;
        opacity: 0;
        padding: 14px 0;
        cursor: pointer;
    }

        .js .input-file:hover + .input-file-trigger,
        .js .input-file:focus + .input-file-trigger,
        .js .input-file-trigger:hover,
        .js .input-file-trigger:focus {
            background: #34495E;
            color: #39D2B4;
        }

    .file-return {
        margin: 0;
    }

        .file-return:not(:empty) {
            margin: 1em 0;
        }

    .js .file-return {
        font-style: italic;
        font-size: .9em;
        font-weight: bold;
    }

        .js .file-return:not(:empty):before {
            content: "선택된 파일 : ";
            font-style: normal;
            font-weight: normal;
        }

    .table-hover tr {
        cursor: pointer;
    }

    .noresize {
        resize: none; /* 사용자 임의 변경 불가 */
    }

    /* Chatting CSS */

    .chat-container {
        height: 25rem;
        min-height: 20rem;
    }

    .message-card {
        max-width: 60%;
        min-height: 0px !important;
    }

    .bg-lightblue {
        background-color: #7CC0FF;
    }

    .bg-darkblue {
        background-color: #0E5EA9;
    }

    .bg-lightgrey {
        background-color: #f1f1f1;
    }

    .search-input-h {
        height: 10% !important;
    }

    .hover-color-darkblue:hover {
        color: #0E5EA9 !important;
    }

    .hover-color-lightgray:hover {
        color: #dcdcdc !important;
    }

    .hover-bg-lightgray:hover {
        background-color: #dcdcdc !important;
        cursor: pointer;
    }

    .active.hover-bg-lightgray:hover {
        background-color: #0E5EA9 !important;
        cursor: pointer;
    }

    .border-chat-lightgray {
        border-style: solid;
        border-width: 1px 0 1px 1px;
        border-color: #dfdfdf !important;
    }

    .text-white {
        color: white;
    }

    .message-scroll {
        overflow-y: auto;
    }

    .sidebar-scroll {
        overflow-y: auto;
    }

    #sidebar-content {
        display: flex;
        flex-direction: column;
    }

    /** {
    border-radius: 0px!important;
    border-collapse: collapse;
    box-shadow:none!important;
}*/

    .tt-namecard {
        padding-left: 5px;
        padding-right: 5px;
        height: 30px;
        font-size: 12px;
        border-radius: 15% !important;
        line-height: 30px;
        text-align: center;
        margin-top: 5px;
    }

    .tt-namecard-opponent {
        color: #fff;
        background: dodgerblue;
        margin-left: 10px;
    }

    .tt-namecard-me {
        color: dodgerblue;
        border: 1px dodgerblue solid;
        background: #fff;
        margin-right: 10px;
    }

    /* Backgrounds will cover all the section
* --------------------------------------- */

    #section0,
    #section1 {
        position: relative;
        z-index: 1;
        text-align: center;
    }

    /*#section2 {
    padding-top: 60px;
}*/
    /* Defining each sectino background and styles 
* --------------------------------------- */

.section {
    padding: 0 50px;
}

        .section img {
            max-height: 600px;
        }

        .section h1 {
            font-size: 4em;
        }

        .section h2 {
            font-size: 3em;
        }

        .section h3 {
            font-size: 2.5em;
        }

        .section h4 {
            font-size: 2em;
        }

    .scrollPage {
        padding: 50px;
    }


#section0:after {
    /*background-image: url('../assets/images/wall_black_01.jpg');*/
    top: 0;
    left: 0;
    position: absolute;
    background-size: cover;
    /*opacity: 0.9 !important;*/
    /*filter: alpha(opacity=50);*/
    z-index: -1;
    content: "";
    width: 100%;
    height: 100%;
    color: white;
}

#section1:after {
    /*background-image: url('../assets/images/wall_black_02.jpg');*/
    top: 0;
    left: 0;
    position: absolute;
    background-size: cover;
    /*opacity: 0.8 !important;*/
    /*filter: alpha(opacity=50);*/
    z-index: -1;
    content: "";
    width: 100%;
    height: 100%;
    
    color: white !important;
}

#section2:after {
    /*background: #0d72b9;*/
    top: 0;
    left: 0;
    position: absolute;
    background-size: cover;
    z-index: -1;
    content: "";
    width: 100%;
    height: 100%;
}
#section3:after {
    /*background: #0d72b9;*/
    top: 0;
    left: 0;
    position: absolute;
    background-size: cover;
    z-index: -1;
    content: "";
    width: 100%;
    height: 100%;
}
    #section4:after {
        /*background: #515151;*/
        top: 0;
        left: 0;
        position: absolute;
        background-size: cover;
        opacity: 0.1 !important;
        filter: alpha(opacity=50);
        z-index: -1;
        content: "";
        width: 100%;
        height: 100%;
    }

    /*#section2:after {
    background-image: url('../assets/images/main-bg-section2.jpg');
    top: 0;
    left: 0;
    position: absolute;
    background-size: cover;
    opacity: 0.4 !important;
    filter: alpha(opacity=50);
    z-index: -1;
    content: "";
    width: 100%;
    height: 100%;
}*/

    /*#section3:after {
    background-image: url('../assets/images/main-bg-section3.jpg');
    background: #0e5ea9;
    top: 0;
    left: 0;
    position: absolute;
    background-size: cover;
    opacity: 0.3 !important;
    filter: alpha(opacity=50);
    z-index: -1;
    content: "";
    width: 100%;
    height: 100%;
}*/
    .slide a {
        margin-top: 30px;
    }
    .section .card-body {
        min-height: 5em;
    }

    #section7 .card-body {
        min-height: 8em;
    }

    .scrolldown {
        position: absolute;
        bottom: 15px;
        left: 50%;
        height: 50px;
        width: 50px;
        transform: translateY(-80px) translateX(-50%) rotate(45deg);
    }

        .scrolldown span {
            position: absolute;
            top: 0;
            left: 0;
            display: block;
            width: 100%;
            height: 100%;
            border-bottom: 2px solid #515151;
            border-right: 2px solid #515151;
            animation: animate 1.5s linear infinite;
            opacity: 0;
        }

            .scrolldown span:nth-child(1) {
                transform: translate(-15px, -15px);
                animation-delay: -0.4s;
            }

            .scrolldown span:nth-child(2) {
                transform: translate(0, 0);
                animation-delay: -0.2s;
            }

            .scrolldown span:nth-child(3) {
                transform: translate(15px, 15px);
                animation-delay: 0s;
            }

    @keyframes animate {
        0% {
            top: -5px;
            left: -5px;
            opacity: 0;
        }

        25% {
            top: 0px;
            left: 0px;
            opacity: 1;
        }

        100% {
            top: 5px;
            left: 5px;
            opacity: 0;
        }
    }

    /*#menu li {
    display:inline-block;
    margin: 10px;
    color: #000;
    background:#fff;
    background: rgba(255,255,255, 0.5);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
#menu li.active{
    background:#666;
    background: rgba(0,0,0, 0.5);
    color: #fff;
}
#menu li a{
    text-decoration:none;
    color: #000;
}
#menu li.active a:hover{
    color: #000;
}
#menu li:hover{
    background: #aaaaaa;
}
#menu li a,
#menu li.active a{
    padding: 9px 18px;
    display:block;
}
#menu li.active a{
    color: #fff;
}
#menu{
    position:fixed;
    top:70px;
    left:0;
    height: 40px;
    z-index: 70;
    width: 100%;
    padding: 0;
    margin:0;
}*/

    .btn-group.special {
        display: flex;
    }

    .special .btn {
        flex: 1
    }

    .dataTables_filter input {
        width: 300px !important;
    }

    /*.navbar-nav .nav-item:not(:last-child) {
    border-right: 2px solid silver;
}*/

@media (max-width: 400px) {
    .section h1 {
        font-size: 2em !important;
    }
    .section h5 {
        font-size: 1.0em !important;
    }
}

    .dataTables_wrapper .btn-secondary {
        background: dodgerblue !important;
        color: #fff;
    }

        .dataTables_wrapper .btn-secondary:hover {
            opacity: 0.8;
        }


    .navi_box01 {
        width: 100px;
        position: fixed;
        right: 0;
        top: 20%;
        line-height: 100px;
        z-index: 20;
    }

        .navi_box01 > div > div > .btn {
            border: none;
            background: #0d72b9;
            color: #ffffff;
            margin: 1px 0;
            text-align: center;
            line-height: 24px;
        }

        .navi_box01 .btn:hover {
            border: none;
            background: #1ea293;
            color: #ffffff;
        }

        .navi_box01 .btn i {
            display: block;
            margin: 0 auto;
            margin-top: 5px;
            font-size: 1.4em;
        }


    /* loding */
    #loading {
        display: none;
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgba(255,255,255,0.8);
        z-index: 1000;
    }

    #loadingcontent {
        display: table;
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    }

    #loadingspinner {
        display: table-cell;
        vertical-align: middle;
        width: 100%;
        text-align: center;
        font-size: larger;
        padding-top: 80px;
    }

    .right-bottom-fixed {
        position: fixed; /* Safari & IE */
        right: 10px;
        bottom: 10px;
        z-index: 100;
    }

    .right-top-fixed {
        position: fixed; /* Safari & IE */
        right: 0;
        top: 94px;
        z-index: 100;
    }

        .right-top-fixed > input {
            color: white;
            border: 0;
            height: 50px;
            border-bottom-left-radius: 10px;
        }

    .run-button {
        padding: 20px !important;
        border-radius: 0 0 0 5px;
        font-size: 1.5em;
        color: white;
        vertical-align: middle;
    }

    .bg-finecare {
        background: dodgerblue;
        color: white;
    }

    .run-button:hover {
        color: white !important;
    }

    .bg-finecare-genie {
        background: mediumpurple;
        color: white;
    }

    .bg-finecare-cms {
        background: cadetblue;
        color: white;
    }

    .run-button .octicon {
        width: 25px;
        height: 25px;
    }

    .price-card-body {
        height: 400px;
    }

    .spinner {
        border: 16px solid silver;
        border-top: 16px solid #337AB7;
        border-radius: 50%;
        width: 80px;
        height: 80px;
        animation: spin 700ms linear infinite;
        top: 40%;
        left: 55%;
        position: absolute;
    }

    .custom-shape-divider-bottom-1634787096 {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        overflow: hidden;
        line-height: 0;
        transform: rotate(180deg);
    }

        .custom-shape-divider-bottom-1634787096 svg {
            position: relative;
            display: block;
            width: calc(195% + 1.3px);
            height: 189px;
            transform: rotateY(180deg);
        }

        .custom-shape-divider-bottom-1634787096 .shape-fill {
            fill: #9EB1C5;
        }

.board-header-background {
    padding: 40px 0;
    text-align: center;
    border-bottom: 1px solid gray;
    /*background: -moz-linear-gradient(81deg, rgba(23,129,255,1) 15%, rgba(54,48,190,1) 50%, rgba(15,146,172,1) 90%);
    background: -webkit-linear-gradient(81deg, rgba(23,129,255,1) 15%, rgba(54,48,190,1) 50%, rgba(15,146,172,1) 90%);*/
    background: linear-gradient(.25turn, #b6b6b6, 15%, #fafafa, 85%, #b6b6b6);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1781ff",endColorstr="#0f92ac",GradientType=1);
}

.board-header-background h1{
    font-weight: bold;
}

    .genie-background:after {
        background-image: url('../assets/images/products/genie_back1.jpg');
        top: 0;
        left: 0;
        position: absolute;
        background-size: cover;
        opacity: 0.2;
        filter: alpha(opacity=50);
        z-index: -1;
        content: "";
        width: 100%;
        height: 100%;
        max-width: 100%;
    }

.number-only {
    /**/

}

.v-line {
    border-left: thick solid plum;
    height: 30px;
    display: inline-block;
}