@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&family=Open+Sans:ital,wght@0,400;0,600;1,400;1,600&display=swap');

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
  color: #2B2B2B;
  font-family: 'Open Sans', Arial, sans-serif;
  font-weight: 400;
  min-height: 100vh;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}            

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Montserrat', Arial, sans-serif;
}


/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
  color: #123F9A;
  font-weight: 600;
}

a:hover {
    text-decoration: none;
}

b,
strong {
  font-weight: 600;
}


/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

h1 {
  font-size: 1.5em;
  line-height: 1.0909090909em;
  margin: 0 0 1.0909090909em;
}

.wrapper {
    border: .5em solid #fff;
    background: rgb(9,32,77); 
    background: linear-gradient(45deg, rgba(9,32,77,1) 4%, rgba(18,63,154,1) 100%);
    display: flex;
    justify-content: center;
    align-items: stretch;
    min-height: calc(100vh - 64px);
    padding: 1.5em;
}

.content {
    padding: 1.5em;
    background-color: #fff;
    border-radius: 1.5em;
    width: 100%;
    min-height: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.center-block {
    max-width: 1100px;
}

.center-block p {
    line-height: 1.44em;
    margin-bottom: 1.44em;
}

.logo {
    display: block;
    margin: 0 auto 2.5em;
    width: 10em;
}

.logo svg,
.maintenance-icon svg {
    width: 100%;
    height: auto;
}

.maintenance-icon {
    display: block;
    margin: 2.5em auto 0;
    width: 5em;
}


@media (min-width: 576px) {

}

@media (min-width: 768px) {

}

@media (min-width: 992px) {
    .wrapper {
        border: 1em solid #fff;
        padding: 3em;
        min-height: calc(100vh - 128px);
    }

    .content {
        border-radius: 2em;
    }

    h1 {
        font-size: 2em;
    }

    .center-block p {
        font-size: 1.25em;
    }

    .logo {
        width: 13.875em;
    }

    .maintenance-icon {
        width: 6em;
    }
}

@media (min-width: 1220px) {

}

@media (min-width: 1400px) {
    .wrapper {
        padding: 5em;
        min-height: calc(100vh - 192px);
    }

    .content {
        border-radius: 2.5em;
    }

    h1 {
        font-size: 2.75em;
    }

    .center-block p {
        font-size: 1.5625em;
    }

    .logo {
        margin: 0 auto 5.625em;
    }

    .maintenance-icon {
        margin: 5.625em auto 0;
        width: 7em;
    }
}