.hotsite-image-fluid{max-width:100%;height:auto;vertical-align:middle}
.hotsite,.hotsite *,.hotsite *:after,.hotsite *:before{box-sizing:border-box;font-size:14px}
.hotsite{position:relative;overflow:hidden; background-color: #010329}
.hotsite h2{font-size:18px;margin:41px 0}
.hotsite p{margin:10px 0;display:block}
.hotsite-container{min-width:1000px;max-width:1280px;width:100%;margin:0 auto;padding:1.05% .390625%;box-sizing:border-box}
.hotsite-container{content:"";display:table;clear:both}
[class^="hotsite-col-"]{float:left;margin:0;box-sizing:border-box;position:relative}
.hotsite-col-3{width:24.43%}
.hotsite-col-6{width:50%}
.hotsite-col-12{width:98.5%}
.hotsite-row{position:relative;overflow:hidden}
.hotsite-area-1 .hotsite-container{padding:44px .390625%}
.hotsite-area-1{background-color:#1d1d1d}
.hotsite-area-1 .hotsite-image-drop{height:355px}
.hotsite-area-4 .hotsite-image-drop{height:280px}
.hotsite-area-3 .hotsite-col-3:first-child .hotsite-image-drop{height:280px}
/*.hotsite-area-3 .hotsite-col-3:first-child>*:first-child{margin-bottom:20px}*/
.hotsite-area-3 .hotsite-image-drop{height:580px}
.hotsite-area-5 .hotsite-col-3:first-child .hotsite-image-drop{height:580px}
.hotsite-area-5 .hotsite-col-6 div>*,.hotsite-area-5 .hotsite-col-3:nth-child(2) .hotsite-image-drop{height:280px}
.hotsite-area-5 .hotsite-col-6>*:first-child,.hotsite-area-5 .hotsite-col-3:nth-child(2)>*:first-child{margin-bottom:20px}
[class^="hotsite-col-"] img{border-radius:5px}
.hotsite-area-bg{position:absolute;width:100%;height:100%;top:0;left:0;}
.hotsite-area-bg img{width:1920px;position:relative;margin-left:45%;left:-840px;background-repeat:repeat!important}
.img-mobile{display:none;margin:}
.img-mobile img{margin:75px auto}
.hover-image img:last-child{display:none;}
.hover-image:hover img{ -webkit-animation: flash 1.5s;animation: flash 1.5s;}
.hover-image:hover img:first-child{display:none; opacity: 1;    -webkit-animation: flash 1.5s;animation: flash 1.5s;}
.hover-image:hover img:last-child{display:inline-block;}
.img-desk{display:block;height:482px;width:100%}
.dd-img{width:100%;height:auto;display:flex;align-items:center;justify-content:center;text-align:center;position:relative}
   



 /* --- start --- this style is constant ---------- */
@keyframes slider-key-next {
  0% {left: 100%; }
  100% {left: 0; }
}
@keyframes slider-key-left {
  0% {left: 0; }
  100% {left: -100%; }
}
@keyframes slider-key-previous {
  0% {left: -100%; }
  100% {left: 0; }
}
@keyframes slider-key-right {
  0% {left: 0; }
  100% {left: 100%; }
}
.slider {
  overflow: hidden;
  position: relative;
}
.slider > ul {
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
  float: left;
  width: 100%;
  overflow: hidden;
}
.slider > ul > li {
  position: absolute;
  left: 100%;
  top: 0;
  width: 100%;
  height: 100%;
  visibility: hidden;
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
}
.slider > ul > li.active {visibility: visible; left: 0; }
.slider > ul > li.left {animation-name: slider-key-left; }
.slider > ul > li.next {animation-name: slider-key-next; }
.slider > ul > li.right {animation-name: slider-key-right; }
.slider > ul > li.previous {animation-name: slider-key-previous; }
/* --- end --- this style is constant ---------- */


/* -- your style here -- */
.slider {
  max-width: 600px;
  margin: 0 auto;

}
.slider > button {
  transition: 0.3s;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 60px;
  background-color: #fafafa;
  opacity: 0.5;
  border: 0;
  outline: none;
  padding: 0;
  box-shadow: 0 3px 6px rgba(0,0,0,0.2);
  background-size: 110%;
  background-repeat: no-repeat;
  background-position: center;
}
.slider > button:hover {
  opacity: 1;
  box-shadow: 0 5px 10px rgba(0,0,0,0.2);
}
.slider > button:nth-child(2) {
  left: 10px;
  background-image: url('https://www.pontofrio-imagens.com.br/criacao/03-hotsite/2018/03-marco/29/seta-esquerda.png');
}
.slider > button:nth-child(3) {
  right: 10px;
  background-image: url('https://www.pontofrio-imagens.com.br/criacao/03-hotsite/2018/03-marco/29/seta-direita.png');
}
.slider > ul > li > img {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.slider > ul > li {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 0;
}
.slider > ul > li h1,
.slider > ul > li p {
  position: relative;
  padding: 0 15%;
  color: #fff;
  font-family: sans-serif;
}



@media all and (max-width:950px){.hotsite-container{min-width:0}
.img-mobile{display:block}
.img-desk{display:none}
.hotsite-area-1 .hotsite-col-12,.hotsite-area-1 .hotsite-container{width:100%;margin:0;padding:0}
.hotsite-area-3 .hotsite-col-3{width:48.43%}
.hotsite-area-3 .hotsite-col-6{width:100%;margin:5px .78125% 0}
.hotsite-area-5 .hotsite-col-3{width:48.43%}
.hotsite-area-5 .hotsite-col-6{width:100%;margin-top:5px}
.hotsite-area-3 .hotsite-col-3:first-child .hotsite-image-drop,.hotsite-area-5 .hotsite-col-3:nth-child(2) .hotsite-image-drop{height:190px}
.hotsite-area-3 .hotsite-image-drop,.hotsite-area-5 .hotsite-col-3:first-child .hotsite-image-drop{height:385px}
.hotsite-area-5 .hotsite-col-6 div>*:first-child,.hotsite-area-5 .hotsite-col-3:nth-child(2)>*:first-child{margin-bottom:5px}
.hotsite-area-4 .hotsite-col-6{width:100%;margin:5px .78125% 0}
.hotsite-area-4 .hotsite-image-drop,.hotsite-area-5 .hotsite-col-6 .hotsite-image-drop{height:150px}
/*.hotsite-area-3 .hotsite-col-3:first-child>*:first-child,.hotsite-area-5 .hotsite-col-6>*:first-child,.hotsite-area-5 .hotsite-col-3:nth-child(2)>*:first-child{margin-bottom:5px}*/
.nav-menu, body .nav-menu {
    background-color: #e5f1fb;
    position: absolute;
    width: 100%;
    z-index: 905;
   top: 0 auto !important
   }
}