body{
    background-color: #ebebeb;
    cursor: crosshair;
}
/* pareffect */

h2{
    font-size: 4.5vw
}
.sigla_h{
    width: 14%;
    margin:0 1%
}
.guv, .eu, .is{
    display: none
}

.carousel-wrapper{
 
  position:relative;
 height:500px;
  margin:0 auto;
}
.carousel-item{
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  padding:25px 50px;
  opacity:1;
  transition: all 0.5s ease-in-out;
}
.arrow{
  border: #dfb561;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 12px;
}

.arrow-prev{
  left:5%;
  position:absolute;
  top:50%;
  background-image: url("https://servicii-funerare-bocsa.ro/foto/pachete/produsul-anterior.png");
width:10%;
background-repeat:no-repeat;
background-size: contain;
}
 
.arrow-next{
    right:5%;
  position:absolute;
  top:50%;
  background-image: url("https://servicii-funerare-bocsa.ro/foto/pachete/produsul-urmator.png");
width:10%;
background-repeat:no-repeat;
background-size: contain;
  }

.light{
  color:white;
}


  
    
/*Select every element*/
[id^="item"] {
    display: none;
  }

  #item-1t:target ~ .item-1t {
    opacity: 1;
  }

#item-2t:target ~ .item-2t, #item-3t:target ~ .item-3t, #item-4t:target ~ .item-4t, #item-5t:target ~ .item-5t, #item-6t:target ~ .item-6t, #item-7t:target ~ .item-7t, #item-8t:target ~ .item-8t, #item-9t:target ~ .item-9t, #item-10t:target ~ .item-10t, #item-11t:target ~ .item-11t, #item-12t:target ~ .item-12t, #item-13t:target ~ .item-13t {
    z-index: 3;
    opacity: 1;
  }
}
 #item-1c:target ~ .item-1c {
    opacity: 1;
  }

#item-2c:target ~ .item-2c, #item-3c:target ~ .item-3c, #item-4c:target ~ .item-4c, #item-5c:target ~ .item-5c, #item-6c:target ~ .item-6c {
    z-index: 3;
    opacity: 1;
  }
  #item-1ca:target ~ .item-1ca {
    opacity: 1;
  }

#item-2ca:target ~ .item-2ca, #item-3ca:target ~ .item-3ca, #item-4ca:target ~ .item-4ca, #item-5ca:target ~ .item-5ca, #item-6ca:target ~ .item-6ca {
    z-index: 3;
    opacity: 1;
  }
   #item-1co:target ~ .item-1co {
    opacity: 1;
  }

#item-2co:target ~ .item-2co, #item-3co:target ~ .item-3co, #item-4co:target ~ .item-4co, #item-5co:target ~ .item-5co, #item-6co:target ~ .item-6co, #item-7co:target ~ .item-7co, #item-8co:target ~ .item-8co   {
    z-index: 3;
    opacity: 1;
  }
   #item-1mb:target ~ .item-1mb {
    opacity: 1;
  }

#item-2mb:target ~ .item-2mb{
    z-index: 3;
    opacity: 1;
  }
}



#item-1:target ~ .item-1 {
    opacity: 1;
  }

