﻿body {
    background-color: #1d1d1d;
}

.zoom {
    display: block;
    transition: transform .8s;
    margin: 0 auto;
    vertical-align: middle;
}

    .zoom:hover {
        transform: scale(10);
        transform-origin: 50% 50%;
    }

.roundme {
    border-radius: 4px;
}

.stylybutton {
    border-radius: 4px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 12px;
    width: 200px;
}

.imgframe {
    height: 322px;
    width: 200px;
    border-radius: 7px;
    border: 1px solid #d1d1d1;
}

.imgframe-small {
    height: 125px;
    width: 125px;
    border-radius: 7px;
    border: 1px solid #d1d1d1;
}

.verticalgroup button {
    background-color: #4CAF50; /* Green background */
    border: 1px solid green; /* Green border */
    color: white; /* White text */
    padding: 10px 24px; /* Some padding */
    cursor: pointer; /* Pointer/hand icon */
    width: 50%; /* Set a width if needed */
    display: block; /* Make the buttons appear below each other */
    vertical-align: middle;
}

.padbottombtn {
    margin-bottom: 5px;
}

.verticalgroup button:not(:last-child) {
    border-bottom: none; /* Prevent double borders */
}

/* Add a background color on hover */
.verticalgroup button:hover {
    background-color: #3e8e41;
}

.cardglow {
    width: 322px;
    height: 515px;
    margin-bottom: 28px;
    box-shadow: 0 0px 14px #fff;
}

.cardglow-wide {
    width: 670px;
    height: 1050px;
    margin-bottom: 28px;
    box-shadow: 0 0px 14px #fff;
}

.cardglow-short {
    width: 670px;
    padding: 3px;
    margin-bottom: 28px;
    box-shadow: 0 0px 14px #fff;
}

.breathing-button {
    -webkit-animation: breathing 1.2s ease-out infinite normal;
    animation: breathing 1.2s ease-out infinite normal;
    -webkit-font-smoothing: antialiased;
    text-align: center;
}

h3 {
    font-family: Raleway-Light;
}

* {
    box-sizing: border-box;
}

.img-magnifier-container {
    position: relative;
}

.img-magnifier-glass {
    position: absolute;
    border: 3px solid #000;
    border-radius: 50%;
    cursor: none;
    /*Set the size of the magnifier glass:*/
    width: 170px;
    height: 170px;
}

@-webkit-keyframes breathing {
    100% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
    }

    66% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    0% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
    }
}

@keyframes breathing {
    100% {
        -webkit-transform: scale(0.9);
        -ms-transform: scale(0.9);
        transform: scale(0.9);
    }

    66% {
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }

    0% {
        -webkit-transform: scale(0.9);
        -ms-transform: scale(0.9);
        transform: scale(0.9);
    }
}

@font-face {
    font-family: "Raleway-Light";
    src: url(Content/fonts/Raleway-Light.ttf) format('truetype')
}

@font-face {
    font-family: "Raleway-Thin";
    src: url(Content/fonts/Raleway-Thin.ttf) format('truetype')
}
