main, main #main-panel {
  display: flex;
  justify-content: center;
  align-items: center; }

h1, h2, h3, h4, h5, h6, p, div {
  font-family: 'Montserrat', sans-serif;
  -webkit-font-family: 'Montserrat', sans-serif;
  -moz-font-family: 'Montserrat', sans-serif;
  -o-font-family: 'Montserrat', sans-serif; }

body {
  margin: 0;
  overflow-x: hidden; }

main {
  position: fixed !important;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: url("img/bgdog.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat; }
  main #main-panel {
    width: 1000px;
    height: 500px;
    background-color: #ffffffb4;
    -webkit-background-color: #ffffffb4;
    -moz-background-color: #ffffffb4;
    -o-background-color: #ffffffb4; }
    main #main-panel .main-panel-left {
      width: 28%;
      height: 100%;
      background-color: #00a99d;
      display: flex;
      flex-direction: column; }
      main #main-panel .main-panel-left .logo:first-of-type {
        width: 100%;
        height: 20%; }
      main #main-panel .main-panel-left .logo:first-of-type {
        width: 100%;
        height: 24%; }
      main #main-panel .main-panel-left .logo {
        padding-top: 20px;
        width: 100%;
        height: 13%;
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        border-bottom: solid 1px #ffffff65;
        -webkit-border-bottom: solid 1px #ffffff65;
        -moz-border-bottom: solid 1px #ffffff65;
        -o-border-bottom: solid 1px #ffffff65; }
        main #main-panel .main-panel-left .logo a {
          position: absolute;
          top: 3px;
          display: flex;
          justify-content: center; }
          main #main-panel .main-panel-left .logo a img {
            width: 40%;
            height: 40%; }
        main #main-panel .main-panel-left .logo h2 {
          padding-left: 30px;
          align-self: flex-start;
          text-transform: uppercase;
          color: rgba(0, 0, 0, 0.78);
          font-size: 10px;
          font-weight: 700;
          text-align: left;
          position: absolute;
          bottom: 0; }
        main #main-panel .main-panel-left .logo h3 {
          text-transform: uppercase;
          color: #ffffffd3;
          font-size: 13px;
          font-weight: 600;
          text-align: right;
          align-self: flex-end;
          padding-right: 20px; }
      main #main-panel .main-panel-left .lg-div-border {
        border-top: solid 1px #ffffff65;
        -webkit-border-top: solid 1px #ffffff65;
        -moz-border-top: solid 1px #ffffff65;
        -o-border-top: solid 1px #ffffff65; }
      main #main-panel .main-panel-left .menu-button.responsive-logo {
        display: none; }
      main #main-panel .main-panel-left .menu-button {
        max-width: 100%;
        height: 11%;
        font-size: 10px;
        font-weight: 700;
        text-align: left;
        text-decoration: none;
        color: #ffffffd3;
        display: flex;
        align-items: center;
        padding: 0 0 0 30px;
        transition: color 1s, background-color 1s; }
        main #main-panel .main-panel-left .menu-button i {
          padding-right: 10px; }
        main #main-panel .main-panel-left .menu-button span {
          display: none; }
      main #main-panel .main-panel-left .menu-button:hover {
        color: #010101;
        background-color: #ffffffb4;
        -webkit-background-color: #ffffffb4;
        -moz-background-color: #ffffffb4;
        -o-background-color: #ffffffb4; }
      main #main-panel .main-panel-left .button-border {
        border-bottom: solid 1px #ffffffd3;
        -webkit-border-bottom: solid 1px #ffffffd3;
        -moz-border-bottom: solid 1px #ffffffd3;
        -o-border-bottom: solid 1px #ffffffd3; }
    main #main-panel .main-panel-right {
      width: 72%;
      height: 100%;
      padding: 40px; }
      main #main-panel .main-panel-right .panel-logo {
        display: none; }
      main #main-panel .main-panel-right .panel-right-quote {
        padding-top: 30px;
        padding-bottom: 10px;
        margin: 0 40px;
        font-size: 15px;
        font-weight: 500;
        text-align: center;
        font-style: italic;
        color: #010101; }
      main #main-panel .main-panel-right .panel-right-welcome {
        padding-top: 30px;
        display: flex;
        align-items: center;
        justify-content: center; }
        main #main-panel .main-panel-right .panel-right-welcome .welcome-img {
          width: 40%;
          height: 100%; }
          main #main-panel .main-panel-right .panel-right-welcome .welcome-img img {
            border-radius: 50%;
            width: 70%;
            height: 70%; }
        main #main-panel .main-panel-right .panel-right-welcome .welcome-title {
          width: 60%;
          height: 100%; }
          main #main-panel .main-panel-right .panel-right-welcome .welcome-title h1 {
            font-size: 32px;
            font-weight: 400;
            text-align: left;
            font-style: italic; }
          main #main-panel .main-panel-right .panel-right-welcome .welcome-title p {
            font-size: 12px;
            font-weight: 400;
            text-align: left;
            line-height: 20px;
            font-style: italic; }

@media only screen and (max-width: 900px) {
  main {
    top: 0;
    right: auto;
    bottom: auto;
    left: auto;
    height: 100%;
    min-width: 100%;
    background-size: cover; }
    main #main-panel {
      flex-direction: column;
      width: 100%;
      width: 100%;
      height: 100%; }
      main #main-panel .main-panel-left {
        width: 100%;
        height: 30%; }
        main #main-panel .main-panel-left .logo, main #main-panel .main-panel-left .lg-div-border {
          display: none; }
        main #main-panel .main-panel-left .menu-button.responsive-logo {
          display: flex; }
        main #main-panel .main-panel-left .menu-button {
          padding: 7px;
          border: solid 1px #ffffff65; }
          main #main-panel .main-panel-left .menu-button span {
            display: inline !important;
            padding-left: 4px; }
      main #main-panel .main-panel-right {
        width: 100%;
        height: 80%;
        overflow-y: auto; }
        main #main-panel .main-panel-right .panel-logo {
          display: block !important;
          width: 30%;
          height: auto;
          margin: 0 auto; } }
@media only screen and (max-width: 700px) {
  p {
    font-size: 12px; }

  h1, h2, h3, h4 {
    font-size: 12px; } }
@media only screen and (max-width: 500px) {
  .main-panel-right .panel-right-welcome {
    flex-direction: column; }
    .main-panel-right .panel-right-welcome .welcome-img {
      display: none; }
    .main-panel-right .panel-right-welcome .welcome-title {
      text-align: justify; } }

/*# sourceMappingURL=style.css.map */