#item-2:target ~ .item-2, #item-3:target ~ .item-3, #item-4:target ~ .item-4, #item-5:target ~ .item-5, #item-6:target ~ .item-6, #item-7:target ~ .item-7, #item-8:target ~ .item-8,  #item-9:target ~ .item-9,  #item-10:target ~ .item-10, #item-11:target ~ .item-11, #item-12:target ~ .item-12, #item-13:target ~ .item-13, #item-14:target ~ .item-14, #item-15:target ~ .item-15, #item-16:target ~ .item-16, #item-17:target ~ .item-17, #item-18:target ~ .item-18, #item-19:target ~ .item-19, #item-20:target ~ .item-20, #item-21:target ~ .item-21, #item-22:target ~ .item-22, #item-23:target ~ .item-23, #item-24:target ~ .item-24, #item-25:target ~ .item-25, #item-26:target ~ .item-26,  #item-27:target ~ .item-27, #item-28:target ~ .item-28,  #item-29:target ~ .item-29,  #item-30:target ~ .item-30, #item-31:target ~ .item-31, #item-32:target ~ .item-32, #item-33:target ~ .item-33, #item-34:target ~ .item-34, #item-35:target ~ .item-35, #item-36:target ~ .item-36, #item-37:target ~ .item-37, #item-38:target ~ .item-38, #item-39:target ~ .item-39, #item-40:target ~ .item-40, #item-41:target ~ .item-41, #item-42:target ~ .item-42, #item-43:target ~ .item-43, #item-44:target ~ .item-44, #item-45:target ~ .item-45, #item-46:target ~ .item-46, #item-47:target ~ .item-47, #item-48:target ~ .item-48,  #item-49:target ~ .item-49,  #item-50:target ~ .item-50, #item-51:target ~ .item-51, #item-52:target ~ .item-52, #item-53:target ~ .item-53, #item-54:target ~ .item-54, #item-55:target ~ .item-55, #item-56:target ~ .item-56, #item-57:target ~ .item-57, #item-58:target ~ .item-58, #item-59:target ~ .item-59, #item-60:target ~ .item-60, #item-61:target ~ .item-61, #item-62:target ~ .item-62, #item-63:target ~ .item-63, #item-64:target ~ .item-64, #item-65:target ~ .item-65, #item-66:target ~ .item-66, #item-67:target ~ .item-67, #item-68:target ~ .item-68,  #item-69:target ~ .item-69,  #item-70:target ~ .item-70, #item-71:target ~ .item-71, #item-72:target ~ .item-72, #item-73:target ~ .item-73, #item-74:target ~ .item-74, #item-75:target ~ .item-75, #item-76:target ~ .item-76, #item-77:target ~ .item-77, #item-78:target ~ .item-78, #item-79:target ~ .item-79, #item-80:target ~ .item-80, #item-81:target ~ .item-81, #item-82:target ~ .item-82, #item-83:target ~ .item-83, #item-84:target ~ .item-84, #item-85:target ~ .item-85, #item-86:target ~ .item-86 {
    z-index: 3;
    opacity: 1;
  }
}

#item-1s:target ~ .item-1s {
    opacity: 1;
  }

#item-2s:target ~ .item-2s, #item-3s:target ~ .item-3s, #item-4s:target ~ .item-4s, #item-5s:target ~ .item-5s, #item-6s:target ~ .item-6s, #item-7s:target ~ .item-7s, #item-8s:target ~ .item-8s,  #item-9s:target ~ .item-9s,  #item-10s:target ~ .item-10s, #item-11s:target ~ .item-11s, #item-12s:target ~ .item-12s, #item-13s:target ~ .item-13s, #item-14s:target ~ .item-14s, #item-15s:target ~ .item-15s, #item-16s:target ~ .item-16s, #item-17s:target ~ .item-17s, #item-18s:target ~ .item-18s, #item-19s:target ~ .item-19s, #item-20s:target ~ .item-20s, #item-21s:target ~ .item-21s, #item-22s:target ~ .item-22s, #item-23s:target ~ .item-23s, #item-24s:target ~ .item-24s, #item-25s:target ~ .item-25s, #item-26s:target ~ .item-26s,  #item-27s:target ~ .item-27s, #item-28s:target ~ .item-28s,  #item-29s:target ~ .item-29s,  #item-30s:target ~ .item-30s, #item-31s:target ~ .item-31s, #item-32s:target ~ .item-32s, #item-33s:target ~ .item-33s, #item-34s:target ~ .item-34s, #item-35s:target ~ .item-35s, #item-36s:target ~ .item-36s, #item-37s:target ~ .item-37s, #item-38s:target ~ .item-38s, #item-39s:target ~ .item-39s, #item-40s:target ~ .item-40s, #item-41s:target ~ .item-41s, #item-42s:target ~ .item-42s, #item-43s:target ~ .item-43s {
    z-index: 3;
    opacity: 1;
  }
}


