@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;700&display=swap');
/*************************
*******Typography******
**************************/

body {
  background: #f1f1f1;
  font-family: 'Ubuntu', sans-serif;
  color:#000;
  font-size: 15px;
  font-weight:400;
  line-height: 22px;
  
}



h1 {
  font-family: 'Ubuntu', sans-serif;
  font-size: 34px;
  color:#0156ad;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.5em;
  padding-bottom: 5px;
  margin-bottom:25px;
  position: relative;
  text-align:center;
}
h1:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 3px;
  width: 55px;
  background-color: #e43e42;
  left: 0;
  right: 0;
  margin: 0 auto;
}

h2{
  font-family: 'Ubuntu', sans-serif;
  font-size: 26px;
  color:#0156ad;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.2em;
  padding-bottom: 5px;
  position: relative;
  text-align:left;
}

h3{
  font-size: 22px;
  color: #000;
  font-weight:700;
  margin-bottom:10px;
}

h4{
  font-size:18px;
  color: #333;
  font-weight:500;
  line-height: 24px;
  margin-bottom:8px;
}

h5{
  font-size:15px;
  color: #9b1943;
  font-weight:700;
  line-height: 24px;
  margin-bottom:8px;
}
h6{
  font-size:14px;
  color: #333;
  font-weight:600;
  line-height: 24px;
  margin:8px 0;
}




ul {
	margin: 0; 
	padding: 0; 
	list-style-type: none;
	 
}

li {
	margin: 0; 
	padding: 0; 
	list-style-type: none; 
}

a{
	color:#e43e42;
  -webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;
  text-decoration: none;
}
a:hover{
  color:#0156ad;
  text-decoration: none;
}
.menu-area{
	background:#e43e42;
	padding:0;
}

.banner{margin-top:80px;position: relative;}

