.overlay {
    background-color: rgba(0, 0, 0, 0.6);
    bottom: 0;
    cursor: default;
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 1;

    -webkit-transition: opacity .5s;
    -moz-transition: opacity .5s;
    -ms-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
}

.overlay:target {
    visibility: visible;
    opacity: 1;
    z-index: 9999;
}
.popup {
    left: 50%;
    position: fixed;
    text-align: center;
    top: 40%;
    visibility: hidden;
    z-index: 10;
    background-color: #AC0000;
    width: 30%;
    font-family: Avenir-Light;

    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);

    -webkit-transition: opacity .5s, top .5s;
    -moz-transition: opacity .5s, top .5s;
    -ms-transition: opacity .5s, top .5s;
    -o-transition: opacity .5s, top .5s;
    transition: opacity .5s, top .5s;
}


.title{
    margin-left: 9%;
    margin-right: 9%;
    margin-left: 10%;
    margin-right: 10%;
    margin-top: 10%;
    margin-bottom: 10%;
}

h2{
    color: white;
    font-size: 130%;
}

.complete{
    background-color: #EFEFEF !important;
    padding: 18% 0 ;
}

h3{
    color: rgba(74,76,74,0.9);
    font-size: 110%;
    margin-bottom: 3%;
}
#documentNumber{
    padding-bottom: 2%;
    padding-top: 2%;
    padding-right: 2%;
    padding-left: 2%;
    border-top-width: 0px;
    border-right-width: 0px;
    border-left-width: 0px;
    border-bottom-width: 0px;
    text-align: center;
    color: grey;
    opacity: 0.6;
    width: 80%;
    height: 10%;
}
.overlay:target+.popup {
    top: 50%;
    opacity: 1;
    visibility: visible;
    z-index: 999999;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {.popup {width: 35%;}}

@media only screen and (max-width: 425px) {.popup {width: 100%;}}

@media only screen and (min-width: 426px) and (max-width: 767px) {.popup {width: 60%;}}