@charset "UTF-8";

 body, html {
    height: 100%;
}

body {
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 300;
  color: #000;
  background-color: #fff2e6 !important;
  line-height: 1.6;
}

h1, h2 {
  font-family: "Dosis", sans-serif;
  font-size: 8vw;
  font-weight: 400;
  color: #cc6600;
  margin-top: 80px;
}


h3 {
      font-family: "Dosis", sans-serif;
  font-weight: 400;
  color: #ff3300;
}

.about {
  position: relative;
  text-align: center;
  color: black;
}

#about {

    color: black;

}

@media screen and (min-width: 600px) {
    .smart {
        display: none;
    }
}

@media screen and (max-width: 600px) {
    .desk {
        display: none;
    }
}

#rev {
    display: block;
    margin-top: 100px;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
}

#srev {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 70%;
}

.modal-header {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 70%;
}

#services {
    background-color: #ffcc99;
    color: #000000;
}

#galeria {
    background-color: #ffcc99;
    width: 100%;

}

.thumbnail {
    height: 60%;
}

@media screen and (max-width: 480px) {
    .thumbnail {
        height: 80%;
    }
}


/* colunas galeria */
* {
    box-sizing: border-box;
}
#ga {
    background-color: #ffece5 !important; 
}

#fuu {
    background-color: #804000;
}

#ftr {
    padding-top: 5vw;
    padding-bottom: 5vw;
    font-family: "Open Sans", sans-serif;
  font-size: 3vw;
  font-weight: 500;
  color: white;
    text-align: center;
}

/* Create four equal columns that floats next to each other */
.column {
    float: left;
    width: 25%;
    padding:10px;
    -webkit-column-gap: 13px; 
    -moz-column-gap: 13px; 
    column-gap: 13px; 
    background-color: #ffece5;
}



/* On screens that are 992px wide or less, go two columns */
@media screen and (max-width: 992px) {
    .column {
        width: 50%;
        -webkit-column-gap: 8px; 
        -moz-column-gap: 8px; 
        -ms-column-gap: 8px;
        column-gap: 8px;
    }
}


/* --------------------- */
/* NAVIGATION BAR
/* --------------------- */
.navbar-brand {
  padding: 10px 15px;
}
.navbar-brand img {
  width: 74px;
  height: auto;
}

.navbar,
.navbar.navbar-light {
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  transform: translateZ(0);
}

.nav > li > a:focus {
  background-color: transparent;
  outline: none;
}

.navbar-nav {
  padding: 10px 0;
}
.navbar-nav > li {
  margin: 0 10px;
}
.navbar-nav > li > a {
  -moz-transition-property: all;
  -o-transition-property: all;
  -webkit-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.1s;
  -o-transition-duration: 0.1s;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
  -moz-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  padding-left: 3px;
  padding-right: 3px;
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: 2px solid transparent;
  font-size: 12px;
  color: #646464;
  font-weight: 700;
}
.navbar-nav > li > a:hover {
  border-bottom: 2px solid #646464;
  padding-bottom: 0;
  background-color: transparent;
}
.navbar-nav > li.active > a {
  border-bottom: 2px solid #646464;
  padding-bottom: 0;
  background-color: transparent;
  outline: none;
}
.navbar-nav.nav-text-light > li > a {
  color: #fff;
}
.navbar-nav.nav-text-light > li > a:hover {
  border-bottom-color: #fff;
}
.navbar-nav.nav-text-light > li.active > a {
  border-bottom-color: #fff;
}

