*
{
  scroll-behavior: smooth;
}

body{
  overflow-x: hidden;
  margin:0;
  padding:0;

}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 50px;
  border: none;
  background:none;
  outline: none;
  color:#343a40; 
  cursor: pointer;
  transition: .5s;
}

#myBtn:hover {
   transform:scale(1.2);
}

a:hover{
  text-decoration: none;
}
.background-color{
  background-color:#ffca00; 
}
ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 0em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0px;
}
.inline-item .list-inline-item a:hover{
  color:#ccc!important;
}
.inline-item .list-inline-item a i:hover{
  color:#ccc!important;
}
.nav {
  text-align: center;
  font-weight: 600;

}

.nav * {
  box-sizing: border-box;
  transition: all .35s ease;
}

.nav li {
  display: inline-block;
  list-style: outside none none;
  margin: .5em 1em;
  padding: 0;
}

.nav a {
  padding: .5em .8em;
  color: rgba(255,255,255,.5);
  position: relative;
  text-decoration: none;
  font-size: 18px;
  letter-spacing: 1px;
  color: grey;
}

.nav a::before,
.nav a::after {
  content: '';
  height: 14px;
  width: 14px;
  position: absolute;
  transition: all .35s ease;
  opacity: 0;
}

.nav a::before {
  content: '';
  right: 0;
  top: 0;
  border-top: 3px solid #343a40;
  border-right: 3px solid #343a40;
  transform: translate(-100%, 50%);
}

.nav a:after {
  content: '';
  left: 0;
  bottom: 0;
  border-bottom: 3px solid #343a40;
  border-left: 3px solid #343a40;
  transform: translate(100%, -50%)
}

.nav a:hover:before,
.nav a:hover:after{
  transform: translate(0,0);
  opacity: 1;
}

.nav a:hover {
  color: #343a40;
  text-decoration: none;
}

a{
  color: #111
}
.caption1{
   top:30%;
 
}
.caption2{
  top:30%;
}
.content-1{
  font-weight: 200;
  letter-spacing: -1px;
 
}
.content-2{
  font-weight: 700;
  font-size: 70px;
 
}
.product-grid6,.product-grid6 .product-image6{
  overflow:hidden;
}
.product-grid6{
  font-family:'Open Sans',sans-serif;
  text-align:center;
  position:relative;
  transition:all .5s ease 0s;
}
.product-grid6:hover{
  box-shadow:0 0 10px rgba(0,0,0,.3);
}
.product-grid6 .product-image6 a{
  display:block;
}
.product-grid6 .product-image6 img{
  width:100%;
  height:auto;
  transition:all .5s ease 0s;
}
.product-grid6:hover .product-image6 img{
  transform:scale(1.1);
}
.product-grid6 .product-content{
  padding:12px 12px 15px;
  transition:all .5s ease 0s;
}
.product-grid6:hover .product-content{
  opacity:0;
}
.product-grid6 .title{
  font-size:20px;
  font-weight:600;
  text-transform:capitalize;
  margin:0 0 10px;
  transition:all .3s ease 0s;
}
.product-grid6 .title a{
  color:#000;
}
.product-grid6 .title a:hover{
  color:#343a40;
}
.product-grid6 .price{
  font-size:18px;
  font-weight:600;
  color:#343a40;
}
.product-grid6 .price span{
  color:#999;
  font-size:15px;
  font-weight:400;
  text-decoration:line-through;
  margin-left:7px;
  display:inline-block;
}
.product-grid6 .social{
  background-color:none;
  font-size: 20px;
  display: inline;
  position:absolute;
  list-style:none;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  width:100%;
  padding:0;
  margin:0;
  list-style:none;
  opacity:0;
  transform:translateX(-50%);
  top: 50%;
  bottom:-50%;
  left:50%;
  z-index:1;
  transition:all .5s ease 0s;
}
.product-grid6:hover .social{
  opacity:1;
  bottom:20px;
}
.product-grid6 .social li{
  display:inline-block;
}
.product-grid6 .social li a{
  color:white;
  font-size:16px;
  line-height:45px;
  text-align:center;
  height:45px;
  width:45px;
  margin:0 7px;
  border:2px solid white;
  border-radius:50px;
  display:block;
  position:relative;
  transition:all .3s ease-in-out;
}
.product-grid6 .social li a:hover{
  color:#343a40;
  background-color:white;
}
.product-grid6 .social li a:after,
.product-grid6 .social li a:before{
  content:attr(data-tip);
  color:#343a40;
  background-color:white;
  font-size:12px;
  letter-spacing:1px;
  line-height:20px;
  padding:1px 5px;
  border-radius:5px;
  white-space:nowrap;
  opacity:0;
  transform:translateX(-50%);
  position:absolute;
  left:50%;
  top:-30px;
}
.product-grid6 .social li a:after{
  content:'';
  height:15px;
  width:15px;
  border-radius:0;
  transform:translateX(-50%) rotate(45deg);
  top:-20px;z-index:-1;
}
.product-grid6 .social li a:hover:after,
.product-grid6 .social li a:hover:before{
  opacity:1;
}
@media only screen and (max-width:990px){.product-grid6{margin-bottom:30px}
}
.overlay1 {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color:#00000059;
}

.product-grid6:hover .overlay1 {
  opacity: 1;
}




