* { margin:0;padding:0;font-family:"Montserrat";font-optical-sizing:auto;transition:0.5s ease all; user-select:none;}

/*
* #fefae0
* #606c38
* #283618
* #dda15e
* #bc6c25
*
* #98971a
* #cc241d
*/

html, body, .main{
    width: 100vw;
    height: 100vh;
}

.central-block {
    margin: 8rem auto 0 auto;
    border-radius:0.3rem;
    box-shadow: 0 0 0.5rem #35353577;
    padding:2.5rem;
    min-width: 40rem;
    width: fit-content;
}
.central-block:hover {background-color:#ededed;box-shadow:#fefae0;}

.text-center {text-align:center;}
.text-center h1 {
    color:#606c38;
    font-weight:300;
}
p.description {font-weight:200;color:#283618;}

.hidden {display:none;}

.upload-inner {width:fit-content;margin:auto;}
.upload-inner svg {width:15rem;height:auto;margin:1rem;}

li svg { max-width:1rem;max-height:1rem;width:auto;}

path.outline {stroke:#ccc;stroke-width:1px}
.central-block:hover path.outline {stroke:#dda15e;}

p.small {text-align:center;font-size:0.6rem;color:#e3e5e7;}
span.semibold {font-weight:700;}
.central-block:hover p.small {color:#dda15e;}

.results {
    width: 32rem;
    padding: 0.5rem;
    margin:3rem auto;
    border-radius: 0.3rem;
    box-shadow: 0 0 0.5rem #35353577;
}

.result-icon {
    max-width:1rem;
    margin-right:2rem;
}

ul {list-style-type:none;}
li {margin:0.3rem;font-size:0.8rem;line-height:1rem;}

.red { color:#cc241d;}
.green { color:#606c38;}
.yellow {color:#fabd2f;}
#report-result {text-align:center;font-weight:300;}


.help-guidelines {color:#bc6c25;font-weight:400;text-align:center;font-size:0.7rem;margin-top:2rem;}
.help-guidelines a {color:#dda15e;font-weight:600;}
.help-guidelines a:hover {color:#606c38;font-weight:600;font-style:italic;}


.footer {position:fixed;bottom:0;background-color:#353535;padding:0.2rem;height:fit-content;width:100%;box-shadow:0 0 0.3rem #353535aa;}
.copyright {font-size:0.7rem;color:#fefae0;text-align:center;}

.preview-header {text-align:center;font-weight:100;}
#ad-preview-container {
    margin:3rem auto;
    overflow: hidden;
}
#ad-preview-container iframe {border:none;outline:none;box-shadow:0 0 0.7rem #35353577;margin:0 auto 5rem auto;display:block;}


body {
    background-image: url('hhholographic.webp');
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    background-attachment:fixed;
}

.central-block, #results-container {
    background-color: #fff;
}
.central-block:hover, #results-container:hover {
    background-color:#fefae0;
}