/* Main application style sheet */
/* Copyright (c) 2017-2023 Six Kin Development Pte. Ltd. */

/* 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. */


:root
{
    --main-header-height: 100px;
}

/*Fonts*/
/*@import url("https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,200");*/
/*Use local custom fonts*/
@font-face
{
    font-family: 'Yanone Kaffeesatz';
    src: url("css_fonts/YanoneKaffeesatz-Light.ttf");
    font-style: normal;
    font-weight: 300;
}

@font-face
{
    font-family: 'Yanone Kaffeesatz';
    src: url("css_fonts/YanoneKaffeesatz-Regular.ttf");
    font-style: normal;
    font-weight: 400;
}

@font-face
{
    font-family: 'Yanone Kaffeesatz';
    src: url("css_fonts/YanoneKaffeesatz-Bold.ttf");
    font-weight: bold;
}


/* Basic styles */

body
{
    background: #D4D9DD url("css_images/body_bg.jpg");
    color: #474f51;
    font-size: 12pt;
    font-family: 'Arial Nova', Arial;
    font-weight: 300;
    line-height: normal;    
}

input, textarea, select, html, h1, h2, h3, h4, h5, h6, p, blockquote, a
{
    color: #474f51;
    font-family: 'Arial Nova', Arial;
    font-weight: 300;
    line-height: normal;
}

p
{
    margin-top: 0px;
}

a
{
    text-decoration: underline;
}

    a:hover
    {
        text-decoration: none;
    }

h1, h2, h3, h4, h5, h6
{
    line-height: normal;
}

h2, h4, h6
{
    color: #96a9b5;
}
/******************** End basic styles ********************/


/* Header class - creates a bar for containing logo, menus, etc. */
.sk-header-large
{
    height: 100px;
    width: 100%;
    background: #3B4346 url("css_images/header_bg.jpg");
    border-bottom: solid 1px #272d30;
    box-shadow: inset 0px -1px 0px 0px #51575a;
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.75);
}

/* For positioning the logo that goes in the upper left corner of the header. */
.sk-logo-normal
{
    height: 95px;
}

/* Nav class - style for the navigation menu, large screens (tablet/desktop). */
.sk-nav-large
{
    position: absolute;
    top: 30px;
    left: 125px;
}

    .sk-nav-large a
    {
        text-decoration: none;
        color: #c6c8c8;
        font-family: 'Yanone Kaffeesatz';
        font-weight: 300;
        font-size: 1.5em;
    }

        .sk-nav-large a:hover
        {
            color: #f6f8f8;
        }

/* Header for small screen (phone). */
.sk-header-small
{
    height: 44px;
    width: 100%;
    background: url("css_images/header_bg.jpg");
    border-bottom: solid 1px #272d30;
    box-shadow: inset 0px -20px 70px 0px rgba(200, 220, 245, 0.1), inset 0px -1px 0px 0px rgba(255, 255, 255, 0.1), 0px 1px 7px 0px rgba(0, 0, 0, 0.6);
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.75);
}

/* Styles the mobile menu button. */
.sk-menu-btn
{
    position: absolute;
    top: 6px;
    left: 7px;
    width: 48px;
}

/* For positioning the logo in the mobile header. */
.sk-logo-mobile
{
    height: 30px;
    display: block;
    position: absolute;
    top: 7px;
    left: 0;
    right: 0;
    margin: 0 auto;
}

/* Title style for mobile (if no logo used) */
h1.sk-title-mobile
{
    color: #fff;
    display: block;
    text-align: center;
    line-height: 24px;
    font-size: 1.2em;
    font-weight: 400;
}

/* Nav class - style for the navigation menu, small screens (phone). */
.sk-nav-small
{
    background: url("css_images/header_bg.jpg");
    background-repeat: repeat;
    position: absolute;
    left: 0px;
    top: 44px;
    width: 220px;
    box-shadow: inset -1px 0px 0px 0px rgba(255, 255, 255, 0.25), inset -2px 0px 25px 0px rgba(0, 0, 0, 0.5);
    text-shadow: -1px -1px 1px black;
}

    .sk-nav-small a
    {
        text-decoration: none;
        color: #c6c8c8;
        font-family: 'Yanone Kaffeesatz';
        font-weight: 300;
        font-size: 1.2em;
        border-top: solid 1px #373d40 !important;
        border-bottom: solid 1px rgba(0, 0, 0, 0.4) !important;
    }

        .sk-nav-small a:hover
        {
            color: #f6f8f8;
        }

/* Main content area. */
.sk-content-area
{
    margin-top: 100px;
    background: #f7f7f7 url("css_images/content_bg.png");
}

