/*======================= GENERAL =======================*/
:root { 
    background: 12px;
}
@media screen and (min-width: 961px){
  :root { 
      background: 16px;
  }  
}
body{
  font-family: 'Open Sans', sans-serif;
  color: #1e1e1e;
  overflow-x: hidden;
}

img{max-width: 100%;}

.clear{
  content: "";
  display: table;
  clear: both;
}

h1{
  font-weight: bold;
  font-size: 1.5rem;
  color: #1e1e1e;
  text-transform: uppercase;
}
@media screen and (min-width: 961px){
  h1{
    font-size: 2rem;
  }  
}
h1:after{
  content: "";
  width: 100px;
  height: 3px;
  background-color: #1e1e1e;
  display: block;
  margin: 0.5rem 0 2rem 0;
}
h2{
  margin: 10px 0;
  font-size: 1rem;
  line-height: 1.5rem;
}


p{
  font-family: 'Open Sans', sans-serif;
  color: #1e1e1e;
  font-size: 0.875rem;
  line-height: 1.5rem;
}
@media screen and (min-width: 991px){
  p{text-align: justify;}
}

a{
  color: #1e1e1e;
  font-weight: bold; 
}
a:hover{
  text-decoration: none;
}

ul, ol{
  margin: 0;
  padding: 0 0 0 17px;
}
ul li, ol li{
  font-family: 'Open Sans', sans-serif;
  color: #1e1e1e;
  font-size: 0.875rem;
  line-height: 1.5rem;
}

ul.logo-list{
  margin: 0;
  padding: 0;
  list-style-type: none;
}
ul.logo-list li{
  display: inline-block;
  vertical-align: top;
  float: left
}

a.logo{
  display: block;  
  width: 100%;
  text-decoration: none;
}
a.logo img{
  max-width: 100%;
  display: block;
}

.website-title{
  font-size: 1rem;
  font-weight: 800;
  color: #1e1e1e;
  margin: .75rem 0;
}
@media screen and (min-width: 961px){
  .website-title{
    font-size: 1.75rem;
  } 
}
.website-contact-desk{
  display: none;  
}
.website-contact-mob{
  display: block;
}
.website-contact{
  font-size: 13px;
  color: #014493;
  line-height: 1.25rem;
  font-weight: bold;
}
.website-contact span{
  margin-right: 5px;
  font-weight: bold;
}
@media screen and (min-width: 468px){
  .website-contact-desk{
    display: block;
  }  
  .website-contact-mob{
    display: none;
  }  
}



header{
  margin: 0 0 1rem 0;
  padding: 1rem 0 0.5rem 0;
  box-shadow: 0px 1px 5px #000;
}
@media screen and (min-width:961px){
  header{
    margin: 0;
    padding: 1rem 0 0.5rem 0;
    box-shadow: 0px 1px 5px #000;
  }
}

.header-image{
  box-shadow: 0px 3px 7px 0px #999;
}
.homepage-info{
  box-shadow: 0px 3px 7px 0px #999; 
}
.homepage-info p{
  text-align: center!important;
}

.homebox-title{
  text-transform: uppercase;
  font-weight: bold;
  font-size: 1rem;
}

.in-site .middle-section-spy{
  display: none;
}
.middle-section-spy{
  background-color: #1e1e1e;
  margin: 0 0 3rem 0;
  padding: 2rem 0;
}
.middle-section-spy img{
  display: block;
  margin: 0 0 1.5rem 0;
}
@media screen and (min-width: 961px){
  .middle-section-spy img{
    margin: 0; 
  }
  .in-site .middle-section-spy{
    display: block;
  }
}
.mss-title{
  color: #510708;
  font-weight: 800;
  font-size: 1.75rem;
  line-height: 1.75rem;
  margin: 0;
}
@media screen and (min-width: 961px){
  .mss-title{
    font-size: 2.5rem;
    line-height: 2.5rem; 
  }
}
.mss-subtitle{
  color: #510708;  
}