.head{
    background-image: url("../foto/home/fundal-header-ciprianca-servicii-funerare.jpg");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;

}
.head .sigla{
    width: 46%;
    margin: 5% 27% 0
}
.head h1{
    margin-top: 1%!important;
    font-size: 2.6vw;
    padding: 0 15%;
    font-variant: small-caps;
}
.mm{
    width: 12%;
    margin: 5% 44%;
}
.separator{
    width: 0.12vw;
    margin: 2% 0 -6% 50%;
    z-index: 2;
    height: 8vw
}
.w3-padding{
    padding: 6% 15%!important;
}
.despre h2{
    font-size:4vw;
    margin-top:5%
}
.despre p{
    line-height: 3vw;
    font-size:1.4vw;
}
.deco-s{
    width:16%;
    margin:-2% 42% 0;
}
.amm{
    font-size: 1.6vw;
    width:24%;
    padding: 1.2%;
    margin:2% 38%;
}
.pachete{
    background-image: url("../foto/home/fundal-servicii-funerare-documente.jpg");
}
.pachete .deco-s{
    margin-bottom: 5%
}
.p1{
    background-image: url("../foto/deco/separator-vertical-punctat.png");
    background-position: top right;
    background-size: 0.4% 100%;
    background-repeat: no-repeat;
}
.pachet{
    padding: 5%
}

.pachet .icon{
    width: 30%;
    margin: 5% 35% 2%;
}
.ce-putem{
    z-index: 2;
}
.ce-putem .separator{
    height: 8vw;
    margin-bottom: 3%;
    width:0.2vw;
    margin:-5% 50%
}
.ce-putem .deco-s{
    height: 1.2vw;
    margin-top: -1%
}
.serviciu{
    background-image: url("../foto/deco/deco-fundal.png");
    background-size:30% 100%!important;
    background-repeat: repeat-y;
    background-position: top right;
    padding-bottom: 15%;
}
.serviciu .text{
    width: 25%;
    margin: 5% 5% 0 20%
}
.text p{
    padding-left: 7%;
    font-size: 1.5vw;
}
.amm{
    margin: 0% 18%;
    width: 18%;
    padding: 0.6%;
}

.galerie-produse {background-color:#111!important;
padding:0 10% 10% 10%;
width:90%;
margin-left:5%;}

.imgprod {width:70%;
margin-left: 15%;}


.butong {width:20%;
margin-top:15%;}
.serviciu img{
    width: 25%;
    margin: 5% 8% 0;
}
.w3-black{
    background-color: rgba(17, 17, 16, 1)!important;
}

.amm{
    z-index: 2;
}
.deco2{
    width: 60%;
    margin: -5% 20% 0;
}
.ornamente{
    margin-top: -8%
}
.ornamente h2{
    font-size: 3vw;
    margin:0 0 0.5%;
    line-height:3.4vw;
    z-index: 2
}
.deco_t{
    width: 16%;
    margin:0 42%;
    z-index: 2
}
.orn{
    display: flex;
    padding: 5% 15%;
}
.ornament{
    padding: 0 3%;
}
.ornament h3{
    font-size: 2vw;
}
.ornament img{
    width: 50%;
    margin: 0 25%;
}
.ornamente .amm{
    margin: 0 5%;
	width:90%!important;
	font-size:1vw;
}
.ornamente .separator{
    margin-top: 5%;
    margin-bottom: 0;
    height: 7vw
}
.serviciu2{
    background-image: url("../foto/deco/deco-fundal.png");
    background-size:30% 100%;
    background-repeat:no-repeat;
    background-position: top left;
    margin-top:-7%
}
.serviciu2 .text{
    width: 25%;
    margin: 10% 5% 0 5%
}
.serviciu2 img{
    width: 25%;
    margin: 12% 8% 12% 20%
}
.serviciu2 .text .amm{
    width: 70%;
    margin-top: 3%;
}

