/* common.css */

/* Padding (Bootstrap v4 to v5 change: pl- to ps-, pr- to pe-) */
.pl-0 { padding-left: 0 !important; }
.pl-1 { padding-left: .25rem !important; }
.pl-2 { padding-left: .5rem !important; }
.pl-3 { padding-left: 1rem !important; }
.pl-4 { padding-left: 1.5rem !important; }
.pl-5 { padding-left: 3rem !important; }

.pr-0 { padding-right: 0 !important; }
.pr-1 { padding-right: .25rem !important; }
.pr-2 { padding-right: .5rem !important; }
.pr-3 { padding-right: 1rem !important; }
.pr-4 { padding-right: 1.5rem !important; }
.pr-5 { padding-right: 3rem !important; }

/* Margin (Bootstrap v4 to v5 change: mr- to me-, ml- to ms-) */
.ml-0 { margin-left: 0 !important; }
.ml-1 { margin-left: .25rem !important; }
.ml-2 { margin-left: .5rem !important; }
.ml-3 { margin-left: 1rem !important; }
.ml-4 { margin-left: 1.5rem !important; }
.ml-5 { margin-left: 3rem !important; }
.ml-auto { margin-left: auto !important; }

.mr-0 { margin-right: 0 !important; }
.mr-1 { margin-right: .25rem !important; }
.mr-2 { margin-right: .5rem !important; }
.mr-3 { margin-right: 1rem !important; }
.mr-4 { margin-right: 1.5rem !important; }
.mr-5 { margin-right: 3rem !important; }
.mr-auto { margin-right: auto !important; }

/* Float Classes (Bootstrap v4 to v5 change: float-left to float-start, float-right to float-end) */
.float-left { float: left !important; }
.float-right { float: right !important; }
.float-none { float: none !important; }

/* Clearfix Class (Bootstrap v4 to v5 change: clearfix remains the same) */
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

/* Text Alignment (Bootstrap v4 to v5 change: text-left, text-right) */
.text-left { text-align: left !important; }
.text-right { text-align: right !important; }
.text-center { text-align: center !important; }

/* Positioning (Bootstrap v4 to v5 change: position-left and position-right to position-start and position-end) */
.position-left { left: 0 !important; }
.position-right { right: 0 !important; }

/* Sizing (Bootstrap v4 to v5 change: w-auto-left and w-auto-right) */
.w-auto-left { width: auto !important; }
.w-auto-right { width: auto !important; }

/* Alignment classes (for horizontal alignment in flexbox) */
.align-left { justify-content: flex-start !important; }
.align-right { justify-content: flex-end !important; }

/* Margin classes for start and end (Bootstrap v5 uses ms- and me-) */
.ml-md-0 { margin-left: 0 !important; }
.ml-md-1 { margin-left: .25rem !important; }
.ml-md-2 { margin-left: .5rem !important; }
.ml-md-3 { margin-left: 1rem !important; }
.ml-md-4 { margin-left: 1.5rem !important; }
.ml-md-5 { margin-left: 3rem !important; }

.mr-md-0 { margin-right: 0 !important; }
.mr-md-1 { margin-right: .25rem !important; }
.mr-md-2 { margin-right: .5rem !important; }
.mr-md-3 { margin-right: 1rem !important; }
.mr-md-4 { margin-right: 1.5rem !important; }
.mr-md-5 { margin-right: 3rem !important; }

/* Responsive Padding Classes (Bootstrap v4 to v5 change: pl-*, pr-*, ml-*, mr-*) */
.pl-sm-0 { padding-left: 0 !important; }
.pl-sm-1 { padding-left: .25rem !important; }
.pl-sm-2 { padding-left: .5rem !important; }
.pl-sm-3 { padding-left: 1rem !important; }
.pl-sm-4 { padding-left: 1.5rem !important; }
.pl-sm-5 { padding-left: 3rem !important; }

.pr-sm-0 { padding-right: 0 !important; }
.pr-sm-1 { padding-right: .25rem !important; }
.pr-sm-2 { padding-right: .5rem !important; }
.pr-sm-3 { padding-right: 1rem !important; }
.pr-sm-4 { padding-right: 1.5rem !important; }
.pr-sm-5 { padding-right: 3rem !important; }

