/*------------------------------------------Margin Top Start------------------------------------------------*/
.mt_5{
  margin-top: 5px;
}
.mt_10{
  margin-top: 10px;
}
.mt_15{
  margin-top: 15px;
}
.mt_20{
  margin-top: 20px;
}
.mt_25{
  margin-top: 25px;
}
.mt_30{
  margin-top: 30px;
}
.mt_35{
  margin-top: 35px;
}
.mt_40{
  margin-top: 40px;
}
.mt_45{
  margin-top: 45px;
}
.mt_50{
  margin-top: 50px;
}
.mt_55{
  margin-top: 55px;
}
.mt_60{
  margin-top: 60px;
}
.mt_65{
  margin-top: 65px;
}
.mt_70{
  margin-top: 70px;
}
.mt_75{
  margin-top: 75px;
}
.mt_80{
  margin-top: 80px;
}
.mt_85{
  margin-top: 85px;
}
.mt_90{
  margin-top: 90px;
}
.mt_95{
  margin-top: 95px;
}
.mt_100{
  margin-top: 100px;
}
.mt_105{
  margin-top: 105px;
}
.mt_110{
  margin-top: 110px;
}
.mt_115{
  margin-top: 115px;
}
.mt_120{
  margin-top: 120px;
}
.mt_125{
  margin-top: 125px;
}
.mt_130{
  margin-top: 130px;
}
.mt_135{
  margin-top: 135px;
}
.mt_140{
  margin-top: 140px;
}
.mt_145{
  margin-top: 145px;
}
.mt_150{
  margin-top: 150px;
}
.mt_155{
  margin-top: 155px;
}
.mt_160{
  margin-top: 160px;
}
.mt_165{
  margin-top: 165px;
}
.mt_170{
  margin-top: 170px;
}
.mt_175{
  margin-top: 175px;
}
.mt_180{
  margin-top: 180px;
}
.mt_185{
  margin-top: 185px;
}
.mt_190{
  margin-top: 190px;
}
.mt_195{
  margin-top: 195px;
}
.mt_200{
  margin-top: 200px;
}
/*------------------------------------------Margin Top End--------------------------------------------------*/

/*------------------------------------------Margin Bottom Start------------------------------------------------*/
.mb_5{
  margin-bottom:5px;
}
.mb_10{
  margin-bottom:10px;
}
.mb_15{
  margin-bottom:15px;
}
.mb_20{
  margin-bottom:20px;
}
.mb_25{
  margin-bottom:25px;
}
.mb_30{
  margin-bottom:30px;
}
.mb_35{
  margin-bottom:35px;
}
.mb_40{
  margin-bottom:40px;
}
.mb_45{
  margin-bottom:45px;
}
.mb_50{
  margin-bottom:50px;
}
.mb_55{
  margin-bottom:55px;
}
.mb_60{
  margin-bottom:60px;
}
.mb_65{
  margin-bottom:65px;
}
.mb_70{
  margin-bottom:70px;
}
.mb_75{
  margin-bottom:75px;
}
.mb_80{
  margin-bottom:80px;
}
.mb_85{
  margin-bottom:85px;
}
.mb_90{
  margin-bottom:90px;
}
.mb_95{
  margin-bottom:95px;
}
.mb_100{
  margin-bottom:100px;
}

/*------------------------------------------Margin Bottom End--------------------------------------------------*/


/*----------------------------------------------Margin Left Start------------------------------------------------------*/
.ml_5{
  margin-left:5px;
}
.ml_10{
  margin-left:10px;
}
.ml_15{
  margin-left:15px;
}
.ml_20{
  margin-left:10px;
}
.ml_25{
  margin-left:25px;
}
.ml_30{
  margin-left:30px;
}
.ml_35{
  margin-left:35px;
}
.ml_40{
  margin-left:40px;
}
.ml_45{
  margin-left:45px;
}
.ml_50{
  margin-left:50px;
}
.ml_55{
  margin-left:55px;
}
.ml_60{
  margin-left:60px;
}
.ml_65{
  margin-left:65px;
}
.ml_70{
  margin-left:70px;
}
.ml_75{
  margin-left:75px;
}
.ml_80{
  margin-left:80px;
}
.ml_85{
  margin-left:85px;
}
.ml_90{
  margin-left:90px;
}
.ml_95{
  margin-left:95px;
}
.ml_100{
  margin-left:100px;
}

/*----------------------------------------------Margin Left end--------------------------------------------------------*/
/*----------------------------------------------Margin right Start------------------------------------------------------*/
.mr_5{
  margin-right:5px;
}
.mr_10{
  margin-right:10px;
}
.mr_15{
  margin-right:15px;
}
.mr_20{
  margin-right:10px;
}
.mr_25{
  margin-right:25px;
}
.mr_30{
  margin-right:30px;
}
.mr_35{
  margin-right:35px;
}
.mr_40{
  margin-right:40px;
}
.mr_45{
  margin-right:45px;
}
.mr_50{
  margin-right:50px;
}
.mr_55{
  margin-right:55px;
}
.mr_60{
  margin-right:60px;
}
.mr_65{
  margin-right:65px;
}
.mr_70{
  margin-right:70px;
}
.mr_75{
  margin-right:75px;
}
.mr_80{
  margin-right:80px;
}
.mr_85{
  margin-right:85px;
}
.mr_90{
  margin-right:90px;
}
.mr_95{
  margin-right:95px;
}
.mr_100{
  margin-right:100px;
}
/*----------------------------------------------Margin right end--------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Calligraffitti&family=Inter&family=Kaushan+Script&family=Merriweather:wght@700&family=Nunito&family=Raleway:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&family=Roboto:wght@700&display=swap');
@font-face {
  font-family: "arial";
  src: url('../fonts/arial.ttf');
}

@font-face{
  font-family: 'Lovers Quarrel', cursive;
}

*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

li{
  list-style:none;
}

a {
  text-decoration: none;
}

a:hover{
  text-decoration: none;
}


/*----------------------------------------------header start--------------------------------------------------------*/
.navbar {
  position: fixed;
  top: 0;
  background: #cccccc;
  width: 100%;
  /*height: 130px;*/
  /*line-height: 100px;*/
  /*padding: 22px 0;*/
}

