﻿

.job-heading-container {
    margin-top:50px;
    width:100%;
}

.job-info-flex {
    display:flex;
    justify-content: space-around;
}

.job-info-col1 {
    text-align:right;
    width: 49%;
    margin-left:auto;
    margin-right:5px;
}

.job-info-col2 {
    text-align:left;
    width:49%;
    margin-right: auto;
    margin-left:5px;
}

.job-heading-title {
    font-size:28px;
    color:black;
}

.job-heading-subtitle {
    font-size:20px;
    color:black;
}

.job-description-container {
    margin-top:30px;
}

.job-description-font
{
    font-size: 16px;   
    color: black;
}

.job-description-font::first-letter {
    display:block;
    font-size:50px;
    initial-letter:2;
    line-height: 30px;
}

.job-description-first-letter {
    font-size:35px;
    line-height:30px;
    font-weight:bold;
    color:black;
}

.project-images-container
{
    margin-top: 70px;
    font-family: 'Caladea';
}

.job-images-flex {
    margin-top: 75px;
    display:flex;
    justify-content:space-around;
}

.project-images-image {
    display:block;
    width:99%;
    max-width:300px;
    max-height:300px;
    margin-left:auto;
    margin-right:auto;
}

.project-images {
    width:100%;   
    z-index:1;
}
.project-images:hover {
    cursor:pointer;
    z-index:5;
}

.project-image-title {
    margin-top:10px;
    font-size:16px;
    text-align:center;
}

#theaterLights {
    display:none;
    position:fixed;
    width:100%;
    height:100%;
    top:0;
    left:0;
    z-index:15;
    background-color:black;
    opacity:.8;    
}

.original-job-image
{
    display:none;
    position: fixed;
    padding:.8em;
    width: 65%;
    height: auto;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: whitesmoke;
    z-index: 50;
}
.job-image-top {

    height:30px;
}

.right-modal-exit {
    width:20px;
    font-family:'Roboto';
    font-weight:bold;
    color:black;
    font-size:1em;
    margin-left:auto;
    padding:5px;
    margin-right:20px;
}

.right-modal-exit:hover {
    background-color: maroon;
    color:white;
    cursor:pointer;
}

.image-loader {
    display:block;
    width:10%;
    max-width:50px;
    position: absolute;
    left:50%;
    top:50%;
    z-index: 70;

}
#imageLoading {
    display:block;
    width:100%;
}

.job-image-inner-container
{
    width: 95%;
    margin-left: auto;
    margin-right: auto;
    height: 90%; 
    margin-top: 25px;
    overflow: auto;
}
.inner-job-image {
    z-index:75;
    width:100%;
    height:auto;
}

#bigImage {   
    display:none;
}