/* msi-ico-list */
.middle-section-ico{
  margin: 3rem 0;
}
ul.msi-ico-list{
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: center;
}
ul.msi-ico-list li{
  display: inline-block;
  margin: 1rem;
}
ul.msi-ico-list li a{
  text-transform: uppercase;
  text-decoration: none;
  color: #1e1e1e;
  display: block;
  font-size: .825rem;
}
ul.msi-ico-list li a:hover, ul.msi-ico-list li a:hover span{
  color: #666!important;
}
ul.msi-ico-list li a span{
  display: block;
}
ul.msi-ico-list li a .msi-ico-top{
  margin-bottom: 10px;
}

footer{
  width: 100%;
  padding: 60px 0 40px 0;
}
footer a{
  display: inline-block;
  float: left;
  color: #1e1e1e;
  font-family: 'Open Sans', sans-serif;
  text-decoration: none;
  font-size: 0.925rem;
  vertical-align: middle;
}
footer a:hover{
  color: #000000;
}
@media screen and (min-width:768px){
  footer a{
    float: right; 
  }
}
footer img{
  vertical-align: middle;
  padding-left: 0.75rem;
}
footer img.invisible-img{
  display: block;
  margin: 0;
}
@media screen and (min-width:961px){
  footer img.invisible-img{
    display: inline-block;
  }
  footer img{
    margin: 0;
  }  
}
footer .copy span{
  display: inline-block;
  color: #231f20;
  font-family: 'Open Sans', sans-serif;
  text-decoration: none;
  font-size: 0.925rem;
  vertical-align: middle;
}

.footer-border-top{
  border-top: 1px solid #cbcbcb;
  padding-bottom: 2rem;
}

.desk-view{display:none!important}
.mob-view{display:block!important}
@media screen and (min-width: 768px){
  .desk-view{display:block!important}
  .mob-view{display:none!important} 
}


/* contact */
.cform{
  padding: 1rem;
  margin-bottom: 40px;
  background-color: #ccc;
}
label{
  display: block;
  font-size: .825rem;
  margin: 15px 0 5px 0;
}
input[type="text"]{
  width: 100%;
  border: 1px solid #fff;
  font-size: .825rem;
  padding: 5px;
}
textarea{
  width: 100%;
  border: 1px solid #fff;
  font-size: .825rem;
  padding: 5px;
}
input[type="submit"]{
  -webkit-appearance: button;
  color: #333;
  background-color: #fff;
  border-color: #ccc;
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  margin: 20px 0 0 0;
  border: 0;
  outline: 0;
}
input[type="submit"]:hover{
  background-color: #e6bf45;
  border: 0;
  outline: 0;
}
.errors p{
  color: #d78b1d;
}
.errors ul li {
  font-size: .825em;
}

/*======================= SCROLL TO TOP =======================*/
.backTop {
  bottom: 90px;
  position: fixed;
  right: 15px;
  -webkit-transform: translateZ(0);
  z-index: 99;
  display: none;
}
.backTop a {
  background: #fff;
  -webkit-border-radius: 1000px;
  -moz-border-radius: 1000px;
  border-radius: 1000px;
  display: block;
  font: 38px/46px FontAwesome;
  height: 51px;
  text-align: center;
  width: 51px;
  border: 2px solid #fff;
  box-shadow: 1px 2px 3px -1px #888888;
   color: #000;
}
.backTop a > span:before {
  content: "\f106";
}
.backTop a:hover {
  background: #fff;
  /*box-shadow: 2px 5px 8px -1px #888888;*/
  color: #000;
}

/*======================= BURGER MENU =======================*/
#mob-logo {display:block}
#desk-logo {display:none}
#mob-menu .MenuSection{display:none; text-align:center;}
#desk-menu{display:none}
.burger-click-region{display:block}
@media (min-width: 1200px) {
  #mob-logo {display:none}
  #desk-logo {display:block}
  #mob-menu{display:none}
  #desk-menu{display:block}
}

.burger-menu {
  display: table-cell;
  vertical-align: middle;
  float: right;
}
@media (min-width: 1200px) {
  .burger-menu {display:none;}  
}
.burger-click-region {
  width: 30px;
  cursor: pointer;
  position: relative;
  margin: 13px 0;
  padding: 0 13px;
  box-sizing: content-box;
  text-align: justify;
}
.burger-menu-text{
  font-size: 9px;
  padding-top: 25px;
  color: #1e1e1e;
  text-transform: uppercase;
}
.burger-menu-piece {
  display: block;
  position: absolute;
  width: 30px;
  border-top: 2px solid #1e1e1e;
  transform-origin: 50% 50%;
  transition: transform 400ms ease-out;
}
.burger-menu-piece:nth-child(1) {
  top: 4px;
}
.burger-menu-piece:nth-child(2) {
  top: 10px;
  opacity: 1;
  transition: transform 400ms ease-out, opacity 0ms linear 400ms / 2;
}
.burger-menu-piece:nth-child(3) {
  top: 16px;
}
  
