.pop-form {
   display: none;
   position: fixed;
   z-index: 1200;
   padding-top: 100px;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   overflow: auto;
   background-color: rgb(0,0,0);
   background-color: rgba(0,0,0,0.3);
}

.pop-form .pop-content {
   position: relative;
   background-color: #FAFAFA;
   padding: 0;
   border: 1px solid #888;
   max-width: 1100px;
   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;

   left: 50%;
   transform: translateX(-50%);
}

.pop-form.error-form .pop-content {
   max-width: 650px;
}

.pop-form .pop-body {
   position: relative;
}

.pop-form .pop-body .pop-body-overlay {
   background: rgba(255,255,255,.6);

   position: absolute;
   bottom: 0;
   right: 0;
   left: 0;
   top: 0;

   display: none;
}

/* 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}
}

.pop-header {
   padding: 10px 15px;
   background-color:  rgb(0,0,0);
   color: #ffffff;
   cursor: move;
}

.pop-header h3 {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   margin: 5px 0;
   font-size: 16px;
}

.pop-header h3 a {
   cursor: pointer;
   color: #ffffff;
}

.pop-body {
   padding: 10px 15px;
}

.pop-footer {
   padding: 10px 15px;
   color: white;
}

.pop-form .form-errors {
   margin-bottom: 10px;
}

.pop-form .table th, .pop-form .table td {
   padding: 6px 8px;
}

.pop-form .table .checkbox, .pop-form .table .span {
   margin: 0;
}

.pop-form .button, .pop-form .a-button {
   font-size: inherit;
   cursor: pointer;
   border: none;
   position: relative;
}

.pop-form .button {
   background-color:  rgb(0,0,0);
   color: #FFFFFF;
   display: inline-block;
   text-decoration: none;
   text-align: center;
   transition: background 0.3s;
   padding: 8px 25px;
}

.pop-form .a-button {
   padding: 8px 20px;
}

.pop-form .button .loading-icon, .pop-form .a-button .loading-icon {
   position: absolute;
   left: 5px;
   top: 35%;
   display: none;
}

.pop-form .a-button {
   background: none;
   color: #8e8e8e;
   text-decoration: none;
}

.pop-form textarea {
   resize: vertical;
}

#overlay_loader {
   position: fixed;
   z-index: 1200;
   left: 0;
   top: 0;
   padding-top: 100px;
   width: 100%;
   height: 100%;
   overflow: auto;
   background-color: rgb(0,0,0);
   background-color: rgba(0,0,0,0.4);
}

#overlay_loader div.loading-container {
   margin: 0 auto;
   min-width: 0;
   width: auto;
   max-width: 350px;
   background-color: #fefefe;
   border: 1px solid #888;
   box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
}

#overlay_loader div.loading-header {
   padding: 10px 15px;
   background-color:  rgb(0,0,0);
   height: 30px;
}

#overlay_loader div.loading-content {
   color: #333333;
   padding: 25px 15px 15px 15px;
   text-align: center;
}

#overlay_loader div .fa {
   font-size: 28px;
}

#colorpicker_popform .colorpicker-panel {
   margin-left:-550px;
}