header .container{
  padding: 0 120px;
}

.logo {
  float: left;
  padding: 5px 0;
}

.logo img {
  vertical-align:middle;
  /*height: 115px;*/
  width: auto;
  
}

/*nav {
  float: right;
}*/

/*nav a {
  margin-left: 1em;
}*/

nav a:first-child {
  margin-left: 0;
}

/* Header */

header {
  background-color: #c7c7c7;
  border-bottom: 1px solid #aaa;
  float: left;
  width: 100%;
  position: fixed;
  z-index: 10;
}

header a {
  color: #2d70a6;
  text-decoration: none;
  font-family: "arial";
  text-transform: uppercase;
  font-size: 14px;
  padding: 50px 10px;
}

.logo_link{
  padding: 0!important;
}

header a.active{
  padding: 24px 0;
  border-top: 5px solid red;
  color: #2d70a6;
}
/*.large a{
  padding: 50px 0;
  border-top: 5px solid red;
}*/

header.large .active{
  border-top: 5px solid red;
  padding: 55px 10px;
  color: #2d70a6;
}

header a.active, header a:hover {
  color: #2d70a6;
}

header li {
  margin-right: 30px;
}

/* header large */
header.large {
  /*height: 130px;*/
  background-image: url('../images/Vishwa Enterprise Navigation Menu- Before Scroll.png');
  background-size: cover;
}

/*header.large a{
   padding: 50px 10px;
}*/

/*.logo_img{
  height: 85px;
}*/
header.large img {
  /*width: auto;*/
  /*height: 120px;*/
  /*margin-top: 18px;*/
}
header.large li {
  margin-top: 52px;
}

/* header small */

header.small a{
  padding: 
}

header.small {
  height: 70px;
  background-image: url('../images/Vishwa Enterprise Navigation Menu- After Scroll.png');
  background-size: cover;
}
header.small img {
  width: auto; 
  height: 60px;
  margin-top: -10px;
}
header.small li {
  margin-top: 17px;
}

/* Transitions */
.logo,
header,
nav,
a,
img,
li {
  transition: .7s all;
  -moz-transition: .7s all;
  -webkit-transition: .7s all;
  -o-transition: .7s all;
}

.request_quote_img{
  height: 30px!important;
}

/*----------------------------------------------header end--------------------------------------------------------*/
/*----------------------------------------------Home page start--------------------------------------------------------*/
.ghost {
  width:100%;
  height: 130px;
}

main section {
  align-content: center;
  font-size: 1em;
}

main section:nth-child(1) {
	display: grid;
  justify-content: center;
  height: 91vh;
  background-color: grey;
  background-image: url(../images/home_page_img.png);
  height: 500px;
}

main section:nth-child(2){
  /*height: 100vh;*/
  background-color: #0f3863;
}

h1.title{
  font-family: 'Arial';
  font-weight: 500;
  font-size: 2em;
  color: white;
}

@media (max-width: 768px){
    .container{
        padding: 0 20px;
        grid-template-areas:
            "lgo ... nav";
    }
}

.float_left{
  float: left;
}

.home{
	background-image: url("../images/home_page_img.png");
	height: 600px;
	width: 100%;
}

.service{
	padding:30px 0px;
}

.our_services{
  font-family: 'Arial';
  font-weight: 600;
  font-size: 40px;
  color: #ffffff;
  text-align: center;
}

.over_a_period_para {
    font-family: 'Arial';
    font-weight: 500;
    font-size: 16px;
    color: #fff;
    text-align: justify; 
    line-height: 24px;
    margin-top: 15px;
    /* padding: 0px 130px; */
}

.supply_chain{
  font-family: 'Merriweather', serif;
  font-weight: 600;
  font-size: 50px;
  color: #fff;
  text-align: center;
  margin-bottom: 0;
}

.Whether_para{
  font-family: 'Arial';
  font-weight: 500;
  font-size: 16px;
  color: #fff;
  text-align: center;
  line-height: 24px;
  margin-top: 15px;
  padding: 0px 130px;
}

.we_offer_text{
  font-family: 'Arial';
  font-weight: 600;
  font-size: 22px;
}

.section_4{
	background-color: #0f3863;
  padding: 40px 0;
}

.air_freight{
  font-family: "arial";
  position: relative;
	height:300px;
	background-color: #249bcc;
	width: 100%;
  font-size: 30px;
  font-weight: 700; 
	color: #7daed9;
  /*z-index: 3;*/
	transform: rotate(180deg);
  writing-mode: vertical-lr;
}

.air_freight_2{
  font-family: "arial";
  position: relative;
  font-size: 20px;
  color: white;
  z-index: 3;
  right: 10px;
  top: 30px;
  writing-mode: vertical-lr;
}

