﻿@font-face {
    font-family: 'Dry-Brush';
    src: url('/fonts/dry-brush/Dry-Brush.ttf.woff') format('woff'), url('/fonts/dry-brush/Dry-Brush.ttf.svg#Dry-Brush') format('svg'), url('/fonts/dry-brush/Dry-Brush.ttf.eot'), url('/fonts/dry-brush/Dry-Brush.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}

html, body {
    padding: 0px;
    margin: 0px;
    background-color: #fff;
    width: 100%;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
}

html {
    min-height: 100%;
    min-width: 100%;
    width: 100%;
    position: relative;
}


body {
    font-family: 'Montserrat', sans-serif;
    overflow-x: hidden;
}


a {
    text-decoration: none;
}

button {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
}


#menu-panel {
    display: block;
    text-align: center;
    padding: 0px;
    margin: 0px;
}



    #menu-panel .logo-circle {
        background-image: url('/images/logo.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        border-radius: 50%;
        display: inline-block;
    }



    #menu-panel nav ul {
        margin: 0vw;
        padding: 0vw;
    }

    #menu-panel nav li {
        width: 100%;
        text-align: center;
    }


        #menu-panel nav li.active a {
            font-weight: bold;
            color: #3690ae;
        }

    #menu-panel nav a {
        text-decoration: none;
        color: #45add0;
    }




.product-panel {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: inline-block;
    color: #fff;
    float: left;
}



    .product-panel .overlay {
        opacity: 0;
        background: linear-gradient(to bottom, rgba(69, 125, 125, 0.6) 30%, rgba(69, 125, 125, 0.2) 90%);
        width: 100%;
        height: 100%;
        display: inline-block;
        box-shadow: inset 0px 0px 6vw rgba(0, 0, 0, 0.4);
    }

    .product-panel:hover .overlay {
        opacity: 1;
    }


    .product-panel a {
        color: #fff;
    }


    .product-panel * {
        transition: all 0.3s ease-in-out;
    }




    .product-panel .title {
        width: 80%;
        font-family: 'Dry-Brush';
        font-weight: 100;
        display: inline-block;
    }


    .product-panel .location {
        text-transform: uppercase;
    }

    .product-panel .time {
        font-weight: 200;
        text-transform: uppercase;
    }



    .product-panel .text-container {
        margin-top: 30%;
        margin-left: 10%;
    }



.side-panel {
    display: inline-block;
}

    .side-panel h1 {
        font-weight: 400;
    }

    .side-panel p {
        color: #888;
    }



.main-panel {
    background: linear-gradient(to bottom, #0f1011 50%, #2b2d2e 100%);
    display: inline-block;
    text-align: center;
    min-height: 100%;
}

.picture-panel {
    background-color: transparent;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    height: 95%;
    display: inline-block;
    float: left;
    max-width: 100%;
    min-height: 100%;
    margin-left: auto;
    margin-right: auto;
}

.side-panel .data th {
    font-weight: 600;
    text-align: left;
}

.embed-container {
    padding-bottom: 56.25%; /* 16:9 */
    text-align: center;
}

.picture-navigation {
    text-align: center;
}

.picture-navigation-button {
    color: #000;
    font-size: 1.2vw;
    margin-left: 2vw;
    margin-right: 2vw;
    font-weight: bold;
}

    .picture-navigation-button.disabled {
        color: #d0d0d0;
    }

.picture-navigation .position {
    font-size: 0.7vw;
    color: #3690ae;
}


button {
    background-color: #91c7d9;
    border: 0;
    color: #fff;
    padding: 10px;
    border-radius: 5px;
}

input[type="text"] {
    background-color: #f0f0f0;
}

.swal2-popup .swal2-title {
    font-size: 1.2vw;
}


.swal2-popup button {
    margin-left: 1vw;
    margin-right: 1vw;
}

table.data {
    display: inline-block;
    margin-right: 4vw;
    vertical-align: top
}


input, textarea {
    border: 0px;
    background-color: #f2f2f2;
    height: 2vw;
    width: 20vw;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8vw;
    padding: 1vw;
    border-radius: 5px;
}