<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet">

    <title>Site em construção</title>
    <style>
    * {
      margin: 0;
      padding: 0;
      border: none;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    h1, p {
      margin: 25px 0;
    }
    p {
      margin-bottom: 15px;
    }
    hr {
      border-top: 1px solid rgba(0,0,0,0.23);;
    }
    body {
      background: url(catalog/view/theme/vista/image/bg_loja_desenvolvimento.jpg) no-repeat;
      background-size: 110%;
      background-position: center top -200px;
      font: 16px normal Arial, helvetica, sans-serif;
      height: 100%;
    }
    h1 {
      font-size: 19px;
    }
    body:before {
      content: "";
      position: fixed;
      height: 100%;
      width: 100%;
      background-color: rgba(255, 255, 255, .95);
    }
    section {
      width: 90%;
      max-width: 600px;
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background: #FFF;
      border: 2px solid rgba(0,0,0,0.23);
      padding: 40px;
      box-sizing: border-box;
      text-align: center;
      -webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.1), 0 3px 6px rgba(0,0,0,0.2);
      box-shadow: 0 3px 6px rgba(0,0,0,0.1), 0 3px 6px rgba(0,0,0,0.2);
    }
    ul {
      list-style: none;
      padding: 0;
    }
    li {
      text-align: center;
      display: inline-block;
      vertical-align: middle;
    }
    li:last-child {
      margin-right: 0;
    }
    a {
      display: block;
      color: #FFF;
      height: 38px;
      width: 40px;
      line-height: 38px;
      border-radius: 4px;
      margin: 0 2px 10px;
    }
    .fb { background: #3C5B9B; }
    .tw { background: #359BED; }
    .googleplus { background: #cb2027; }
    .rss { background: #FD9F13; }
    .pintrest { background: #cb2027; }
    .linkedin { background: #027ba5; }
    .youtube { background: #F03434; }
    .instagram { background: #A9714E; }
    .blogger {
      background: #f58220;

      padding-top: 3px;
      box-sizing: border-box;
    }
    a:hover {
      background: #333;
    }
    .contato span,
    .contato b {
      display: inline-block;
      margin: 0 2px;
    }
    .contato .contato-text {
      display: block;
      margin: 5px 0;
    }
    hr + .contato {
      margin-top: 25px;
    }
    #logo img {
      max-width: 100%;
    }

    .contact-container {
      display: block;
      width: 200px;
      margin: 0 auto;
    }
    .contact-icon {
      display: inline-block;
      width: 40px;
      height: 40px;
      float: left;
      line-height: 40px;
      text-align: center;
    }
    .contact-description {
      display: inline-block;
      width: calc(100% - 40px);
      line-height: 40px;
      text-align: left;
    }
    .contact-description span {
      display: block;
    }

    </style>
  </head>
  <body>
    <section class="main-container col1-layout">
      <?php if (isset($logo) && $logo) { ?>
      <div id="logo">
        <img src="<?php echo $logo; ?>" title="<?php echo $name; ?>" alt="<?php echo $name; ?>" />
      </div>
      <?php } ?>

        <article class="col-main">
          <div id="content">
            <div class="desenvolvimento">
              <h1>
                <?php echo $message; ?>
              </h1>
            </div>
          </div>
        </article>

        <hr>
        <!-- Validar para não exibir footer-primary-bottom caso não tenha nada nele -->
        <?php if (($this->config->get('wg24_facebook_url'))
              || ($this->config->get('wg24_twitter_url'))
              || ($this->config->get('wg24_google_url'))
              || ($this->config->get('wg24_rss_url'))
              || ($this->config->get('wg24_pinterest_url'))
              || ($this->config->get('wg24_linking_url'))
              || ($this->config->get('wg24_youtub_url'))
              || ($this->config->get('wg24_instagram_url'))
              || ($this->config->get('wg24_twitter_id'))
        ){ ?>
        <p><?php echo $text_redes ?></p>
        <div class="footer-primary-bottom">
        <div class="social">
          <ul class="link">
            <?php if($this->config->get('wg24_facebook_url')) { ?>
            <li>
              <a class="fb" href="<?php echo  $this->config->get('wg24_facebook_url') ?>" target="_Blank" title="<?php echo  $this->config->get('wg24_facebook_url') ?>"><i class="fab fa-facebook-f"></i></a>
            </li>
            <?php } ?>
            <?php if($this->config->get('wg24_twitter_url')) { ?>
            <li>
              <a class="tw" href=" <?php echo  $this->config->get('wg24_twitter_url') ?>" target="_Blank" title="<?php echo  $this->config->get('wg24_twitter_url') ?>"><i class="fab fa-twitter"></i></a>
            </li>
            <?php } ?>
            <?php if($this->config->get('wg24_google_url')) { ?>
            <li>
              <a class="googleplus" href=" <?php echo  $this->config->get('wg24_google_url') ?>" target="_Blank" title="<?php echo  $this->config->get('wg24_google_url') ?>"><i class="fab fa-google-plus-g"></i></a>
            </li>
            <?php } ?>
            <?php if($this->config->get('wg24_rss_url')) { ?>
            <li>
              <a class="rss" href=" <?php echo  $this->config->get('wg24_rss_url') ?>" target="_Blank" title="<?php echo  $this->config->get('wg24_rss_url') ?>"><i class="fas fa-rss"></i></a>
            </li>
            <?php } ?>
            <?php if($this->config->get('wg24_pinterest_url')) { ?>
            <li>
              <a class="pintrest" href=" <?php echo  $this->config->get('wg24_pinterest_url') ?>" target="_Blank" title="<?php echo  $this->config->get('wg24_pinterest_url') ?>"><i class="fab fa-pinterest-p"></i></a>
            </li>
            <?php } ?>
            <?php if($this->config->get('wg24_linking_url')) { ?>
            <li>
              <a class="linkedin" href=" <?php echo  $this->config->get('wg24_linking_url') ?>" target="_Blank" title="<?php echo  $this->config->get('wg24_linking_url') ?>"><i class="fab fa-linkedin-in"></i></a>
            </li>
            <?php } ?>
            <?php if($this->config->get('wg24_youtub_url')) { ?>
            <li>
              <a class="youtube" href=" <?php echo  $this->config->get('wg24_youtub_url') ?>" target="_Blank" title="<?php echo  $this->config->get('wg24_youtub_url') ?>"><i class="fab fa-youtube"></i></a>
            </li>
            <?php } ?>
            <?php if($this->config->get('wg24_instagram_url')) { ?>
            <li>
              <a class="instagram" href=" <?php echo  $this->config->get('wg24_instagram_url') ?>" target="_Blank" title="<?php echo  $this->config->get('wg24_instagram_url') ?>"><i class="fab fa-instagram"></i></a>
            </li>
            <?php } ?>
            <?php if($this->config->get('wg24_blogger_url')) { ?>
            <li>
              <!-- o icone não esta com o padrão de fontawesome porque quando foi feito não existia o icone, alterar quando possivel -->
              <a class="blogger" href=" <?php echo  $this->config->get('wg24_blogger_url') ?>" target="_Blank" title="<?php echo  $this->config->get('wg24_blogger_url') ?>"><i class="fab fa-blogger-b"></i></a> </li>
            <?php } ?>
          </ul>
        </div>
      </div>
      <?php } ?>
      <div class="contato">
        <?php if($config_telephone){ ?>

          <span class="contato-text"><b><?php echo $text_phone ?></b></span>

          <?php foreach($config_telephone as $key => $telefone){ ?>

          <div class="contact-container">
            <div class="contact-icon">
              <?php
                switch ($key) {
                case Type_Phone::Tp_Telefone: ?>
                  <i class="fas fa-phone"></i>
                <?php     break;
                case Type_Phone::Tp_Fax: ?>
                  <i class="fas fa-fax"></i>
                <?php     break;
                case Type_Phone::Tp_Celular:
                case Type_Phone::Tp_Whatsapp: ?>
                  <i class="fab fa-whatsapp"></i>
                <?php     break;
                }
              ?>
            </div>
            <div class="contact-description">
              <?php foreach($telefone as $numero){ ?>
              <span><?php echo $numero; ?></span>
              <?php } ?>
            </div>
          </div>

          <?php } ?>
        <?php } ?>

        <?php if ($this->config->get('config_email')) { ?>
          <span class="contato-text"><b><?php echo $text_email ?>: </b><span><?php echo $this->config->get('config_email') ?></span></span>
        <?php } ?>
      </div>
    </section>
  </body>
</html>