.container_box{
  /*max-width: 800px;*/
  padding: 0 100px;
  display: flex;
  justify-content: center;
  grid-column-gap: 55px;
}

.air_freight_box img{
    width:100%;
    padding:10px;
}

.gradiant{
  height: 20px;
  background-color: #c9c1c1;
}

.example-section-two {
    position: relative;
    overflow: hidden;
}

.example-section-two::after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    /*z-index: 10;*/
    background: linear-gradient(
        to top,
        #c9c1c1 9%,
        rgba(255, 99, 71, 0) 30%
    );
    pointer-events: none;
}

.ask_for_quote_btn{
  font-family: "arial";
  font-size: 14px;
  color: white;
  background-color: red;
  border: none;
  border-radius: 5px;
  padding: 10px 15px;
  width: 200px;
}
/*----------------------------------------------Home page end--------------------------------------------------------*/
/*-----------------------------------------------------footer start----------------------------------------------*/
footer{
  padding: 2rem 0;
  background-color: #000000;
}
.footer-column:not(:first-child) {
  padding-top: 2rem;
}
@media (min-width: 768px){
  .footer-column:not(:first-child) {
    padding-top: 0rem;
  }
}
.footer{
  padding: 0px 100px;
}
.footer-column{
  /*text-align: center;*/
}
.footer-column .nav-item .nav-link{
  font-family: "arial";
  color: white;
  padding: 0.1rem 0;
  font-size: 26px;
  font-weight: bold;
}
.footer-column .nav-item .nav-link p{
  font-family: "arial";
  color: white;
  padding: 0.1rem 0;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 0;
}
.footer-column .nav-item span.nav-link{
  color: #6c757d;
}
.footer-column .nav-item span.footer-title{
  font-family: "arial";
  font-size: 40px;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
}
.footer-column .nav-item .fas{
  margin-right: 0.5rem;
}
.footer-column ul{
  display: inline-block;
}
@media (min-width: 768px){
  .footer-column ul {
    text-align: left;
  }
}

ul.social-buttons{
  margin-bottom: 0;
}

ul.social-buttons li a:active,
ul.social-buttons li a:focus,
ul.social-buttons li a:hover{
  background-color: #fec503;
}

ul.social-buttons li a{
  font-size: 20px;
  line-height: 40px;
  display: block;
  width: 40px;
  height: 40px;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  color: #fff;
  border-radius: 100%;
  outline: 0;
  background-color: #1a1d20;
}

footer .quick-links{
  font-size: 13px;
  font-style: italic;
  line-height: 14px;
  margin-bottom: 0;
  text-transform: none;
  font-family: Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.copyright{
  color: white;
}

.fa-ellipsis-h{
  color: white;
  padding: 2rem 0;
}

/*-----------------------------------------------------footer End----------------------------------------------*/
/*-----------------------------------------------------About us page start----------------------------------------------*/
.container .service {
  position: relative;
  width: 300px;  
  margin: 20px 40px;
  overflow: hidden; 
  border-radius: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.container .card .content {
  position: absolute;
  bottom: -160px;
  width: 100%;
  height: 160px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  flex-direction: column;
  backdrop-filter: blur(15px);
  box-shadow: 0 -10px 10px rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 15px;
  transition: bottom 0.5s;
  transition-delay: 0.65s;
}
.container .card:hover .content {
  bottom: 0;
  transition-delay: 0s;
}
.container .card .content .contentBx h3 {
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 2px;
  font-weight: 500;
  font-size: 18px;
  text-align: center;
  margin: 20px 0 15px;
  line-height: 1.1em;
  transition: 0.5s;
  transition-delay: 0.6s;
  opacity: 0;
  transform: translateY(-20px);
}
.container .card:hover .content .contentBx h3 {
  opacity: 1;
  transform: translateY(0);
}
.container .card .content .contentBx h3 span {
  font-size: 12px;
  font-weight: 300;
  text-transform: initial;
}
.container .card .content .sci {
  position: relative;
  bottom: 10px;
  display: flex;
}
.container .card .content .sci li {
  list-style: none;
  margin: 0 10px;
  transform: translateY(40px);
  transition: 0.5s;
  opacity: 0;
  transition-delay: calc(0.2s * var(--i));
}

.container .card:hover .content .sci li {
  transform: translateY(0);
  opacity: 1;
}
.container .card .content .sci li a {
  color: white;
  font-size: 24px;
}

/*-----------------------------------------------------About us page End----------------------------------------------*/

#button {
  display: inline-block;
  background-color: #09C;
  width: 80px;
  height: 40px;
  text-align: center;
  /*border-radius: 4px;*/
  position: fixed;
  bottom: 30px;
  right: 30px;
  transition: background-color .3s, 
    opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;
}
#button::after {
  content: "\f077";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  font-size: 2em;
  line-height: 38px;
  color: #fff;
}
#button:hover {
  cursor: pointer;
  background-color: #09C;
}
#button:active {
  background-color: #555;
}
#button.show {
  opacity: 1;
  visibility: visible;
}

.quote{
  width: 40px;
  padding: 5px;
}

/*services card */

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

/*.card {
  background-color: #fff;
  border-radius: 2px;
  box-shadow: -1px 2px 4px rgba(0,0,0,.25), 1px 1px 3px rgba(0,0,0,.1);
  margin: 0 auto;
  max-width: 340px;
}*/

.container .card {
  position: relative;
  overflow: hidden; 
  display: flex;
  justify-content: center;
  align-items: center;
}

.card-media {
  width: 100%;
}