.felinare h2{
    font-size: 3vw;
    margin:0 0 0.5%;
    line-height:3.4vw;
    z-index: 2
}
.felinare p{
    font-size: 1.5vw;
    line-height:4vw;
    padding: 0 15%;
}
.felinare .amm{
    margin: 2% 39%;
    width: 22%
}
.felinare .text{
    width: 30%
}
.felinare .text p{
    line-height: 2.5vw;
    padding: 0 5%;
}
.felinare .serviciu{
    padding-bottom: 2%;
}

.contact{
    padding-top:5%;
}
.contact .deco-s{
    width: 10%;
    margin-left: 45%;
}
.contact h3{
    margin-top:-1%;
}
h3 span{
    font-size: 2vw;
}
.date{
    width: 50%;
    padding-left:15%;
    margin-top: 5%
}
.date .w3-btn{
    font-size: 1.5vw;
    width: 95%;
    text-align: left;
    white-space: normal;
    margin:2% 0;
}
.harta{
    width: 50%
}
.contact .mm{
    margin-top: -5%
}
.formular{
    background-image: url("../foto/produse/fundal-footer-produse.jpg");
    background-size:100% 80%;
    background-position: bottom center;
    background-repeat:no-repeat;
}
.formular .deco-s{
    height:0.8vw;
    width: 14%;
    margin-left:43%;
    margin-bottom:5%;
}
.formular h3 span{
    font-size: 3vw
}
.formular .vezi{
    width: 26%;
    font-size: 1.6vw;
    margin:5% 37%;
}
.formular input[type=text], .formular input[type=email]{
    width: 32%;
    margin: 2% 2% 2% 0;
    font-size: 2vw;

}
.formular input[type=email]{
    margin-right: 0!important;
}
.formular textarea{
    width: 100%;
    margin:0 2% 2% 0;
    font-size: 2vw;
    height: 14vw;

}
.formular input[type=submit]{
    font-size: 1.5vw;
    width: 26%;
    margin:2% 37% 0%;
}
.formular .deco2{
    margin:7% 5% 0;
    width: 90%;
}
.meniu_f, .meniu_f2{
    width: 50%;
}
.sigla_f{
    width: 60%;
    margin: 2% 0;
}
.meniu_f{
    padding-left: 10%
}
.meniu_f .w3-bar-item, .meniu_f2 .w3-bar-item{
    margin:0;
}
.meniu_f2{
    margin: 7% 0 0 0;
    padding-left:20%
}
.meniu_f2 .w3-bar-item img{
    width:5%
}
.formular{
    padding-bottom:4%!important;
    padding-top: 0 !important;
}
.copy{
    padding: 0 15%;
}
.sus{
    position: absolute;
    width: 6%;
    left: 47%;
    top: 10%;
}
.cp{
    margin-top:3%
}