.navbar {
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
}
.navbar.navbar-light {
  background-color: #f7f7f7;
  border-bottom: 1px solid #eee;
}
.navbar.navbar-light .navbar-nav.nav-text-light > li > a {
  color: #646464;
}
@media screen and (max-width: 767px) {
  .navbar.navbar-light .navbar-nav.nav-text-light > li > a {
    color: #e6e6e6;
    border-bottom: none;
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .navbar.navbar-light .navbar-nav.nav-text-light > li > a:hover {
    color: #fff;
    padding-top: 15px;
    padding-bottom: 15px;
    text-decoration: underline;
  }
}
.navbar.navbar-light .navbar-nav.nav-text-light > li > a:hover {
  border-bottom-color: #646464;
}
.navbar.navbar-light .navbar-nav.nav-text-light > li.active > a {
  border-bottom-color: #646464;
}

.navbar-toggle {
  background-color: #646464;
}
.navbar-toggle .icon-bar {
  background-color: #fff;
}

@media screen and (max-width: 767px) {
  .navbar-collapse {
    background-color: #646464;
  }
}



.section-info {
        color: #0033cc;
  font-size: 14px;
}
.section-about {
    color: #331a00;
}

.section-heading p {
  font-size: 1.5em;
  color: #003399;
}
.section-heading hr {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
 
  border-top: 1px solid #646464;
}

/* ------------------ CONTACT ------------------ */
/* --------------------- */
/* CONTACT INFO
/* --------------------- */

.contact-info p {

    color: #0033cc;
  font-size: 20px;
}
.center {
    text-align: center;
    color: #ff0000;
}


.contact-info i {
  font-size: 40px;
}
@media screen and (max-width: 768px) {
  .contact-info {
    text-align: center;
  }

}

@media screen and (max-width: 480px) {
  .contact {
    padding-bottom: 0;
  }
}
/* --------------------- */
/* CONTACT FORM
/* --------------------- */
.contact-form {
  overflow: hidden;
  margin-bottom: 40px;
}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 12px;
  margin-bottom: 7px;
  min-height: 3em;
  border: none;
  background-color: #e6f2ff;
}
.contact-form .form-group {
  margin-bottom: 0;
}
.contact-form textarea {
  width: 100%;
  display: block;
  padding: 14px;
  min-height: 130px;
}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea {
    border: 1px solid #0033cc;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}
.contact-form input[type="text"]:focus,
.contact-form input[type="email"]:focus,
.contact-form textarea:focus {
  outline: none;
}
.contact-form .alert,
.contact-form label {
  display: none;
}
@media screen and (max-width: 480px) {
  .contact-form .btn-primary {
    width: 100%;
  }
}

@media screen and (min-width: 600) {
   #mob {
        display:none;
    }
    .mtext {
        display:none;
    }
}

/* The hero image */
#hero {

    margin-top: 50px;
    width: 100%;
    position: static;
} 


#htext { 
  font-family: 'Courgette';
  font-weight: 500;
  text-align: center;
  color: #ffc748;
}

.w3-myfont {
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  font-weight: 300;
  color: #000;
}

.item-1, 
.item-2, 
.item-3,
.item-4{
    position: absolute;
    bottom: 70%;
    left: 50%;
    transform: translate(-50%, -50%);
  
  font-size: 2em;

	animation-duration: 20s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;

}


.item-1{
	animation-name: anim-1;
}

.item-2{
	animation-name: anim-2;
}

.item-3{
	animation-name: anim-3;
}

.item-4{
	animation-name: anim-4;
}



@keyframes anim-1 {
	0%, 6.25% { top: 100%; opacity: 0; }
  6.25%, 18.75% { top: 85%; opacity: 1; }
  25%, 100% { top: 100%; opacity: 0; }
}

@keyframes anim-2 {
	0%, 25% { top: 100%; opacity: 0; }
  31.25%, 43.75% { top: 85%; opacity: 1; }
  50%, 100% { top: 100%; opacity: 0; }
}

@keyframes anim-3 {
	0%, 50% { top: 100%; opacity: 0; }
  56.25%, 68.75% { top: 85%; opacity: 1; }
  75%, 100% { top: 100%; opacity: 0; }
}

@keyframes anim-4 {
	0%, 75% { top: 100%; opacity: 0; }
  81.25%, 93.75% { top: 85%; opacity: 1; }
  100% { top: 100%; opacity: 0; }
}