.card-details {
  padding: 5px 15px;
}

.card-head {
  font-weight: 400;
}

.card-head {
  font-size: 26px;
  margin-bottom: 15px;
}

.card-action-button {
  color: #FFAB40;
  cursor: pointer;
  display: inline-block;
  font-weight: 500;
  margin: 0;
  padding: 10px;
  text-decoration: none;
}

.card-action-button:hover {
  background-color: rgba(255 ,168 ,58, .2);
}

.service_card{
  padding: 50px 100px;
}



/* Float three columns side by side */
.column {
  margin-top: 20px;
}
.card .profile{
   transition: 0.2s;
}
.card:hover .profile{
  
}

.card .content_2{
  width:100%;
  height:100%;
  position:relative;
  overflow:hidden;
}
.card .content_2 .back{
  position:absolute;
  width:100%;
  height:100%;
  background-color: #f1f1f1e6;
  transition:1s;
  padding:10px;
}

.front{
  padding: 5px;
}


.frony h2{
  font-family: 'arial';
    font-weight: 600;
    font-size: 26px;
}

.from-left{
  top:0;
  left:-100%;
}
.card:hover .content_2 .from-left {
   left:0%;
}

.from-bottom{
  top:100%;
  left:0;
}
.card:hover .content_2 .from-bottom {
   top:0%;
}

.from-right{
  top:0%;
  right:-100%;
}
.card:hover .content_2 .from-right {
   right:0;
}

.card .content_2 .back h3{
  font-family: "arial";
  font-size:15px;
  letter-spacing:2px;
}
.card .content_2 .back .tem-img{
  border-radius:100%;
}

.card .content_2 .back .des{
  font-family: "arial";
  font-size:13px;
  padding:20px 0px;
}
.card .content_2 .back .social-icon{
  list-style:none;
  margin:0px;
  padding:0px;
}
.card .content_2 .back .social-icon li{
  display:inline-block;
}

.card .content_2 .back .social-icon li a{
  font-family: "arial";
  display:block;
  background:#333;
  color:#fff;
  width:40px;
  height:40px;
  text-align:center;
  line-height:40px;
  border-radius:100%;
}

.read_more{
  font-family: "arial";
  font-size: 14px;
  font-weight: 600;
  padding: 5px;
  color: red;
  border: 1px solid black;
}

.service_head{
   font-family: 'arial';
   font-size: 20px;
   font-weight: 700;
   text-align: center;
   padding: 10px;
}

.supplyChain_box{
  padding: 20px 100px;
}

.supply_chain_img{
  width: 100%;
}

.supply_chain_para{
  font-family: 'arial';
  font-size: 18px;
  line-height: 20px;
  text-align: left;
  margin-top: 20px;
}

.Useful_links_content_box{
  border: 1px solid #e9e9e9;
}

.imo_details{
  background-color: #0f3863;
  padding: 20px 0px;
}

.imo_text{
  font-family: 'arial';
  font-size: 24px;
  line-height: 50px;
  color: white;
  margin-bottom: 0;
}

.link_box{
  padding: 0px 100px;
}

.links_table{
  margin: 20px 0px;
}

.nhava_sheva_text{
  font-family: 'arial';
  font-weight: 600;
  width: 400px;
  font-size: 16px;
  padding: 5px 0px;
  list-style: unset;
  color: #000000;
}

.nhava_sheva_text a{
  color: #000000;
}

.colon{
  width: 400px;
  text-align: center;
}

@media screen and (min-width: 991px){
            .rwd-break { display: none; }
        }
        

.custom_rates{
  font-family: 'arial';
  font-weight: 600;
  width: 400px;
  font-size: 16px;
  padding: 5px 0px;
  list-style: unset;
}


/*request a quote*/
.clearfix:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
  height: 0;
}



.checkbox_option label {
  margin-right: 1em;
  position: relative;
}
.checkbox_option label:before {
  content: "";
  display: inline-block;
  width: 0.5em;
  height: 0.5em;
  margin-right: 0.5em;
  vertical-align: -2px;
  border: 2px solid #cccccc;
  padding: 0.12em;
  background-color: transparent;
  background-clip: content-box;
  transition: all 0.2s ease;
}
.checkbox_option label:after {
  border-right: 2px solid #000000;
  border-top: 2px solid #000000;
  content: "";
  height: 20px;
  left: 2px;
  position: absolute;
  top: 7px;
  transform: scaleX(-1) rotate(135deg);
  transform-origin: left top;
  width: 7px;
  display: none;
}
.checkbox_option input:hover + label:before {
  border-color: #000000;
}
.checkbox_option input:checked + label:before {
  border-color: #000000;
}
.checkbox_option input:checked + label:after {
  -moz-animation: check 0.8s ease 0s running;
  -webkit-animation: check 0.8s ease 0s running;
  animation: check 0.8s ease 0s running;
  display: block;
  width: 7px;
  height: 20px;
  border-color: #000000;
}

.radio_option label {
  margin-right: 1em;
}
.radio_option label:before {
  content: "";
  display: inline-block;
  width: 0.5em;
  height: 0.5em;
  margin-right: 0.5em;
  border-radius: 100%;
  vertical-align: -3px;
  border: 2px solid #cccccc;
  padding: 0.15em;
  background-color: transparent;
  background-clip: content-box;
  transition: all 0.2s ease;
}
.radio_option input:hover + label:before {
  border-color: #000000;
}
.radio_option input:checked + label:before {
  background-color: #000000;
  border-color: #000000;
}

