@charset "UTF-8";
/*!
* Mtendere Secondary School
*/
:root {
  --blue: #0d6efd;
  --navy-blue:#000080;
  --navy-blue-rgb:0,0,128;
  --sky-blue:#87ceeb;
  --sky-blue-rgb:135,206,235;
  --deep-sky-blue:#00bfff;
  --dark-blue-rgb:0,0,139;
  --dark-blue:#00008b;
  --red: #dc3545;
  --orange: #fd7e14;
  --green: #198754;
  --green-rgb:25,135,84;
  --teal: #20c997;
  --black: #000;
  --white: #fff;
  --primary: #0d6efd;
  --success: #198754;
  --whitesmoke: #f5f5f5;
  --info: #0dcaf0;
  --warning: #ffc107;
  --danger: #dc3545;
  --light: #f8f9fa;
  --dark: #212529;
  --footer-color: var(--white);
  --footer-bg-color: var(--navy-blue);
  --header-bg-color: var(--blue);
  --title-color:#258cd1;
  --border-radius-pill: 50rem;
  --border-radius-pill-md: 5rem;
  --link-hover-color: var(--green);
  --link-bg-color: var(--blue);
  --nav-bottom-border:2px solid var(--red);
  --nav-pills-bg-color: var(--blue);
  --prefooter-bg-color: var(--sky-blue);
  --lh: 1.5rem;
}
.btn{
	border-radius:0;
}
.btn-primary {
	background-color:var(--dark-blue) !important;
	border:1px solid var(--dark-blue)!important;
}
.btn-outline-primary {
  --bs-btn-border-color: var(--dark-blue);
  --bs-btn-active-bg: var(--dark-blue);  
  --bs-btn-color: var(--dark-blue);
  --bs-btn-border-color: var(--dark-blue);
  --bs-btn-hover-bg: var(--dark-blue);
  --bs-btn-hover-border-color: var(--dark-blue);
}

.btn-circle.btn-xl {
		height: 50px;
		width: 50px;
		border-radius: 35px;
		font-size: 15px;
		line-height: 1.33;
	}
	.btn-circle.btn-lg {
		width: 35px;
		height: 35px;
		padding: 6px 0;
		border-radius: 35px;
		font-size: 15px;
	}
	
.btn-circle {
    width: 30px;
    height: 30px;
    padding: 6px 0;
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    line-height: 1.42857;
	overflow: hidden;
}

.btn-white {
  transition-duration: 0.4s;
  background-color: #fff;
  color:#0033AA;
}

.btn-white:hover {
  background-color: #eee;
  color: #0033AA;
}

@media (min-width: 576px) {
	.btn-circle.btn-xl {
		height: 70px;
		width: 70px;
		padding: 12px;
		border-radius: 35px;
		font-size: 15px;
		line-height: 1.33;
	}
	.btn-circle.btn-lg {
		width: 50px;
		height: 50px;
		border-radius: 35px;
		font-size: 25px;
	}
}
.callout {
  margin: 0 0 20px 0;
  padding: 15px 30px 15px 15px;
  border-left: 5px solid #eee;
}
.callout h4 {
  margin-top: 0;
}
.callout p:last-child {
  margin-bottom: 0;
}
.callout code,
.callout .highlight {
  background-color: #fff;
}
.callout.callout-danger {
  background-color: #fcf2f2;
  border-color: #dFb5b4;
}
.callout.callout-warning {
  background-color: #fefbed;
  border-color: #f1e7bc;
}
.callout.callout-info {
  background-color: #f0f7fd;
  border-color: #d0e3f0;
}
.callout.callout-danger h4 {
  color: #B94A48;
}
.callout.callout-warning h4 {
  color: #C09853;
}
.callout.callout-info h4 {
  color: #3A87AD;
}
.bs-callout {
  padding: 20px;
  margin: 0 0 20px 0 !important;
  border: 1px solid #eee;
  border-left-width: 5px;
  border-radius: 4px;
  margin-left: 50px;
}
.bs-callout-xl {
  margin-left: 0px;
}
.bs-callout-lg {
  margin-left: 50px;
}
.bs-callout-md {
  margin-left: 100px;
}
.bs-callout-sm {
  margin-left: 150px;
}
.bs-callout-xs {
  margin-left: 200px;
}
.bs-callout h4 {
  margin-top: 0;
  margin-bottom: 5px;
}
.bs-callout p:last-child {
  margin-bottom: 0;
}
.bs-callout code {
  border-radius: 4px;
}
.bs-callout+.bs-callout {
  margin-top: -5px;
}
.bs-callout-default {
  border-left-color: #777;
  background-color: #f7f7f9;
}
.bs-callout-default h4 {
  color: #777;
}
.bs-callout-primary {
  border-left-color: #428bca;
}
.bs-callout-primary h4 {
  color: #428bca;
}
.bs-callout-success {
  border-left-color: #5cb85c;
  background-color: #efffe8;
}
.bs-callout-success h4 {
  color: #5cb85c;
}
.bs-callout-danger {
  border-left-color: #d9534f;
  background-color: #fcf2f2;
}
.bs-callout-danger h4 {
  color: #d9534f;
}
.bs-callout-warning {
  border-left-color: #f0ad4e;
  background-color: #fefbed;
}
.bs-callout-warning h4 {
  color: #f0ad4e;
}
.bs-callout-info {
  border-left-color: #5bc0de;
  background-color: #f0f7fd;
}
.bs-callout-info h4 {
  color: #5bc0de;
}
/* bg transparency and disabled effects for Bootstrap callout */ 
.bs-callout-default.transparent {
  background-color: rgb(247, 247, 249, 0.7); /*#f7f7f9*/
}
.bs-callout-success.transparent {
  background-color: rgb(239, 255, 232, 0.7); /*#efffe8*/
}
.bs-callout-warning.transparent {
  background-color: rgb(254, 251, 237, 0.7); /*#fefbed*/
}
.bs-callout-danger.transparent {
  background-color: rgb(252, 242, 242, 0.7); /*#fcf2f2*/
}
.bs-callout-info.transparent {
  background-color: rgb(240, 247, 253, 0.7); /*#f0f7fd*/
}
.bs-callout.disabled {
  opacity: 0.4;
}

