/*

-----------------------------------------------------------------------------------------------------------------------

|.class	            | .intro	                                                | Selects all elements with class="intro"

|.class1.class2	    | <div class="name1 name2">...</div>	                    | Selects all elements with both name1 and name2 set within its class attribute

|.class1 .class2	| <div class="name1"> <div class="name2"> ... </div> </div>	| Selects all elements with name2 that is a descendant of an element with name1

|#id	            | #firstname	                                            | Selects the element with id="firstname"

|*	                | *	                                                        | Selects all elements

|element       	    | p	                                                        | Selects all <p> elements

|element.class	    | p.intro	                                                | Selects all <p> elements with class="intro"

|element,element	| div, p                                                    | Selects all <div> elements and all <p> elements

|element element	| div p	                                                    | Selects all <p> elements inside <div> elements

|element>element	| div > p	                                                | Selects all <p> elements where the parent is a <div> element

|element+element	| div + p                                                   | Selects all <p> elements that are placed immediately after <div> elements

|element1~element2	| p ~ ul	                                                | Selects every <ul> element that are preceded by a <p> element

-----------------------------------------------------------------------------------------------------------------------

*/

.sto-theme-body {
  background-color: #ffffff; /* For browsers that do not support gradients */

  /* background-image: linear-gradient(to bottom right, #FFFFFF, #fad0a9); /* Standard syntax (must be last) */
}

/*

-----------------------------------------------------------------------------------------------------------------------

NAV e NAVBAR

-----------------------------------------------------------------------------------------------------------------------

*/

.sto-theme-nav-bg {
  background-color: #ffffff;
}

.sto-theme-navbar-brand-link img {
  width: 100%;

  max-width: 350px;

  height: auto;

  max-height: 130px;
}

@media screen and (max-width: 480px) {
  .sto-theme-navbar-brand-link img {
    width: 100%;

    max-width: 200px;

    height: auto;

    max-height: 130px;
  }
}

.sto-theme-navbar-menu {
}

.sto-theme-nav-bg .sto-theme-navbar-menu .nav-item:hover,
.sto-theme-nav-bg .sto-theme-navbar-menu .nav-item:focus {
  color: #ffffff;

  background-color: #0079b2;
}

.sto-theme-nav-bg .sto-theme-navbar-menu .nav-item .nav-link {
  padding-left: 0.5rem;

  padding-right: 0.5rem;
}

.sto-theme-nav-bg .sto-theme-navbar-menu .nav-item .nav-link:hover,
.sto-theme-nav-bg .sto-theme-navbar-menu .nav-item .nav-link:focus {
  color: #ffffff;
}

.sto-theme-nav-bg .sto-theme-navbar-menu .nav-link.active,
.sto-theme-nav-bg .sto-theme-navbar-menu .nav-link.active:hover,
.sto-theme-nav-bg .sto-theme-navbar-menu .nav-link.active:focus {
  color: #0079b2;

  font-weight: bold;

  text-decoration: underline;

  background-color: #e7e7e7;
}

/*

-----------------------------------------------------------------------------------------------------------------------

section-mensagem

-----------------------------------------------------------------------------------------------------------------------

*/

.section-mensagem {
  margin-bottom: 3rem;
}

/*

-----------------------------------------------------------------------------------------------------------------------

Titulos

-----------------------------------------------------------------------------------------------------------------------

*/

.sto-theme-header-title {
  text-align: center;

  color: #3eb2cf;

  line-height: 1.27273;

  font-size: 2rem;

  font-family: Verdana, serif;

  margin-top: 4rem;

  margin-bottom: 4rem;
}

.sto-theme-header-title-blue {
  color: #3eb2cf;
}

.sto-theme-header-title-orange {
  color: #fec20b;
}

.sto-theme-p-text {
  font-size: 1.5rem;

  text-align: justify;

  text-indent: 1rem;
}

@media screen and (min-width: 601px) {
  .sto-theme-header-title {
    font-size: 2rem;

    margin-top: 2rem;

    margin-bottom: 2rem;
  }

  .sto-theme-p-text {
    font-size: 1.5rem;
  }
}

@media screen and (max-width: 600px) {
  .sto-theme-header-title {
    font-size: 1.3rem;

    margin-top: 2rem;

    margin-bottom: 2rem;
  }

  .sto-theme-p-text {
    font-size: 1rem;
  }
}

@media screen and (max-width: 320px) {
  .sto-theme-header-title {
    font-size: 1rem;

    margin-top: 1rem;

    margin-bottom: 1rem;
  }

  .sto-theme-p-text {
    font-size: 1rem;
  }
}

/*

-----------------------------------------------------------------------------------------------------------------------

CARDS

-----------------------------------------------------------------------------------------------------------------------

*/

.sto-theme-cards {
  margin-top: 4rem;

  margin-bottom: 4rem;
}

@media screen and (min-width: 601px) {
  .sto-theme-cards {
    margin-top: 2rem;

    margin-bottom: 2rem;
  }
}

@media screen and (max-width: 600px) {
  .sto-theme-cards {
    margin-top: 2rem;

    margin-bottom: 2rem;
  }
}

@media screen and (max-width: 320px) {
  .sto-theme-cards {
    margin-top: 1rem;

    margin-bottom: 1rem;
  }
}

/*

-----------------------------------------------------------------------------------------------------------------------

GALLERY

-----------------------------------------------------------------------------------------------------------------------

*/

.sto-theme-gallery {
  background-color: #d2e6e9;
}

.sto-theme-gallery-container {
  min-height: 200px;
}

.sto-theme-gallery-image {
  opacity: 1;

  display: block;

  width: 100%;

  height: auto;

  transition: 0.5s ease;

  backface-visibility: hidden;
}

.sto-theme-gallery-middle {
  transition: 0.5s ease;

  opacity: 0;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  -ms-transform: translate(-50%, -50%);

  text-align: center;
}

.sto-theme-gallery-container:hover .sto-theme-gallery-image {
  opacity: 0.3;
}

.sto-theme-gallery-container:hover .sto-theme-gallery-middle {
  opacity: 1;
}

.sto-theme-gallery-text {
  background: #000000;

  color: #cdcdcd;

  font-size: 1rem;

  padding: 1.5rem 1.2rem;
}

/*
-----------------------------------------------------------------------------------------------------------------------
FOOTER
-----------------------------------------------------------------------------------------------------------------------
*/

.sto-theme-footer {
  background: #323232;

  min-height: 272px;

  height: auto;
}