.select_option {
  position: relative;
  width: 100%;
}
.select_option select {
  display: inline-block;
  width: 100%;
  height: 35px;
  padding: 0px 15px;
  cursor: pointer;
  color: #7b7b7b;
  border: 1px solid #cccccc;
  border-radius: 0;
  background: #fff;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  transition: all 0.2s ease;
}
.select_option select::-ms-expand {
  display: none;
}
.select_option select:hover, .select_option select:focus {
  color: #000000;
  background: #fafafa;
  border-color: #000000;
  outline: none;
}

.select_arrow {
  position: absolute;
  top: calc(50% - 4px);
  right: 15px;
  width: 0;
  height: 0;
  pointer-events: none;
  border-width: 8px 5px 0 5px;
  border-style: solid;
  border-color: #7b7b7b transparent transparent transparent;
}

.select_option select:hover + .select_arrow, .select_option select:focus + .select_arrow {
  border-top-color: #000000;
}

.credit {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: 15px;
  color: #f5ba1a;
}
.credit a {
  color: #e1a70a;
}

@-webkit-keyframes check {
  0% {
    height: 0;
    width: 0;
  }
  25% {
    height: 0;
    width: 7px;
  }
  50% {
    height: 20px;
    width: 7px;
  }
}
@keyframes check {
  0% {
    height: 0;
    width: 0;
  }
  25% {
    height: 0;
    width: 7px;
  }
  50% {
    height: 20px;
    width: 7px;
  }
}
@-webkit-keyframes expand {
  0% {
    -webkit-transform: scale3d(1, 0, 1);
    opacity: 0;
  }
  25% {
    -webkit-transform: scale3d(1, 1.2, 1);
  }
  50% {
    -webkit-transform: scale3d(1, 0.85, 1);
  }
  75% {
    -webkit-transform: scale3d(1, 1.05, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    opacity: 1;
  }
}
@keyframes expand {
  0% {
    -webkit-transform: scale3d(1, 0, 1);
    transform: scale3d(1, 0, 1);
    opacity: 0;
  }
  25% {
    -webkit-transform: scale3d(1, 1.2, 1);
    transform: scale3d(1, 1.2, 1);
  }
  50% {
    -webkit-transform: scale3d(1, 0.85, 1);
    transform: scale3d(1, 0.85, 1);
  }
  75% {
    -webkit-transform: scale3d(1, 1.05, 1);
    transform: scale3d(1, 1.05, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    opacity: 1;
  }
}
@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translate3d(0, -25px, 0);
    opacity: 0;
  }
  25% {
    -webkit-transform: translate3d(0, 10px, 0);
  }
  50% {
    -webkit-transform: translate3d(0, -6px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, 2px, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes bounce {
  0% {
    -webkit-transform: translate3d(0, -25px, 0);
    transform: translate3d(0, -25px, 0);
    opacity: 0;
  }
  25% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  50% {
    -webkit-transform: translate3d(0, -6px, 0);
    transform: translate3d(0, -6px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, 2px, 0);
    transform: translate3d(0, 2px, 0);
  }
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@media (max-width: 600px) {
  .form_wrapper .col_half {
    width: 100%;
    float: none;
  }

  .bottom_row .col_half {
    width: 50%;
    float: left;
  }

  .form_container .row .col_half.last {
    border-left: none;
  }

  .remember_me {
    padding-bottom: 20px;
  }
}

/*-------------------------------------------mobile sidebar start---------------------------------------------------*/

@media (min-width:801px){
  .mobile-slider{
    display: none;
  }
  .mobile_header{
    display: none;
  }
  .mobile-menu-icon {
    display: none!important;
  }
}

@media (max-width:991px){
  .ghost {
      width: 100%;
      height: 80px;
  }
  .navbar{
    /*padding:22px 20px;*/
  }
  nav a{
    display: none;
  }
  header.small img {
    width: auto; 
    height: 40px;
    margin-top: -10px;
  }
  header.large img {
    /* width: auto; */
    height: 65px;
    /* margin-top: 18px; */
  }
.mobile_header {
  background-color: rgb(15, 15, 15);
  position: fixed;
  box-shadow: inset 0 -3px 0 orange;
  width: 100%;
}
.header-inner {
  padding: 25px;
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.logo span {
  font-weight: 400;
  font-size: 0.9em;
  color: orange;
  padding-left: 2px;
  height: 100px;
}
.mobile-menu-icon {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 10px;
  border: 2px solid #555;
  border-radius: 5px;
}
.mobile-menu-icon:hover {
  cursor: pointer;
}
rect {
  border-radius: 10px;
  width: 28px;
  height: 4px;
  background-color: #d47878;
}
rect:nth-child(2) {
  margin: 4px 0;
}
.content {
  max-width: 1200px;
  padding: 120px 30px;
  margin: 0 auto;
  color: #222;
}
.content h1 {
  font-size: 2.2em;
  display: inline-block;
  margin-bottom: 20px;
}
.content p {
  line-height: 2em;
  font-size: 1em;
  padding-bottom: 1em;
}

/* Filter on main content when mobile menu open */
.filter {
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  min-height: 100vh;
  width: 100%;
  z-index: 99;
  background-color: rgba(0, 0, 0, 0.7);
}
/*  Mobile Slider Styling */
.mobile-slider {
  visibility: hidden;
  position: fixed;
  z-index: 100;
  top: 0;
  right: 0;
  bottom: 0;
  overflow-y: auto;
  width: 256px;
  background-color: #6b7b8a;
  box-shadow: -5px 0 8px rgba(0, 0, 0, 0.2);
}
.mobile-slider-top {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 25px;
  border-bottom: 2px solid orange;
  background-color: #6b7b8a;
}
.mobile-slider-top h2 {
  font-size: 1em;
  color: #f2f2f2;
}
.mobile-slider-top h2 span {
  color: orange;
  font-weight: 400;
  font-size: 0.9em;
}
.mobile-slider-top .close-menu {
  color: #f2f2f2;
  font-size: 1.3em;
  position: relative;
}
.close-menu:hover {
  cursor: pointer;
}
.mobile-navigation {
  list-style: none;
}
.mobile-navigation i {
  padding-right: 15px;
}
.mobile-navigation li a,
.mobile-navigation li a:visited {
  padding: 14px;
  color: #ddd;
  text-decoration: none;
  border-bottom: 1px solid #555;
  display: block;
  width: 100%;
  transition: 0.2s;
  font-size: 16px;
}
.mobile-navigation li a:hover {
  background-color: #111111;
}

}

/*---------------------------------------------------------------main slider start---------------------------------------------------*/
/*.btn {
  display: inline-block;
  padding: 13px 20px;
  color: #fff;
  text-decoration: none;
  position: relative;
  background: transparent;
  border: 1px solid #e1e1e1;
  font: 12px/1.2 "Oswald", sans-serif;
  letter-spacing: 0.4em;
  text-align: center;
  text-indent: 2px;
  text-transform: uppercase;
  transition: color 0.1s linear 0.05s;
}
.btn::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: #e1e1e1;
  z-index: 1;
  opacity: 0;
  transition: height 0.2s ease, top 0.2s ease, opacity 0s linear 0.2s;
}
.btn::after {
  transition: border 0.1s linear 0.05s;
}
.btn .btn-inner {
  position: relative;
  z-index: 2;
}
.btn:hover {
  color: #373737;
  transition: color 0.1s linear 0s;
}
.btn:hover::before {
  top: 0;
  height: 100%;
  opacity: 1;
  transition: height 0.2s ease, top 0.2s ease, opacity 0s linear 0s;
}
.btn:hover::after {
  border-color: #373737;
  transition: border 0.1s linear 0s;
}*/

.slideshow {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100vh;
  z-index: 1;
}
.slideshow .slideshow-inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.slideshow .slides {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.slideshow .slide {
  display: none;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.slideshow .slide.is-active {
  display: block;
}
.slideshow .slide.is-loaded {
  opacity: 1;
}
.slideshow .slide .caption {
  padding: 100px 100px 0 100px;
}
.slideshow .slide .image-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  z-index: 1;
  background-size: cover;
  image-rendering: optimizeQuality;
}
.slideshow .slide .image-container::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
}
.slideshow .slide .image {
  width: 100%;
  width: 100%;
  object-fit: cover;
  height: 100%;
}
.slideshow .slide-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  color: #fff;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(
        to top,
        #c9c1c1 9%,
        rgba(255, 99, 71, 0) 30%
    );
}
.moving_load_text{
  font-family: "arial";
  margin-top: 20%;
  font-size: 30px;
  float:right;
  font-style: italic;
}
.slideshow .slide .title {
  font-family: "arial";
  margin: 0 auto 15px;
  max-width: 1000px;
  font-size: 30px;
  /*font: 300 50px/1.2;*/
  /*letter-spacing: 0.35em;*/
  text-transform: uppercase;
}
.slideshow .slide .text {
  font-family: "arial";
  margin: 0 auto;
  max-width: 1000px;
  font-size: 18px;
  line-height: 1.4;
}
.slideshow .slide .btn {
  margin: 15px 0 0;
  border-color: #fff;
}
.slideshow .slide .btn::before {
  background: #fff;
}
.slideshow .pagination {
  position: absolute;
  bottom: 35px;
  left: 43%;
  width: 100%;
  height: 12px;
  cursor: default;
  z-index: 2;
  text-align: center;
}
.slideshow .pagination .item {
  display: inline-block;
  padding: 15px 5px;
  position: relative;
  width: 46px;
  height: 32px;
  cursor: pointer;
  text-indent: -999em;
  z-index: 1;
}
.slideshow .pagination .item + .page {
  margin-left: -2px;
}
.slideshow .pagination .item::before {
  content: "";
  display: block;
  position: absolute;
  top: 15px;
  left: 5px;
  width: 36px;
  height: 2px;
  background: rgba(255, 255, 255, 0.5);
  transition: background 0.2s ease;
}
.slideshow .pagination .item::after {
  width: 0;
  background: #fff;
  z-index: 2;
  transition: width 0.2s ease;
}
.slideshow .pagination .item:hover::before, .slideshow .pagination .item.is-active::before {
  background-color: #fff;
}
.slideshow .arrows .arrow {
  margin: -33px 0 0;
  padding: 20px;
  position: absolute;
  top: 50%;
  cursor: pointer;
  z-index: 3;
}
.slideshow .arrows .prev {
  left: 30px;
}
.slideshow .arrows .prev:hover .svg {
  left: -10px;
}
.slideshow .arrows .next {
  right: 30px;
}
.slideshow .arrows .next:hover .svg {
  left: 10px;
}
.slideshow .arrows .svg {
  position: relative;
  left: 0;
  width: 14px;
  height: 26px;
  fill: #fff;
  transition: left 0.2s ease;
}

/*---------------------------------------------------------------main slider end---------------------------------------------------*/

.form-control {
    display: block;
    width: 300px;
    padding: 0.375rem 0.75rem;
    font-size: 14px;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0rem!important;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.required_field_text{
  font-family: "arial";
  font-size: 14px;
  color: #c2d8eb;
}

textarea{
  width: 100%!important;
}

.submit{
  cursor:pointer;
  width:100px;
  border:none;
  background:#09C;
  color:black;
  margin:0 0 5px;
  padding:10px;
  font-size:15px;
  font-weight: 600;
}

/*---------------------------------------------------------------home page start-----------------------------------------------*/
.services {
  position: relative;
 /* width: 1200px;*/
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  background-color: #0f3863;
  padding: 50px 0;
}
.services__box {
  position: relative;
  width: 145px;
  height: 280px;
  background: #4eb7ff;
  /*border-radius: 20px;*/
  overflow: hidden;
}
.services__box:hover .services__content {
  transform: scale(1);
  transition-delay: 0.25s;
}
.services__box:hover .services__icon {
  width: 80px;
  height: 80px;
  /*border-radius: 50%;*/
  top: 30px;
  left: calc(50% - 40px);
  transition-delay: 0s;
}
.services__box:hover img{
  height: 50px;
  width: 50px;
}
.services__box:hover .services__icon ion-icon {
  font-size: 2rem;
  transition-delay: 0s;
}
.services__icon {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--i);
  transition: 0.5s;
  /*z-index: 2;*/
  transition-delay: 0.25s;
  margin: 0;
}
.services__icon ion-icon {
  font-size: 4rem;
  color: #fff;
  font-weight: bold;
  transition: 0.5s;
  transition-delay: 0s;
}
.services__content {
  position: relative;
  color: #fff;
  padding: 20px;
  text-align: center;
  margin-top: 100px;
  z-index: 1;
  transform: scale(0);
  transition: 0.5s;
  transition-delay: 0s;
}
.services__title {
  margin: 10px 0 5px 0;
  font-size: 1.5rem;
  font-weight: 600;
}
.services__description {
  font-size: 0.95rem;
  font-weight: 400;
  padding-top: 10px;
}

/*---------------------------------------------------------------home page End-----------------------------------------------*/


.card_main {
  height: 300px;
  width: 300px;
  background-image: url(https://images.unsplash.com/photo-1591187954401-bcd97ec89785?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80);
  background-position: center;
  background-size: cover;
  perspective: 1000px;
  box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.10) ;
}

.data {
  width: 100%;
  height: 100%;
  background-color: rgba(127, 194, 3, 0.746);
  text-align: center;
  transform-style: preserve-3d;
  transform: rotateX(90deg) rotate(180deg);
  transition: transform 500ms ease-in-out;
}
.data h1 {
  color: white;
  padding: 40px 0;
  font-size: 60px;
}

.order {
  position: relative;
  overflow: hidden;
}

.data a {
  text-decoration: none;
  padding: 5px 8px;
  background-color: yellow;
  border-radius: 10px;
  color: black;
  font-weight: bold;
  display: inline-block;
  box-shadow: 0 0 7px 3px rgba(0, 0, 0, 0.10);
}

.data a::before {
  content: "Order Now";
  position: absolute;
  top: calc(-100% - 15px);
  right: 50%;
  z-index: 2;
  transform: translate(50%, 50%);
  background-color: white;
  padding: 5px 8px;
  border-radius: 10px;
  transition: top 200ms ease-in-out;
  pointer-events: none;
}

.data a:hover::before {
  top: calc(0% - 14px);
}

.card_main:hover .data {
  transform: rotateX(0deg) rotate(0deg);
}


:root {
  --btn-clr: #ff00d0;
  --gr-clr: linear-gradient(
    to left top,
    #a7c6e5,
    #a7c6e5,
    #a7c6e5,
    #a7c6e5,
    #a7c6e5
  );
}
/*food card hoverable*/


/*---------------------------------------------------------------Our services page start-----------------------------------------------*/

.card__body {
  --card-width: 300px;
  padding: 10px;
  height: 280px;
  /*border-radius: 30px;*/
 /* border: 4px solid var(--btn-clr);*/
  /*width: var(--card-width);*/
  /*height: calc(var(--card-width) + 100px);*/
  display: flex;
  align-items: flex-end;
  /*object-fit: cover;*/
 /* object-position: center;*/
  overflow: hidden;
  position: relative;
}
.card__body .card__image {
  /*width: 120%;*/
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  /*opacity: 0.8;*/
}
.card__body:hover .card__inner {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}
.card__body .card__inner {
  transition: all 300ms cubic-bezier(0.87, -0.38, 0.22, 1.43);
  opacity: 0;
  visibility: hidden;
  transform: translateY(170px);
  box-shadow: 0 0 40px 0px rgba(51, 51, 51, 0.835);
  /*z-index: 1;*/
  backdrop-filter: blur(4px);
  border-radius: 20px;
  padding: 10px 10px;
  color: #f6f6f6;
  max-width: 100%;
  position: relative;
  overflow: hidden;
}
.card__body .card__inner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  z-index: -1;
  background-image: var(--gr-clr);
  opacity: 0.79;
  filter: saturate(200%);
}
.card__body .card__inner .card__title {
  font-family: 'arial';
  text-transform: capitalize;
  max-width: 100%;
  margin: 0;
  margin-top: 10px;
  line-break: 1;
  overflow: hidden;
  /*white-space: nowrap;*/
  text-overflow: ellipsis;
}
.card__body .card__inner .card__text {
  font-family: 'arial';
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 0.8rem;
  line-height: 20px;
  opacity: 0.9;
}
.card__body .card__inner .inner__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.card__body .card__inner .inner__footer .btn {
  font-family: 'arial';
  border: none;
  padding: 5px 20px;
  border-radius: 50px;
  cursor: pointer;
  font-weight: 700;
  color: white;
 /* letter-spacing: 2px;*/
  transition: transform 500ms ease;
  background-color: var(--btn-clr);
}
.card__body .card__inner .inner__footer .btn:hover {
  transform: scale(1.05);
}
.card__body .card__inner .inner__footer .btn:active {
  transform: scale(0.9);
}
.card__body .card__inner .inner__footer .price {
  font-size: 1.4rem;
  font-weight: 600;
}

.pg-title {
  font-family: 'arial';
  font-weight: bolder;
  font-size: 2rem;
  color: #f9f871;
  grid-column: span 3;
  text-align: center;
}

/*---------------------------------------------------------------Our services page start-----------------------------------------------*/

/*about card*/

.card__body_2 {
  --card-width: 300px;
  padding: 10px;
  height: 190px;
  /*border-radius: 30px;*/
  /* border: 4px solid var(--btn-clr);*/
  /*width: var(--card-width);*/
  /*height: calc(var(--card-width) + 100px);*/
  display: flex;
  align-items: flex-end;
  /*object-fit: cover;*/
  /* object-position: center;*/
  overflow: hidden;
  position: relative;
}
.card__body_2 .card__image_2 {
  /*width: 120%;*/
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  /*opacity: 0.8;*/
}
.card__body_2:hover .card__inner_2 {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}
.card__body_2 .card__inner_2 {
  /*height: 100%;
  width: 100%;*/
  transition: all 300ms cubic-bezier(0.87, -0.38, 0.22, 1.43);
  opacity: 0;
  visibility: hidden;
  transform: translateY(170px);
  box-shadow: 0 0 40px 0px rgba(51, 51, 51, 0.835);
  /*z-index: 1;*/
  backdrop-filter: blur(4px);
  border-radius: 20px;
  padding: 10px 10px;
  color: #f6f6f6;
  max-width: 100%;
  position: relative;
  overflow: hidden;
}
.card__body_2 .card__inner_2::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  z-index: -1;
  background-image: var(--gr-clr);
  opacity: 0.79;
  filter: saturate(200%);
}
.card__body_2 .card__inner_2 .card__title_2 {
  font-family: 'arial';
  text-transform: capitalize;
  max-width: 100%;
  margin: 0;
  font-size: 20px; 
  /*margin-top: 10px;*/
  line-break: 1;
  overflow: hidden;
  /*white-space: nowrap;*/
  text-overflow: ellipsis;
}
.card__body_2 .card__inner_2 .card__text_2 {
  font-family: 'arial';
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 0.8rem;
  line-height: 20px;
  opacity: 0.9;
}
.card__body_2 .card__inner_2 .inner__footer_2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.card__body_2 .card__inner_2 .inner__footer_2 .btn_2 {
  font-family: 'arial';
  border: none;
  padding: 5px 12px;
  border-radius: 50px;
  cursor: pointer;
  font-weight: 700;
  width: 100px;
  font-size: 12px;
  color: white;
  /*letter-spacing: 2px;*/
  transition: transform 500ms ease;
  background-color: var(--btn-clr);
}
.card__body_2 .card__inner_2 .inner__footer_2 .btn_2:hover {
  transform: scale(1.05);
}
.card__body_2 .card__inner_2 .inner__footer_2 .btn_2:active {
  transform: scale(0.9);
}
.card__body_2 .card__inner_2 .inner__footer_2 .price_2 {
  font-size: 1.4rem;
  font-weight: 600;
}
/*---------------------------------------------------------------Our services page End-----------------------------------------------*/
/*---------------------------------------------------------------Request a quote page start-----------------------------------------------*/

/* ---- */
/* FORM */
/* ---- */

.request_quote_form{
  margin: 10px;
}

.contact form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
  padding: 10px 120px;
  margin: 20px 0px;
}