.truncate {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.truncate-overflow {
  --max-lines: 3;
  position: relative;
  max-height: calc(var(--lh) * var(--max-lines));
  overflow: hidden;
  padding-right: 1rem;
}
.truncate-overflow::before {
  position: absolute;
  content: "...";
  bottom: 0;
  right: 0;
}
.truncate-overflow::after {
  content: "";
  position: absolute;
  right: 0;
  width: 1rem;
  height: 1rem;
  background: white;
}

/* {
  margin: 0;
  padding: 0;
  list-style: none; 
  }*/


 a{
	 color:var(--sky-blue);
	 text-decoration: none;
 }
 a:hover{
	 color:var(--link-hover-color);
	 background-color:transparent;
 }
 /*.prefooter a{
	 color:var(--dark-blue);
 }*/
 
body {
    font-family: Lato, sans-serif;
	background-color:#dddfe2 !important;
    padding: 0 !important;
    margin: 0;
	line-height: var(--lh);
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; 
}

 #main{
/*background-image: url('/images/background.jpg');*/
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;  
  background-attachment: fixed;
  min-height:800px;
 }
.container-fluid {
	margin:0!important;
	padding:0!important;
}
@media (max-width: 767.98px) {
	body{
		text-align:center;
	}
}
.banner {
	margin-top:0 !important;
}
.banner h1{
	font-size:2.5rem;
	margin-top:0 !important;
	padding-top:50px;
}
h1,h2 {
  font-family: "rift", Arial, Verdana;
  margin-top: 2rem;
  margin-bottom: 1.5rem;
  text-transform: uppercase;
}
h1{
  font-weight: 700;
}
h2 {  
  font-weight: 400;
}

h1,h2,h3,h4,h5,h6 {
      color: var(--dark-blue);
    font-family: 'Open Sans', sans-serif;
	font-weight:bold;
    }

	header{
        background-color:var(--header-bg-color);
        text-align: center;	
	}

    
	.brand,super-marquee{		
		font-family: 'Comic Sans MS', sans-serif;
		font-weight: 700;
	}
	@media (max-width: 575.98px) {
		.brand{
			padding-left:10px;
			padding-right:10px;
			font-size:1.6rem;
		}
	}
	.brand{
		color:var(--white) !important;
	}
	
/* Navigation*/
nav#main-nav {
	background-color: #0a2240 !important;
}
.navigation-main > .nav-item > .nav-link {
  color: var(--white);
  border-radius: var(--border-radius-pill);
}

/*.navigation-main > .nav-item >.nav-link:hover,
	.navigation-main > .nav-item > .nav-link.active {
		padding-bottom:0;
		background-color: #87CEEB;
	  border-bottom: var(--nav-bottom-border);
	}*/