.active .burger-menu-piece:nth-child(1) {
  animation: burger-open-top 400ms ease-out forwards;
}
.active .burger-menu-piece:nth-child(2) {
  opacity: 0;
  transition: transform 400ms ease-out, opacity 0ms linear 400ms / 2;
}
.active .burger-menu-piece:nth-child(3) {
  animation: burger-open-bot 400ms ease-out forwards;
}  
.closing .burger-menu-piece:nth-child(1) {
  animation: burger-close-top 400ms ease-out forwards;
}
.closing .burger-menu-piece:nth-child(3) {
  animation: burger-close-bot 400ms ease-out forwards;
}

@keyframes burger-open-top {
  50% {
    transform: translate3d(0, 6px, 0);
  }
  100% {
    transform: translate3d(0, 6px, 0) rotate(45deg);
  }
}

@keyframes burger-open-bot {
  50% {
    transform: translate3d(0, -6px, 0);
  }
  100% {
    transform: translate3d(0, -6px, 0) rotate(-45deg);
  }
}

@keyframes burger-close-top {
  0% {
    transform: translate3d(0, 6px, 0) rotate(45deg);
  }
  50% {
    transform: translate3d(0, 6px, 0) rotate(0deg);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes burger-close-bot {
  0% {
    transform: translate3d(0, -6px, 0) rotate(-45deg);
  }
  50% {
    transform: translate3d(0, -6px, 0) rotate(0deg);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}

/*======================= Menu =======================*/
ul.TopMenu{
  margin: 1rem 0 0 0; 
  padding: 0; 
  list-style-type: none;  
  display: inline-block; 
  vertical-align: top;
}
ul.TopMenu li{
  display: inline-block;
}
ul.TopMenu li a {
  display: inline-block;
}
ul.TopMenu li a span.top-menu-text{
  display: none;
  float: left;
  height: 25px;
  font-size: 12px;
  line-height: 25px;
  margin-right: 5px;
}
ul.TopMenu li a img{
  display: block;
  float: left;
}
ul.LangMenu{
  margin: 1rem 0 0 0; 
  padding: 0; 
  list-style-type: none;  
  display: inline-block; 
  vertical-align: top;
}
@media screen and (min-width: 961px){
  ul.TopMenu{
    margin: 0; 
  }
  ul.TopMenu li a span.top-menu-text{
    display: inline-block;
  }
  ul.LangMenu{
    margin: 0 0 0 1rem; 
  }  
}
ul.LangMenu li{
  display: inline-block;
}
ul.LangMenu li a{
  background-color: #1e1e1e;
  color: #ffffff;
  text-transform: capitalize;
  text-decoration: none;
  width: 25px;
  height: 25px;
  display: inline-block;
  line-height: 25px;
  text-align: center;
  border-radius: 100%;
  font-size: 12px;
}
ul.LangMenu li a.lang-active{
  background-color: #014493;
  color: #ffffff;
  text-transform: capitalize;
  text-decoration: none;
  width: 25px;
  height: 25px;
  display: inline-block;
  line-height: 25px;
  text-align: center;
  border-radius: 100%;
  font-size: 12px;
}


ul.MainMenu{
  margin: 1rem 0 0 0; 
  padding: 0; 
  list-style-type: none; 
  background-color: #ffffff;
  text-align: center;
}
ul.MainMenu li{
  display: block; 
  padding: 5px 0;
  position: relative;
}
ul.MainMenu li a{
  display: block; 
  text-decoration: none; 
  text-transform: uppercase; 
  color: #1e1e1e; 
  font-size: 13px; 
  background-color: transparent;
  padding: 4px 12px;
}
ul.MainMenu li a:hover{
  text-decoration: none; 
  color: #ffffff;
  background-color: #d8c579;
  padding: 4px 12px;
}
ul.MainMenu li a.current-page,
ul.MainMenu li a.current-page:hover{
  display: block; 
  text-decoration: none; 
  text-transform: uppercase; 
  color: #ffffff; 
  font-size: 13px; 
  background-color: #d8c579;
  padding: 4px 12px;
}

ul.MainMenuSubMob{
  display: none;
  left: 0;
  margin: 0;
  padding: 0;
  background-color: #d8c579;
  z-index: 1;
}
ul.MainMenuSubMob li a{
  display: block; 
  text-decoration: none; 
  text-transform: uppercase; 
  color: #1e1e1e; 
  font-size: 10px; 
  background-color: transparent;
  padding: 4px 12px;
  line-height: .8rem;
}
ul.MainMenuSubMob li a:hover{
  text-decoration: none; 
  color: #ffffff;
  background-color: #d8c579;
  padding: 4px 12px;
}
ul.MainMenuSubMob li a.current-page,
ul.MainMenuSubMob li a.current-page:hover{
  display: block; 
  text-decoration: none; 
  text-transform: uppercase; 
  color: #ffffff; 
  font-size: 10px; 
  background-color: #d8c579;
  padding: 4px 12px;
}

ul.MainMenuSubDesk{
  display: none;
  position: absolute;
  left: 0;
  margin: 0;
  padding: 0;
  background-color: #d8c579;
  z-index: 1;
}
ul.MainMenuSubDesk li a{
  display: block; 
  text-decoration: none; 
  text-transform: uppercase; 
  color: #1e1e1e; 
  font-size: 10px; 
  background-color: transparent;
  padding: 4px 12px;
  line-height: .8rem;
  margin: 0.5rem 0;
}
ul.MainMenuSubDesk li a:hover{
  text-decoration: none; 
  color: #ffffff;
  background-color: #d8c579;
  padding: 4px 12px;
}
ul.MainMenuSubDesk li a.current-page,
ul.MainMenuSubDesk li a.current-page:hover{
  display: block; 
  text-decoration: none; 
  text-transform: uppercase; 
  color: #ffffff; 
  font-size: 10px; 
  background-color: #d8c579;
  padding: 4px 12px;
}

#header_slider{display:none}
@media (min-width: 1200px) {
  #header_slider{display:block}
  ul.MainMenu{
    display:flex; 
    justify-content:space-between; 
    align-items:center;
    background-color: transparent;
  }
  ul.MainMenu li{
    padding: 0;
  }
}

a.fancygal{
  display: block;
  border: 3px double #565641;
}
a.fancygal img{
  width: 100%;
  display: block;
  padding: 10px;
}

.layerSliderH2{
  font-size: 16px;
  color: #fff;
}
.layerSliderLink{
  background: #dbc37b; 
  padding: 5px 10px;
  text-decoration: none;
}
.layerSliderLink:hover{
  background: #ffffff; 
}
@media screen and (min-width:961px){
  .layerSliderH2{
    font-size: 25px;
  }  
  .layerSliderLink{
    background: #dbc37b; 
    padding: 10px 25px ;
  }
}

a.btn-red{
  display: inline-block;
  text-decoration: none;
  text-transform: uppercase;
  color: #ffffff;
  font-size: 13px;
  background-color: #7a1314;
  padding: 0.55rem 2.5rem;
  font-weight: normal;
  margin: 1rem 0;
}
a.btn-red:hover{
  text-decoration: none;  
  background-color: #666;
}

.homebox{
  margin-bottom: 2rem;
}
.homebox p{
  text-align: center!important;
}
@media screen and (min-width: 768px){
  .homebox{
      margin-bottom: 0;
  } 
}


.logo-top{
  display: block;
  font-size: 0.8rem;
}
.logo-middle{
  display: block;
  background-color: #7b1314;
  color: #d8c579;
  font-size: 0.4rem;
  padding: 3.5px;
  letter-spacing: 0.3px;
  font-weight: normal;
  text-decoration: none;
  margin: 5px 0;
}
.logo-bottom{
  display: block;  
  font-size: 0.5rem;
}
.logo-simbol img{
  max-width: 30px;
}

a.cere-oferta{
  text-decoration: underline;
  font-size: 0.875rem;
  line-height: 1.5rem;
  color: #7a1314;
}
a.cere-oferta:hover{
  text-decoration: none;
}