/* body{
    background-color: rgb(241, 241, 241) !important;  
} */

/* On screens that are 992px or less, set the background color to blue */
@media screen and (max-width: 1150px) {
    header{
        padding:15px 100px !important;
    }
  }
  
  /* On screens that are 600px or less, set the background color to olive */
  @media screen and (max-width: 600px) {
    header{
        padding:15px 150px;
    }
    .navigation-items{
        display: none !important;
    }
    .navigation-items-menu{
        display: block !important;
    }
  }



header{
    z-index: 999;
    position: fixed;
    top: 0;
    left:0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items:center;
    padding:15px 200px;
    transition: 0.5s ease;
    -webkit-box-shadow: 0px 0px 9px 3px rgba(41,41,41,.25);
-moz-box-shadow: 0px 0px 9px 3px rgba(41,41,41,.25);
box-shadow: 0px 0px 9px 3px rgba(41,41,41,.25);
}

@media screen and (max-width: 600px) {
    header{
        padding:15px 150px;
    }
}

.mob-nav-items a{
  position: relative;
  color:black;
  font: size 1.5em;
  font-weight:700;
  text-decoration: none;
  font-size: x-large;
  transition: 0.3s ease;
  margin:0px 10px 0px 10px; 
}

.navigation-items a{
    position: relative;
    color:black;
    font: size 1.5em;
    font-weight:700;
    text-decoration: none;
    font-size: x-large;
    transition: 0.3s ease;
    margin:0px 10px 0px 10px; 
}
.titles:before{
    content: '';
    position: absolute;
    background:#ffc107;
    width:0;
    height: 3px;
    bottom:0;
    left:0;
    transition: 0.3s ease;
    
}
.titles:hover:before{
   width:100%;

}
.titles:hover{
    color:rgb(24, 24, 24);
}

.brand{
    background-color: #ffc107;
    background-image: linear-gradient(45deg, #ca0630, #3c839c);
    background-size: 100%;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent; 
    -moz-text-fill-color: transparent;
    /* color: #ffc107; */
    font: size 1.5em;
    font-weight:700;
    text-decoration: none !important;
    font-size: xx-large;
}




@media screen and (max-width: 550px) {
     
    .brand{
        font-size: x-large;
    }
    header {
        padding: 11px 47px !important;
    }
    #brand-img{
        height:39px;
    }
    .about-us {
        font-size: 50px;
    }
    
      }

@media (min-width: 576px){
      .bd-example {
          padding: 1.5rem;
          margin-right: 0;
          margin-left: 0;
          border-width: 1px;
          border-top-left-radius: 0.25rem;
          border-top-right-radius: 0.25rem;
      }
      .bd-example {
          position: relative;
          padding: 1rem;
          margin: 1rem -0.75rem 0;
          border: solid #dee2e6;
          border-width: 1px 0 0;
      }

    }
.glass_header{
    backdrop-filter: blur(21px) saturate(176%);
    -webkit-backdrop-filter: blur(21px) saturate(176%);
    background-color: rgba(255, 255, 255, 0.4);
    border-radius: 12px;
    border: 1px solid rgba(209, 213, 219, 0.3);
}


    .first-banner{
      /* background-image: url("https://source.unsplash.com/1980x600/?sunsetsky"); */
      background-image: url("assets/xyz.jpg");
      /* position: relative; */
      /* opacity: 0.65; */
      background-attachment: fixed;
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
    }


.form-jobs {
  width:65vw !important;
  max-width:750px;
  /* background-color: whitesmoke;
  border-radius:10px; */
}

.jobs-blog {
  width:35vw !important;
  height:50vh;
  /* border:solid #bcbcbc;
  border-width: 1px; */
  
}


.container-body{
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
 
}

.jobs-blog, .form-jobs {
  margin-top:5%;
  padding-top: 1%;
  padding-right:1%;
  padding-left:1%;
  margin-left:2%;
  margin-right:2%;
}


.tags-box{
  display: flex;
  flex-wrap: wrap;
  max-width: 300px;
  margin: 10px 0px;
}
.tags{
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  padding: 2px 8px;
  line-height: 1;
  font-size: 12px;
  margin-right: 8px;
  margin-bottom: 2px;
  background: rgb(245, 247, 251);
  color: rgb(107, 124, 143);
  border-radius: 5555px;
}

.tag i{
  width: 15px;
  height: 15px;
}

.share {
  color: rgb(43, 183, 146) !important;
  width: fit-content !important;
  display: flex;
  flex-wrap: nowrap;
}
.link-unstyled, .link-unstyled:link, .link-unstyled:hover {
  color: inherit;
  text-decoration: inherit;
}