.banner .carousel-item::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%; 
background-image: linear-gradient(#0000, #02020252);
 
}
.carousel-item{text-align:center;margin:0 auto;left:0;right:0;float:none;}
.topbar{background:#ddd;padding:3px 0;}
.topbar ul li{float:left;margin:3px 20px 0 0;color:#474747;font-weight:500; font-size: 14px;}
/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */

/* Since positioning the image, we need to help out the caption */
.carousel-captiondd {
  bottom: 3rem;
  z-index: 10;
}

.custom-logo-link {
    display: block;
    background: #fff;
    padding: 3px 0;
    position: relative;
    z-index: 2;
}
.custom-logo-link img{
    height: 50px;
}
.custom-logo-link::before {
    content: "";
    position: absolute;
    right: 99%;
    height: 100%;
    top: 0;
    width: 500px;
    background: #fff;
}
.custom-logo-link::after {
    content: '';
    position: absolute;
    width: 265px;
    border-top: 56px solid #fff;
    border-right: 50px solid transparent;
    top: 0;
    left: -2px;
    z-index: -1;
}
.logo img{padding-top:6px;}
.logo img:hover, .logo img:focus{outline:0;}

.title{
background:#dfa157;
  color: #fff;
  font-size: 22px;
  font-weight: 600;
  margin:0 0 4px 0;
  padding:8px;
  
}
button:focus{outline:0;}
.colmar{margin-bottom:35px;}

p {
  padding: 0px;
  font-size: 15px;
      line-height: 24px;
}

/*----======== footer ======---*/

footer{
	background:#065d7d;
	background-position: right;
	padding:40px 0 3px 0;
	z-index:33;
}

footer .colmar{ margin-bottom: 0;}

footer h2{
	font-size:18px;
	font-weight:500;
	color:#fff;
	margin: 0 0 25px 0;
}
footer h2:before {
    content: '';
    position: absolute;
    float: left;
    width:30px;
    height:3px;
    background: #e43e42;
    margin: 25px 0 0 0;
}

footer p{
	font-size:13px;
	font-weight:400;
	color:#fff;
}

footer ul li {margin:0 0 3px 0;font-size:13px;color:#fff;}
footer ul li:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f105";
    color: #7bb7e5;
    font-size: 13px;
    padding: 4px;
    border-radius: 50%;
}

footer .foot_address  ul li:before {
    content: ""
}
footer ul li a{
	font-size:13px;
	font-weight:400;
	color:#fff;
	-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
footer ul li a i{color:#e43e42;}
footer ul li a:hover, footer ul li a:focus{	color:#e43e42!important; margin-left:10px;}
.get_in_touch i{background:#474747; width:22px;height:22px;text-align:center;line-height:22px;font-size:12px;color:#fff;margin-right:5px;border-radius:4px;}
.get_in_touch i:hover{color:#fff;background:#e43e42;}

footer .get_in_touch i{background:#98c8ed; width:28px;height:28px;text-align:center;line-height:28px;font-size:14px;color:#000;margin-right:5px;border-radius:4px;}
footer .get_in_touch i:hover{color:#fff;background:#e43e42;}
.copyright{
	background:#04455d;
	padding: 8px 0;
}
.copyright p{font-size:13px;color:#2587ab!important;text-align:center;margin-bottom:0;}
.foot_address i{font-size:11px;color:#7bb7e5;margin-right:4px;}
.get_in_touch{margin-top:1px;}

.nopad{padding:0;}

.address_sec {
    margin-bottom: 10px;
    color: #222;
    font-weight: 400;
	font-size: 14px;
}

.section{margin:40px 0;}
.btn_red i{font-size:18px;}
.btn:focus {outline: 0;box-shadow:none;}

.btn1 {
	 background:#e43e42;
    padding:16px;
    text-transform: uppercase;
   color: #fff!important;
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    -moz-user-select: none;
    line-height: 0;
    margin-bottom: 0;
    margin: 10px;
    cursor: pointer;
    transition: color .4s linear;
    position: relative;
    z-index: 1;
    border: 1px solid #fff;
    overflow: hidden;
    margin: 0;
	border-radius:25px;
}

.btn1::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #0156ad;
    color: #fff!important;
    z-index: 1;
    transition: transform .5s;
    transition-timing-function: ease;
    transform-origin: 0 0;
    transition-timing-function: cubic-bezier(.5,1.6,.4,.7);
    transform: scaleX(0);
    border-radius: 0;
}

.btn1:hover::before {
    transform: scaleX(1);
    color: #fff!important;
    z-index: -1;
}

input.btn1 {
    background: #5c0000;
    padding: 20px 20px;
    text-transform: uppercase;
   color: #fff!important;
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    -moz-user-select: none;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 0;
    margin-bottom: 0;
    margin: 10px;
    cursor: pointer;
    transition: color .4s linear;
    position: relative;
    z-index: 1;
    border: 0;
    overflow: hidden;
    margin: 0;
	border-radius:10px 0!important;
	height: 45px;
}

input.btn1:hover {
    background: #dfa157!important;
}


.btn2 {
    background-image: linear-gradient(to right, #678602 , #aad716);
    padding: 12px 16px;
    text-transform: uppercase;
    color: #fff!important;
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    -moz-user-select: none;
    line-height: 0;
    margin-bottom: 0;
    margin: 10px;
    cursor: pointer;
    transition: color .4s linear;
    position: relative;
    z-index: 1;
    border: 1px solid #fff;
    overflow: hidden;
    margin: 0;
	border-radius:25px;
}

.btn2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #9b1943;
    color: #fff!important;
    z-index: 1;
    transition: transform .5s;
    transition-timing-function: ease;
    transform-origin: 0 0;
    transition-timing-function: cubic-bezier(.5,1.6,.4,.7);
    transform: scaleX(0);
    border-radius: 0;
}

.btn2:hover::before {
    transform: scaleX(1);
    color: #fff!important;
    z-index: -1;
}
.faicon .btn {padding: 0;}
.top {
    background: #fff;
	padding: 0 0 6px 0;
border-top:3px solid #ff0000;
}

	
.faicon .dropdown-toggle::after {display:none;}
#fadecarousel{margin-bottom:25px;}

.carousel-caption h1{
  font-family: 'Ubuntu', sans-serif;
  font-size:26px;
  color:#fff;
  margin-bottom:0;
  font-weight:500;
  text-transform: capitalize;  z-index:1;
}
.carousel-caption h1:before{
    width:0px;
}

.carousel-caption p{color: #fff; font-size:18px;font-weight:400;margin-bottom:25px}
.carousel-caption{
	padding:20px;
	bottom:0;
	left:8%;
	right:8%;
	color:#fff;
	text-align:center;
}

.carousel-caption.text-left h1{color:#333;text-align:left;}

.padd_left_right{padding:0 5px;}


.carousel-indicators [data-bs-target] {background-color: #fff;}
.carousel-indicators li {background-color: #e43e42;    width: 30px;    height: 10px;}

.blockquote-footer{color:#5c0000;font-weight:600;}
.bannerarro {
    background: #e43e42;
    width: 50px;
    height: 50px;
    color: #fff;
    line-height: 50px;
}
.carousel-control-prev, .carousel-control-next {
    z-index: 99;
    opacity:1;
}
.img_border{border:1px solid #dfa157;padding:4px;border-radius:16px 0;}
.menu i{color:#e43e42;}
.orange{color:#e43e42;}
p.txt1{font-size:18px;}
.lightbg{background:#f9edd8;padding:30px 0;}
/* Shine effect */

figure {
	margin: 0;
	padding: 0;
	overflow: hidden;
}
figure:hover+span {
	bottom: -36px;
	opacity: 1;
}

.shine figure {
	position: relative;
}
.shine figure::before {
	position: absolute;
	top: 0;
	left: -75%;
	z-index: 2;
	display: block;
	content: '';
	width: 50%;
	height: 100%;
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.1) 100%);
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.1) 100%);
	-webkit-transform: skewX(-25deg);
	transform: skewX(-25deg);
}
.shine figure:hover::before {
	-webkit-animation: shine .75s;
	animation: shine .75s;
}
@-webkit-keyframes shine {
	100% {
		left: 125%;
	}
}
@keyframes shine {
	100% {
		left: 125%;
	}
}
/* Shine effect end*/


/* images hover start*/

.shine:hover .img_hover img, .item:hover .img_hover img{
   -webkit-transform: scale(1.1);
   transform: scale(1.1);
}

.img_hover{
    overflow: hidden;
    display: block;
    cursor: pointer;
}

.img_hover img{
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .3s ease-in-out;
    transition: .5s ease-in-out;
    width: 100%;
}
.whitebox {
    background: #fff;
    padding: 20px;
	box-shadow:0 0 12px #aaa;
	border-radius:8px;
	
}
.bluebox {
    background: #bfe9ff;
    padding: 20px;
	box-shadow:0 0 12px #aaa;
	border-radius:8px;
	
}

.pagebgimage h1{color:#fff;z-index:1;position: inherit;}
.pagebgimage_content{
	padding:50px 0;
}

.modal-body {padding: 2rem;}
.card-body {padding:5px 0;}
.card-body p{line-height:20px;font-size:14px;}
.card-body-content {padding:0 15px 10px 15px;height:130px;}
.card{border:0;}
h5.card-title{
    background: #7d7d7d;
	padding:8px 12px;
	color: #fff;
	font-size:16px;
	font-weight:600;
	text-align:center;
margin-bottom:2px;	
}

.terms p{margin-bottom:30px;}

.bluebg {
    background: #d3f3fb;
    padding: 30px 0;
}

.pulseit{
	-webkit-animation: pulse linear .5s infinite;
	animation: pulse linear .5s infinite;
}
@-webkit-keyframes pulse {
	0% { width:200px; } 
	50% { width:340px; } 
	100% { width:200px; }
}
@keyframes pulse {
	0% { width:200px; } 
	50% { width:340px; } 
	100% { width:200px; }
}

.card-footer{font-size:16px;font-weight:600;}


.gbg{
	background:#e3e3e3;
	padding:30px 0;
	MARGIN:0 0 30px 0;
}
.yellowbg{
	background:#f7f6d6;
	padding:30px 0;
}
.graybg{
	background: #f7f4fb;
    border-bottom: 2px solid #dfa157;
	padding:15px;
	box-shadow:0 0 12px #666;

}
.graybg h3{background: #5c0000;color:#fff;padding:6px;}
.whatsapp{
	background: #5c0000;
	color:#fff;
	font-size:20px;
	border-radius:50%;
	width:35px;
	height:35px;
	line-height:35px;
	text-align:center;
	position:fixed;
	bottom:50px;
	right:20px;
}
.whatsapp:hover{
	background: #dfa157;
}
.whatsapp a{color:#fff;}
.whatsapp:hover a{color:#000;}
.banner_inner h3 {
    position: absolute;
    top: 130px;
    left: 0;
    right: 0;
    color: #5c0000;
    display: table;
    margin: 0 auto;
    font-size: 25px;
    font-weight: 600;
}

.menu{padding:20px 0;}
.logo-main img{
	background: #5c0000;
    padding: 5px 10px;
    position: absolute;
    top: 0;
	border-radius: 0 0 8px 8px;
}
.card .bg-primary{background:#5c0000!important;}
.border-primary {border-color:transparent!important;}
.card h3 {color: #000!important;font-size:18PX;margin:10px 0;}
.journey .card h3 {color: #000!important;font-size:20PX;margin:10px 0;}
.form-group {
    margin-bottom: 15px;
}
.bg-primary {
    background:#dfa157!important;
}
.tickul li{
	background:url(../images/tick.png) 0 4px no-repeat;
	padding-left:20px;
	margin:0 0 8px 0;
    font-size: 15px;	
    font-weight: 400;	
}
.img_shadow{box-shadow:0 0 10px #aaa;}
img.img_shadow2{box-shadow:0 20px 10px -15px #aaa;}
.txt_md {font-size:18px;font-weight:600;color:#5c0000;margin-bottom:10px;}
.item{width:92%;margin:0 auto;}
.menu-btn a {
    color: #000!important;
    font-size: 14px!important;
    font-weight: 500!important;
    text-transform: capitalize;
    display: inline-block;
    padding: 7px 10px!important;
    background-color: #fff;
    -webkit-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
    border-radius: 25px;
}
.menu-btn a:hover {
    background-color: #000;
    color: #fff!important;
}

.banner label { color: #fff;}
.banner .form-control, .banner .form-select {
    font-size: 14px;
    color: #fff!important;
    background-color: transparent;
	border-color:#777!important;
}

.banner .form-control:focus {
    color: #fff!important;
    background-color: transparent;
	border-color:#fff!important;
	box-shadow:none!important;
}
.banner [type=submit] {
   background-color: #678602!important;
   color: #fff!important;
   width:100%!important;
   border-radius:7px!important;
   text-transform: uppercase;
    font-weight: 600;
	border:0;
}
.banner [type=submit]:hover {
   background-color: #9b1943!important;
}
.banner ::-webkit-input-placeholder { /* Edge */
   color: #fff!important;
}

.banner :-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #fff!important;
}

.banner ::placeholder {
   color: #fff!important;
}




.heading{
	color: #000;
	font-size:20px;
	font-weight:600;
	margin-bottom:15px;
}
.heading:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f058";
    color: #9b1943;
    font-size: 18px;
    font-weight: 700;
    padding: 4px;
    border-radius: 50%;
}

.sub_heading{
	color: #9b1943;
	font-size:17px;
	font-weight:700;
}
.heading2{
	color: #111;
	font-size:17px;
	font-weight:500;
	text-align:center;
	margin-bottom:6px;
}

.whitebox h5{
	font-family: 'Playfair Display', serif!important;
	color: #000!important;
    font-weight: 600;
    font-size: 40px;
}

.whitebox img{margin-bottom:20px;}

.owl-blog .card-body{text-align:left;padding:10px;border:1px solid #dfdfdf;}
.owl-blog a{font-weight:600;}

.owl-prev, .owl-next{
	color: #333;
    font-size: 24px;
    font-weight: 600;
	display: inline-block;
    margin: 12px 4px;
}
.owl-nav{text-align: center;}




.form-control, .form-select {
    font-size: 14px;
    color: #000!important;
    background-color: transparent;
	border-color:#777!important;
}

.form-control:focus {
    color: #000!important;
    background-color: transparent;
	border-color:#000!important;
	box-shadow:none!important;
}
[type=submit] {
   background-color: #9b1943!important;
   color: #fff!important;
   width:100%!important;
   border-radius:7px!important;
   text-transform: uppercase;
    font-weight: 600;
	border:0;
	display:inline-block;
}
[type=submit]:hover {
   background-color: #9b1943!important; 
}
::-webkit-input-placeholder { /* Edge */
   color: #000!important;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #000!important;
}

::placeholder {
   color: #000!important;
}

.white_box{background:#fff;padding:20px;box-shadow:0 0 12px #aaa;border-radius:10px;border-top:3px solid #9b1943;}

.mid{margin-top:0;}

.awards_title{
	width:78%;
	margin:0 auto;
	background:#fff;
	padding:8px;
	border:1px solid #0156ad;
	font-size:18px;
	font-weight:500;
	color:#000;
	text-align:center;
	position:relative;
	margin-top:-20px;
	box-shadow: 0px 15px 10px -15px #111;   
}
h5.modal-title{font-size:25px;color:#0156ad;}
.inner_banner{margin-top:85px;}
.inner_banner img{object-fit: cover;height: 300px;width:100%;}
.inner_banner .carousel-item::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%; 
  background-color: rgba(0,0,0,0.5);
}
.inner_banner .carousel-caption {
    padding: 20px;
    top: 30%;
    left: 8%;
    right: 8%;
    color: #fff;
    text-align: center;
	z-index:2;
}

/********************************/
/*  SECTION WORK EXPERIENCE
********************************/

#work-experience .sectiontitle .headerLine {
  width: 280px;
}

#work-experience .headerline {
  width: 280px;
}

.cbp_tmtimeline {
  margin:0;
  padding: 0;
  list-style: none;
  position: relative;
}

.cbp_tmtimeline:before {
  content: '';
  position: absolute;
  top: 3%;
  bottom: 0;
  width: 10px;
  background: #e43e42;
  left: 11%;
  height: 100%;
}

.cbp_tmtimeline li:last-child:before {
  content: initial;
}

.cbp_tmtimeline > li .cbp_tmtime {
  display: block;
  width: 25%;
  padding-right: 100px;
  position: absolute;
}

.cbp_tmtimeline > li .cbp_tmtime span {
  display: block;
  text-align: right;
}

.cbp_tmtimeline > li .cbp_tmtime span:first-child {
  font-size: 0.9em;
  color: #bdd0db;
}

.cbp_tmtimeline > li .cbp_tmtime span:last-child {
  font-size: 2.9em;
  color: #3594cb;
}

.cbp_tmtimeline > li:nth-child(odd) .cbp_tmtime span:last-child {
  color: #6cbfee;
}

.cbp_tmtimeline > li .cbp_tmlabel {
  margin: 0 0 15px 20%;
  background: #68bf8f;
  color: #FFF;
  padding: 30px;
  font-size: 1.2em;
  font-weight: 300;
  line-height: 1.4;
  font-family: 'Open Sans';
  position: relative;
  border-radius: 5px;
  min-height: 150px;
}

.cbp_tmtimeline > li:nth-child(odd) .cbp_tmlabel {
  background: #4097cb;
}

.cbp_tmtimeline > li .cbp_tmlabel h3 {
  margin-top: 0px;
  color: white;
  font-size: 20px;
  margin-bottom: 5px;
  padding: 0 0 10px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.4);
  font-family: 'Open Sans', sans-serif;
  font-weight: bold;
}

.cbp_tmtimeline > li .cbp_tmlabel h4 {
  opacity: 0.7;
  color: rgba(255, 255, 255, 1);
  letter-spacing: 0px;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 18px;
  line-height: 1.2em;
  font-weight: 600;
  padding: 0;
  padding-bottom: 10px;
  margin: 0;
  text-align: left;
}

.cbp_tmtimeline > li .cbp_tmlabel h4 i {
  margin-right: 5px;
  vertical-align: middle;
}

.cbp_tmtimeline > li .cbp_tmlabel:after {
  right: 100%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-right-color:#68bf8f;
  border-width: 10px;
  top: 70px;
}

.cbp_tmtimeline > li:nth-child(odd) .cbp_tmlabel:after {
  border-right-color: #4097cb;
}

.cbp_tmtimeline > li .cbp_tmicon {
  width: 120px;
  height: 120px;
  top: 3%;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  font-size: 1.4em;
  line-height: 40px;
  -webkit-font-smoothing: antialiased;
  position: absolute;
  color: #fff;
  background: #e43e42;
  border-radius: 50%;
  text-align: center;
  left: 8%;
  margin: 0 0 0 -25px;
}

.cbp_tmtimeline li {
  margin-bottom: 70px;
  position: relative;
}

.sectionClassProject {
  position: relative;
  display: block;
  /* background: #f7f7f7; */
  
  margin: 0 auto;
  padding: 80px 1.875em 3.125em;
}

.projectParagraph {
  font-size: 18px;
  margin: 0.5em 0 0;
  font-family: 'Source Sans Pro', serif;
}

.projectParagraphLink {
  font-size: 15px !important;
  font-weight: 500 !important;
  margin-top: 50px !important;
  margin-bottom: 0px;
  text-align: right;
}

.projectParagraphLink a {
  color: white;
  text-decoration: underline;
}

.cbp_tmicon img {
  width: 100%;
}

.faPra {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 50px;
  vertical-align: middle;
  color: white;
  line-height: 120px;
}

.label {
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 3px;
  color: #FFFFFF;
  display: inline;
  font-size: 12px;
  font-weight: bold;
  margin-right: 10px;
  padding: 5px 15px;
}

.date {
  color: #BFC3C7;
  display: block;
  font-size: 14px;
  font-weight: 600;
  position: absolute;
  top: 30px;
  right: 20px;
}

.date i {
  margin-right: 8px;
  vertical-align: top;
  font-size: 18px;
  line-height: 20px;
}

@media (max-width: 1024px) {
  .cbp_tmtimeline:before {
    display: none;
  }
  .cbp_tmtimeline > li .cbp_tmtime {
    width: 100%;
    position: relative;
    padding: 0 0 20px 0;
  }
  .cbp_tmtimeline > li .cbp_tmtime span {
    text-align: left;
  }
  .cbp_tmtimeline > li .cbp_tmlabel {
    margin: 30px 0 70px 0;
    padding: 50px 30px 30px 30px;
    font-weight: 400;
    font-size: 95%;
    float: left;
  }
  .cbp_tmtimeline > li .cbp_tmlabel:after {
    right: auto;
    border-right-color: transparent;
    border-bottom-color: #68bf8f;
    top: -20px;
  }
  .cbp_tmtimeline > li:nth-child(odd) .cbp_tmlabel:after {
    border-right-color: transparent;
    border-bottom-color:#4097cb;
    left: 65px;
  }
  .cbp_tmtimeline > li:nth-child(even) .cbp_tmlabel:after {
    right: 65px;
  }
  .cbp_tmtimeline > li:nth-child(odd) .cbp_tmicon {
    position: relative;
    float: left;
    left: auto;
    margin: 0px 5px 0 0px;
  }
  .cbp_tmtimeline > li:nth-child(even) .cbp_tmicon {
    position: relative;
    float: right;
    left: auto;
    margin: 0px 5px 0 0px;
  }
  .cbp_tmtimeline > li .cbp_tmtime span:last-child {
    font-size: 1.5em;
  }
}

@media (max-width: 32em) {
  .cbp-ntaccordion {
    font-size: 70%;
  }
}
.about-me-img {
  width: 120px;
  height: 120px;
  left: 10px;
  /* bottom: 30px; */
  position: relative;
  border-radius: 100px;
}


.about-me-img img {
}


.authorWindow{
  width: 600px;
  background: #75439a;
  padding: 22px 20px 22px 20px;
  border-radius: 5px;
  overflow: hidden;
}

.authorWindowWrapper{
  display: none;
  left: 110px;
  top: 0;
  padding-left: 25px;
  position: absolute;
}
/********************************/
/*  SECTION WORK EXPERIENCE
********************************/


.icon_big{
	background:#fff;
	border:2px solid #666;
	width:70px;
	height:70px;
	line-height:70px;
	font-size:30px;
	color:#e43e42;
	text-align:center;
	border-radius:50%;
	margin:0 auto 15px auto;
}
.contact_details .whitebox p{font-size:18px; text-align:center;}
.contact_details .whitebox {height:200px;}

hr:not([size]) {
    height: 1px;margin:45px 0;
}


/********************************/
/* CONTACT US
********************************/

.contact-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 0 auto;
  padding: 20px;
  position: relative;
  max-width: 840px;
}

/* Left contact page */

.send-button {
  margin-top: 15px;
  height: 34px;
  width: 400px;
  overflow: hidden;
  transition: all .2s ease-in-out;
}

.alt-send-button {
  width: 400px;
  height: 34px;
  transition: all .2s ease-in-out;
}

.send-text {
  display: block;
  margin-top: 10px;
  letter-spacing: 2px;
}

.alt-send-button:hover {
  transform: translate3d(0px, -29px, 0px);
}

.contact-text a {
  color: #bbb;
  text-decoration: none;
  transition-duration: 0.2s;
}

.contact-text a:hover {
  color: #fff;
  text-decoration: none;
}


/* Social Media Icons */
.social-media-list {
  position: relative;
  font-size: 22px;
  text-align: center;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}

.social-media-list ul li a {
  color: #fff;
}

.social-media-list ul li {
  position: relative; 
  display: inline-block;
  height: 60px;
  width: 60px;
  margin: 10px 3px;
  line-height: 60px;
  border-radius: 50%;
  color: #fff!important;
  background-color:#0156ad;
  cursor: pointer; 
  transition: all .2s ease-in-out;
}

.social-media-list ul li:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 60px;
  height: 60px;
  line-height: 60px;
  border-radius: 50%;
  opacity: 0;
  box-shadow: 0 0 0 1px #e43e42;
  transition: all .2s ease-in-out;
}

.social-media-list ul li:hover {
  background-color: #e43e42; 
}

.social-media-list ul li:hover:after {
  opacity: 1;  
  transform: scale(1.12);
  transition-timing-function: cubic-bezier(0.37,0.74,0.15,1.65);
}

.social-media-list ul li:hover a {
  color: #fff!important;
}


.contact hr {
  border-color: rgba(255,255,255,.6);margin:25px 0 15px 0;
}

.contact .cont_ul ul li i{font-size:14px; color:#e43e42;margin-right:6px;}
.contact .cont_ul ul li, .contact .cont_ul ul li a{
	font-size:16px;
	color:#000;
	margin-bottom:12px;
}
.border_right{border-right:2px solid #ddd;}
.contact .form-horizontal, .contact .frm_right{width:100%; margin:0 auto;height:200px;}
.frm_right{background-image: linear-gradient(#d1f7f7, #fff);padding:15px;}
/********************************/
/* CONTACT US
********************************/
.services .card{
	background-image: linear-gradient(#d5eeff, #fff, #fff);
	border:1px solid #0156ad;
	padding:20px;
	border-radius:8px;
	box-shadow:0 15px 10px -15px #444;
	text-align:center;
	-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease;
}
.services .card:hover{
	background-image: linear-gradient(#ffd2d3, #fff, #fff);
	border:1px solid #e43e42;
}
.services .card .img_circle{
	background:#e43e42;
	width:100px;
	height:100px;
	line-height:75px;
	border-radius:50%;
	font-size:60px;
	color:#fff;
	text-align:center;
	margin:0 auto 25px auto;
	border:2px solid #0156ad;	
}
.services .card .img_circle img{
	width:70px;
	height:70px;	
}
.services .card:hover .img_circle{
	background:#0156ad;
	color:#e43e42;
	border:2px solid #e43e42;
}
.services .card:hover .services_title{
	background:#e43e42;
	color:#fff;
}
.services_title{
	background:#0156ad;
	padding:6px;
	font-size:15px;
	color:#fff;
	border-radius:5px;	
}
.services .card ul li{text-align:left;}
.services .card p{color:#0156ad;margin:0;}
.fixed-top{box-shadow:0 15px 10px -15px #444;}

.services_title2{
	width:85%;
	background:#e43e42;
	padding:14px 6px;
	font-size:16px;
	color:#fff;
	border-radius:5px;
    margin-top:-12px;	
    margin-left:auto;	
    margin-right:auto;	
}
.card:hover .services_title2{
	background:#065d7d;
}

.other_services .whitebox h3{font-size:18px; height:45px;margin-bottom:5px;}
.white_section_bg{background:#fff;padding:25px 0;}

.owl-our-clients .item{width:85%;margin:0 auto;}
.owl-our-clients .item img{border:1px solid #999; border-radius:10px;}

/*dots*/

 .owl-dots,  .owl-nav {
    text-align: center;
    -webkit-tap-highlight-color: transparent;
	margin-top:15px;
}
 .owl-dots .owl-dot {
    display: inline-block;
    zoom: 1;
}

.owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-dot {
    background: 0 0;
    color: inherit;
    border: none;
    padding: 0!important;
    font: inherit;
}
.owl-carousel .owl-dot, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev {
    cursor: pointer;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

 .owl-dots .owl-dot.active span, .owl-dots .owl-dot:hover span {
    background: #e43e42;
}

 .owl-dots .owl-dot span {
    width: 20px;
    height: 20px;
    margin: 5px 7px;
    background: #bbb;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    border-radius: 30px;
}
/*dots end*/
.awardsbg{padding:30px 0;}

.award_section{
  border-radius:8px;
  padding:15px;
  box-shadow: 0px 15px 10px -15px #5292c8; 
  border:1px dashed #5292c8; 
}

.blue_section{background-image: linear-gradient(to bottom right, #b2dcf5, #fff, #fff); }
.pink_section{background-image: linear-gradient(to bottom right, #e7baff, #fff, #fff); }
.yellow_section{background-image: linear-gradient(to bottom right, #fae9a6, #fff, #fff); }
.green_section{background-image: linear-gradient(to bottom right, #c0dfa2, #fff, #fff); }
.award_section h3{font-size:16px;font-weight:500;color:#111;text-align:center;MARGIN:0!IMPORTANT;}
.award_section.card{border:0;}
.award_section p{ font-size: 12px;text-transform: capitalize;}
ol.static-org-chart, ol.static-org-chart ol, ol.static-org-chart li, ol.static-org-chart li > div {
    position: relative;
}
ol.static-org-chart, ol.static-org-chart ol {
    list-style: none;
    margin: 0;
    padding: 0;
}
ol.static-org-chart {
    text-align: center;
}
ol.static-org-chart ol { padding-top: 1em;}
ol.static-org-chart ol#second { padding-top: 5em;}

ol.static-org-chart ol:before, ol.static-org-chart ol:after, ol.static-org-chart li:before, ol.static-org-chart li:after, ol.static-org-chart > li > div:before, ol.static-org-chart > li > div:after {
    background-color: #0156ad;
    content: '';
    position: absolute;
}
ol.static-org-chart ol > li {
    padding: 1em 0 0 1em;
}
ol.static-org-chart > li ol:before {
    height: 1em;
    left: 50%;
    top: 0;
    width: 3px;
}
ol.static-org-chart > li ol:after {
    height: 3px;
    left: 3px;
    top: 1em;
    width: 50%;
}
ol.static-org-chart > li ol > li:not(:last-of-type):before {
    height: 3px;
    left: 0;
    top: 2em;
    width: 1em;
}
ol.static-org-chart > li ol > li:not(:last-of-type):after {
    height: 105%;
    left: 0;
    top: 0;
    width: 3px;
}
ol.static-org-chart > li ol > li:last-of-type:before {
    height: 3px;
    left: 0;
    top: 2em;
    width: 1em;
}
ol.static-org-chart > li ol > li:last-of-type:after {
    height: 2em;
    left: 0;
    top: 0;
    width: 3px;
}
/*** PRIMARY ***/
ol.static-org-chart > li > div {
    margin-left: 1em;
}
ol.static-org-chart > li > div:before {
    bottom: 2em;
    height: 3px;
    left: -1em;
    width: 1em;
}
ol.static-org-chart > li > div:first-of-type:after {
    bottom: 0;
    height: 2em;
    left: -1em;
    width: 3px;
}
ol.static-org-chart > li > div + div {
    margin-top: 1em;
}
ol.static-org-chart > li > div + div:after {
    height: calc(100% + 1em);
    right: -1em;
    top: -1em;
    width: 3px;
}
/*** SECONDARY ***/
ol.static-org-chart > li > ol:before {
    left: 0;
    right: inherit;
}
ol.static-org-chart > li > ol:after {
    left: 0;
    width: 100%;
}
ol.static-org-chart > li #first:after {
    width: 0%;
}
ol.static-org-chart #second:after {
    width: 0%;
}
ol.static-org-chart #second:before {
    height: 6em!important;
    left: 0!important;
    top: -5em !important;
}
ol.static-org-chart #first > li > div {
    height: 80px;
    width: 250px;
    
    
}
ol.static-org-chart #first > li > div > div {
    position: relative;
   
}

ol.static-org-chart #first .circle2 img {
    width: 100px;
    height: 100px;
    line-height: 100px;
}
ol.static-org-chart #first .circle1 {
    border: 4px solid #e43e42;
    width: 130px;
    line-height: 120px;
    height: 130px;
}
/*** MEDIA QUERIES ***/
@media only screen and ( min-width: 75em ) {
    ol.static-org-chart #second:before {
        height: 9em!important;
        left: 50%!important;
        top: -4em !important;
        width: 3px!important;
   }
   
ol.static-org-chart #second .circle2 img {
    width: 70px;
    height: 70px;
    line-height:70px;
	border: 2px solid #e43e42;
}
ol.static-org-chart #second .circle1 {
    border: 3px solid #e43e42;
    width: 90px;
    line-height: 82px;
    height: 90px;
}


ol.static-org-chart #second .sname {
    top: 10%;
    left: 65%;
    width: 100%;
    font-size: 11px;
	padding:5px 1px;
	border-radius:15px;
}
ol.static-org-chart #second  .sposition {
    border: 1px solid #e43e42;
    padding: 6px 2px;
    border-radius: 15px;
    top: 50%;
    left: 65%;
    font-size: 11px;
    line-height: 15px;
}


    ol.static-org-chart {
        margin-left: -1em;
        margin-right: -1em;
   }
   /* PRIMARY */
    ol.static-org-chart > li > div {
        display: inline-block;
        float: none;
        margin: 0 1em 1em 1em;
        vertical-align: bottom;
   }
    ol.static-org-chart > li > div:first-of-type:nth-last-of-type(2), ol.static-org-chart > li > div:first-of-type:nth-last-of-type(2) ~ div {
        width: calc((100% / 2) - 2em - 4px);
   }
    ol.static-org-chart > li > div:first-of-type:nth-last-of-type(3), ol.static-org-chart > li > div:first-of-type:nth-last-of-type(3) ~ div {
        width: calc((100% / 3) - 2em - 4px);
   }
    ol.static-org-chart > li > div:first-of-type:nth-last-of-type(4), ol.static-org-chart > li > div:first-of-type:nth-last-of-type(4) ~ div {
        width: calc((100% / 4) - 2em - 4px);
   }
    ol.static-org-chart > li > div:first-of-type:nth-last-of-type(5), ol.static-org-chart > li > div:first-of-type:nth-last-of-type(5) ~ div {
        width: calc((100% / 5) - 2em - 4px);
   }
    ol.static-org-chart > li > div:before, ol.static-org-chart > li > div:after {
        bottom: -2em!important;
        top: inherit!important;
   }
    ol.static-org-chart > li > div:before {
        height: 2em!important;
        left: 50%!important;
        width: 3px!important;
   }
    ol.static-org-chart > li > div:only-of-type:after {
        display: none;
   }
    ol.static-org-chart > li > div:first-of-type:not(:only-of-type):after, ol.static-org-chart > li > div:last-of-type:not(:only-of-type):after {
        bottom: -1em;
        height: 3px;
        width: calc(50% + 1em + 3px);
   }
    ol.static-org-chart > li > div:first-of-type:not(:only-of-type):after {
        left: calc(50% + 3px);
   }
    ol.static-org-chart > li > div:last-of-type:not(:only-of-type):after {
        left: calc(-1em - 3px);
   }
    ol.static-org-chart > li > div + div:not(:last-of-type):after {
        height: 3px;
        left: -2em;
        width: calc(100% + 4em);
   }
   /* SECONDARY */
    ol.static-org-chart > li > ol {
        display: flex;
        flex-wrap: nowrap;
   }
    ol.static-org-chart > li > ol:before, ol.static-org-chart > li > ol > li:before {
        height: 6.5em!important;
        left: 50%!important;
        top: 0!important;
        width: 3px!important;
   }
    ol.static-org-chart > li > ol:after {
        display: none;
   }
    ol.static-org-chart > li > ol > li {
        flex-grow: 1;
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 2em;
   }
    ol.static-org-chart > li > ol > li:only-of-type {
        padding-top: 0;
   }
    ol.static-org-chart > li > ol > li:only-of-type:before, ol.static-org-chart > li > ol > li:only-of-type:after {
        display: none;
   }
    ol.static-org-chart > li > ol > li:first-of-type:not(:only-of-type):after, ol.static-org-chart > li > ol > li:last-of-type:not(:only-of-type):after {
        height: 3px;
        top: 0;
        width: 50%;
   }
    ol.static-org-chart > li > ol > li:first-of-type:not(:only-of-type):after {
        left: 50%;
   }
    ol.static-org-chart > li > ol > li:last-of-type:not(:only-of-type):after {
        left: 0;
   }
    ol.static-org-chart > li > ol > li + li:not(:last-of-type):after {
        height: 3px;
        left: 0;
        top: 0;
        width: 100%;
   }
    ol.static-org-chart #first > li > div {
       
		margin:0 auto;
   }
    ol.static-org-chart #first > li > div > div {        margin-left: auto;
        margin-right: auto;
        position: relative;
		
   }
}
#first .staff_info {
	background:#fff;color: #000;
}
ol.static-org-chart .staff_title {
    text-align: center;
   
}
#second .staff_title h3 {
    font-size: 16px;
    color: #fff;
    font-weight: 500;
	padding:0;
	margin:0;
}
.staff_title h3 {
    font-size: 16px;
    color: #fff;
    font-weight: 500;
	padding:0;
	margin:0;
}

.staff_title h4 {
    font-size: 12px;
    color: #fff;
    font-weight: 400;
	padding:0;
	margin:2px;
}
ol.static-org-chart .staff_image img {
    border-radius: 100px;
    width: 70px;
}
ol.static-org-chart .staff_image {
    float: left;
    width: 30%;
}
ol.static-org-chart .staff_name_container {
    padding:5px;
    float: right;
    width: 70%;
}
ol.static-org-chart .staff_name_label {
    color: #0156ad;
    font-size: 16px;
    text-align: left;
}
ol.static-org-chart .staff_name {
    font-size: 14px;
    text-align: left;
	line-height: 18px;
}
ol.static-org-chart #second > li > div:not(:first-child) {
    height: 60px;
    width: 250px;
    background-color: #ececec;
    color: #0156ad;
    font-size: 13px;
   
    margin-bottom: 0.2rem;
}
ol.static-org-chart #second > li > div:not(:first-child) > div {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
ol.static-org-chart #second > li > div:not(:first-child):hover {
    background-color: #b3ff66;
    box-shadow: none;
}
ol.static-org-chart .staff_card + div {
    margin-top: 10px;
}

ol#second .staff_card {
    width: 180px !important;
    min-width: 180px !important;
}
ol#first .staff_card {
    width: 280px !important;
    min-width: 280px !important;
    
}
#second .staff_image {
    float: left;
    width: 100%!important;
}
#second .staff_name, #second .staff_name_container {
    padding:0;
    float: left;
    width: 100%!important;
	text-align:center!important;
	margin-top:4px;
}
#second .staff_info {
    height: 170px!important;
    padding: 8px!important;
	
}
/*team*/



.right-line {
  border-right: 5px #ccc solid;
  height:2em
}

.top-line {
  border-top: 5px #ccc solid;
}

.halved {
  width: 50%;
  float:left;
}




.ani_shadow {
  display: grid;
  position: relative;
  margin: 0 auto;

}

.ani_shadow::before,
.ani_shadow::after {
  content: '';
  position: absolute;
  top: 0px;
  left: 0px;
  padding:0;
  border-radius:8px;
 Background: linear-gradient(45deg,#2ad3db,blue,green,#eba627,#2db3db,black,#ff0000,#1a5b7a);
  background-size: 400%;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  z-index: -1;
  animation: animate 25s linear infinite;
}

.ani_shadow::after {
  filter: blur(15px);
}


@keyframes animate {
  0% {
    background-position: 0 0;
  }

  50% {
    background-position: 400% 0;
  }

  100% {
    background-position: 0 0;
  }
}

.other_service_box{	background-image: radial-gradient(#FFF, #77ecff, #0156ad);padding:50px 0;}
.other_service_box i{font-size:70px;}
.other_service .card{background:transparent;}
.sochal-icon-bar{display: none;}















.staff_info2{position:relative;display:table;}
.circle1 {
	background:#fff;
	border:6px solid #e43e42;
	width:150px;
	line-height:135px;
	height:150px;	
	border-radius:50%;
	
}

.circle2 img{
	background:#fff;
	width:120px;
	height:120px;
	line-height:120px;
	border-radius:50%;
	border:3px solid #e43e42;
	padding:6px;
	
}
.sname{
	display:table;
	background:#0156ad;
	color:#fff;
	padding:7px 12px;
	text-align:center;
	border-radius:25px;
	position:absolute;
    top: 20%;
    left: 75%;
    width: 100%;
	
}

.sposition{
	display:table;
	background:#fff;
	border:2px solid #e43e42;
	padding:6px;
	text-align:center;
	border-radius:25px;
	position:absolute;
    top: 50%;
    left: 75%;
    width: 100%;
	font-size:13px;
	font-weight:500;
}



.redbox{
	background:#67aff9;
	border-radius:10px;
	padding:12px;
	text-align:center;
	transition: 0.3s;
}
.redbox img{ height:70px;}
.redbox h5{ font-size:16px;color:#fff;font-weight:400;padding:15px 0;text-transform:uppercase;}
.what_we_do .row .col{padding-left:10px;padding-right:10px;}
.redbox:hover {
   -webkit-transform: scale(1.1);
   transform: scale(1.1);
   z-index:9999;
}
.box-wrapper {
  display: inline-block;
  box-sizing: border-box;
 }
/* Shine effect */

figure {
	margin: 0;
	padding: 0;
	overflow: hidden;
}
figure:hover+span {
	bottom: -36px;
	opacity: 1;
}

.shine figure {
	position: relative;
}
.shine figure::before {
	position: absolute;
	top: 0;
	left: -75%;
	z-index: 2;
	display: block;
	content: '';
	width: 50%;
	height: 100%;
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.1) 100%);
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.1) 100%);
	-webkit-transform: skewX(-25deg);
	transform: skewX(-25deg);
}
.shine figure:hover::before {
	-webkit-animation: shine .75s;
	animation: shine .75s;
}
@-webkit-keyframes shine {
	100% {
		left: 125%;
	}
}
@keyframes shine {
	100% {
		left: 125%;
	}
}
/* Shine effect end*/
.modal_scroll{height:450px;overflow:auto;}
.servicemodal .modal-body { padding: 1rem!important;}
.servicemodal .modal-body p i{color:#e43e42;}
.servicemodal .modal-body p{
	width:95%;border-bottom: 1px dashed #aaa;	padding:0 0 12px 0;	margin:12px 0 0 0;
}

.btn-close {
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: 0.25em 0.25em;
    color: #dc3545;
    background:url(../images/close.png) 0 0 no-repeat;
    border: 0;
    border-radius: 0.25rem;
    opacity: 1;
}
.btn-close:focus {box-shadow:none;}
.cname{
	font-size:14px;
	color:#000;
	text-align:center;
	margin-top:6px;
}

.same_height {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.equal_height {
	
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1; /* Means flex: 1 1 0 */
}
.modal-body{padding:20px;}
h5.modal-title{font-size:20px;color:#0156ad;}

/* Bar Graph pre */
.bar-graph .year {
  -webkit-animation: fade-in-text 2.2s 0.1s forwards;
  -moz-animation: fade-in-text 2.2s 0.1s forwards;
  animation: fade-in-text 2.2s 0.1s forwards;
}

.bar-graph-vertical {
  margin-top: 80px;

}
.bar-container{cursor:pointer;}
.bar-graph-vertical .bar-container {
  float: left;
  height: 300px;
  margin-right: 18px;
  position: relative;
  text-align: center;
  width: 35px;
}

.bar-graph-vertical .bar {
  border-radius: 3px;
  bottom: 30px;
  position: absolute;
  width: 45px;
}

.bar-graph-vertical .year {
  bottom: 0;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
 font-size:11px;
}

.bar-graph-two .bar::after {
  -webkit-animation: fade-in-text 2.2s 0.1s forwards;
  -moz-animation: fade-in-text 2.2s 0.1s forwards;
  animation: fade-in-text 2.2s 0.1s forwards;
  color: #fff;
  content: attr(data-percentage);
  font-weight: 700;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  text-align: left;
  top: 24px;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.bar-graph-two .bar1 .bar {
  background-color: #dbe196;
  -webkit-animation: show-bar1-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar1-vertical 1.2s 0.1s forwards;
  animation: show-bar1-vertical 1.2s 0.1s forwards; 
}

.bar-graph-two .bar2 .bar {
  background-color: #d4ae54;
  -webkit-animation: show-bar2-vertical 1.2s 0.2s forwards;
  -moz-animation: show-bar2-vertical 1.2s 0.2s forwards;
  animation: show-bar2-vertical 1.2s 0.2s forwards; 
}

.bar-graph-two .bar3 .bar {
  background-color: #e5cf76;
  -webkit-animation: show-bar3-vertical 1.2s 0.3s forwards;
  -moz-animation: show-bar3-vertical 1.2s 0.3s forwards;
  animation: show-bar3-vertical 1.2s 0.3s forwards; 
}

.bar-graph-two .bar4 .bar {
  background-color: #f2a244;
  -webkit-animation: show-bar4-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar4-vertical 1.2s 0.4s forwards;
  animation: show-bar4-vertical 1.2s 0.4s forwards; 
}

.bar-graph-two .bar5 .bar {
  background-color: #f27544;
  -webkit-animation: show-bar5-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar5-vertical 1.2s 0.4s forwards;
  animation: show-bar5-vertical 1.2s 0.4s forwards; 
}

.bar-graph-two .bar6 .bar {
  background-color: #c75cc3;
  -webkit-animation: show-bar6-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar6-vertical 1.2s 0.4s forwards;
  animation: show-bar6-vertical 1.2s 0.4s forwards; 
}
.bar-graph-two .bar7 .bar {
  background-color: #a673f2;
  -webkit-animation: show-bar7-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar7-vertical 1.2s 0.4s forwards;
  animation: show-bar7-vertical 1.2s 0.4s forwards; 
}
.bar-graph-two .bar8 .bar {
  background-color: #7243ea;
  -webkit-animation: show-bar8-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar8-vertical 1.2s 0.4s forwards;
  animation: show-bar8-vertical 1.2s 0.4s forwards; 
}
.bar-graph-two .bar9 .bar {
  background-color: #3d23fa;
  -webkit-animation: show-bar9-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar9-vertical 1.2s 0.4s forwards;
  animation: show-bar9-vertical 1.2s 0.4s forwards; 
}
.bar-graph-two .bar10 .bar {
  background-color: #2374fa;
  -webkit-animation: show-bar10-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar10-vertical 1.2s 0.4s forwards;
  animation: show-bar10-vertical 1.2s 0.4s forwards; 
}
.bar-graph-two .bar11 .bar {
  background-color: #23c0fa;
  -webkit-animation: show-bar11-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar11-vertical 1.2s 0.4s forwards;
  animation: show-bar11-vertical 1.2s 0.4s forwards; 
}
.bar-graph-two .bar12 .bar {
  background-color: #40dacd;
  -webkit-animation: show-bar12-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar12-vertical 1.2s 0.4s forwards;
  animation: show-bar12-vertical 1.2s 0.4s forwards;  
}
.bar-graph-two .bar13 .bar {
  background-color: #40da7a;
  -webkit-animation: show-bar13-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar13-vertical 1.2s 0.4s forwards;
  animation: show-bar13-vertical 1.2s 0.4s forwards;  
}

.bar-graph-two .bar14 .bar {
  background-color: #85da40;
  -webkit-animation: show14-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar14-vertical 1.2s 0.4s forwards;
  animation: show-bar14-vertical 1.2s 0.4s forwards;  
}

.bar-graph-two .bar15 .bar {
  background-color: #c6da40;
  -webkit-animation: show-bar15-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar15-vertical 1.2s 0.4s forwards;
  animation: show-bar15-vertical 1.2s 0.4s forwards;
 
}


.bar-graph-two .bar16 .bar {
  background-color: #ffc63c;
  -webkit-animation: show-bar16-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar16-vertical 1.2s 0.4s forwards;
  animation: show-bar16-vertical 1.2s 0.4s forwards;
}

.bar-graph-two .bar17 .bar {
  background-color: #90df5b;
  -webkit-animation: show-bar17-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar17-vertical 1.2s 0.4s forwards;
  animation: show-bar17-vertical 1.2s 0.4s forwards;
}

.bar-graph-two .bar18 .bar {
  background-color: #5bcbdf;
  -webkit-animation: show-bar18-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar18-vertical 1.2s 0.4s forwards;
  animation: show-bar18-vertical 1.2s 0.4s forwards;
}

.bar-graph-two .bar19 .bar {
  background-color: #e7f381;
  -webkit-animation: show-bar19-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar19-vertical 1.2s 0.4s forwards;
  animation: show-bar19-vertical 1.2s 0.4s forwards;
}

.bar-graph-two .bar20 .bar {
  background-color: #c79df7;
  -webkit-animation: show-bar20-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar20-vertical 1.2s 0.4s forwards;
  animation: show-bar20-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar21 .bar {
  background-color: #9db0f7;
  -webkit-animation: show-bar21-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar21-vertical 1.2s 0.4s forwards;
  animation: show-bar21-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar22 .bar {
  background-color: #f69df7;
  -webkit-animation: show-bar22-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar22-vertical 1.2s 0.4s forwards;
  animation: show-bar22-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar23 .bar {
  background-color: #f7cc9d;
  -webkit-animation: show-bar23-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar23-vertical 1.2s 0.4s forwards;
  animation: show-bar23-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar24 .bar {
  background-color: #3a90c1;
  -webkit-animation: show-bar24-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar24-vertical 1.2s 0.4s forwards;
  animation: show-bar24-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar25 .bar {
  background-color: #80c13a;
  -webkit-animation: show-bar25-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar25-vertical 1.2s 0.4s forwards;
  animation: show-bar25-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar26 .bar {
  background-color: #d9d597;
  -webkit-animation: show-bar26-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar26-vertical 1.2s 0.4s forwards;
  animation: show-bar26-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar27 .bar {
  background-color: #97d9a5;
  -webkit-animation: show-bar27-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar27-vertical 1.2s 0.4s forwards;
  animation: show-bar27-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar28 .bar {
  background-color: #97d0d9;
  -webkit-animation: show-bar28-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar28-vertical 1.2s 0.4s forwards;
  animation: show-bar28-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar29 .bar {
  background-color: #bb97d9;
  -webkit-animation: show-bar29-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar29-vertical 1.2s 0.4s forwards;
  animation: show-bar29-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar30 .bar {
  background-color: #97d9d8;
  -webkit-animation: show-bar30-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar30-vertical 1.2s 0.4s forwards;
  animation: show-bar30-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar31 .bar {
  background-color: #d997b4;
  -webkit-animation: show-bar31-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar31-vertical 1.2s 0.4s forwards;
  animation: show-bar31-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar32 .bar {
  background-color: #97abd9;
  -webkit-animation: show-bar32-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar32-vertical 1.2s 0.4s forwards;
  animation: show-bar32-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar33 .bar {
  background-color: #97d9b3;
  -webkit-animation: show-bar33-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar33-vertical 1.2s 0.4s forwards;
  animation: show-bar33-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar34 .bar {
  background-color: #71c94f;
  -webkit-animation: show-bar34-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar34-vertical 1.2s 0.4s forwards;
  animation: show-bar34-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar35 .bar {
  background-color: #a985fb;
  -webkit-animation: show-bar35-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar35-vertical 1.2s 0.4s forwards;
  animation: show-bar35-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar36 .bar {
  background-color: #a985fb;
  -webkit-animation: show-bar36-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar36-vertical 1.2s 0.4s forwards;
  animation: show-bar36-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar37 .bar {
  background-color: #a985fb;
  -webkit-animation: show-bar37-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar37-vertical 1.2s 0.4s forwards;
  animation: show-bar37-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar38 .bar {
  background-color: #a985fb;
  -webkit-animation: show-bar38-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar38-vertical 1.2s 0.4s forwards;
  animation: show-bar38-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar39 .bar {
  background-color: #a985fb;
  -webkit-animation: show-bar39-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar39-vertical 1.2s 0.4s forwards;
  animation: show-bar39-vertical 1.2s 0.4s forwards;
}
.bar-graph-two .bar40 .bar {
  background-color: #a985fb;
  -webkit-animation: show-bar40-vertical 1.2s 0.4s forwards;
  -moz-animation: show-bar40-vertical 1.2s 0.4s forwards;
  animation: show-bar40-vertical 1.2s 0.4s forwards;
}




@-webkit-keyframes fade-in-text {0% { opacity: 0; } 100% {opacity: 1;  }}
@-webkit-keyframes show-bar1-vertical { 0% { height: 0;}100% { height: 8%;}}
@-webkit-keyframes show-bar2-vertical { 0% {  height: 0; } 100% { height: 10%;  }}
@-webkit-keyframes show-bar3-vertical { 0% { height: 0; } 100% { height: 14%;}}
@-webkit-keyframes show-bar4-vertical { 0% { height: 0; } 100% { height: 18%;}}
@-webkit-keyframes show-bar5-vertical { 0% { height: 0; } 100% { height: 22%;}}
@-webkit-keyframes show-bar6-vertical { 0% { height: 0; } 100% { height:26%;}}
@-webkit-keyframes show-bar7-vertical { 0% { height: 0; } 100% { height: 30%;}}
@-webkit-keyframes show-bar8-vertical { 0% { height: 0; } 100% { height: 34%;}}
@-webkit-keyframes show-bar9-vertical { 0% { height: 0; } 100% { height: 36%;}}
@-webkit-keyframes show-bar10-vertical { 0% { height: 0; } 100% { height: 38%;}}
@-webkit-keyframes show-bar11-vertical { 0% { height: 0; } 100% { height: 40%;}}
@-webkit-keyframes show-bar12-vertical { 0% { height: 0; } 100% { height: 42%;}}
@-webkit-keyframes show-bar13-vertical { 0% { height: 0; } 100% { height: 44%;}}
@-webkit-keyframes show-bar14-vertical { 0% { height: 0; } 100% { height: 46%;}}
@-webkit-keyframes show-bar15-vertical { 0% { height: 0; } 100% { height: 48%;}}
@-webkit-keyframes show-bar16-vertical { 0% { height: 0; } 100% { height: 50%;}}
@-webkit-keyframes show-bar17-vertical { 0% { height: 0; } 100% { height: 52%;}}
@-webkit-keyframes show-bar18-vertical { 0% { height: 0; } 100% { height: 54%;}}
@-webkit-keyframes show-bar19-vertical { 0% { height: 0; } 100% { height: 56%;}}
@-webkit-keyframes show-bar20-vertical { 0% { height: 0; } 100% { height: 58%;}}
@-webkit-keyframes show-bar21-vertical { 0% { height: 0; } 100% { height: 60%;}}
@-webkit-keyframes show-bar22-vertical { 0% { height: 0; } 100% { height: 62%;}}
@-webkit-keyframes show-bar23-vertical { 0% { height: 0; } 100% { height: 64%;}}
@-webkit-keyframes show-bar24-vertical { 0% { height: 0; } 100% { height: 66%;}}
@-webkit-keyframes show-bar25-vertical { 0% { height: 0; } 100% { height: 68%;}}
@-webkit-keyframes show-bar26-vertical { 0% { height: 0; } 100% { height: 70%;}}
@-webkit-keyframes show-bar27-vertical { 0% { height: 0; } 100% { height: 72%;}}
@-webkit-keyframes show-bar28-vertical { 0% { height: 0; } 100% { height: 74%;}}
@-webkit-keyframes show-bar29-vertical { 0% { height: 0; } 100% { height: 76%;}}
@-webkit-keyframes show-bar30-vertical { 0% { height: 0; } 100% { height: 78%;}}
@-webkit-keyframes show-bar31-vertical { 0% { height: 0; } 100% { height: 80%;}}
@-webkit-keyframes show-bar32-vertical { 0% { height: 0; } 100% { height: 82%;}}
@-webkit-keyframes show-bar33-vertical { 0% { height: 0; } 100% { height: 84%;}}
@-webkit-keyframes show-bar34-vertical { 0% { height: 0; } 100% { height: 86%;}}
@-webkit-keyframes show-bar35-vertical { 0% { height: 0; } 100% { height: 88%;}}
@-webkit-keyframes show-bar36-vertical { 0% { height: 0; } 100% { height: 90%;}}
@-webkit-keyframes show-bar37-vertical { 0% { height: 0; } 100% { height: 92%;}}
@-webkit-keyframes show-bar38-vertical { 0% { height: 0; } 100% { height: 95%;}}
@-webkit-keyframes show-bar39-vertical { 0% { height: 0; } 100% { height: 99%;}}
@-webkit-keyframes show-bar40-vertical { 0% { height: 0; } 100% { height: 100%;}}



/* Bar Graph post */
.post .bar-graph .year {
  -webkit-animation: fade-in-text 2.2s 0.1s forwards;
  -moz-animation: fade-in-text 2.2s 0.1s forwards;
  animation: fade-in-text 2.2s 0.1s forwards;
}

.post .bar-graph-vertical {
  margin-top: 80px;

}
.post .bar-container{cursor:pointer;}
.post .bar-graph-vertical .bar-container {
  float: left;
  height: 300px;
  margin-right: 18px;
  position: relative;
  text-align: center;
  width: 32px;
}

.post .bar-graph-vertical .bar {
  border-radius: 3px;
  bottom: 30px;
  position: absolute;
  width: 32px;
}

.post .bar-graph-vertical .year {
  bottom: 0;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
 font-size:11px;
}
.bar-graph-vertical .turnover {
    top: -22px;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
	font-size:11px;
	font-weight:500;
}
.post .bar-graph-two .bar::after {
  -webkit-animation: fade-in-text 2.2s 0.1s forwards;
  -moz-animation: fade-in-text 2.2s 0.1s forwards;
  animation: fade-in-text 2.2s 0.1s forwards;
  color: #fff;
  content: attr(data-percentage);
  font-weight: 700;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  text-align: left;
  top: 24px;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.post .bar-graph-two .bar2000 .bar {
  background-color: #ffc63c;
  -webkit-animation: show-bar2000-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2000-vertical 1.2s 0.1s forwards;
  animation: show-bar2000-vertical 1.2s 0.1s forwards; 
}

.post .bar-graph-two .bar2001 .bar {
  background-color: #b8d475;
  -webkit-animation: show-bar2001-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2001-vertical 1.2s 0.1s forwards;
  animation: show-bar2001-vertical 1.2s 0.1s forwards; 
}

.post .bar-graph-two .bar2002 .bar {
  background-color: #6eb838;
  -webkit-animation: show-bar2002-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2002-vertical 1.2s 0.1s forwards;
  animation: show-bar2002-vertical 1.2s 0.1s forwards; 
}

.post .bar-graph-two .bar2003 .bar {
  background-color: #4ad5b9;
  -webkit-animation: show-bar2003-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2003-vertical 1.2s 0.1s forwards;
  animation: show-bar2003-vertical 1.2s 0.1s forwards; 
}

.post .bar-graph-two .bar2004 .bar {
  background-color: #268ff1;
  -webkit-animation: show-bar2004-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2004-vertical 1.2s 0.1s forwards;
  animation: show-bar2004-vertical 1.2s 0.1s forwards; 
}

.post .bar-graph-two .bar2005 .bar {
  background-color: #404df7;
  -webkit-animation: show-bar2005-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2005-vertical 1.2s 0.1s forwards;
  animation: show-bar2005-vertical 1.2s 0.1s forwards; 
}

.post .bar-graph-two .bar2006 .bar {
  background-color: #6f40f7;
  -webkit-animation: show-bar2006-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2006-vertical 1.2s 0.1s forwards;
  animation: show-bar2006-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2007 .bar {
  background-color: #8940f7;
  -webkit-animation: show-bar2007-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2007-vertical 1.2s 0.1s forwards;
  animation: show-bar2007-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2008 .bar {
  background-color: #9337d9;
  -webkit-animation: show-bar2008-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2008-vertical 1.2s 0.1s forwards;
  animation: show-bar2008-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2009 .bar {
  background-color: #e651e8;
  -webkit-animation: show-bar2009-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2009-vertical 1.2s 0.1s forwards;
  animation: show-bar2009-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2010 .bar {
  background-color: #f11965;
  -webkit-animation: show-bar2010-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2010-vertical 1.2s 0.1s forwards;
  animation: show-bar2010-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2011 .bar {
  background-color: #f16f18;
  -webkit-animation: show-bar2011-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2011-vertical 1.2s 0.1s forwards;
  animation: show-bar2011-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2012 .bar {
  background-color: #f1a218;
  -webkit-animation: show-bar2012-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2012-vertical 1.2s 0.1s forwards;
  animation: show-bar2012-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2013 .bar {
  background-color: #b1a06c;
  -webkit-animation: show-bar2013-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2013-vertical 1.2s 0.1s forwards;
  animation: show-bar2013-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2014 .bar {
  background-color: #6bc8ce;
  -webkit-animation: show-bar2014-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2014-vertical 1.2s 0.1s forwards;
  animation: show-bar2014-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2015 .bar {
  background-color: #486594;
  -webkit-animation: show-bar2015-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2015-vertical 1.2s 0.1s forwards;
  animation: show-bar2015-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2016 .bar {
  background-color: #71b36a;
  -webkit-animation: show-bar2016-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2016-vertical 1.2s 0.1s forwards;
  animation: show-bar2016-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2017 .bar {
  background-color: #99d235;
  -webkit-animation: show-bar2017-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2017-vertical 1.2s 0.1s forwards;
  animation: show-bar2017-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2018 .bar {
  background-color: #35bed2;
  -webkit-animation: show-bar2018-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2018-vertical 1.2s 0.1s forwards;
  animation: show-bar2018-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2019 .bar {
  background-color: #356cd2;
  -webkit-animation: show-bar2019-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2019-vertical 1.2s 0.1s forwards;
  animation: show-bar2019-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2020 .bar {
  background-color: #a06ccc;
  -webkit-animation: show-bar2020-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2020-vertical 1.2s 0.1s forwards;
  animation: show-bar2020-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2021 .bar {
  background-color: #ba7beb;
  -webkit-animation: show-bar2021-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2021-vertical 1.2s 0.1s forwards;
  animation: show-bar2021-vertical 1.2s 0.1s forwards; 
}
.post .bar-graph-two .bar2022 .bar {
  background-color: #807beb;
  -webkit-animation: show-bar2022-vertical 1.2s 0.1s forwards;
  -moz-animation: show-bar2022-vertical 1.2s 0.1s forwards;
  animation: show-bar2022-vertical 1.2s 0.1s forwards; 
}




@-webkit-keyframes fade-in-text {0% { opacity: 0; } 100% {opacity: 1;  }}
@-webkit-keyframes show-bar2000-vertical { 0% { height: 0;}100% { height: 8%;}}
@-webkit-keyframes show-bar2001-vertical { 0% {  height: 0; } 100% { height: 10%;}}
@-webkit-keyframes show-bar2002-vertical { 0% { height: 0; } 100% { height: 14%;}}
@-webkit-keyframes show-bar2003-vertical { 0% { height: 0; } 100% { height: 18%;}}
@-webkit-keyframes show-bar2004-vertical { 0% { height: 0; } 100% { height: 22%;}}
@-webkit-keyframes show-bar2005-vertical { 0% { height: 0; } 100% { height: 28%;}}
@-webkit-keyframes show-bar2006-vertical { 0% { height: 0; } 100% { height: 34%;}}
@-webkit-keyframes show-bar2007-vertical { 0% { height: 0; } 100% { height: 40%;}}
@-webkit-keyframes show-bar2008-vertical { 0% { height: 0; } 100% { height: 44%;}}
@-webkit-keyframes show-bar2009-vertical { 0% { height: 0; } 100% { height: 48%;}}
@-webkit-keyframes show-bar2010-vertical { 0% { height: 0; } 100% { height: 54%;}}
@-webkit-keyframes show-bar2011-vertical { 0% { height: 0; } 100% { height: 60%;}}
@-webkit-keyframes show-bar2012-vertical { 0% { height: 0; } 100% { height: 64%;}}
@-webkit-keyframes show-bar2013-vertical { 0% { height: 0; } 100% { height: 68%;}}
@-webkit-keyframes show-bar2014-vertical { 0% { height: 0; } 100% { height: 72%;}}
@-webkit-keyframes show-bar2015-vertical { 0% { height: 0; } 100% { height: 76%;}}
@-webkit-keyframes show-bar2016-vertical { 0% { height: 0; } 100% { height: 80%;}}
@-webkit-keyframes show-bar2017-vertical { 0% { height: 0; } 100% { height: 84%;}}
@-webkit-keyframes show-bar2018-vertical { 0% { height: 0; } 100% { height: 88%;}}
@-webkit-keyframes show-bar2019-vertical { 0% { height: 0; } 100% { height: 92%;}}
@-webkit-keyframes show-bar2020-vertical { 0% { height: 0; } 100% { height: 96%;}}
@-webkit-keyframes show-bar2021-vertical { 0% { height: 0; } 100% { height: 98%;}}
@-webkit-keyframes show-bar2022-vertical { 0% { height: 0; } 100% { height: 100%;}}

.missionbg{
	background:#fff;
	padding:20px;
	text-align:center;
	box-shadow:0 0 15px #00000075;
	border-top:4px solid #e43e42;
	border-radius:8px;
}



.missionbg h2{
 font-family: 'Ubuntu', sans-serif;
  font-size: 20px;
  color:#000;
  font-weight: 600;
  margin-bottom: 10px;
  text-align:center;
}

.missionbg p{
  font-size: 16px;
  color:#000;
  font-weight:400;
  line-height:26px;
text-align:center;
margin:0;
}
.missionbg p strong{margin:0 0 15px 0;}

.homeimg img{
	height:450px;
}



/* Organogram */
ol.organizational-chart > li ol > li.bb:not(:last-of-type):after {
    height: 100%;
    right: 0;
    top: 0;
    width: 3px;
}
.site-name{padding: 10px 0 5px 0;border-radius: 10px;color: #fff;
    background: #3e50b4;
    background: -webkit-linear-gradient(left top, #3e50b4, #2196F3);
    background: -o-linear-gradient(bottom right, #3e50b4, #2196F3);
    background: -moz-linear-gradient(bottom right, #3e50b4, #2196F3);
    background: linear-gradient(to bottom right, #3e50b4, #2196F3);}
.outborder {display: inline-block;}
.outborder img{width:50px; margin:0 auto 6px auto;border: 1px solid #ddd;}
.subchart-text img{width:40px; margin:0 auto 6px auto;border: 1px solid #ddd;}
.site , .subdomain ,.subdomain2 , .redirects , .host , .email ,.email2 , .dns{display: inline-block;background-size: 4762px 48px;width: 48px;height: 48px;}
.chart-text {display: block;padding:5px 0 8px 0 !important;font-size: 16px;color: #006df0;font-weight: bold; text-align:center;height:145px;}

.chart-text h2{font-size: 15px;color: #e43e42;font-weight: bold;text-align:center;margin:0; line-height: 14px;}
.chart-text h3{font-size: 15px;color: #000;font-weight: bold;margin:0;}
.chart-text p{font-size: 13px;color: #0156ad;font-weight: bold;margin:0;}
.subchart-text {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    background: #fff;border:1px solid #111;display: block;padding:5px !important;font-weight: bold;text-align:center;
	height:135px;
	background-image: linear-gradient(#f3f9d1, #fff)!important;
	
	}
.subchart-text h2{font-size: 13px;color: #e43e42;font-weight: bold;text-align:center;margin:0;line-height:16px;}
.subchart-text h3{font-size: 11px;color: #000;font-weight: bold;margin:0;}
.subchart-text p{font-size: 12px;color: #0156ad;font-weight: bold;margin:0;line-height:16px;}
.subchart-text:hover {color: #3e50b4;}
.site {background-position: -3654px 0;}


.subchart-text-head{background:#065d7d!important;padding:10px 30px!important;font-size: 14px;color: #fff;font-weight: bold;margin:0;}
.vline{
	background:#999!important;
	border:0!important;
	border-radius:0!important;
	width:3px;
	height:30px;
	margin: 0 auto;
}
.yellowbg{background-image: linear-gradient(#f3f9d1, #fff)!important;}
.teambg {
    background: #767070!important;
	border:0!important;display: block;padding:4px !important;
	height:60px;
	}
.teambg P{font-size:14px;color:#fff;text-align:center;margin:0;line-height:20px;}	
.teambg P strong{display:block;font-weight:400;}	
ol li:nth-child(1) .teambg {background: #767070!important;}
ol li:nth-child(2) .teambg {background: #c84646!important;}
ol li:nth-child(3) .teambg {background: #5682ce!important;}
ol li:nth-child(4) .teambg {background: #7bb654!important;}
ol li:nth-child(5) .teambg {background: #daad12!important;}
	
@media screen and (max-width: 64em) {
ol.organizational-chart > li > div:first-of-type:after , ol.organizational-chart > li > div:before {
display: none;
}
ol.organizational-chart > li > ol:before {
    left: 49.5%!important;
    right: 0;
} 
    ol.organizational-chart > li > ol:after {
    left: 0;
    width: 50%!important;
}
   .chart-text, .subchart-text {height:auto;} 
    }

.text-holder{display: inline-block;font-size: 15px;vertical-align: top;margin-top: 1px;margin-left: 10px;line-height: 22px;text-align: left}
.text-holder span{font-size: 13px;display: block;}
.img-holder{width: 30px;height: 30px;border-radius: 50%;display: inline-block;background: #fff;padding: 4px;}
.img-holder img{width: 100%;}


ol.organizational-chart,
ol.organizational-chart ol,
ol.organizational-chart li,
ol.organizational-chart li > div {
    position: relative;
}

ol.organizational-chart,
ol.organizational-chart ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

ol.organizational-chart {
    text-align: center;
}

ol.organizational-chart ol {
    padding-top: 1em;
}

ol.organizational-chart ol:before,
ol.organizational-chart ol:after,
ol.organizational-chart li:before,
ol.organizational-chart li:after,
ol.organizational-chart > li > div:before,
ol.organizational-chart > li > div:after {
    background-color:transparent;
    content: '';
    position: absolute;
}

ol.organizational-chart ol > li {
    padding:0 .2em;
}

ol.organizational-chart > li ol:before {
    height: 1em;
    left: 50%;
    top: 0;
    width: 3px;
}

ol.organizational-chart > li ol:after {
    height: 3px;
    left: 3px;
    top: 1em;
    width: 50%;
}

ol.organizational-chart > li ol > li:not(:last-of-type):before {
    height: 3px;
    left: 0;
    top: 1.7em;
    width: 1em;
}

ol.organizational-chart > li ol > li:not(:last-of-type):after {
    height: 100%;
    left: 0;
    top: 0;
    width: 3px;
}

ol.organizational-chart > li ol > li:last-of-type:before {
    height: 3px;
    left: 0;
    top: 1.7em;
    width: 1em;
}

ol.organizational-chart > li ol > li:last-of-type:after {
    height: 1.7em;
    left: 0;
    top: 0;
    width: 3px;
}

ol.organizational-chart li > div {

}


ol.organizational-chart > li > div {

}

ol.organizational-chart > li > div:before {
    bottom: 2em;
    height: 3px;
    right: -1em;
    width: 1em;
}

ol.organizational-chart > li > div:first-of-type:after {
    bottom: 0;
    height: 2em;
    right: -1em;
    width: 3px;
}

ol.organizational-chart > li > div + div {
    margin-top: 1em;
}

ol.organizational-chart > li > div + div:after {
    height: calc(100% + 1em);
    right: -1em;
    top: -1em;
    width: 3px;
}


ol.organizational-chart > li > ol:before {
    left: inherit;
    right: 0;
}

ol.organizational-chart > li > ol:after {
    left: 0;
    width: 100%;
	height:160px;
}

ol.organizational-chart > li > ol > li > div {
	box-shadow: 0px 15px 10px -15px #898989;    
   background:#fff;
   border:1px solid #cfcfcf;
   display: block;
    border-radius: 10px;
    padding: 10px 0 5px 0!important;
}

@media only screen and ( min-width: 64em ) {

    ol.organizational-chart {
        margin-left: -1em;
        margin-right: -1em;
    }


    ol.organizational-chart > li > div {
        display: block;
        float: none;
        margin: 0 1em 1em 1em;
        vertical-align: bottom;
    }

    ol.organizational-chart > li > div:only-of-type {
        margin-bottom: 0;
    }

    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(2),
    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(2) ~ div {
        width: calc((100% / 2) - 2em - 4px);
    }

    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(3),
    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(3) ~ div {
        width: calc((100% / 3) - 2em - 4px);
    }

    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(4),
    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(4) ~ div {
        width: calc((100% / 4) - 2em - 4px);
    }

    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(5),
    ol.organizational-chart > li > div:first-of-type:nth-last-of-type(5) ~ div {
        width: calc((100% / 5) - 2em - 4px);
    }

    ol.organizational-chart > li > div:before,
    ol.organizational-chart > li > div:after {
        bottom: -1em!important;
        top: inherit!important;
    }

    ol.organizational-chart > li > div:before {
        height: 1em!important;
        left: 50%!important;
        width: 3px!important;
    }

    ol.organizational-chart > li > div:only-of-type:after {
        display: none;
    }

    ol.organizational-chart > li > div:first-of-type:not(:only-of-type):after,
    ol.organizational-chart > li > div:last-of-type:not(:only-of-type):after {
        bottom: -1em;
        height: 3px;
        width: calc(50% + 1em + 3px);
    }

    ol.organizational-chart > li > div:first-of-type:not(:only-of-type):after {
        left: calc(50% + 3px);
    }

    ol.organizational-chart > li > div:last-of-type:not(:only-of-type):after {
        left: calc(-1em - 3px);
    }

    ol.organizational-chart > li > div + div:not(:last-of-type):after {
        height: 3px;
        left: -2em;
        width: calc(100% + 4em);
    }


    ol.organizational-chart > li > ol {
        display: flex;
        flex-wrap: nowrap;
    }

    ol.organizational-chart > li > ol:before,
    ol.organizational-chart > li > ol > li:before {
        height: 1em!important;
        left: 50%!important;
        top: 0!important;
        width: 3px!important;
    }

    ol.organizational-chart > li > ol:after {
        display: none;
    }

    ol.organizational-chart > li > ol > li {
        flex-grow: 1;
		width:30%;
    }

    ol.organizational-chart > li > ol > li:only-of-type {
        padding-top: 0;
    }

    ol.organizational-chart > li > ol > li:only-of-type:before,
    ol.organizational-chart > li > ol > li:only-of-type:after {
        display: none;
    }

    ol.organizational-chart > li > ol > li:first-of-type:not(:only-of-type):after,
    ol.organizational-chart > li > ol > li:last-of-type:not(:only-of-type):after {
        height: 3px;
        top: 0;
        width: 50%;
    }

    ol.organizational-chart > li > ol > li:first-of-type:not(:only-of-type):after {
        left: 50%;
    }

    ol.organizational-chart > li > ol > li:last-of-type:not(:only-of-type):after {
        left: 0;
    }

    ol.organizational-chart > li > ol > li + li:not(:last-of-type):after {
        height: 3px;
        left: 0;
        top: 0;
        width: 100%;
    }

}

.subchart_height{height:170px;}
.subchart_height img{margin-top:5px;}
/* Organogram */
.prepost_bg{
	background:#e43e42;
	font-size:24px;
	text-align:center;
	margin:0;
	padding:12px;
	text-transform:uppercase;
}
.prepost_bg.card h3{font-size:20px;color:#ffc477!important;font-weight:800;margin-bottom:10px;}
.prepost_bg p{font-size:14px;color:#fff!important;font-weight:400;line-height:20px;margin:0;}
.prepost_bg:hover{color:#fcff00!important;}
.prepost_bg img{margin-top:-5px;}
.industrial_asso img{box-shadow: 0px 15px 10px -15px #111;}
.member_img{display: inline-block;}
.member_img img{width:80px;height:80px;border:1px solid #555;margin:0 auto 5px 0;border-radius:5px;}.acredition img{border:1px solid #065d7d;padding:5px;background:#fff;border-radius:5px;}
.job_achievement h5{ background:#e43e42;padding:10px;font-size:18px;font-weight:600;color:#fff;text-align:center;}
.job_achievement h6{ font-size:16px;font-weight:600;color:#e43e42;text-align:center;PADDING:0;margin:0;}
.job_achievement .card-body p{padding:0 12px 12px 12px;}
.photo-img img{border:1px solid #0000002e;padding:5px;background:#fff;}
.assignment_tbl thead th{background:#e43e42;color:#fff;}
.assignment_tbl.table>:not(:first-child) {border-top: 0;}

.certificates h4{background:#0156ad;padding:6px;font-size:14px;color:#fff;text-align:center;line-height:20px;height:50px;}
.whitebox.certificates img {
    margin-bottom: 5px;
}


.img-wrap {
	 margin: 0 auto;
	 display: table;
	 margin-top: 2%;
}
 .img-wrap img {
	 width: 600px;
	 height: auto;
	 transition: transform 0.5s;
}
 .img-wrap :hover {
	 -ms-transform: scale(2);
	/* IE 9 */
	 -webkit-transform: scale(2);
	/* Safari 3-8 */
	 transform: scale(2);
}
 


 .img-wrap2 img {
	 transition: transform 0.5s;
}
 .img-wrap2 :hover {
	 -ms-transform: scale(1.3);
	/* IE 9 */
	 -webkit-transform: scale(1.3);
	/* Safari 3-8 */
	 transform: scale(1.3);
}
 

.modal .close{
	background:#e43e42;
	width: 35px;
    height: 35px;
    border:0;
    border-radius: 100%;
    font-size: 30px;
    color: #fff;
    line-height: 17px;
    position: absolute;
    top: -15px;
    right: -12px;
}
.modal .close:hover{background:#0156ad;}
table {width:100%;border: 1px solid #00000026;}

table th, table td{padding:10px;font-weight:500;}
table tr{border-bottom: 1px solid #fff;}
table tbody tr td:first-child {background:#4471c4;color:#fff;}
table>:not(:first-child) {border-top: 0;}
table thead tr{background:#4471c4!important;}
table thead tr th{color:#fff!important;}
table tr:nth-child(odd) {background:#b4c6e7;color:#000!important;}
table tr:nth-child(even) {background:#d9e2f3;color:#000!important;}



img {max-width: 100%;height: auto;} 
.induction_tbl table tr td:first-child {
    background:transparent;
    color: #000;
	font-size:15px;
	font-weight:600;
}
.induction_tbl h3 {font-size:17px;color: #000;margin:0;}
.induction_tbl h3:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f192";
    font-size: 13px;
    padding:0 4px 0 0;
}
.induction_tbl h4{font-size:15px;font-weight:400;color: #000;margin:0 0 0 15px;}
.induction_tbl h5{font-size:16px;margin:0;}
.induction_tbl table tr td {padding: 15px;}
.induction_tbl table{border:1px solid #0156ad;}
.induction_tbl table tr:nth-child(1) h3, .induction_tbl table tr:nth-child(1) h5{color:#0156ad;}
.induction_tbl table tr:nth-child(2) h3, .induction_tbl table tr:nth-child(2) h5{color:#566e20;}
.induction_tbl table tr:nth-child(3) h3, .induction_tbl table tr:nth-child(3) h5{color:#0070c0;}
.induction_tbl table tr:nth-child(4) h3, .induction_tbl table tr:nth-child(4) h5{color:#c00000;}
.induction_tbl table tr:nth-child(5) h3, .induction_tbl table tr:nth-child(5) h5{color:#566e20;}
.induction_tbl table tr:nth-child(6) h3, .induction_tbl table tr:nth-child(6) h5{color:#0070c0;}
.induction_tbl table tr:nth-child(7) h3, .induction_tbl table tr:nth-child(7) h5{color:#c00000;}
.induction_tbl table tr:nth-child(8) h3, .induction_tbl table tr:nth-child(8) h5{color:#0156ad;}
.induction_tbl table tr {border-color: #bdcfe1;}
.induction_tbl .table-striped>tbody>tr:nth-of-type(odd)>* {
    --bs-table-accent-bg: rgb(230 237 239 / 98%);
}
.induction_tbl .table-hover>tbody>tr:hover>* {
    --bs-table-accent-bg: rgb(255 255 255);
}
.induction_tbl table tr td:last-child {text-align:right;}
/* timeline */
.timeline {
list-style: none;
padding: 0;
margin: 0;
}
.timeline li {margin-top:4px;margin-bottom:4px;}

.timeline li:nth-child(odd) {background: rgb(231 245 234);padding:15px;}
.timeline li:nth-child(even) {background: rgb(224 242 243);padding:15px;}
.timeline li:nth-child(odd):hover, .timeline li:nth-child(even):hover {background:#fff;}



.step {
display: flex;
align-items: flex-start;
margin-left: var(--indent);
color: var(--color);
}
.bullet {
margin-right:5px;
flex-shrink: 0;
}

.bullet:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f192";
    font-size: 13px;
    padding:0 4px 0 0;
	color: currentColor;
}


.step-content {
flex: 1;
}

.title {
font-weight: bold;
}

.timeline li:nth-child(1) .step-content .year{margin-right:240px;}
.timeline li:nth-child(2) .step-content .year{margin-right:210px;}
.timeline li:nth-child(3) .step-content .year{margin-right:180px;}
.timeline li:nth-child(4) .step-content .year{margin-right:150px;}
.timeline li:nth-child(5) .step-content .year{margin-right:120px;}
.timeline li:nth-child(6) .step-content .year{margin-right:90px;}
.timeline li:nth-child(7) .step-content .year{margin-right:60px;}
.timeline li:nth-child(8) .step-content .year{margin-right:30px;}
.step .year {
font-weight: normal;
white-space: nowrap;
float:right;
 font-size: 16px;    font-weight: 500;
}
.subtitle {
 font-size: 14px;
 color: #555;
 font-weight: 500;
}
/* Custom variables for indentation and color */
.step-1 { --indent: 0%;  --color: #e53935; }
.step-2 { --indent: 4%;  --color: #fb8c00; }
.step-3 { --indent: 8%; --color: #8e24aa; }
.step-4 { --indent: 12%; --color: #1e88e5; }
.step-5 { --indent: 16%; --color: #43a047; }
.step-6 { --indent: 18%; --color: #00acc1; }
.step-7 { --indent: 22%; --color: #d81b60; }
.step-8 { --indent: 26%; --color: #5d4037; }				  
.step-content .title {
    background: transparent;
    color: inherit;
    font-size: 18px;
    margin: 0;
    padding: 0;
	    float: left;
}
.timeline-container{ background: #fff;border:1px solid #0156ad;border-radius:15px;padding:6px 10px;}
/* timeline */
b, strong {
    font-weight: 600;
}

.bluebox2 {
    background: #fff;
    border:1px solid #0156ad;
    padding: 20px;
	box-shadow:0 0 12px #aaa;
	border-radius:8px;
	
}.services .card ul{margin-top:10px;margin-bottom:20px;}
.modal-heading {
    font-size: 30px;
    font-weight: 500;
    color: #e43e42;
    text-align: center;
	margin:0;
	padding:0;
}
#yearDetailModal .modal-header {border-bottom:0;}
#yearDetailModal .modal-body {padding:20px;color:#fff;}
#yearDetailModalBody .card {
	background-image: linear-gradient(to bottom, #3196fd, #0156ad);
	padding:20px;
	text-align:center;
	    margin: 40px 15px 5px 15px;
}


.block_arrow .arrow {
  border: 2px solid #111;
  background-image: linear-gradient(to right, #b3d3ec, #fcf3d4);
	font-size:22px;color:#b31f23;font-weight:600;
  margin: 0 0 0 50px;
  padding: 20px;
  text-align: center;

}

.block_arrow .arrow_left {position: relative;}
.block_arrow .arrow_left:after, .block_arrow .arrow_left:before {
  border: solid transparent;
  content: " ";
  display: block;
  height: 0;
  position: absolute;
  pointer-events: none;
  width: 0;
  right: 100%;
}
.block_arrow .arrow_left:after {
  border-color: rgba(255, 255, 255, 0);
  border-right-color: #b3d3ec;
  top: 50%;
  margin-top: -47px;
  border-width: 47px;
}
.block_arrow .arrow_left:before {
  border-color: rgba(255, 255, 255, 0);
  border-right-color: #111;
  top: 50%;
  margin-top: -50px;
  border-width: 50px;
}
.block_arrow .arrow_box1{background:#b3d3ec;padding:10px;font-size:16px;color:#000;text-align:center;border:1px solid #457093;border-radius:5px;}
.block_arrow .arrow_box1 strong{background:#012060;padding:6px;font-size:16px;color:#fff;text-align:center;display: block;}
.block_arrow .arrow_box2{background:#b3d3ec;padding:10px;font-size:16px;color:#000;text-align:center;border:1px solid #457093;border-radius:5px;}
.block_arrow .arrow_box2 strong{background:#e2f0d9;padding:6px;font-size:16px;color:#000;text-align:center;display: block;}
.block_arrow .arrow_box3{background-image: linear-gradient(to bottom, #fcf3d4, #b3d3ec, #fcf3d4);padding:20px 12px;font-size:20px;color:#b31f23;font-weight:600;text-align:center;border:2px solid #111;display: flex;flex-direction: column;align-items: center;justify-content: center;border-radius:5px;}
#JourneyModal .modal-content {background-color: transparent;border: 0;}
#JourneyModal .modal-body {padding: 0;}
/*photos gallery start*/
.post-box:hover .photo-img img {
  transform: scale(1.1);
}

.photo-item {
  position: relative;
}

.paper {
  background: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  margin: 0 0 20px 0;
  padding: 12px 12px 5px 12px;
  position: relative;
  width: 100%;
  color: #000;
}

.paper:before,
.paper:after {
  content: "";
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: -1;
}

.paper:before {
  background: #D7B474;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  left: -5px;
  top: 4px;
  transform: rotate(-2.5deg);
}

.photo-img {
  overflow: hidden;
  min-height: 57px;
  display: block;
  cursor: pointer;
  border-radius: 0;
}

.photo-img img {
  transform: scale(1);
  transition: 0.5s ease-in-out;
  width: 100%;
  border-radius: 8px;
  border: 1px solid #dadada;
}

.photo-date {
  color: #fff;
  position: absolute;
  z-index: 99;
  bottom: 0;
  width: 100%;
  height: 100%;
  /*background: linear-gradient(rgba(0,0,0,0) 60%,rgba(0,0,0,.65) 100%);*/
  display: flex;
  transform: scale(0.5);
  opacity: 0;
  transition: 300ms ease all;
  transition-delay: 0;
}

.photo-icon {
  position: absolute;
  width: 60px;
  height: 60px;
  top: 42%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(0, 0, 0, 0.7019607843);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 600;
  text-align: center;
  border-radius: 50%;
}

.photo-icon i {
  line-height: 60px;
  font-size: 25px !important;
  color: #fff !important;
}

.post-box:hover .photo-date {
  transform: scale(1) rotate(0);
  opacity: 1;
  transition-delay: 300ms;
}

.view_title {
  font-size: 13px;
  font-weight: 500;
  color: #222;
  text-align: center;
  margin: 3px 0 0 0;
  background: #fff;
  padding: 6px 4px;
  border-radius: 6px;
  border: 1px solid #dfc560;
}

/*photos gallery end*/