.contact form label {
  display: block;
}

.contact form p {
  font-family: "arial";
  margin: 0;
}

.contact form .full {
  grid-column: 1 / 3;
}

.contact form button,
.contact form input,
.contact form textarea {
  width: 100%;
  padding: 1em;
  border: solid 1px #627EDC;
  border-radius: 4px;
}

.contact form textarea {
  resize: none;
}

.contact form button {
  font-family: "arial";
  background: #627EDC;
  border: 0;
  color: #e4e4e4;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: bold;
  width: 40%;
}

.contact form button:hover,
.contact form button:focus {
  background: #3952a3;
  color: #ffffff;
  outline: 0;
  transition: background-color 2s ease-out;
}

/* ------------- */
/* MEDIA QUERIES */
/* ------------- */

@media only screen and (min-width: 700px) {
  .wrapper {
    display: grid;
    /*grid-template-columns: 1fr 2fr;*/
  }

  /*.wrapper > * {
    padding: 2em;
  }*/

  .company-info {
    border-radius: 4px 0 0 4px;
  }

  .contact {
    border-radius: 0 4px 4px 0;
  }

  .company-info h3,
  .company-info ul,
  .brand {
    text-align: left;
  }
}

/*---------------------------------------------------------------Request a quote page End-----------------------------------------------*/