.navigation-main .level-1 > a{
	--border-radius-pill-md: .85rem;
		border-radius: var(--border-radius-pill-md) !important;
	 color: var(--white);
	 padding:2px;
	 margin:2px;
	  background-color: #0056b3;/*var(--nav-pills-bg-color);*/	
	}
	.navigation-main .level-1 > a:hover,
	.navigation-main .level-1 > a.active{
	--border-radius-pill-md: .85rem;
		border-radius: var(--border-radius-pill-md) !important;
		border-bottom: 2px solid #dc3545 !important;
		color: #0a2240 !important;
		background-color:#87CEEB;
	}
	@media screen and (max-width: 991.8px) {
		.sub-menu .nav-link:hover,
	.sub-menu .nav-link.active {
			background-color:#dddfe2;/*rgba(var(--green-rgb),.5);*/
			color: #0a2240 !important;
			padding-bottom:0 !important;
		margin-bottom:2px; 
	} 
	}
@media (min-width:992px) {
	#main-nav .nav-item .nav-link {
	  color: var(--white);
	  padding-top:2px;
	  padding-bottom:2px;
	  padding-left:2px;
	  padding-right:2px;
	}
	.sub-menu .nav-link:hover,
	.sub-menu .nav-link.active {
			background-color:#dddfe2;/*rgba(var(--green-rgb),.5);*/
			color: #0a2240 !important;
			padding-bottom:0 !important;
		margin-bottom:2px; 
	}

	#main-nav {
		height:70px;
	}
}
/*@media (min-width: 576px) {
	#main-nav .nav-item > .nav-link {
		padding-left:15px;
	}
}*/
@media (max-width:1199.98px) {
	#main-nav .nav-item > .nav-link {
	  text-align:left;
	padding-left:5px;
	margin-left:0 !important;
	margin-top:3px;
	}
	/*#main-nav .nav-item .nav-link.active {
	  background-color:rgba(var(--green-rgb),.5);
	}*/
}

#main-nav.navbar {
   margin-top:10px;
}

@media (min-width: 1400px) {
	.navbar-nav > li{
	  margin-left:3px;
	  margin-right:3px;
	}
	#main-nav .nav-item > .nav-link {
	  /*padding-left: 10px;
	  padding-right: 10px;*/
	  padding-left: 15px;
	  padding-right: 15px;
	}
}
@media (min-width: 1200px) {
	#main-nav .nav-item > .nav-link {
	  padding-top:3px;
	  padding-bottom:3px;
	  margin-left: 2px;
	  margin-right: 2px;
	  padding-left: 10px;
	  padding-right: 10px;
	  color: #fff;
	  transition: background-color 0.3s;
	}
}
.nav-item .nav-link {
	margin-right:0;
	margin-left:1px;
	margin-right:1px;
}
@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */ 
.navbar {
   margin-top:20px;
}

#main-nav .nav-item > .nav-link:hover,
#main-nav .nav-item > .nav-link.active {
  color: var(--white);
}

#main-nav .nav-item > .nav-link.active {
  color: var(--white);
}
}  
/** end navigation*/

/* prefooter */
.prefooter-banner {
	padding: 20px !important;
	background-color:rgb(var(--sky-blue-rgb));
	min-height:100px;
}
/* footer styles starts */

/*footer {
  padding: 50px;
  background-color: var(--footer-bg-color);
  color: #FFF; 
  } 
}*/
footer {
    padding-top: 25px;
    border-top: 1px solid #0a2240;
    background: #0a2240;
    margin-top: 0;
	font-family: 'Open Sans', sans-serif;
	color: #ddd;
}


 @media screen and (max-width: 940px) {
    footer {
      padding: 30px 10px; } 
}
  footer h2 {
    font-size: 1.2rem;
    margin-bottom: 20px;
	color:#fff;
	}
  footer .contact p {
    font-size: .9em;
    margin-bottom: 20px; }
	footer .contact .foot-address {
    margin-bottom: 1rem }
 @media (min-width: 768px) {
  footer .contact .foot-address {
    display: flex; }
	}
    footer .contact .foot-address .icon {
      padding: 10px 10px; }
    footer .contact .foot-address .add {
      font-size: .9rem;
      margin: auto 0; }
  footer .fotblog .blohjb {
    margin-bottom: 10px; }
    footer .fotblog .blohjb p {
      font-size: .9rem; }
    footer .fotblog .blohjb span {
      font-size: .9rem; }