.btn-flex{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}


.btn-flex-1{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}





@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,500,300,700);

section {
  font-family: Open Sans;
}

section {
  width: 100%;
  display: inline-block;
  background: #333;
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  text-decoration: underline;
}

.footer-distributed{
	background: rgb(102, 102, 102);
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
	box-sizing: border-box;
	width: 100%;
	text-align: left;
	font: bold 16px sans-serif;
	padding: 55px 50px;
}

.footer-distributed .footer-left,
.footer-distributed .footer-center,
.footer-distributed .footer-right{
	display: inline-block;
	vertical-align: top;
}

/* Footer left */

.footer-distributed .footer-left{
	width: 40%;
}

/* The company logo */

.footer-distributed h3{
	color:  #ffffff;
	font: normal 36px 'Open Sans', cursive;
	margin: 0;
}

.footer-distributed h3 span{
	color:  lightseagreen;
}

/* Footer links */

.footer-distributed .footer-links{
	color:  #ffffff;
	margin: 20px 0 12px;
	padding: 0;
}

.footer-distributed .footer-links a{
	display:inline-block;
	line-height: 1.8;
  font-weight:400;
	text-decoration: none;
	color:  inherit;
}

.footer-distributed .footer-company-name{
	color:  #222;
	font-size: 14px;
	font-weight: normal;
	margin: 0;
}

/* Footer Center */

.footer-distributed .footer-center{
	width: 35%;
}

.footer-distributed .footer-center i{
	background-color:  #33383b;
	color: #ffffff;
	font-size: 25px;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	text-align: center;
	line-height: 42px;
	margin: 10px 15px;
	vertical-align: middle;
}

.footer-distributed .footer-center i.fa-envelope{
	font-size: 17px;
	line-height: 38px;
}

.footer-distributed .footer-center p{
	display: inline-block;
	color: #ffffff;
  font-weight:400;
	vertical-align: middle;
	margin:0;
}

.footer-distributed .footer-center p span{
	display:block;
	font-weight: normal;
	font-size:14px;
	line-height:2;
}

.footer-distributed .footer-center p a{
	color:  lightseagreen;
	text-decoration: none;;
}

.footer-distributed .footer-links a:before {
  content: "|";
  font-weight:300;
  font-size: 20px;
  left: 0;
  color: #fff;
  display: inline-block;
  padding-right: 5px;
}

.footer-distributed .footer-links .link-1:before {
  content: none;
}

/* Footer Right */

.footer-distributed .footer-right{
	width: 20%;
}

.footer-distributed .footer-company-about{
	line-height: 20px;
	color:  #92999f;
	font-size: 13px;
	font-weight: normal;
	margin: 0;
}

.footer-distributed .footer-company-about span{
	display: block;
	color:  #ffffff;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 20px;
}

.footer-distributed .footer-icons{
	margin-top: 25px;
}

.footer-distributed .footer-icons a{
	display: inline-block;
	width: 40px;
	height: 40px;
	cursor: pointer;
	background-color:  #33383b;
	border-radius: 2px;

	font-size: 20px;
	color: #ffffff;
	text-align: center;
	line-height: 35px;

	margin-right: 3px;
	margin-bottom: 5px;
}

/* If you don't want the footer to be responsive, remove these media queries */

@media (max-width: 880px) {

	.footer-distributed{
		font: bold 14px sans-serif;
	}

	.footer-distributed .footer-left,
	.footer-distributed .footer-center,
	.footer-distributed .footer-right{
		display: block;
		width: 100%;
		margin-bottom: 40px;
		text-align: center;
	}

	.footer-distributed .footer-center i{
		margin-left: 0;
	}

}
 .clients-connect h4 i{
display: inline-block;
	width: 35px;
	height: 35px;
	cursor: pointer;
	background-color:  #33383b;
	border-radius: 2px;

	font-size: 20px;
	color: #ffffff;
	text-align: center;
	line-height: 35px;

	margin-right: 3px;
	margin-bottom: 5px;

}

.cl-item{
    width: 200px;
    height: 150px;

  }

  @media screen and (max-width: 550px) {
    .cl-item{
        width: 150px;
        height: 100px;
    
      }
}

.about-us{
    text-align: center;
    background-color: #ca0630;
    background-image: linear-gradient(90deg, #d12e2f, #3c839c);
    background-size: 100%;
    -webkit-background-clip:text;
    -moz-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color:transparent;;
    -moz-text-fill-color:transparent;
    font:size 1.5em;
    font-weight: 700;
    text-decoration: none !important;
    font-size: 70px;
    width: fit-content;
    
 }