.ml-sm-0 { margin-left: 0 !important; }
.ml-sm-1 { margin-left: .25rem !important; }
.ml-sm-2 { margin-left: .5rem !important; }
.ml-sm-3 { margin-left: 1rem !important; }
.ml-sm-4 { margin-left: 1.5rem !important; }
.ml-sm-5 { margin-left: 3rem !important; }

.mr-sm-0 { margin-right: 0 !important; }
.mr-sm-1 { margin-right: .25rem !important; }
.mr-sm-2 { margin-right: .5rem !important; }
.mr-sm-3 { margin-right: 1rem !important; }
.mr-sm-4 { margin-right: 1.5rem !important; }
.mr-sm-5 { margin-right: 3rem !important; }

/* Float Classes for Responsive (Bootstrap v4 to v5 change: float-left and float-right) */
.float-left-sm { float: left !important; }
.float-right-sm { float: right !important; }
.float-none-sm { float: none !important; }

.float-left-md { float: left !important; }
.float-right-md { float: right !important; }
.float-none-md { float: none !important; }

.float-left-lg { float: left !important; }
.float-right-lg { float: right !important; }
.float-none-lg { float: none !important; }
select.form-control{ appearance: auto !important; }



/* Postin relatives for bootstrap grids */
/* Bootstrap Grid Classes with position: relative */

/* Generic column class */
[class*="col-"] {
  position: relative;
}

@media (min-width: 1400px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1140px !important;
  }
}
@media (min-width: 768px) {
    .text-md-left {
        text-align: left !important;
    }
}

@media (min-width: 768px) {
    .text-md-right {
        text-align: right !important;
    }
}

a:not([href]):not([tabindex]) {
    color: inherit;
    text-decoration: none;
}

.form-group {
    margin-bottom: 1rem;
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}

@media (min-width: 768px) {
  .col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9 {
      float:left
  }
}

@media (min-width: 992px) {
  .col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9 {
      float:left;
  }
}

.fade:not(.visible) {
  opacity: 1
  ;
}

header {display: flex;}

.btn-block {
  width: 100%
}

a {
  text-decoration: none
}
@media (min-width: 768px) {
  .modal-dialog {
      width: 600px;
      margin: 30px auto;
  }
}
.close {
  float: right;
  font-size: 21px;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  filter: alpha(opacity=20);
  opacity: .2;
}

button.close {
  -webkit-appearance: none;
  padding: 0;
  cursor: pointer;
  background: 0 0;
  border: 0
}

p {
  font-family: "Verdana";
  font-weight: normal;
  color: black;
  margin-top: -5px;
}

H2 {
  font-family: "Verdana";
  font-weight: normal;
  font-size: 14pt !important;
  color: maroon;
}

.bg-gradient {
  background: #1b9f94 !important;
  background: linear-gradient(to right, #1b9f94 0, #316db3 100%) !important;
}
.btn-group-vertical>.btn-group:after, .btn-group-vertical>.btn-group:before, .btn-toolbar:after, .btn-toolbar:before, .clearfix:after, .clearfix:before, .container-fluid:after, .container-fluid:before, .container:after, .container:before, .dl-horizontal dd:after, .dl-horizontal dd:before, .form-horizontal .form-group:after, .form-horizontal .form-group:before, .modal-footer:after, .modal-footer:before, .modal-header:after, .modal-header:before, .nav:after, .nav:before, .navbar-collapse:after, .navbar-collapse:before, .navbar-header:after, .navbar-header:before, .navbar:after, .navbar:before, .pager:after, .pager:before, .panel-body:after, .panel-body:before, .row:after, .row:before {
  display: table;
  content: " ";
}.btn-group-vertical>.btn-group:after,.btn-group-vertical>.btn-group:before,.btn-toolbar:after,.btn-toolbar:before,.clearfix:after,.clearfix:before,.container-fluid:after,.container-fluid:before,.container:after,.container:before,.dl-horizontal dd:after,.dl-horizontal dd:before,.form-horizontal .form-group:after,.form-horizontal .form-group:before,.modal-footer:after,.modal-footer:before,.modal-header:after,.modal-header:before,.nav:after,.nav:before,.navbar-collapse:after,.navbar-collapse:before,.navbar-header:after,.navbar-header:before,.navbar:after,.navbar:before,.pager:after,.pager:before,.panel-body:after,.panel-body:before,.row:after,.row:before {
  display: table;
  content: " "
}

.btn-group-vertical>.btn-group:after, .btn-toolbar:after, .clearfix:after, .container-fluid:after, .container:after, .dl-horizontal dd:after, .form-horizontal .form-group:after, .modal-footer:after, .modal-header:after, .nav:after, .navbar-collapse:after, .navbar-header:after, .navbar:after, .pager:after, .panel-body:after, .row:after {
  clear: both;
}

.col-xs-6 {
  width: 50%;
}

.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
  float: left;
}