footer .glink h2{
	padding:0px !important;
	margin-bottom:10px;
	padding-left: 2.5rem !important;
	list-style: none; 	
	}
footer .glink ul li {
	padding:10px !important;
	margin-left: 0 !important;
	list-style: none; 	
	}

@media (max-width: 575.98px) {
	footer .glink ul{
    padding: 0;
	margin-left:0;
	}
}
    footer .glink ul li i {
      margin-right: 10px; }
    footer .glink ul li a {
      color: #FFF; }
	footer .glink ul li a:hover {
      color: var(--link-hover-color);
	  }
  footer .tags ul li {
    float: left;
    padding: 8px;
    margin-right: 8px;
    margin-bottom: 8px;
    border: 1px solid #CCC; }

.copy {
  padding: 20px;
  background-color:#0a2230;
  color: #FFF; }
  .copy a {
    color: #FFF;
    font-size: .8rem; }
  .copy span {
    float: right; }
    .copy span i {
      margin-right: 20px; }
 #poweredByJumait {
	 font-size:7pt;
 }
@media (min-width: 900px) {
  #poweredByJumait {
	position: absolute;
	right: 100px;
	text-align:center;
	  width: 100%;
	  max-width: 65.5555555556em;
	  max-width: 73.75rem;
	  width: 132px;
	  font-size:9pt;
	}
}
/* end footer */
section {
	max-width: 800px;
	max-height: 100%;
	margin: 0 auto;
	padding: 10px;
	background-color: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	border-radius: 10px;
}
		
/* Basic styling for the search container */
.search-container {
  position: relative;
  display: inline-block;
}

/* Styling for the search input */
.search-input {
  padding: 8px;
  border-radius: 25px;
  color:#fff !important;
  outline: none;
  background-color:var(--primary);
  width: 200px;
  transition: width 0.3s ease-in-out;
}
.search-input::placeholder {
  color: #fff;
  opacity: 1; /* Firefox */
  text-align:center;
}

.search-input::-ms-input-placeholder { /* Edge 12 -18 */
  color: #fff;
  align-content:center;
}

/* Styling for the search icon */
.search-icon {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  cursor: pointer;
}

/* Styling for the focus effect */
.search-input:focus {
  width: 250px;
}
.staff-result-container1 ul{
	background:#fdfdff;
	list-style:none;
}
.result-container,
.staff-result-container1 ul,
.staff-result-container1 p {
	text-align:left;
	z-index:1001;
	left:auto;
	max-height:100%;
	position:absolute;
}
@media (max-width: 575.98px) {
	.result-container,
	.staff-result-container1 ul,
	.staff-result-container1 p{
		width:100%;
		overflow:auto;
	}
}
.loader {
    position: fixed;
    top: 60%;
    width: 100% !important;
    text-align: center !important;
    margin-top: 50px !important;
    background-color: #fff;
}

.preloader {
    background-image: url("/favicon.png");
    background-size: 150px;
    top: 0;
    left: 0;
    height: 100vh;
	width: 100vw;
    position: fixed;
    background-color: #fff;
    z-index: 20000;
    background-position: center;
    background-repeat: no-repeat;
}

#goToTopBtn {
    display: none;
    position: fixed;
    bottom: 80px;
    right: 80px;
    background-color: #bd4147;
    color: #fff;
    cursor: pointer;
    border-radius: 50%;
    border: 1px solid #bd4147;
    font-size: 18px;
    height: 40px;
    width: 40px;
    align-items: center !important;
	z-index:1001;
}
#goToTopBtn:hover {
	--red:#ff0000;
    background-color: var(--red);
	border: 1px solid var(--red);
}
#goToTopBtn:hover:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    margin-left: 10px;
    margin-top: -10px;
    height: 130%;
    width: 110%;
    box-sizing: border-box;
    padding: 10px;
}

 /* Gallery Link Styles */
    .gallery-link {
		display: inline-block;
		padding: 10px 20px;
		background-color: var(--green); /* Green */
		color: white;
		text-align: center;
		text-decoration: none;
		font-size: 16px;
		border-radius: 5px;
		border: none;
		cursor: pointer;
		transition: background-color 0.3s;
	}

	.gallery-link:hover {
		background-color: var(--link-hover-color);
	}

	/* Gallery Image Styles */
	.gallery-images {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin-top: 20px;
	}

	.gallery-image {
		margin: 10px;
		border-radius: 5px;
		overflow: hidden;
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
		transition: transform 0.3s ease-in-out;
	}

	.gallery-image:hover {
		transform: scale(1.05);
	}

	.gallery-image img {
		width: 200px;
		height: 200px;
		object-fit: cover;
	}