@media only screen and (max-width: 768px) {
    .header {
        background-color: #534741 ;
        z-index:1!important;
    }
	
	.carousel-wrapper {height:70px;}
	    .arrow, .light .arrow {
        background-size: 10px;
        background-position: 10px 50%;
      }
	.deco_t {width:40%; margin:0 30%;}
	.ce-putem {margin-top: -1px;}
	.ornament {margin-top:5%; margin-bottom: 5%;}
	
	.felinare {margin-top:-1px; padding-top:15%;}
	.swiper-container {height:71vw!important;}
	.butong {margin-left:0; margin-top: 13%; width:22%;}
	.imgprod {width: 80%; margin-left:10%;}

    .parallax__layer--base {margin-bottom:-480%;}
    .righty {display:none;}
    #blinds-window {margin-top:55%;}
    #subscribeNews {margin-left:-44%;
        margin-right:-40%;
    }

    .acord {width: 100%;}
  

    .mai_mult{
        position: absolute;
        bottom: 0%;
        width: 40%;
        left:30%;
        z-index: 1;
    }
    .mai_mult a{
        width:40%;
        margin-left: 35%;
    }
   
    .despre{
        padding: 25% 15%;
    }
    .despre1{
        padding: 0;
        background-size: 90%;
        background-attachment: local;
        padding-top: 10%
    }
    .despre1 img{
        width: 90%;
        margin-left:10%;
    }
    .despre1 .text{
        width: 100%;
        margin: 0;
        padding: 25% 10%;
    }
    .despre1 .text p{
        line-height: 7vw;
    }
    .despre1 .text .mm{
        width: 42%;
    }

    .b2{
        background-position: right top;
        padding-top: 20%
    }
    .b2 img{
        width: 100%;
        margin: 0;
    }
    .b2 .text{
        margin: 0;
    }
    .p0{
        padding: 5% 0;
        background-size:100%;
    }
    .p0 h1{
        padding: 2% 10%;
    }
    .p0 img{
        margin: 0 0 25% 0;
    }
    .p0 p{
        padding: 0 10%
    }
    .b3{
        background-position: right top;
        padding-top: 10%
    }
    .b3 img{
        margin: 0;
    }
    .b3 .text{
        margin: 7% 0 0 0;
    }
    .b3 .text h2{
        margin-bottom:  0;
    }
    .b3 .text h3{
        margin-top: 0;
    }
    .b4{
        background-position: right top;
        padding-top: 30%;
        background-size: 90%;
    }
    .b4 .text{
        margin: 2% 0;
    }
    .b4 .text h2{
        margin-bottom:  0;
        margin-top: 0;
        line-height: 5vw
    }
    .b4 .text h3{
        margin-top: 0;
        margin-bottom:  0;
        line-height: 4vw
    }
    .b4 img{
        width: 100%;
        margin:0;
    }
    .b4 .text .mm{
        width: 80%
    }
    .video{

        width: 100%!important;
    }
    .contact{
        padding: 3% 10%;
    }
    .date{
        width: 100%;
        margin: 8% 0%;
    }
    .date a img{
        margin-right: 5%;
    }
   
    .formular input{
        width:100%;
        padding:3% 1%;
        font-size: 4vw
    }
    .w3-margin-left{
        margin-left: 0!important;
    }
    .formular textarea{
        width:100%;
        padding:3% 1%;
        font-size: 4vw
    }
    .formular #trimite{
        width: 40%!important;
        position: relative;
        bottom:auto;
        right:auto;
        height:33vw!important;
        margin: 5% 30%

    }
	

.sigla_h {width:40%; margin: 3% 0 3% 1%;}
.btn_meniu {margin-left:32%!important; margin-top:3%!important;}

.despre {padding-top:30%!important;}

.mm {width:40%!important;margin-left:30%;}
.serviciu .text {width:80%; margin-left:10%!important; margin-right:10%!important;}

.amm {width:80%!important; margin:10%!important; }
.serviciu21 img {width:80%; margin-left:10%!important; margin-right:10%!important;}
.serviciu21 .text1 {width:80%; margin-left:10%!important; margin-right:10%!important;}
.serviciu22 img {width:80%; margin-left:10%!important; margin-right:10%!important;}
.serviciu22 .text {width:80%; margin-left:10%!important; margin-right:10%!important;}
.ornamente h2 {margin: 5% 0 5%;}
.orn {display:block;}
.ornament {width:80%; margin-left:10%!important; margin-right:10%!important;}
.formular h3 span {font-size: 5vw;}
.formular .vezi {width:80%; margin-left:10%!important; margin-right:10%!important;}
.formular {margin: -1px 0 0 0!important;width:100%!important;background-size:cover; padding-top:15%;}
.meniu_f, .meniu_f2 {width:100%;padding-left:0;}
.sigla_f {width:100%;}

.serviciu .text {width:80%; margin-left:10%!important; margin-right:10%!important;}
.serviciu img {width:80%; margin-left:10%!important; margin-right:10%!important;}
.serviciu2 .text {width:80%; margin-left:10%!important; margin-right:10%!important;}
.serviciu2 img {width:80%; margin-left:10%!important; margin-right:10%!important;}

.it {margin-right: -31%!important;margin-top:3%!important;}

}