/* The Modal (background) */



.modal {

    display: block;

    position: fixed; /* Stay in place */

    z-index: 9999999; /* Sit on top */

    padding-top: 100px; /* Location of the box */

    left: 0;

    top: 0;

    width: 100%; /* Full width */

    height: 100%; /* Full height */

    overflow: auto; /* Enable scroll if needed */

    background-color: rgb(0,0,0); /* Fallback color */

    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */

}



/* Modal Content */



.modal-content {

    position: relative;

    background-color: #fefefe;

    margin: auto;

    padding: 0;

    border: 1px solid #888;

	width: fit-content;

    max-width: 80%;

    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);

    -webkit-animation-name: animatetop;

    -webkit-animation-duration: 0.4s;

    animation-name: animatetop;

    animation-duration: 0.4s

}



/* Add Animation */



@-webkit-keyframes animatetop {

    from {top:-300px; opacity:0} 

    to {top:0; opacity:1}

}





@keyframes animatetop {



    from {top:-300px; opacity:0}

    to {top:0; opacity:1}

}





/* The Close Button */

.closeModal {

    color: white;

    float: right;

    font-size: 28px;

    font-weight: bold;

}







.closeModal:hover, .closeModal:focus {

    color: #000;

    text-decoration: none;

    cursor: pointer;

}



.modalHeader {

	font-family: Arial, Verdana;

    padding: 1em;

    background-color: #005aab;

    color: white;

	text-transform: uppercase;

	font-size: initial;

}



.modalBody {

    padding: 1em 1em 75px 1em;

    font-family: Arial, Verdana;

    font-size: 16pt;

    text-transform: uppercase;

    background: url('vjd_logo.png');

    background-position: 98% 98%;

    background-repeat: no-repeat;



    }





.modal-footer {



	font-family: Arial, Verdana;

    padding: 2px 16px;

    background-color: #005aab;

    color: white;



}