/* fonts 
//////////////////////////////////////////////////////////////////////////////////////////*/
@import url(//fonts.googleapis.com/css?family=Roboto:100,400,700,900);



/* colors 
//////////////////////////////////////////////////////////////////////////////////////////*/
a,
a:hover,
a:focus,
a:active,
ul.pagination li a,
.search-term,
.contact .contact-info .contact-info-important  { 
  color: #A82B2E }

ul.pagination li.active a,
ul.pagination li.active a:hover,
ul.pagination li.active a:focus, 
ul.pagination li.active a:active,
.btn-primary { 
  background: #A82B2E }

.navbar-nav li.active a,
.navbar-nav li a:active,
.navbar-nav li a:focus,
.navbar-nav li a:hover,
.nav .open > a, 
.nav .open > a:focus, 
.nav .open > a:hover {
  color: #FFF }

ul.pagination li.active a,
ul.pagination li.active a:hover,
ul.pagination li.active a:focus, 
ul.pagination li.active a:active { 
  border: 1px solid #A82B2E }

.btn-primary { border-color: #A82B2E }

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  border-color: #333; 
  background: #333 }

@media (max-width: 767px) {

  .navbar-nav,
  button.navbar-toggle:active,
  button.navbar-toggle:focus,
  button.navbar-toggle:hover,
  button.navbar-toggle .icon-bar { 
    background: #A82B2E }

  .navbar-nav > li > a { color: #FFF }

  .navbar-nav li.active a,
  .navbar-nav li a:active,
  .navbar-nav li a:focus,
  .navbar-nav li a:hover,
  .nav .open>a, .nav .open>a:focus, .nav .open>a:hover { background: rgba(0,0,0,0.2) }

  button.navbar-toggle:active .icon-bar,
  button.navbar-toggle:focus .icon-bar,
  button.navbar-toggle:hover .icon-bar { 
    background: #FFF }
   
}



/* html/body 
//////////////////////////////////////////////////////////////////////////////////////////*/
body, html { height: 100% }

body {
  color: #333; 
  font-family: "Roboto", Sans-serif;
  font-size: 12pt }



/* wrapper
//////////////////////////////////////////////////////////////////////////////////////////*/
@media(min-width: 768px){
  .wrapper {
    padding: 100px 0;
  }
}

@media(max-width: 767px){
  .wrapper {
    padding: 50px 0;
  }
}



/* container: fixed width page
//////////////////////////////////////////////////////////////////////////////////////////*/
@media (min-width: 768px) {
  .container { 
    width: 1100px;
    padding: 0 }
}

@media (min-width: 768px) and (max-width: 1100px) {
  .container { 
    width: auto;
    padding: 0 20px }
}



/* header
//////////////////////////////////////////////////////////////////////////////////////////*/
header {
  background: #1A2F55;
  width: 100% }

header .container { position: relative }

@media(min-width: 768px){
   header { height: 85px }
}

@media(max-width: 767px){
  header { height: 70px }
}



/* brand/navbar
//////////////////////////////////////////////////////////////////////////////////////////*/
.brand { margin: 20px 0 0 0 }

.navbar-brand img { height: 35px  } /* mobile cfg */

.navbar { 
  border-radius: 0;
  padding: 0;
  margin: 0 } 


/* navbar-nav
//////////////////////////////////////////////////////////////////////////////////////////*/
.navbar-nav > li > a { 
  font-size: 112.5%;
  font-weight: 100 } 

@media (min-width: 768px) {
  .navbar-nav {
    position: absolute;
    top: 0;
    right: 0 }

  .navbar-nav > li { margin-right: 30px }

  .navbar-nav > li:last-child { margin: 0 }

  .navbar-nav > li > a { 
    color: rgba(255,255,255,0.6);
    padding: 0 15px;
    line-height: 74px;
    display: inline-block  }

  .navbar-nav > li.active > a,
  .navbar-nav > li > a:active,
  .navbar-nav > li > a:focus,
  .navbar-nav > li > a:hover,
  .nav .open > a, 
  .nav .open > a:focus, 
  .nav .open > a:hover { 
    background: none;
    color: rgba(255,255,255,1);
    border-bottom: 10px solid #A82B2E }

}

@media (max-width: 767px) {

  .navbar-collapse {
    border: 0 !important;
    box-shadow: 0 !important;
    width: 100%;
    top: 69px;
    position: absolute;
    z-index: 200 }

  .navbar-nav { margin-top: 0 }

  .navbar-nav > li { border-bottom: 1px solid rgba(0,0,0,0.7); }

  .navbar-nav > li:nth-last-child(1) { border-bottom: 0 }

  .navbar-nav > li > a { 
    display: block;
    border-radius: 0;
    font-size: 120%;
    padding: 15px 20px }

  button.navbar-toggle {
    background: none;
    position: absolute;
    top: 5px;
    right: 0;
    padding: 10px }

  button.navbar-toggle .icon-bar { height: 3px }
   
}

.socialmedia { margin-top: 5px }

.socialmedia > a {
  background-position: top;
  margin-right: 3px;
  width: 25px;
  height: 25px;
  display: inline-block;
  text-indent: -1000px;
  overflow: hidden }

.socialmedia a.fb { background-image: url(img/ico-fb.png) }
.socialmedia a.tw { background-image: url(img/ico-tw.png) }
.socialmedia a.ig { background-image: url(img/ico-ig.png) }
.socialmedia a.in { background-image: url(img/ico-in.png) }
.socialmedia a.yt { background-image: url(img/ico-yt.png) }

.modal#search { background: rgba(0,0,0,0.9) }

.modal#search .modal-content {
  top: 100px;
  border: 0;
  background: none;
  box-shadow: none }

.modal#search .modal-header { border: 0 }

.modal#search .modal-header .close { 
  opacity: 0.8;
  color: #FFF }

.modal#search .modal-body { background: none }

.modal#search .modal-body .form-control { 
  border: 0 !important;
  color: #FFF;
  font-size: 180%;
  background: none;
  box-shadow: none;
  border-radius: 0;
  padding: 30px 10px;
  border-bottom: 3px solid rgba(255,255,255,0.3) !important }



/* headings/p/li/others
//////////////////////////////////////////////////////////////////////////////////////////*/
h1, h2, h3, h4, h5, h6 { 
  font-weight: 100; 
  text-transform: uppercase;
  margin: 0 0 50px 0;
  padding: 0;
  line-height: auto }

h2 { color: #282C47 }

p ~ h1,
p ~ h2,
p ~ h3,
p ~ h4,
p ~ h5, 
p ~ h6 { margin-top: 50px }

@media(min-width: 768px){
  /* NORMAL 
  h1 { font-size: 280% }
  h2 { font-size: 250% }
  h3 { font-size: 220% }
  h4 { font-size: 190% }
  h5 { font-size: 160% }
  h6 { font-size: 130% }*/

  /* GRANDE */
  h1 { font-size: 340% }
  h2 { font-size: 245% }
  h3 { font-size: 180% }
  h4 { font-size: 150% }
  h5 { font-size: 130% }
  h6 { font-size: 100% }

  /* MUITO GRANDE 
  h1 { font-size: 400% }
  h2 { font-size: 350% }
  h3 { font-size: 300% }
  h4 { font-size: 250% }
  h5 { font-size: 200% }
  h6 { font-size: 150% }*/

  /* EXTRA GRANDE 
  h1 { font-size: 450% }
  h2 { font-size: 400% }
  h3 { font-size: 350% }
  h4 { font-size: 300% }
  h5 { font-size: 250% }
  h6 { font-size: 200% }*/
}

@media(max-width: 767px){

  h1 { font-size: 200% }
  h2 { font-size: 160% }
  h3 { font-size: 130% }
  h4 { font-size: 120% }
  h5 { font-size: 110% }
  h6 { font-size: 100% }

  h1, h2, h3, h4, h5, h6 { margin-bottom: 25px }

}


/* carousel slideshow
//////////////////////////////////////////////////////////////////////////////////////////*/
.carousel-slideshow { width: 100% }

.carousel-slideshow .item img { 
  object-fit: cover;
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  width: 100% }

.carousel-slideshow .container {
  z-index: 2;
  position: absolute }

.carousel-control.left,
.carousel-control.right {
  color: #FFF;
  width: 20%;
  z-index: 30;
  background: none }

.carousel-fade .carousel-inner .item {
  -webkit-transition-property: opacity;
          transition-property: opacity }

.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right { opacity: 0 }

.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right { opacity: 1 }

.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0) } 

.carousel-slideshow .caption { color: #FFF }

@media (min-width: 768px) {
  .carousel-slideshow .item,
  .carousel-slideshow .item  img { height: 600px }

  .carousel-slideshow .carousel-indicators {  }

  .carousel-slideshow .container { 
    text-align: center;
    height: 100% }

  .carousel-slideshow .caption { 
    width: 100%;
    margin: 0 auto }

  .carousel-slideshow .caption .caption-inner { 
    margin: 200px auto 0 auto;
    width: 50% }

  .carousel-slideshow .caption .caption-title { 
    font-size: 480%;
    font-weight: 900;
    line-height: 100%;
    letter-spacing: -1px;
    margin-bottom: 10px }

  .carousel-slideshow .caption .caption-summary { 
    font-size: 200%;
    font-weight: 300;
    line-height: 130% } 
} 

@media (max-width: 767px) {
  .carousel-slideshow,
  .carousel-slideshow .container { padding: 0 }

  .carousel-slideshow .item,
  .carousel-slideshow .carousel-inner .item img { 
    height: 300px;
    width: 100% }  

  .carousel-slideshow .carousel-indicators { display: none } 

  .carousel-slideshow .caption {
    text-align: center;
    padding: 0 70px;
    bottom: 20px }

  .carousel-slideshow .caption .caption-title { 
    background: rgba(255,255,255,0.3);
    margin-bottom: 10px;
    line-height: 110%;
    font-size: 150%;
    font-weight: 700 }

  .carousel-slideshow .caption .caption-summary { 
    text-shadow: 0 0 5px rgba(0,0,0,0.5);
    line-height: 110%;
    font-size: 110%;
    color: #FFF;
    display: inline-block }
}



/* newsletter
//////////////////////////////////////////////////////////////////////////////////////////*/
.newsletter { background: #EEE }

.newsletter p { 
  line-height: 130%;
  font-size: 180% }

.newsletter .input-group { margin-top: 10px }



/* group default
//////////////////////////////////////////////////////////////////////////////////////////*/
.group .group-item { position: relative }

.group.mode-grid .group-item { text-align: center }

.group.mode-list .group-item.no-img { padding-left: 0 }

.group .group-item .item-img { margin-bottom: 10px }

.group.mode-list .group-item .item-img {
  position: absolute;
  left: 0; 
  top: 0 }

.group .group-item .item-title { 
  font-weight: 800;
  line-height: 120% }

.group .group-item .item-title,
.group .group-item .item-summary { margin-bottom: 10px }

.group .group-item .item-summary { font-size: 80% }

.group .group-item .item-img img { 
  border-radius: 5px;
  object-fit: cover }

@media(min-width: 768px){

  .group.mode-list .group-item { 
    padding-left: 170px;
    min-height: 170px }

  .group .group-item .item-title { font-size: 130% }
  .group .group-item.no-img .item-title { font-size: 180% }

  .group .group-item .item-img img { 
    width: 150px;
    height: 150px }

}

@media(max-width: 767px){

  .group .group-item { margin-bottom: 30px }

  .group.mode-list .group-item { padding-left: 100px }

  .group .group-item .item-title { font-size: 100% }

  .group .group-item .item-img img { 
    width: 80px;
    height: 80px }

  .group .group-item .item-img.ico-img img { max-height: 100px }

  .group .group-item a.link-more { display: none }

}



/* product-detail/product-group
//////////////////////////////////////////////////////////////////////////////////////////*/
.inner .product-group { background: #EEE }
.inner .row .product-group { background: #FFF }

.product-group .group-item .item-summary a { color: #333 }

.product h1,
.product-detail h2, 
.product-group h2 { 
  padding-bottom: 25px;
  margin-bottom: 25px }

.product-detail .btn { margin-bottom: 20px }

.category-group h3 { 
  margin: 0 0 10px 0;
  font-size: 120% }

.category-group ul li { margin-bottom: 5px }

@media(min-width: 768px){

  .product-group .col-sm-5pl { 
    float: left;
    width: 20% }

  .product-group .group-item { padding: 0 15px }

  .product-group .row { 
    padding-bottom: 40px;
    margin-bottom: 40px }

  .product-group .row:last-child { 
    padding-bottom: 0;
    margin-bottom: 0 }

  .product-group.group .row:last-of-type > div { margin-bottom: 0 }

  .product-group .group-item .item-img img { 
    width: 110px;
    height: 90px }

  .product-group .group-item .item-title { 
    margin-bottom: 5px;
    font-size: 110% }
}


@media(max-width: 767px){

  .product-group .group-item { margin-bottom: 0 }

  .product-group .row > div { 
    padding-top: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #DDD }

  .product-group .row:last-of-type > div:last-of-type { border-bottom: 0 }

  .product-group.group.mode-grid .group-item { padding: 0 15px }

  .product-group .group-item .item-title { margin-bottom: 0 }

  .product-detail .detail-ico { margin-bottom: 10px }

  .product-group .group-item .item-img img { 
    object-fit: contain;
    width: 100% }

  .category-group .btn { text-align: left }
  .category-group .btn .caret { 
    position: absolute;
    top: 15px;
    right: 30px }

  .category-group .dropdown-menu {
    width: auto;
    margin: 0 15px;
  }
}

 
/* detail page
//////////////////////////////////////////////////////////////////////////////////////////*/
.detail-title {
  color: #333;
  font-family: "Open Sans", Arial, Sans-serif;
  font-weight: 700;
  font-size: 270%;
  font-style: normal;
  letter-spacing: -1px;
  text-transform: none;
  margin-bottom: 20px }

.detail-date {
  font-size: 87.5%;
  margin-bottom: 20px }

.detail-summary {
  margin-bottom: 20px;
  font-size: 112.5%;
  color: #888 }

.detail-share {
  border-bottom: 3px solid #EEE;
  padding-bottom: 30px;
  margin-bottom: 30px }

.detail-text p {
  line-height: 160%;
  margin-bottom: 20px }

.detail-img.center-block { 
  margin: 0 0 30px 0;
  width: 100% }

.detail-img-legend {
  text-align: center;
  padding: 10px 0;
  color: #AAA;
  font-size: 80% }

.detail-gallery h3 { color: #777 }

.detail-gallery { background: #222 }

.detail-gallery a { margin-bottom: 30px }

.detail-gallery a img { object-fit: cover }

.detail-video { clear: both }

@media(min-width: 768px){

  .detail-title { font-size: 270% }

  .detail-text { margin-bottom: 80px }

  .detail-gallery a img { 
    border-radius: 5px;
    height: 150px }

  .detail-img.pull-left,
  .detail-img.pull-right { width: 50% }

  .detail-img.left25,
  .detail-img.right25 { width: 25% }

  .detail-img.pull-left { margin: 0 30px 30px 0 }
  .detail-img.pull-right { margin: 0 0 30px 30px }

}

@media(max-width: 767px){

  .detail-title { font-size: 200% }

  .detail-summary {
    border-bottom: 3px solid #EEE;
    padding-bottom: 30px;
    margin-bottom: 30px }

  .detail-img.pull-left,
  .detail-img.pull-right { 
    margin: 0 0 20px 0;
    width: 100%;
    float: none }

  .detail-img img { width: 100% }

  .detail-text { margin-bottom: 25px }

  .detail-gallery a img {  
    border-radius: 20px;
    height: 70px }
}



/* about home/inner
//////////////////////////////////////////////////////////////////////////////////////////*/
.about.bg-cover { background-image: url(img/bg-about.jpg) }

.about * { color: #FFF }

.about p { 
  margin-bottom: 1.5em;
  line-height: 160% }



/* form elements
//////////////////////////////////////////////////////////////////////////////////////////*/
.btn { 
  font-weight: 400; 
  text-transform: uppercase } 

input.error,
textarea.error,
select.error { background: #FFDFDF url(img/ico-required.png) no-repeat right 13px }

.modal .modal-body    { background: #EEE }
.modal .modal-footer  { background: #222 }

.modal  form .input-group { margin-bottom: 10px }

.modal  form .input-group-addon { 
  color: #BBB;
  background: #FFF;
  border: 1px solid #DDD;
  border-right: 0 }

.modal form .form-control {
  color: #666;
  border: 1px solid #DDD !important;
  box-shadow: none !important;
  padding-left: 0;
  border-left: 0 !important;
  min-height: 40px }

.modal  form textarea.form-control { 
  min-height: 146px;
  resize: none; 
  padding-top: 10px }

.modal form .input-group-addon { vertical-align: top }

.modal  form .input-group-addon .glyphicon { 
  color: #777;
  top: 7px }

@media(min-width: 768px){
  .search-form {
  width: 25%;
  position: absolute;
  top: -65px;
  right: 0 }
}

@media(max-width: 767px){
  .search-form { margin-bottom: 20px }
}



/* CONTACT 
//////////////////////////////////////////////////////////////////////////////////////////*/
.contact.bg-cover { 
  background-image: url(img/bg-contact.jpg);
  color: #FFF }

.contact h2 { color: #FFF }
.contact h3 { margin-bottom: 20px }

.contact form .input-group-addon { 
  color: #BBB;
  background: #FFF;
  border: 1px solid #DDD;
  border-right: 0 }

.contact form .form-control {
  color: #666;
  border: 1px solid #DDD !important;
  box-shadow: none !important;
  padding-left: 0;
  border-left: 0 !important;
  min-height: 40px }

.contact form textarea.form-control { 
  min-height: 146px;
  resize: none; 
  padding-top: 10px }

.contact form .input-group-addon { vertical-align: top }

.contact form .input-group-addon .glyphicon { 
  color: #777;
  top: 7px }

.contact form .row > div > div { margin-bottom: 10px !important }

.contact .contact-info p { margin-bottom: 20px }

.contact .contact-info .glyphicon { margin-right: 10px }



/* FOOTER
//////////////////////////////////////////////////////////////////////////////////////////*/
/*footer { 
  background: url(img/bg-footer.jpg) no-repeat center;
  background-size: cover }
*/
footer a.brand-flexpoint {
  display: inline-block;
  text-indent: -1000000px;
  background: url(img/brand-flexpoint.png) bottom;
  width: 25px;
  height: 27px } 
  
footer a.brand-flexpoint:hover { background: url(img/brand-flexpoint.png) center } 

@media(min-width: 768px){
  footer { padding: 50px 0 }
}

@media(max-width: 767px){
  footer { padding: 20px 0 }
}



  /* global
//////////////////////////////////////////////////////////////////////////////////////////*/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both }

.link-more { 
  color: #282C47;
  font-weight: 900; 
  text-transform: uppercase;
  font-size: 75% }

.bg-cover { 
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center  }

.contact .modal-body { 
  background: #EEE;
  padding: 15px }

.contact .modal-body .input-group { margin-bottom: 5px }

.contact .modal-body .input-group:last-of-type { margin-bottom: 0 }