<!DOCTYPE html>
<html>
    <head>
        <title>Runtime Error</title>
        <meta name="viewport" content="width=device-width" />
        <style>
         body {font-family:"Verdana";font-weight:normal;font-size: .7em;color:black;} 
         p {font-family:"Verdana";font-weight:normal;color:black;margin-top: -5px}
         b {font-family:"Verdana";font-weight:bold;color:black;margin-top: -5px}
         H1 { font-family:"Verdana";font-weight:normal;font-size:18pt;color:red }
         H2 { font-family:"Verdana";font-weight:normal;font-size:14pt;color:maroon }
         pre {font-family:"Consolas","Lucida Console",Monospace;font-size:11pt;margin:0;padding:0.5em;line-height:14pt}
         .marker {font-weight: bold; color: black;text-decoration: none;}
         .version {color: gray;}
         .error {margin-bottom: 10px;}
         .expandable { text-decoration:underline; font-weight:bold; color:navy; cursor:pointer; }
         @media screen and (max-width: 639px) {
          pre { width: 440px; overflow: auto; white-space: pre-wrap; word-wrap: break-word; }
         }
         @media screen and (max-width: 479px) {
          pre { width: 280px; }
         }
        </style>
    </head>

    <body bgcolor="white">

            <span><H1>Server Error in '/' Application.<hr width=100% size=1 color=silver></H1>

            <h2> <i>Runtime Error</i> </h2></span>

            <font face="Arial, Helvetica, Geneva, SunSans-Regular, sans-serif ">

            <b> Description: </b>An application error occurred on the server. The current custom error settings for this application prevent the details of the application error from being viewed remotely (for security reasons). It could, however, be viewed by browsers running on the local server machine.
            <br><br>

            <b>Details:</b> To enable the details of this specific error message to be viewable on remote machines, please create a &lt;customErrors&gt; tag within a &quot;web.config&quot; configuration file located in the root directory of the current web application. This &lt;customErrors&gt; tag should then have its &quot;mode&quot; attribute set to &quot;Off&quot;.<br><br>

            <table width=100% bgcolor="#ffffcc">
               <tr>
                  <td>
                      <code><pre>

&lt;!-- Web.Config Configuration File --&gt;

&lt;configuration&gt;
    &lt;system.web&gt;
        &lt;customErrors mode=&quot;Off&quot;/&gt;
    &lt;/system.web&gt;
&lt;/configuration&gt;</pre>                      </code>

                  </td>
               </tr>
            </table>

            <br>

            <b>Notes:</b> The current error page you are seeing can be replaced by a custom error page by modifying the &quot;defaultRedirect&quot; attribute of the application&#39;s &lt;customErrors&gt; configuration tag to point to a custom error page URL.<br><br>

            <table width=100% bgcolor="#ffffcc">
               <tr>
                  <td>
                      <code><pre>

&lt;!-- Web.Config Configuration File --&gt;

&lt;configuration&gt;
    &lt;system.web&gt;
        &lt;customErrors mode=&quot;RemoteOnly&quot; defaultRedirect=&quot;mycustompage.htm&quot;/&gt;
    &lt;/system.web&gt;
&lt;/configuration&gt;</pre>                      </code>

                  </td>
               </tr>
            </table>

            <br>

            </font>

    </body>
</html>