/* Footer area. */
.sk-footer-area
{
    color: #546b76;
    text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.5);
    line-height: 22px;
    width: 100%;
    /*position: absolute;*/
    /*bottom: 0;*/
    /*height: 260px;*/
}

    .sk-footer-area a
    {
        font-family: 'Yanone Kaffeesatz';
        font-weight: 300;
        font-size: 14pt;
    }

    .sk-footer-area h3
    {
        font-family: 'Yanone Kaffeesatz';
        font-weight: 300;
        color: #212f35;
        margin-bottom: 0px;
    }

    .sk-footer-area p
    {
        font-family: 'Yanone Kaffeesatz';
        font-weight: 300;
        font-size: 14pt;
        margin-top: 6px;
        margin-bottom: 6px;
    }

/* Copyright notice. */
.sk-copyright
{
    border-top: solid 1px #b5bec3;
    box-shadow: inset 0px 1px 0px 0px #e0e4e7;
    text-align: center;
    color: #8d9ca3;
    text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.5);
    padding: 12px;
}

/*Formatted list of links*/
.sk-link-list
{
    list-style-type: none;
    margin-top: 6px;
    margin-bottom: 6px;
    padding-left: 0em;
}

/* Content column styles */
.sk-content-column
{
    background: #fff;
    margin-top: 16px;
    margin-bottom: 16px;
    padding: 16px;
}

/* Style overrides for small screens. */
@media (max-width:736px)
{
    .sk-content-area
    {
        margin-top: 44px;
        overflow-x: hidden;
    }

    .sk-footer-area
    {
        overflow-x: hidden;
    }
}

/* Main page photo slideshow */
.sk-main-slides
{
}

    .sk-main-slides img
    {
        max-height: 275px;
        max-width: 100%;
        margin: 0 auto;
        display: none;
    }

/* Featured items area */
.sk-feature-area
{
    background: #353D40 url("css_images/features_bg.jpg");
    border-bottom: solid 1px #272e31;
    padding: 45px 0 45px 0;
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.75);
}

    .sk-feature-area p
    {
        color: #a0a8ab;
    }

    .sk-feature-area h3
    {
        font-size: 1.25em;
        color: #fff;
        font-weight: 300;
        margin: 0 0 0.25em 0;
    }

    .sk-feature-area a
    {
        color: #e0e8eb;
    }

    .sk-feature-area b
    {
        color: #fff;
    }

    .sk-feature-area img
    {
        display: block;
        max-width: 100%;
        padding: 10px;
        box-shadow: 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
        margin: 0 auto;
        margin-bottom: 1.5em;
        outline: 0;
        background: #fff url("css_images/content_bg.png");
    }