.social-icons {
	text-align:center;
}
.social-icon i{
	color:var(--prefooter-bg-color);
}
/*.social-icon .fa-stack-1x {
	color:var(--prefooter-bg-color);
} 
.social-icon {
    display: inline-block;
    font-size: 24px;
	color:var(--white);
    transition: color 0.3s ease;
}*/
/*@media (min-width: 900px) {
  .social-icon {
		padding-top: 20px;
	}
}*/

 .fa-stack.small {
    font-size: 0.5em;
  }
   .fa-stack.medium {
    font-size: 0.7em;
  }
  i {
    vertical-align: middle;
  }

/*styling links in academics*/
.cool-link {
	display: inline-block;
	padding: 10px 20px;
	background-color:var(--link-bg-color);
	color: #fff;
	text-decoration: none;
	border-radius: 5px;
	transition: background-color 0.3s;
	font-size: 16px;
}

.cool-link:hover {
	background-color: var(--link-hover-color);
	color: #fff;
}

/* Services page styling */
.service {
		margin-bottom: 20px;
		padding: 20px;
		border-radius: 10px;
		background-color: #fff;
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
		transition: transform 0.3s ease, box-shadow 0.3s ease;
	  }
	
	  .service:hover {
		transform: translateY(-5px);
		box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
	  }
	
	  .service h2 {
		color: var(--title-color);
		font-size: 24px;
		margin: 0;
		margin-bottom: 10px;
	  }
	
	  .service p {
		font-size: 16px;
		margin: 0;
		color: var(--dark);
	  }
    
.service {
    display: flex;
    margin-bottom: 40px;
}

.service-info {
    flex: 1;
    padding: 20px;
}

.service-image {
    flex: 1;
    padding: 20px;
}

.service-image img {
    width: 100%;
    border-radius: 5px;
}
 /*end service   */////


/** image carousel custom styling */
.carousel-indicators {
        bottom: -1.4375rem;
    }
    .carousel-indicators button {
        background-color: #f00;
    }
	
.carousel .carousel-indicators button.active { background-color: var(--primary); }

.carousel-caption h3, 
.carousel-caption h4{
	color:#fff;
} 

/* cards */
#cards-container-1{
	position:relative;
	padding-top:10px;
	padding-bottom:10px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color:#9fcdff;/*rgba(34,61,80,1);*/
	margin-left:0 !important;
	margin-right:0 !important;
}
#cards-container-1  > .container {
	border:.5rem solid #0062e1;
	border-radius:2rem;
}
#cards-container-1 .card .card-img {
	height:350px;
    min-width: 200px;
    object-fit: cover !important;
}
.card-with-img-bg {
    overflow: hidden; /* Hide overflow */
    transition: transform 0.3s ease; /* Add transition effect */
    position: relative; /* Position for hover effect */
	min-height:350px;
	max-height:200px;
}
.container-fluid.cover{
	background-color:var(--light);
	padding-top:3rem !important;	
	padding-bottom:3rem;
}
@media (min-width: 1400px) {
.container-fluid.cover{
	padding-top:3rem;	
	padding-bottom:3rem;
}
#cards-container-1 .card .card-img {
	height:400px;
    width: 100%;
    object-fit: cover !important;
}
#cards-container-1 .card .card-text{
	vertical-align:middle;
}
.card-with-img-bg {
	margin: 20px;
    border: 5px solid #fff; /* White border */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); /* Shadow effect */
    overflow: hidden; /* Hide overflow */
    transition: transform 0.3s ease; /* Add transition effect */
    position: relative; /* Position for hover effect */
	min-height:400px;
	max-height:400px;
}

.card-with-img-bg:hover{
	transform: scale(1.05); /* Scale up on hover */
}
.card-img-overlay {
	background-color: #0056b3; 
	min-height:400px;
	max-height:400px;
}
}
.card-image {
	display:block;
	margin:auto;
}
.action-card-button {
    position: absolute; /* Position text over image */
    bottom: 0;
    left: 0;
    right: 0;
}

