img{max-width: 100%; height: auto}

body{padding-top: 80px;}
h2,h3{margin: 20px 0; padding: 10px 0}

h2{color:#900d1d}
h3{color:#7d2257}
.navbar {
  background-image: linear-gradient(to right , #900d1d, #90092e, #8c0e3d, #86184b, #7d2257, #712b61, #643369, #563a6d);
  color:#fff;
  /*background: linear-gradient(110deg, rgba(144,13,29,1) 0%,rgba(144,13,29,1) 30%,rgba(144,13,29,1) 50%,rgba(144,13,29,1) 75%,rgba(144,13,29,1)100%);}*/
}
.navbar a{color:#fff; padding: 0 3px; text-decoration: none}
.navbar img{height: 64px;}
.navbar span{padding-left: 10px;}
section{
  display: block;
  max-width: 100vw;
  min-height: 45vh;
  position: relative;
}


.container-fluid .row{max-width: 1200px; margin: auto}


#start > .container-fluid {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 10;
  background: linear-gradient(110deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 30%, rgba(255, 255, 255, 0) 100%);

}

#start > .container-fluid .row,
#start > .container-fluid .col-sm-8,
#start > .container-fluid .d-flex{height: 100%}


#homeSlider .carousel-item{background-size: cover; width: 100%; min-height: calc(100vh - 64px); display: block}

#offer .col-sm-6{position: relative;}
#offer .col-sm-6.pt-5{overflow: hidden}
#offer i {width:6vw; height: 6vw; background-image: url('../media/ico2.svg'); display: inline-block; background-size: cover; position: absolute; z-index: 102}
#offer i:nth-of-type(2){background-image: url('../media/ico1.svg'); width:8vw; height: 8vw; top:15%; left:17%;opacity: 0.7}
#offer i:nth-of-type(3){background-image: url('../media/ico3.svg'); width:6vw; height: 6vw; top:-8%; right: 22%; opacity: 0.7}
#offer i:nth-of-type(4){background-image: url('../media/ico4.svg'); width:10vw; height: 10vw; top:29%; left:43%;opacity: 0.7}
#offer i:nth-of-type(5){background-image: url('../media/ico5.svg'); width:8vw; height: 8vw; top:58%; right:0%; opacity: 0.9}
#offer i:nth-of-type(6){background-image: url('../media/ico6.svg'); width:7vw; height: 7vw; top:65%; opacity: 0.7}

#gallery img{ height: 140px; width: auto; border-top-right-radius: 20px; border-bottom-left-radius: 20px;}
#gallery > div{ padding: 0.5rem 0.5rem 1rem 0.5rem; text-align: center}
#gallery{padding: 20px 0;}



#contact{
  color: #fff;
  padding-top: 150px;
  background-image: linear-gradient(to left top, #900d1d, #90092e, #8c0e3d, #86184b, #7d2257, #712b61, #643369, #563a6d);
  z-index: 202;
}

#contact img.logo{height:100px; width: auto; margin: 0 auto 20px}
#contact img.magda{border-top-right-radius: 20px; border-bottom-left-radius: 20px;  max-height: 360px}
#contact address{}
footer{line-height: 60px;}

.wrap:before{
background-image:url("../media/path.svg");

  background-repeat: no-repeat;
  background-size: 100% 100%;
  height: 6em;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: 100;
}
.wrap:before{
  -moz-transform: translateY(-100%);
  -webkit-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
  content: '';
  top: 1px;
}

#contact.wrap:before{
  top:-1px;
  transform: translateY(0) rotateX(-180deg);
}
#contact .d-flex{width:100%; height: 100%;}

.map-responsive{
  overflow:hidden;
  padding-bottom:75%;
  position:relative;
  height:0;
  width:100%;
}
.map-responsive iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute;
}

@media (max-width:768px) {
  body{padding-top: 50px; font-size:0.9rem}
  h2{font-size: 1.2em; margin: 10px 0}
  h3{font-size:1.1em; margin: 10px 0}
  h4{font-size:1.05em}

  .navbar{padding-left: 5px; padding-right: 5px;}
  .navbar > .container-fluid{padding-left: 5px; padding-right: 5px;}
  .navbar img{height: 34px;}
  .navbar-brand{margin-right: 0; margin-left: -2px; padding: 0}

  #homeSlider .carousel-item{background-position: 58% center}
  #start > .container-fluid .col-sm-8{text-align: center}
  #start > .container-fluid .col-sm-8 ul{text-align: left}
  #start > .container-fluid .d-flex > div{margin-top:-35px;}

  #offer .container-fluid > .row > .col-sm-6{padding-bottom: 20px; margin-bottom: 20px}
  #offer .container-fluid > .row > .col-sm-6:first-of-type{min-height: 100px;}
  #offer .pt-5{padding-top:10px !important; padding-bottom: 0; margin-bottom: 0}
  #offer i {transform: scale(1.7)}
  #offer i:nth-of-type(1){top:10px; left:16%;}
  #offer i:nth-of-type(3){right: 35%}
  #offer i:nth-of-type(4) {left:34%; top:35%;}
  #offer i:nth-of-type(5) {right:7%; top:40%;}
  #offer i:nth-of-type(2){display: none}
  .wrap:before{height: 4em}
  #contact{padding-top: 100px; text-align: center}
  #contact .magda{ margin: 10px auto 30px;}
}
@media (max-width:560px) {
  .navbar-text{font-size: 0.8rem}
}