body{ overflow-x: hidden;
}

:root{
 --main-color:#f08245;
}

section {
  scroll-margin-top: 120px;}


.my-nav{box-shadow: 0px 3px 5px 0px #f081434f;}
.navbar-nav{column-gap: 30px; }

 .navbar-light .navbar-nav .nav-link {
color: rgba(0,0,0,.99); font-weight:600; font-size:18px;
}

.navbar-light .navbar-nav .nav-link:hover {
color: var(--main-color) ;
transition:2.5s;
}

.main-slider .carousel-inner img{height:680px; object-fit:cover;}

@media only screen and (max-width:767px){.main-slider .carousel-inner img{height:300px !important; object-fit:cover; }}

@-webkit-keyframes zoom{
from{
-webkit-transform: scale(1, 1);
}
to {
-webkit-transform: scale(1.5, 1.5);
}
}

@keyframes zoom {
from {
transform: scale(1, 1);
}
to {
transform: scale(1.5, 1.5);
}
}

.main-slider .carousel-inner .carousel-item > img {
-webkit-animation: zoom 20s;
animation: zoom 20s;
}

.mybtn {
position: relative;
display: inline-block;
width: auto; height: auto;
background-color: #f08245;
border: none;
cursor: pointer;
/*box-shadow:2px 2px 2px 2px gray;*/
min-width: 150px;
}
.mybtn span {         
position: relative;
display: inline-block;
font-size: 14px;
font-weight: bold;
letter-spacing: 2px;
text-transform: uppercase;
top: 0; left: 0;
width: 100%;
padding: 15px 20px;
transition: 0.3s;
}

/*--- btn-2 ---*/
.btn-2::before {
background-color: rgb(28, 31, 30);
transition: 0.3s ease-out;
}
.btn-2 span {
color: black;
border: 1px solid var(--main-color);
transition: 0.2s;
}  
.btn-2 span:hover {
color: rgb(255,255,255);
background:var(--main-color);
transition: 0.2s 0.1s;
}

/* 9. hover-slide-right */
.mybtn.hover-slide-right::before {
top: 0; bottom: 0; left: 0; 
height: 100%; width: 0%;
}
.mybtn.hover-slide-right:hover::before {
width: 100%;
}



/******************* Timeline Demo - 5 *****************/
.main-timeline5{overflow:hidden;position:relative}
.main-timeline5 .timeline{position:relative;margin-top:-9px}
.main-timeline5 .timeline:first-child{margin-top:0}
.main-timeline5 .timeline-icon,.main-timeline5 .year{margin:auto;position:absolute;top:0;left:0;bottom:0;right:0}
.main-timeline5 .timeline:after,.main-timeline5 .timeline:before{content:"";display:block;width:100%;clear:both}
.main-timeline5 .timeline:before{content:"";width:100%;height:100%;box-shadow:-8px 0 5px -5px rgba(0,0,0,.5) inset;position:absolute;top:0;right:0;z-index:2}
.main-timeline5 .timeline-icon{width:210px;height:210px;border-radius:50%;border:25px solid transparent;border-top-color:#f44556;border-right-color:#f44556;z-index:1;transform:rotate(45deg)}
.main-timeline5 .year{display:block;width:110px;height:110px;line-height:110px;border-radius:50%;background:#fff;box-shadow:0 0 20px rgba(0,0,0,.4);font-size:30px;font-weight:700;color:#f44556;text-align:center;transform:rotate(-45deg)}
.main-timeline5 .timeline-content{width:35%;float:right;background:#f44556;padding:30px 20px;margin:50px 0;z-index:1;position:relative}
.main-timeline5 .timeline-content:before{content:"";width:20%;height:15px;background:#f44556;position:absolute;top:50%;left:-20%;z-index:-1;transform:translateY(-50%)}
.main-timeline5 .title{font-size:20px;font-weight:700;color:#fff;margin:0 0 10px}
.main-timeline5 .description{font-size:16px;color:#fff;line-height:24px;margin:0}
.main-timeline5 .timeline:nth-child(2n):before{box-shadow:8px 0 5px -5px rgba(0,0,0,.5) inset}
.main-timeline5 .timeline:nth-child(2n) .timeline-icon{transform:rotate(-135deg);border-top-color:#e97e2e;border-right-color:#e97e2e}
.main-timeline5 .timeline:nth-child(2n) .year{transform:rotate(135deg);color:#e97e2e}
.main-timeline5 .timeline:nth-child(2n) .timeline-content{float:left}
.main-timeline5 .timeline:nth-child(2n) .timeline-content:before{left:auto;right:-20%}
.main-timeline5 .timeline:nth-child(2n) .timeline-content,.main-timeline5 .timeline:nth-child(2n) .timeline-content:before{background:#e97e2e}
.main-timeline5 .timeline:nth-child(3n) .timeline-icon{border-top-color:#13afae;border-right-color:#13afae}
.main-timeline5 .timeline:nth-child(3n) .year{color:#13afae}
.main-timeline5 .timeline:nth-child(3n) .timeline-content,.main-timeline5 .timeline:nth-child(3n) .timeline-content:before{background:#13afae}
.main-timeline5 .timeline:nth-child(4n) .timeline-icon{border-top-color:#105572;border-right-color:#105572}
.main-timeline5 .timeline:nth-child(4n) .year{color:#105572}
.main-timeline5 .timeline:nth-child(4n) .timeline-content,.main-timeline5 .timeline:nth-child(4n) .timeline-content:before{background:#105572}
@media only screen and (max-width:1199px){.main-timeline5 .timeline{margin-top:-103px}
.main-timeline5 .timeline-content:before{left:-18%}
.main-timeline5 .timeline:nth-child(2n) .timeline-content:before{right:-18%}
}
@media only screen and (max-width:990px){.main-timeline5 .timeline{margin-top:-127px}
.main-timeline5 .timeline-content:before{left:-2%}
.main-timeline5 .timeline:nth-child(2n) .timeline-content:before{right:-2%}
}
@media only screen and (max-width:767px){.main-timeline5 .timeline{margin-top:0;overflow:hidden}
.main-timeline5 .timeline:before,.main-timeline5 .timeline:nth-child(2n):before{box-shadow:none}
.main-timeline5 .timeline-icon,.main-timeline5 .timeline:nth-child(2n) .timeline-icon{margin-top:-30px;margin-bottom:20px;position:relative;transform:rotate(135deg)}
.main-timeline5 .timeline:nth-child(2n) .year,.main-timeline5 .year{transform:rotate(-135deg)}
.main-timeline5 .timeline-content,.main-timeline5 .timeline:nth-child(2n) .timeline-content{width:100%;float:none;border-radius:0 0 20px 20px;text-align:center;padding:25px 20px;margin:0 auto}
.main-timeline5 .timeline-content:before,.main-timeline5 .timeline:nth-child(2n) .timeline-content:before{width:15px;height:25px;position:absolute;top:-22px;left:50%;z-index:-1;transform:translate(-50%,0)}
}


/******************/


     /*up button*/
.animated {
  animation: up-down 2s ease-in-out infinite alternate-reverse both;
}

@media (max-width: 991px) {
 .animated {
  -webkit-animation: none;
  animation: none;
}
}

@-webkit-keyframes up-down {
0% {
  transform: translateY(10px);
}
100% {
  transform: translateY(-10px);
}
}

@keyframes up-down {
0% {
  transform: translateY(10px);
}
100% {
  transform: translateY(-10px);
}
}


/*  return to top */
#btnreturntotop {
display: none; 
position: fixed; 
bottom: 25px; 
right: 21px; 
z-index: 9999; 
border: none; 
outline: none; 
background-color:#f08143;
color: white;
cursor: pointer; 
border-radius: 50%; 
font-size: 18px;
height:40px;
width:40px;
}

.whatsapp{position:fixed;  bottom: 5%;  left: 5%; border-radius:50%;box-shadow:0 0 10px 7px #8a898963; z-index:9999; animation: beat .40s infinite alternate;
  transform-origin: center;}
  
  @keyframes beat{
    to { transform: scale(1.2);} }
    
    @media (max-width: 768px){.whatsapp{display:none;} }

#layout{background:linear-gradient(rgba(255,255,255,0.6),rgba(255,255,255,0.8)),url('../images/1.jpg') center center no-repeat fixed; background-size:cover;}

#gallery{background:linear-gradient(rgba(176,203,32,0.6),rgba(255,255,255,0.8)),url('../images/2.jpg') center center no-repeat fixed; background-size:cover;}

.banks{background:linear-gradient(rgba(255,255,255,0.6),rgba(255,255,255,0.8)),url('../images/1.jpg') center center no-repeat fixed; background-size:cover;}

footer{background:linear-gradient(rgba(176,203,32,0.6),rgba(255,255,255,0.8)),url('../images/2.jpg') center center no-repeat fixed; background-size:cover;}

