@font-face {
  font-family: LucidaCalligraphyFont;
  src: url(fonts/lucida-calligraphy-bold.otf);
  font-weight: bold;
}
h1{
	font-family:LucidaCalligraphyFont!important;
}



@-webkit-keyframes zoom {
  from {
    -webkit-transform: scale(1, 1);
  }
  to {
    -webkit-transform: scale(1.2, 1.2);
  }
}

@keyframes zoom {
  from {
    transform: scale(1, 1);
  }
  to {
    transform: scale(1.5, 1.5);
  }
}

.carousel-inner .carousel-item > img {
  -webkit-animation: zoom 30s;
  animation: zoom 30s;
}


.font-24{ font-size: 24px; }
.white-plain-bg{ background-color:#fff; }
h2{font-family: 'Oswald', sans-serif; font-size: 32px; line-height:34px}
#sp-top{ background-color: red; padding:15px; }
.navbar{  z-index: 9999;}
 .header-top{overflow: hidden; }
 
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link{
	color:#fff!important; background: #393185;
}
.top-info{
    background: linear-gradient(rgba(232, 95, 25,0.9), rgba(242, 87, 9, 0.96)), url(../img/pattern-1.png); 
	padding:7px 20px;
	
color: #fff; }

.sticky {position: fixed; top: 0; width: 100%; z-index: 999;}
.bg-green-effect{   min-height:400px; background: linear-gradient(rgba(166, 195, 17, 0.92), rgba(166, 195, 17, .96)), url(../img/pattern-1.png);}
.orange-container{ 
    margin-top: 120px;
clip-path: circle(63.8% at 50% 77%);
clip: rect(10px, 20px, 30px, 40px);
background: linear-gradient(rgba(166, 195, 17, 0.92), 
    rgba(166, 195, 17, .96)), url(../img/pattern-1.png);

}
.off-white{ color: #f2f2f2; }
.text-orange{ color: #E8771E; }
.off-orange{ color: #fd723e; }

.text-yellow{color: #E8771E;}

.nav-link{font-weight: bold!important; margin-left:5px; color: #E8771E!important;}

#slider{ height:100vh; }
.pdtb-90{padding-top: 90px; padding-bottom: 90px;}
.pdt-90{padding-top: 90px;}

  .media .fa{width:50px; color:rgb(255, 255, 255); text-align:center; background:#E8771E; padding:8px; margin-right:4px; border-radius:25px;}

.service-list{ width: 98%; border:1px solid #f2f2f2; padding:10px 20px; 
 transition: background 1s;}
.service-list:hover{background-color:rgba(0,0,0,.5);  }
.service-img{ text-align: center; margin-top: -50px; }
.service-content{ margin-top: 25px; }
.service-content h2{ color: #fff;  font-size: 20px; }
.service-content p{ color: #fff;  text-align: justify:  ; }
.service-list a:hover{ background-color: #fff; text-decoration:none;  }
.prosess-box {
    width: 96%;
    margin: 20px auto 0px;
    border: 4px solid rgb(253, 69, 69);
    padding: 20px;
    box-shadow: 2px 5px 10px #ccc;
    background: rgba(255,255,255,.8);
    margin:90px;

}
.appoin{
    
    background:url('../img/jb.png');
    background-color: #E8771E;
    
    background-repeat: no-repeat;
    background-position: top right;

}
.prosess-box h2 {
    margin: -35px 0px 35px;
    background: #fff;
    padding: 0px 15px;
    max-height: 350px;
    text-align: center;
    color: rgb(255, 47, 0);
    font-family: Oswald,sans-serif;
    font-weight: 500;
    color: #E8771E;
    text-transform: capitalize;
    line-height: 48px;
    text-align: center;
    font-size: 32px;
    
}
.bg-green{ background: #E8771E; }

.site-title{ text-align: center;  width: 100%; padding-bottom: 50px;}

. 
.prosess-box h4 {
    font-family: Oswald,sans-serif;
    font-weight: 500;
    color: rgb(255, 47, 0);
    text-transform: capitalize;
    font-size: 22px;
}
.prosess-box p {
    color: #212529;
    line-height: 30px;
    text-align: justify;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
}


.about{background:url('../img/2nd.png'); 
    background-position: left bottom;
    background-size: 50%;
    background-repeat: no-repeat;
        padding-top:90px;}

.milestone-header{ background-color: red; min-height:400px; padding-bottom: 90px; 
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 1, 0, .96)), url(../img/family.png); 
background-repeat: no-repeat; background-size:cover; background-position:center;
padding:100px 0px 100px;
text-align: center;
color: #fff;
font-weight: bold;
}
.milestone-slider{ min-height: 350px; padding-top: 50px; margin-top: -90px; 

background: linear-gradient(rgba(253, 69, 69,0.9), rgba(253, 69, 69, 0.96)), url(../img/pattern-1.png);
 url(../img/pattern-1.png)
}
.milestone-header p { color:#f2f2f2;}
.carousel{ min-height: 200px; }
.orange-container{
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 1, 0, .96)), url(../img/x.svg); 

}

.scheam{
    padding: 120px 0px; 
}

.green-bg{background: linear-gradient(rgba(166, 195, 17, 0.92), rgba(166, 195, 17, 0.96)), url(../img/pattern-1.png);}
.orange-bg{background: linear-gradient(rgba(253, 69, 69,0.9), rgba(253, 69, 69, 0.96)), url(../img/pattern-1.png);}
.white-bg{background: linear-gradient(rgba(255, 255, 255,0.9), rgba(241, 241, 241, 0.96)), url(../img/pattern-1.png);}
.flip-card {
  background-color: transparent;
  width: 100%;
  margin-left:auto;
  margin-right:auto;
  height: 280px;

  margin-top: -80px;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}


/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  background-color: #bbb;
  color: black;
}

/* Style the back side */
.flip-card-back {
  background-color: dodgerblue;
  color: white;
  transform: rotateY(180deg);
}

.post-card  .entry-footer{ background:none; border-top: 1px solid #f8f8f8;}

.post-card .entry-meta  {
    position: absolute;
    background: rgba(253, 69, 69, 1.0);
    top: -15px;
    left:25px;
    color: #fff;
    text-align:center;
    padding: 5px 15px;
    font-weight: 700;
}

#sponcer{ padding: 80px 0px; }
.post.hentry{margin:0px;}
.post-card article{border:1px solid #ccc;}
.entry-summary{padding:20px  10px;} 
.entry-summary h3 a{
font-family: Oswald,sans-serif;
    font-weight: 500;
    color: rgba(253, 69, 69, 1.0);
    text-transform: capitalize;
    font-size: 18px;
    }
.entry-summary h3 a:hover{color: #666;}

.team {
    padding: 90px 0px;
}
.team ul {
    margin: 0px;
    padding: 0px;
    width: 100%;
}
.team ul li {
    margin: 0px;
    padding: 0px;
    list-style: none;
    text-align: center
}
.team img { width:90%; margin:0px auto; }
.team-card {background: #fff; position: inherit; margin: -20px 10%; padding: 20px; width: 80%; border: 1px solid #ccc;}
.team h5 {color: rgb(253, 69, 69);font-size: 16px;}

footer{ 
  padding:60px 0px 20px; border-top:2px solid #E8771E; 

  

    background: linear-gradient(rgba(0,0,102,.9), 
      rgba(0,0,102,.9)), url(../img/banner_covid_cover1.jpg)center;
    padding: 60px 0px 20px;
    border-top: 2px solid #ffa739;
    background-color: #006;

    }
footer h2{ font-size:18px; font-weight: bold; color:#E8771E; }
footer ul{ padding:0px; }
footer ul li{ padding:0px; margin:0px; list-style: none; }
footer  ul li a{ color: #fff; font-size:14px; line-height: 28px; cursor: pointer; text-transform: capitalize;}
footer ul li a:hover{ padding-right:5px; color: #E8771E; text-decoration: none;}
footer  ul li a:before { float: left; margin-right: 0.7em; color: #E8771E; content: '\f35a'; font-family: "Font Awesome 5 Free";}
footer p { color: #f2f2f2; }
address ,address a{ color: #f2f2f2;     color: #fff;
    font-size: 14px;
    line-height: 28px;
    cursor: pointer; }
address .fa{ margin-right: 5px; }
.block-1{ display: block; margin-bottom: 5px; }

.footer-btm{padding-top: 20px; margin-top: 30px; 
}
.fixed-social ul li{     display: inline; }
.fixed-social ul li a{  padding:10px; border:1px solid #ccc; color: #666;}
.fixed-social ul li a:hover {
  background-color: #E8771E; color: #fff;
}

.galery{ padding: 90px 0px 120px; 
background: linear-gradient(rgba(253, 69, 69,0.9), rgba(253, 69, 69, 0.96)), url(../img/pattern-1.png); 
background-size: 100% 70%; background-repeat: no-repeat; background-position: bottom;}
p{ color: #444; font-size: 14px; line-height: 28px;  }
.btn{background:linear-gradient(rgba(253, 69, 69, 0.9), rgba(
  253, 69, 69, 0.96));
border:1px solid #eb5a1a; }
.btn-black{ background:#000; color:#fff;}
.carousel-caption{ padding-bottom:250px!important;}
.carousel-caption h2{ font-size:44px;      font-family: 'Oswald', sans-serif; color:#E8771E; text-shadow: -1px 1px 0 #fff, 1px 1px 0 #fff, 1px -1px 0 #fff, -1px -1px 0 #fff;}
.carousel-caption .text-white{ font-family: 'Oleo Script', cursive; font-size:36px; color:#39318!important;}
.social-icon{ margin:20px 0px; }
.social-icon a{ text-align: center;}
.social-icon .fab{ font-size:18px; width:30px; 
    height:30px; color:#fff; line-height:30px; 
    border:1px solid #fff;
    

    -webkit-transition: background .5s ease-in-out,color .5s ease-in-out;
    -moz-transition: background .5s ease-in-out,color .5s ease-in-out;
    transition: background .5s ease-in-out,color .5s ease-in-out;
	}
.social-icon .fab:hover{background:#E8771E; 
    border:1px solid #E8771E; color:#fff;}

.back-to-top .fa{color:#fff;}
.back-to-top{
    
  cursor: pointer;
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
    background: #000;
    border: 0px;
	border:1px solid #fff;
}
.back-to-top:hover{
  cursor: pointer;
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
    background: #000;
    border: 0px;
	border:1px solid #fff;
}
.content ul,.content  li{ margin:0px; padding:0px; list-style:none; line-height: 28px; color:#444;}
.content ul,.content  li:before{margin-right: 7px;
color: #E8771E;
    content: '\f0a4';
    font-family: "Font Awesome 5 Free";}
.whatsapp {
  height:45px;
  width:45px;
  text-align: center;
    cursor: pointer;
    position: fixed;
    bottom: 70px;
    right: 20px;
    background: #01e675;
    border: 0px;
    z-index: 999;
    padding: 10px;
    color: #fff;
    border-radius: 20px;
    border: 1px solid #fff;
}


hr {
    margin: 0 auto;
}
.form-control{border-radius:0px;
height:40px;
}
.btn-default{border-radius:0px;}

     
.navbar-nav li:hover > ul.dropdown-menu {
    display: block;
}
.dropdown-submenu {
    position:relative;
}
.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top:-6px;
}

/* rotate caret on hover */
.dropdown-menu > li > a:hover:after {
    text-decoration: underline;
    transform: rotate(-90deg);
} 

 .page-header_1{
       background: linear-gradient(rgba(0,0,0,.6), rgba(0,0,0,.7)), url(../img/sea_freigt.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    color: #fff;
    padding-top: 120px;
    padding-bottom: 120px;
  margin-bottom:50px;}
  .page-header_1 p{ color:#f2f2f2;
  }


.btn-black{ color: #fff!important;  }

.top-banner{margin-top: 120px;}
.vision-box{ padding:50px;}
@media only screen and (max-width: 600px) {
.pdtb-90 {
    padding-top: 30px;
    padding-bottom: 10px;
}
.top-banner{margin-top:0px;}


.nav-link{color: #fff!important;}
.site-title{ padding-bottom:10px;}
.page-header_1{ margin-bottom:10px;}
.vision-box{ padding:5px;}
.vision{padding:1em 0}
.vision_info p{ padding:10px!important;}
.carousel-caption{ top:0px;}
.carousel-caption .text-white{font-size:20px;}
	
}