@font-face {
    font-family: helvetica;
    src: url(../fonts/HELR45W.ttf);
}


.carouselh1 {
  font-size:100px;
}

.carouselp {
  font-size:20px;
}


.navbar {
      font-family: Montserrat, sans-serif;
      margin-bottom: 0;
      background-color: #031428;
      border: 0;
      font-size: 11px !important;
      letter-spacing: 4px;
      opacity: 0.9;
      position: fixed;
}



  }
  .navbar li a, .navbar .navbar-brand { 
      color: #fff !important;
  }
  .navbar-nav li a:hover {
      color: #fff !important;
  }
  .navbar-nav li.active a {
      color: #fff !important;
      background-color: #29292c !important;
  }
  .navbar-default .navbar-toggle {
      border-color: transparent;
  }

.navbar-nav li a {
  color:#dadada!important;
}


.navbar-brand {

  color:#fff!important;
}

.navbar-brand a:hover{

  color:red!important;
}


.logo-small {
    color: #f4511e;
    font-size: 50px;
}

.logo {
    color: #f4511e;
    font-size: 200px;
}

.thumbnail {
    padding: 0 0 15px 0;
    border: 1;
    border-radius: 1;
}

.thumbnail img {
    width: 100%;
    height: 100%;
    margin-bottom: 10px;
}

.bg-1 {
    background: #031428;
    color: #bdbdbd;
}
.bg-1 h2 {color: #fff;}


.bg-1 p {
  color:#fff;
}

.bg-2 {
    padding-bottom: 30px;
}

.bg-3 {
    background: #031428;
    color: #fff;
    padding-bottom: 30px;
}



.btn {
    background-color: #051932;
    color: #fff;
}

.btn.active {
  background-color:red;
    color: #ffffff!important;
}


.btn:focus {      
    border: 1px solid #031428;
    background-color: #ffffff!important;
    color: #031428!important;  
}


.btn-danger {
    border-color: #051932;
}

.buttonquemsomos{
  display: flex;
  align-items: center;
  justify-content: center;  
}

#bquemsomos:hover {
  background-color:#2d2d30; 
  color:#ffffff!important;
}


#buttonmodal {
  background-color:#ffffff; 
  color:#ffffff!important;
}


#buttonmodal:hover {
  background-color:#2d2d30; 
  color:#ffffff!important;
}


.quemsomos {
margin-top:35px;
color:#fff; 
}


#contactButton{
margin-top:20px;
background-color:#fff!important;
color:#333!important;
}


.btn-danger:hover {
    background-color: #337ab7!important;
    border-color: #337ab7!important;
  }

#destaques, #quemsomos, #portefolio, #contactos {
  padding-top:15px;
}


textarea {
    resize: none;
}


footer {
    background-color: #fff;
    color:#031428;
    padding: 32px;
}

footer a {
    color: #031428!important;
}

footer a:hover {
    color: #606060!important;
    text-decoration: none;
}

html {
  overflow-y: scroll;
}

#info {
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;        
  background:#fcf8e3;
  border:1px solid  #fbeed5;
  width:95%;
  max-width:900px;
  margin:0 auto 40px auto;
  font-family:arial;
  font-size:12px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
}

  #info .info-wrapper {
    padding:10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;

  }
  
  #info a {
    color:#c09853;
    text-decoration:none;
  }
  
  #info p {
    margin:5px 0 0 0;
  }


.container { 
  position: relative; 
  width: 960px; 
  margin: 0 auto; 
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;  
}
 
#filters {
  margin:1%;
  padding:0;
  list-style:none;
}

  #filters li {
    float:left;
  }
  
  #filters li span {
    display: block;
    padding:5px 20px;   
    text-decoration:none;
    color:#666;
    cursor: pointer;
  }
  
  #filters li span.active {
    background: #031428;
    color:#fff;
  }
 

 
#portfoliolist .portfolio {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  width:23%;
  margin:1%;
  display:none;
  float:left;
  overflow:hidden;
}

  .portfolio-wrapper {
    overflow:hidden;
    position: relative !important;
    background: #031428;
    cursor:pointer;
    }

  .portfolio img {
    /*max-width:100%;
    position: relative;*/
    top:0;
    -webkit-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1);
    transition:         all 600ms cubic-bezier(0.645, 0.045, 0.355, 1);
  }
  
  .portfolio .label {
    /*position: relative;*/
    width: 100%;
    height:40px;
    bottom:-40px;
    -webkit-transition: all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
    transition:         all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
  }

    .portfolio .label-bg {
      /*background: #666;*/
      width: 100%;
      height:100%;
      position: absolute;
      top:0;
      left:0;
    }
  
    .portfolio .label-text {
      color:#fff;
      position: relative;
      z-index:500;
      padding:5px 8px;
      font-size:18px;
    }
 
      .portfolio .text-category {
        color:#fff;
        display:block;
        font-size:9px;
        padding-top: 5px;
      }
  
  .portfolio:hover .label {
    bottom:0;
  }
  .portfolio:hover img {
    top:-30px;
  }  


  .portefolioalign{
  display: flex;
  align-items: center;
  justify-content: center;  
}