/** infobox styling */
.info-box {
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2);
  border-radius: 0.25rem;
  position: relative;
  display: flex;
  width: 100%;
  min-height: 80px;
  padding: 0.5rem;
  margin-bottom: 1rem;
  background-color: #fff;
}
.info-box .info-box-icon {
  display: flex;
  align-items: center;
  background:#0056b3;
  justify-content: center;
  width: 150px;
  font-size: 1.05rem;
  text-align: center;
}
.info-box .info-box-icon > img {
  max-width: 100%;
}
.info-box .info-box-content {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  padding: 0 10px;
  line-height: 1.8;
}

@media (max-width: 1399.98px){
	.p-5 {
		padding:2rem !important;
	}
	.pt-5 {
		padding-top:2rem !important;
	}
	.pb-5{
		padding-bottom:2rem !important;
	}
}


#welcome-jumbo{
	padding: 2rem 3rem 3rem;
	margin:3rem;
	color: #fff;
    background: #007bff;
    background: -moz-linear-gradient(151deg, #0033AA 0%, #007bff 100%);
    background: -webkit-linear-gradient(151deg, #0033AA 0%, #007bff 100%);
    background: linear-gradient(151deg, #0033AA 0%, #007bff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#0033AA, endColorstr=#007bff);
}
@media (max-width: 479px) {
 #welcome-jumbo{
    padding: 1rem;
	margin:1rem;
  }
}
#welcome1 .msg{
	color: #fff;
	background: #0a2240 !important;
	background: -moz-linear-gradient(151deg, #0033AA 0%, #0a2240 100%) !important;
	background: -webkit-linear-gradient(151deg, #0033AA 0%, #0a2240 100%) !important;
	background: linear-gradient(151deg, #0033AA 0%, #0a2240 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#0033AA, endColorstr=#0a2240) !important;
}
@media (min-width: 576px) {
	#welcome{
		padding: 3rem !important;
		margin:3rem;
	}
}
@media (min-width: 768px) {
	#welcome .row:first-child{
		padding-bottom:3rem;
	}
}
/**
 * ===================================================================================
 * = IMAGE BOX STYLING
 * ===================================================================================
 */
.image-box-item .avatar {
  position: relative;
}
.image-box-item .avatar .overlay {
  z-index: 0;
  transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  visibility: hidden;
  opacity: 0;
}
.image-box-item .avatar .img-details {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  margin-top: -11px;
  text-align: center;
  transition: all 0.5s linear;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  visibility: hidden;
  opacity: 0;
}
.image-box-item .avatar .img-details a {
  color: #fff;
  font-size: 16px;
  margin: 0 14px;
}
.image-box-item .avatar .img-details a:hover {
  color: #be8b2b;
}
.image-box-item .img-caption {
  padding: 28px 30px 8px;
  background: #fff;
}
.mem-height{
  height: 134px;
}
.image-box-item .img-caption h5 span {
  display: block;
  margin-top: 5px;
}
.image-box-item:hover .overlay {
  opacity: 0.7;
  visibility: visible;
}
.image-box-item:hover .img-details {
  visibility: visible;
  opacity: 1;
}
.image-box-item.slide-item {
  margin: 0 15px;
  margin-bottom: 3px;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  background: #00387a;
  opacity: 0.8;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.infolink {
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: 12px;
  color: #be8b2b;
  display: inline-block;
  line-height: 1.1;
}
.infolink:visited {
  color: #be8b2b;
}
.infolink:hover {
  color: var(--hover-color);
}

.rounded-xs {
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  overflow: hidden;
}

/********************* Add * in required section *************** start ******/
form div.required label.form-label:after {
  content:" * ";
  color:red;
}
/********************* Add * in required section *************** end *******/

@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */ 
.append {
   min-height:300px;
}

/*.arrow-top:before {
	content: " ";
	display: block;
	height: 0;
	position: relative;
	pointer-events: none;
	width: 0;
	bottom: 100%;
	border: solid transparent;
	border-bottom-color: #fff;
	left: 50%;
	margin-left: -50px;
	border-width: 50px;
	margin-bottom:-6rem;
}*/
.arrow-top{
	height:70px;
	background:#007bff;
}
.arrow-top p{
	padding-top:15px;
	z-index:1002;
}
.arrow-top:before {
	content: " ";
	height: 0;
	position: absolute;
	pointer-events: none;
	width: 0;
	bottom: 100%;
	border: solid transparent;
	border-bottom-color: #007bff;
	left: 50%;
	margin-left: -15px;
	border-width: 15px;
	margin-bottom:0;
}