.sar_header{padding: 0%}
.logo_wrap{margin:0% 5%;}
.logo_url{padding: 5px 0;}
.sar_menu{background-color:#545050;padding:0;}
.sar_menu ul li a.nav-link{padding:5px 15px !important;color:#fff !important;line-height:30px;font-size:14px !important}

@font-face {
  font-family: UniNeueRegular;
  src: url(UniNeueRegular.otf);
}

body {
    font-family: "UniNeueRegular", sans-serif !important;
  }
  @media (min-width: 320px) and (max-width: 480px) {
   #navbarNavDropdown{justify-content: flex-end;padding-right: 0px !important}
   }
     
  .footer_title{font-size:15px !important;font-weight:600;border-bottom:2px solid #111;text-transform: uppercase;margin:0 0 22px;text-align: left}
  .footer_menu{list-style-type:none;padding:0;text-align: left}
  .footer_menu .footer_menu_item{margin-bottom:9px;}
  .footer_menu .footer_menu_item a{font-size:15px; color:#5a5a5a;}
  .footer_menu .footer_menu_item a:hover{color:#000;text-decoration:none;}
  .footer_contact a{font-size:15px; color:#5a5a5a;}
  .footer_contact a:hover{color:#000;text-decoration:none;}
  .footer_contact_subscribe input{width:100%;margin-bottom:10px;width: 100%;box-sizing: border-box;padding: 10px;display: inline-block;border: 1px solid #ddd;background-color: #f4f4f4;color: #444;font-size: 14px;}
  .footer_contact_subscribe input[type="submit"]{background-color:#444;color:#fff !important}
  .nopadding{padding:0 !important}
  h2.home_title {text-align: center;font-size: 24px;line-height: 1.384615384615385em;color: #dc6724;padding-top: 25px;padding-bottom: 25px;}
  .overview-heading{color:#007ad5;font-size: 30px; line-height: 34px;padding-top: 60px;padding-bottom: 30px;font-weight: 700;}
  .inner-heading{color:#007ad5;font-size: 24px; line-height: 34px;padding-top: 60px;padding-bottom: 30px;font-weight: 600}
  .h3-title {text-align: center;padding-top: 10px;font-size: 21px;font-weight: 600;}
  .paragraph-title{
	overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 3;
           line-clamp: 3;
	padding-left: 10px;
	padding-right: 10px;
	text-align: left;
   -webkit-box-orient: vertical;
}
  .custom-color{padding-top: 30px;padding-bottom: 30px;}
  .height{height: 293px;}
  .height2{height:150px;}
  .login-back-color{background-color: #e8e8e8;padding-top: 30px;padding-bottom: 30px;}
  .overview-custom-color{background-color: #ffefb1;padding-top: 60px;padding-bottom: 30px;}
  .ct_col_content{box-shadow: 0 0 8px 12px rgba(0, 0, 0, 0.03);border-radius:10px; background: #fff;width: auto;padding-bottom: 10px;margin-bottom: 2rem;}
  .nominee-box{text-align: center; padding: 15px;}
   .ct_col_content:hover  {
	 transform: scale(1.05);
    -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1.05);
	box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}
.read-more-button-mobile{
	text-align: right;
}
  .row.conuntry_thought_row {padding-bottom: 40px;}
  .anchor{text-align:center;}
  .custom-buttons{padding-top: 18%}
  .sarfarosh-buttons{padding-left:0px;}
  .form-control{background: #FFF;}
  .form-control::placeholder{color:#000;}
  .custom-list {padding: 0px;border: 1px solid #bbb;border-top: none;padding-bottom: 14px}
  .custom-list-1 {padding: 0px;border: 1px solid #bbb;border-top: none;padding-bottom: 14px; margin-bottom:20px}
  .team-img img.ct_col_image {max-width: 100%;height: 200px;}
  img.ct_col_image {max-width: 100%;height: auto;}
  p.title-silent{text-align: center;}
  p.title-silent a{text-decoration: none;}
  p.custom-story{text-align: center}
  .silent-padding{padding-top: 30px; padding-bottom: 30px}
  a.link {border: 1px solid;padding-top: 5px;padding-bottom: 5px;padding-left: 15px;padding-right: 15px; text-decoration: none}
  p.anchor a {text-decoration: none;}
  .hyper{border:1px solid; padding-top: 5px; padding-bottom: 5px; padding-left: 15px; padding-right: 15px;border-radius: 7px;}
  .hyper:hover{background-color: #007bff; color: #fff}
  .hyper-1{color: #FFF;border:1px solid #007ad5;padding-top: 0px; font-weight: bold; padding-bottom: 0px; padding-left: 15px; padding-right: 15px;border-radius: 7px;background-color:#007ad5;}
  .hyper-1:hover{color: #fff;border:1px solid #fff; -webkit-box-shadow: 0 5px 15px 0 rgba(0,0,0,0.3); box-shadow: 0 5px 15px 0 rgba(0,0,0,0.3);}  

  a.hyper-1{color: #FFF;border:1px solid #007ad5;padding-top: 0px; font-weight: bold; padding-bottom: 0px; padding-left: 15px; padding-right: 15px;border-radius: 7px;background-color:#007ad5;}
 
  .hyper-2{display: inline;color: #FFF; margin-top: -1px; border:1px solid #fff; margin-left: 0rem;padding-top: 1px; font-weight: bold; padding-bottom: 1px; padding-left: 10px; padding-right: 10px;border-radius: 7px; background-color:#007ad5;}
  .hyper-2:hover{color: #fff; background-color: #34a853; -webkit-box-shadow: 0 5px 15px 0 rgba(0,0,0,0.3); box-shadow: 0 5px 15px 0 rgba(0,0,0,0.3);}

  .hyper-3{display: inline;color: #FFF;  margin-left: -1rem;padding-top: 1px; font-weight: bold; padding-bottom: 3px; padding-left: 18px; padding-right: 18px;border-radius: 7px; background-color:#007ad5;}
  .hyper-3:hover{color: #fff; background-color: #cc0010; -webkit-box-shadow: 0 5px 15px 0 rgba(0,0,0,0.3); border:1px solid #fff; box-shadow: 0 5px 15px 0 rgba(0,0,0,0.3);}

  .hyper-4{display: inline;color: #FFF; border:1px solid #fff; margin-left: 1rem;padding-top: 4px; font-weight: bold; padding-bottom: 5px; padding-left: 18px; padding-right: 18px;border-radius: 7px; background-color:#007ad5;}
  .hyper-4:hover{color: #ffefb1; -webkit-box-shadow: 0 5px 15px 0 rgba(0,0,0,0.3); box-shadow: 0 5px 15px 0 rgba(0,0,0,0.3);}

  .center{text-align: center;}
  
	.category{background-image: linear-gradient(#11096e, 40%, #007bd8); text-align: center; font-size: 13px !important; color: #fff; margin: 0px;}
  .vote{width: 30%;}
  .vote-text{
	background: #cc0010;
    position: absolute;
	margin-left: -0.4rem;
    font-size: .8125rem;
    line-height: .8125rem;
    color: #fff;
    padding: .275rem 1rem;
    z-index: 9;
    letter-spacing: .1em;
	font-weight: bold;
	}
	
	.vote-text:after{
		content:'';
		position:absolute;
		width:0;
		height:0;
		border-top:.4375rem solid #c1c1c1;
		border-left:.4375rem solid transparent;
		bottom:-.455rem;
		left:0
		}
	
	
  button.btn.btn-1{background-color: #000;color:#fff;}
  button.btn.btn-1:hover {background: #f05a28; color: #fff}
  .btn-2{background-color: #006738;color:#fff;}
  .btn-1:hover{background-color: #f05a28 !important;border:1px solid #f05a28 !important;color: #fff}
  .initiative-ct_col_content-1{padding: 15px;background-color:#f05a28 }
  .background-home-3{background-color: #006738;padding-top: 30px;padding-bottom: 30px;}
  .custom-fb{border: 1px solid #fff}
  .home_title-1{font-weight: 600; font-size: 24px;line-height: 33px; color: #fff;text-align: center;padding-top: 7px;}
  .img-bottom-space{margin-bottom: 8px}
  img.logo_image {max-width: 100%;height: auto;}
  button.btn.btn-default {background: #f05a28;color: #fff;font-weight: 600;font-size: 17px;border: 0px solid;}
  button.btn.btn-default:hover {background: #000;color: #fff;font-weight: 600;font-size: 17px;border: 0px solid;}
  .user_details{text-align: center;padding-top: 4px}
  .follow_button{text-align: center;padding-bottom: 20px}
  .border-read{border: 1px;
    padding-top: 5px;
    padding-bottom: 5px;
    color: #000;
    padding-left: 15px;
    padding-right: 15px;
	margin-bottom: 1.5rem;
    border-radius: 9px;
    background-color: #ffefb1;}
  a.border-read:hover {text-decoration: none;background-color: #0056b3;color: #fff;}
  .user_card.box_shadow {box-shadow: 0 0 5px;margin-bottom: 20px;}
 
@media (min-width: 320px) and (max-width: 480px) {
  .btn.btn-1 {
    margin-bottom: 10px !important;
    font-size: 10px !important;}
}
@media (min-width: 320px) and (max-width: 480px) {
  .mobile-background {
    background:none !important;
}
.justify-mobile{text-align: justify !important;}

.mobile-custom{margin-right: 2rem;margin-left: 2rem;}



}
.content{position: relative;}
.image {display: block;width: 100%;height: auto;}
.overlay {position: absolute;bottom: -14px;left: 0;right: 0;background-color: #ce2029;overflow: hidden;width: 100%;height: 100%;-webkit-transform: scale(0);-ms-transform: scale(0);transform: scale(0);-webkit-transition: .3s ease;transition: .3s ease; display:none !important;}
.ct_col_content:hover .overlay {-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1); display:none !important;}
.text {text-align:center !important;color: white;font-size: 15px;position: absolute;top: 50%;width: 79%;left: 50%;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);text-align: justify;font-weight: 600;border: 1px solid #fff;padding: 8px;word-spacing: -1px}
@media(min-width: 320px) and (max-width: 480px) {
.text{padding:13px !important;} 
.logo_wrap{background-size:200% !important;}


}
.embed-responsive {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    overflow: hidden;
}
@media only screen and (max-width: 600px) {
.header_wrap{ background:none !important; }
    .logo_wrap {
    margin: 0% 2%;
}
}

span#navbarDropdownMenuLink {
    padding: 5px 15px !important;
    color: #fff !important;
    line-height: 30px;
    border-right: 1px solid #111;
    font-size: 14px !important;
}
img.ct_col_image-1 {
    max-width: 100%;
    height: auto;
}
.custom-header-nav{color: #fff;padding-right: 5px;text-decoration: none;}
.custom-header-nav:hover{color: #fff;padding-right: 5px;text-decoration: none;}
.ct_col_content:hover{background-color: #FFF}
@media (min-width: 320px) and (max-width: 480px){
  .justify-content-between{
	  justify-content: space-between !important;} 
}
p.hero-name {
    font-size: 15px;
}
.well{min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}
p.justify-mobile {
    font-size: 17px;
}
@media (min-width: 320px) and (max-width: 480px){
 .ct_col_image{
     padding-bottom:10px !important;
     margin-bottom:0px !important;
 }
 .img-bottom-space{margin-bottom:0px !important;}
 .custom-mobile-css {padding-bottom:0px !important;}
 .mobile-custom{padding-top:10px !important;}

 a.login img{display: block;}
}
div#navbarNavDropdown {
    text-align: left;
}

.modal.modal-wide .modal-dialog {
  width: 90%;
}
.modal-wide .modal-body {
  overflow-y: auto;
}

/* irrelevant styling */

body p { 
  max-width: 100%; 
  margin: 10px auto; 
}
.video { position: relative; }




input#heroname::placeholder {
    color: #495057;
}
textarea#nominatereason::placeholder{color: #495057;}
textarea#nominateplace::placeholder{color: #495057;}
input#videolink1::placeholder{color: #495057;}
input#videolink2::placeholder{color: #495057;}
input#videolink3::placeholder{color: #495057;}
header.container-fluid.sar_header {
    background: #fff;
    position: fixed;
    z-index: 1111;
}
.container.sar_content {
    padding-top: 50px;
	padding-bottom: 50px;
}

.container-fluid.sar_content {
    padding-top: 50px;
	padding-bottom: 50px;
}
.container-fluid.overview-custom-color {
    padding-top: 50px;
	padding-bottom: 50px;
}
div#tallModal {
    z-index: 9999;
}
.container-fluid.login-back-color {
    padding-top: 258px;
}
@media (min-width: 768px) and (max-width: 1024px){
 .vote-button{padding:5px !important;}
  }

  /*Vote or nominate silent heroes Image size style for desktop*/
  img.nav-item_icon {
    width: 235px;
    height: 130px;
}
@media (min-width: 320px) and (max-width: 480px){
 img.nav-item_icon{width: 100% !important;}
  }
@media (min-width: 768px) and (max-width: 1024px){
 img.nav-item_icon{width: 100% !important;}
  }
  a{text-decoration: none;}
  
  
	.video-slider {
		width: 100%;
		height: 20em;
		background: #444;
		position: relative;
		overflow: hidden;
	}
	.slide {
		position: absolute;
		top: 0;
		left: 100%;
		height: 100%;
		width: 100%;
		text-align: center;
		overflow: hidden;
	}
	.slide:first-child{
		left: 0;
	}
	.video{
		height: 100%;
		width: 100%;
		border:0;
	}
	.slide-arrow{
		position: absolute;
		top: 0;
		left: 0;
		height: 45%;
		width: 15%;
		cursor: pointer;
		opacity: .2;
	}
	.slide-arrow:hover{
		opacity: 1;
	}
	.slide-arrow:after{
		content: "\003c";
		text-align: center;
		display: block;
		height: 10%;
		width: 100%;
		position: absolute;
		bottom: 0;
		left: 0;
		font-size: 3em;
	}
	.slide-arrow.right:after{
		content: "\003e";
	}
	.slide-arrow.right{
		left: auto;
		right: 0;
	}
	
	.container1 {
    width: 60%;
    margin: 20px auto;
    background-color: #fff;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.nominee{
	position: relative;
    width: 100%;
    background-color: #ffefb1;
}

h1 {
    color: #fff;
    text-shadow: 2px 2px #000000;
    margin-bottom: 30px;
    font-size: 60px;
    font-family: "UniNeueRegular", sans-serif;
    font-weight: 700;
}

form {
    display: flex;
    flex-direction: column;
}

fieldset {
    margin-bottom: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 15px;
}

legend {
    font-weight: bold;
	text-align: left;
    color: #333;
}

label {
    display: block !important;
	text-align: left !important;
    margin-bottom: 5px;
    color: #666;
}

input[type="text"],
input[type="file"],
textarea {
    width: calc(100% - 30px);
    padding: 6px;
    font-size: 16px;
    border-radius: 5px;
    border: 1px solid #ccc;
    margin-bottom: 10px;
}

input::placeholder {
  opacity: 1;
  color: #FFF;
}

.card-body{
	color: #FFF;
}

.card-body a{
	color: #FFF;
}


input[type="email"] {

    padding: 6px;
    font-size: 16px;
    border-radius: 5px;
    border: 1px solid #ccc;
    margin-bottom: 10px;
}

input[type="file"] {
    margin-bottom: 20px;
}

input[type="submit"] {
    background-color: #007ad5;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 15px;
	border: 2px solid;
    cursor: pointer;
    font-size: 16px;
}

input[type="submit"]:hover {
    background-color: #007ad5;
	color: #ffefb1;
}

textarea {
    resize: vertical;
    min-height: 100px;
}

a {
  color: #92badd;
  display:inline-block;
  text-decoration: none;
  font-weight: 400;
}

h2 {
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  display:inline-block;
  margin: 0px 8px 10px 8px; 

}

.heading2 {font-size: 30px;}

/* STRUCTURE */

.wrapper {
  display: flex;
  align-items: center;
  flex-direction: column; 
  justify-content: center;
  width: 100%;
  min-height: 100%;
  padding: 20px;
}

#formContent {
  -webkit-border-radius: 10px 10px 10px 10px;
  border-radius: 10px 10px 10px 10px;
  background: #fff;
  padding: 30px !important;
  width: 90%;
  max-width: 450px;
  position: relative;
  padding: 0px;
  background-image: linear-gradient(#11096e, 40%, #007bd8);
  -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
  box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
  text-align: center;
}
#formContent-nominee {
  -webkit-border-radius: 10px 10px 10px 10px;
  border-radius: 10px 10px 10px 10px;
  background: #fff;
  padding: 30px !important;
  width: 90%;
  position: relative;
  padding: 0px;
  -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
  box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
  text-align: center;
}

#formFooter {
  background-color: #f6f6f6;
  border-top: 1px solid #dce8f1;
  padding: 10px;
  margin-bottom: 1rem;
  text-align: center;
  -webkit-border-radius: 0 0 10px 10px;
  border-radius: 0 0 10px 10px;
}

.embed-responsive {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    overflow: hidden;
}

/* TABS */

h2.inactive {
  color: #cccccc;
}

h2.active {
  color: #0d0d0d;
  border-bottom: 2px solid #5fbae9;
}



/* FORM TYPOGRAPHY*/


/* ANIMATIONS */

/* Simple CSS3 Fade-in-down Animation */
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

/* Simple CSS3 Fade-in Animation */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fadeIn {
  opacity:0;
  -webkit-animation:fadeIn ease-in 1;
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:1s;
  -moz-animation-duration:1s;
  animation-duration:1s;
}

.fadeIn.first {
  -webkit-animation-delay: 0.4s;
  -moz-animation-delay: 0.4s;
  animation-delay: 0.4s;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 20px;
}

.fadeIn.second {
  -webkit-animation-delay: 0.6s;
  -moz-animation-delay: 0.6s;
  margin-left: auto;
  margin-right: auto;
  animation-delay: 0.6s;
}

.fadeIn.third {
  -webkit-animation-delay: 0.8s;
  -moz-animation-delay: 0.8s;
  margin-left: auto;
  margin-right: auto;
  animation-delay: 0.8s;
}

.fadeIn.fourth {
  -webkit-animation-delay: 1s;
  -moz-animation-delay: 1s;
  margin-left: auto;
  margin-right: auto;
  animation-delay: 1s;
  background-color: #56baed;
  border: none;
  color: white;
  padding: 15px 80px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  text-transform: uppercase;
  font-size: 13px;
  -webkit-box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
  box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
  -webkit-border-radius: 20px;
  border-radius: 20px;
  margin: 5px 20px 40px 20px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.text-small{font-size: 9px;}

.fadeIn.fourth:hover  {
  background-color: #39ace7;
}
/* Simple CSS3 Fade-in Animation */
.underlineHover:after {
  display: block;
  left: 0;
  bottom: -10px;
  width: 0;
  height: 2px;
  background-color: #56baed;
  content: "";
  transition: width 0.2s;
}

.underlineHover:hover {
  color: #0d0d0d;
}

.underlineHover:hover:after{
  width: 100%;
}



/* OTHERS */

*:focus {
    outline: none;
} 

	.slide-arrow{
		position: absolute;
		top: 0;
		left: 0;
		height: 45%;
		width: 15%;
		cursor: pointer;
		opacity: .2;
	}
	.slide-arrow:hover{
		opacity: 1;
	}
	.slide-arrow:after{
		content: "\003c";
		text-align: center;
		display: block;
		height: 10%;
		width: 100%;
		position: absolute;
		bottom: 0;
		left: 0;
		font-size: 3em;
	}
	.slide-arrow.right:after{
		content: "\003e";
	}
	.slide-arrow.right{
		left: auto;
		right: 0;
	}
	
	
	.icon-container {
            display: none;
            overflow: hidden;
            width: 200px; /* Adjust the width as needed */
        }

        .icon-container a {
            flex-shrink: 0;
            transition: transform 0.5s ease-in-out;
            margin-right: 10px; /* Adjust the margin as needed */
        }

        .icon-container:hover a {
            transform: translateX(-70%);
        }
		
		@media only screen and (max-width: 767px) {
    /* Center align the "Vote" and "Read More" buttons */
    .vote-button-mobile,
    .read-more-button-mobile {
    margin-right: 1rem;
    margin-bottom: 0.5rem;
	width: 40%;
    }

    /* Adjust margin or padding if necessary */
    .vote-button-mobile button,
    .read-more-button-mobile a {
    display: grid;
    margin-right: 0rem;
    margin-bottom: 0.5rem;
    }
	.team .team-item:hover .team-text {
    height: 210px !important;
}
.voted{margin-right: 0.2rem;}
}

	a.login {
    display: block;
    position: fixed;
    right: -70px !important;
    bottom: 20%;
    z-index: 100000000;
    /* animation: bounce 4s infinite; */
}

a.nominate {
    display: block;
    position: fixed;
    right: -35px!important;
    top: 20%;
    z-index: 100000000;
    /* animation: bounce 4s infinite; */
}
.swal2-checkbox{display: none !important}