@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  10%, 20% {
    -webkit-transform: scale(.9) rotate(-8deg);
    transform: scale(.9) rotate(-8deg);
  }

  30%, 50%, 70% {
    -webkit-transform: scale(1.3) rotate(8deg);
    transform: scale(1.3) rotate(8deg);
  }

  40%, 60% {
    -webkit-transform: scale(1.3) rotate(-8deg);
    transform: scale(1.3) rotate(-8deg);
  }

  80% {
    -webkit-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  10%, 20% {
    -webkit-transform: scale(.9) rotate(-8deg);
    -ms-transform: scale(.9) rotate(-8deg);
    transform: scale(.9) rotate(-8deg);
  }

  30%, 50%, 70% {
    -webkit-transform: scale(1.3) rotate(8deg);
    -ms-transform: scale(1.3) rotate(8deg);
    transform: scale(1.3) rotate(8deg);
  }

  40%, 60% {
    -webkit-transform: scale(1.3) rotate(-8deg);
    -ms-transform: scale(1.3) rotate(-8deg);
    transform: scale(1.3) rotate(-8deg);
  }

  80% {
    -webkit-transform: scale(1) rotate(0);
    -ms-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

.faa-tada.animated,
.faa-tada.animated-hover:hover,
.faa-parent.animated-hover:hover > .faa-tada {
  -webkit-animation: tada 2s linear infinite;
  animation: tada 2s linear infinite;
}



.modal-header, h4, .close {
    background-color: #031428!important;
    color: #fff !important;
    text-align: center;
    font-size: 30px;
}


.close {
  opacity:1!important;
}


.close:hover {
  opacity:.5!important;
}

.modal-header, .modal-body {
    padding: 25px 50px;
}


body.modal-open {
overflow-y: auto !important;
padding-right: 0 !important;
}

.modal-scrollbar-measure {

overflow: hidden;
}


.modalWrapper p {
color:#031428;
}

.modalWrapper h3 {
color:#031428;
}

#modal1 {
background-color: #ffffff!important;

#modal2 {
background-color: #ffffff!important;    

#modal3 {
background-color: #ffffff!important;

}


.portfolioFont {
  background-color: #ffffff!important;
  color: #000000 !important;
    text-align: center;
    font-size: 30px;
}



/* The grid: Four equal columns that floats next to each other */
.column {
    float: left;
    width: 25%;
    padding: 10px;
}

/* Style the images inside the grid */
.column img {
    opacity: 0.8; 
    cursor: pointer; 
}

.column img:hover {
    opacity: 1;
}

/* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;
}

/* The expanding image container 
.container {
    position: relative;
    display: none;
}*/

/* Expanding image text */
#imgtext {
    position: absolute;
    bottom: 15px;
    left: 15px;
    color: white;
    font-size: 20px;
}

/* Closable button inside the expanded image */
.closebtn {
    position: absolute;
    top: 10px;
    right: 15px;
    color: white;
    font-size: 35px;
    cursor: pointer;
}


.carouselModal{
  text-decoration: none!important;
  color:#ffffff!important;
  cursor: pointer;
}



 .carouselh1 {
  font-size:80px;
}

.carouselp {
  font-size:25px;
}    

/* #Tablet (Portrait) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
  .container {
    width: 768px; 
  }
}

/*  #Mobile (Portrait) - Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {
  .container { 
    width: 95%; 
  }
  
  #portfoliolist .portfolio {
    width:48%;
    margin:1%;
  } 

  .carouselh1 {
  font-size:30px;
}

.carouselp {
  font-size:15px;
}    
}

/* #Mobile (Landscape) - Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  .container {
    width: 70%;

  }

  .carouselh1 {
  font-size:25px;
}

.carouselp {
  font-size:15px;
}
}


/* #Mobile (small) - Note: Design for a width of 480px */
@media only screen and (max-width: 480px) {
  .navbar-brand {
    font-size:5px ;
    
  }
.carouselh1 {
  font-size:20px;
}

.carouselp {
  font-size:8px;
}
}