/*Large red button*/
.sk-button-large
{
    background-image: -moz-linear-gradient(top, #ed391b, #ce1a00);
    background-image: -webkit-linear-gradient(top, #ed391b, #ce1a00);
    background-image: linear-gradient(top, #ed391b, #ce1a00);
    display: inline-block;
    background-color: #ed391b;
    color: #fff;
    text-decoration: none;
    font-family: 'Yanone Kaffeesatz';
    font-size: 1.75em;
    font-weight: 300;
    padding: 15px 40px 15px 40px;
    outline: 0;
    border-radius: 10px;
    box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(255, 192, 192, 0.5), inset 0px 0px 0px 2px rgba(255, 96, 96, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.5);
}

    .sk-button-large:hover
    {
        background-image: -moz-linear-gradient(top, #fd492b, #de2a10);
        background-image: -webkit-linear-gradient(top, #fd492b, #de2a10);
        background-image: linear-gradient(top, #fd492b, #de2a10);
        background-color: #fd492b;
        box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(255, 192, 192, 0.5), inset 0px 0px 0px 2px rgba(255, 96, 96, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
    }

    .sk-button-large:active
    {
        background-image: -moz-linear-gradient(top, #ce1a00, #ed391b);
        background-image: -webkit-linear-gradient(top, #ce1a00, #ed391b);
        background-image: linear-gradient(top, #ce1a00, #ed391b);
        background-color: #ce1a00;
        box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(255, 192, 192, 0.5), inset 0px 0px 0px 2px rgba(255, 96, 96, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
    }

/*Medium red button*/
.sk-button-medium
{
    background-image: -moz-linear-gradient(top, #ed391b, #ce1a00);
    background-image: -webkit-linear-gradient(top, #ed391b, #ce1a00);
    background-image: linear-gradient(top, #ed391b, #ce1a00);
    display: inline-block;
    background-color: #ed391b;
    color: #fff;
    text-decoration: none;
    font-family: 'Yanone Kaffeesatz';
    font-size: 1.35em;
    font-weight: 300;
    padding: 10px 25px 10px 25px;
    outline: 0;
    border-radius: 10px;
    box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(255, 192, 192, 0.5), inset 0px 0px 0px 2px rgba(255, 96, 96, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.5);
}

    .sk-button-medium:hover
    {
        background-image: -moz-linear-gradient(top, #fd492b, #de2a10);
        background-image: -webkit-linear-gradient(top, #fd492b, #de2a10);
        background-image: linear-gradient(top, #fd492b, #de2a10);
        background-color: #fd492b;
        box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(255, 192, 192, 0.5), inset 0px 0px 0px 2px rgba(255, 96, 96, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
    }

    .sk-button-medium:active
    {
        background-image: -moz-linear-gradient(top, #ce1a00, #ed391b);
        background-image: -webkit-linear-gradient(top, #ce1a00, #ed391b);
        background-image: linear-gradient(top, #ce1a00, #ed391b);
        background-color: #ce1a00;
        box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(255, 192, 192, 0.5), inset 0px 0px 0px 2px rgba(255, 96, 96, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
    }

/*Small red button*/
.sk-button-small
{
    background-image: -moz-linear-gradient(top, #ed391b, #ce1a00);
    background-image: -webkit-linear-gradient(top, #ed391b, #ce1a00);
    background-image: linear-gradient(top, #ed391b, #ce1a00);
    display: inline-block;
    background-color: #ed391b;
    color: #fff;
    text-decoration: none;
    font-family: 'Yanone Kaffeesatz';
    font-size: .8em;
    font-weight: 200;
    padding: 3px 13px 3px 13px;
    outline: 0;
    border-radius: 10px;
    box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(255, 192, 192, 0.5), inset 0px 0px 0px 2px rgba(255, 96, 96, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.5);
}

    .sk-button-small:hover
    {
        background-image: -moz-linear-gradient(top, #fd492b, #de2a10);
        background-image: -webkit-linear-gradient(top, #fd492b, #de2a10);
        background-image: linear-gradient(top, #fd492b, #de2a10);
        background-color: #fd492b;
        box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(255, 192, 192, 0.5), inset 0px 0px 0px 2px rgba(255, 96, 96, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
    }

    .sk-button-small:active
    {
        background-image: -moz-linear-gradient(top, #ce1a00, #ed391b);
        background-image: -webkit-linear-gradient(top, #ce1a00, #ed391b);
        background-image: linear-gradient(top, #ce1a00, #ed391b);
        background-color: #ce1a00;
        box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.75), inset 0px 2px 0px 0px rgba(255, 192, 192, 0.5), inset 0px 0px 0px 2px rgba(255, 96, 96, 0.85), 3px 3px 3px 1px rgba(0, 0, 0, 0.15);
    }

.sk-quote-list li
{
    padding: 1em 0 1em 0;
    overflow: hidden;
}

    .sk-quote-list li:first-child
    {
        padding-top: 0 !important;
        border-top: 0 !important;
    }

    .sk-quote-list li:last-child
    {
        padding-bottom: 0 !important;
        border-bottom: 0 !important;
    }

    .sk-quote-list li img
    {
        float: left;
    }

    .sk-quote-list li p
    {
        margin: 0 0 0 90px;
        font-size: 1.2em;
        font-style: italic;
    }

    .sk-quote-list li span
    {
        display: block;
        margin-left: 90px;
        font-size: 0.9em;
        font-weight: 400;
    }

.sk-check-list
{
    list-style-type: none;
    padding: 0;
    margin: 0
}

    .sk-check-list li
    {
        padding: 0.7em 0 0.7em 45px;
        font-size: 18px;
        background: url("css_images/icon_checkmark.png") 0px .75em no-repeat;
        border-bottom: 1px solid #ddd
    }

        .sk-check-list li:first-child
        {
            padding-top: 0 !important;
            border-top: 0 !important;
            background-position: 0 0.3em;
        }

        .sk-check-list li:last-child
        {
            padding-bottom: 0 !important;
            border-bottom: 0 !important;
        }

.sk-tooltip
{
    position: relative;
    display: inline-block;
}

    .sk-tooltip .sk-tooltiptext
    {
        visibility: hidden;
        width: 60px;
        background-color: gray;
        color: #fff;
        text-align: center;
        border-radius: 6px;
        padding: 5px 0;
        position: absolute;
        z-index: 1;
        bottom: 125%;
        left: 50%;
        margin-left: -30px;
        opacity: 0;
        transition: opacity 1s;
        font-size: 12px;
    }

        .sk-tooltip .sk-tooltiptext::after
        {
            content: "";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #555 transparent transparent transparent;
        }

    .sk-tooltip:hover .sk-tooltiptext
    {
        visibility: visible;
        opacity: 1;
    }

.sk-image-center
{
    max-width: 98%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    height: auto;
}

/*Caption text for images & figures*/
.sk-caption
{
    text-align: center;
    margin-top: 5px;
    font-size: 10pt;
}

/*A black bar with white text that fills its container horizontally*/
.sk-black-bar
{
    font-size: 18px;
    font-weight: bold;
    line-height: 32px;
    text-align: center;
    margin: 10px 0;
    color: #fff !important;
    background-color: #000 !important
}