.color{
  color: #343a40;
}
.rpr {
    display: inline-block;
    width: 40px;
    height: 40px;
    text-align: center;
    background-color: #343a40;
}
.erup {
    margin-top: 12px;
    color: white;
}
.rq {
    font-size: 14px;
    color: #343a40;
    font-weight: 480;
}
.top{
  top:20px;
}
.btndsgn{
  padding: 10px 40px!important;
  background:none !important;
  border-radius: 0px 30px 30px 30px;
  padding-left: 15px;
  margin-top: 20px;
  border:3px solid #343a40;
  color:  #343a40!important;
  font-weight: bold!important;
  transition: .5s;
}
.btndsgn:hover{
  background-color:  #343a40!important;
  color: white!important;
}





.form-contct {
  margin-top: 10px;
  background-color: #ffffff;
  -webkit-box-shadow: 0 0 12px 0 rgba(2, 2, 2, 0.16);
  -moz-box-shadow: 0 0 12px 0 rgba(2, 2, 2, 0.16);
  box-shadow: 0 0 12px 0 rgba(2, 2, 2, 0.16);
  overflow: hidden;
}
.form-contct::after, .form-contct::before {
  display: table;
  content: '';
}
.form-contct::after {
  clear: both;
}
@media (min-width: 1367px){
.main-content {
     padding-bottom: 0px; 
}
}
.form-message {
  padding-top: 55px;
  padding-right: 70px;
  padding-bottom: 40px;
  padding-left: 70px;
  background-color: #ffffff;
}
.form-message .title {
  font-size: 20px;
  font-weight: 500;
  color: #000000;
  text-align: left;
  font-style: normal;
  margin-bottom: 27px;
}
.zentimo-contact-fom .form-label {
  font-size: 14px;
  line-height: 30px;
  color: #888;
  display: block;
  margin-bottom: 5px;
}
.zentimo-contact-fom .form-control {
  position: relative;
  overflow: hidden;
}
.zentimo-contact-fom .form-control:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.zentimo-contact-fom .your-textarea {
 
}
.zentimo-contact-fom .button-submit {
  min-width: 157px;
  margin-top: 10px;
}
.form-contact-information {
  padding-top: 45px;
  padding-right: 45px;
  padding-bottom: 45px;
  padding-left: 45px;
  background-color: #ffcb00;
}
.zentimo-contact-info .title {
  font-size: 20px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 55px;
}
.zentimo-contact-info .item {
  display: block;
  overflow: hidden;
  margin-bottom: 32px;
}
.zentimo-contact-info .item .icon {
  display: inline-block;
  float: left;
  border: 1px solid  white;
  border-radius: 50%;
  width: 42px;
  height: 42px;
  margin-right: 20px;
  text-align: center;
  line-height: 40px;
}
.zentimo-contact-info .item .icon::before {
  font-family: 'FontAwesome';
  font-size: 20px;
  color: white;
  display: inline-block;
  text-align: center;
}
.zentimo-contact-info .address .icon::before {
  content: "\f041";
}
.zentimo-contact-info .phone .icon::before {
  content: "\f095";
}
.zentimo-contact-info .email .icon::before {
  content: "\f003";
}
.zentimo-contact-info .item .text {
  display: block;
  color: #000000;
  text-transform: capitalize;
  font-size: 14px;
  overflow: hidden;
}
.zentimo-contact-info .socials {
  padding-top: 238px;
}
.zentimo-contact-info .socials .social-item {
  font-size: 23px;
  color: #555;
  margin-right: 20px;
}
.zentimo-contact-info .socials .social-item:hover {
  color: #ffffff;
}
.bg{
  background-color: #ffcb00 ;
  padding: 10px 4px;
}
.margin-top{
  margin-top: 80px;
}
.right-icon{
  color:#343a40;
  background-color:white ;
  padding: 13px 15px;
  border:2px solid #343a40;
  border-radius: 50%; 
  transition: .5s;
}
.left-icon{
  color:#343a40;
  background-color:white ;
  padding: 13px 15px;
  border:2px solid #343a40;
  border-radius: 50%; 
  transition: .5s;
}
.right-icon:hover {
    background-color: #343a40;
    color:white;
   text-decoration: none;
}
.left-icon:hover {
    background-color: #343a40;
    color:white;
   text-decoration: none;
}

/* Mobile view Navbar */
.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 99;
  top: 0;
  left:0;
  background-color: #ffb700;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
  text-align:center;
}

.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;

}

.sidenav a:hover{
  color: #f1f1f1;
}

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}
/* end of Mobile view Navbar */
.line{
  height:3px;
  width:5%;
  background-color:#343a40; 
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
}

@media only screen and (max-width: 768px) {
  .caption1{
   top:7%;
 
}
.caption2{
  top:7%;
}
.content-1{
  font-weight: 300;
  letter-spacing: -1px;
  font-size: 14px;
 
}
.content-2{
  font-weight: 700;
  font-size: 28px;
 
}
.btndsgn{
  padding: 5px 30px!important;
  background:none !important;
  border-radius: 0px 30px 30px 30px;
  padding-left: 15px;
margin-top: 3px;
  border:3px solid #343a40;
  color:  #343a40!important;
  font-weight: bold!important;
  transition: .5s;
}
  }