/* Start CSS Reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
/* End CSS Reset */
/*

* {
	outline: 1px solid red;
}
*/
/* Start Core CSS */
html {
	scroll-behavior: smooth;
}
:root {
	--lite: #e5e1e1;
	--liter: #f5f1f1;
	--dark: #333;
	--darkish: #555;
	--lite_g: #8dcd3f;
	--dark_g: #099e51;
	--lite_y: #f3ef49;
	--dark_y: #ccb030;
	--red: #e01a21;
	--red7: #e01a2170;
    --yellow: #fdbf16;
	--grad_bg: linear-gradient(to right top, #000000, #242424, #424242, #646464, #878787);
}
body {
	font-family: Arial, sans-serif;
	font-family: Helvetica, sans-serif;
	font-family: "Lato", sans-serif;
	color: #777;
	background: #fff;
	overflow-x: hidden;
}
.cont_wrap p {
    background-position: left center;
}
.cont_wrap p.address {
}
.wrapper {
	margin: 0 auto;
	width: 1200px;
	/* box-shadow: 0 5px 20px 5px #0002; */
}
#menu {
    min-height: 39px;
    background: #555c;
    z-index: 9999;
    width: inherit;
    width: 100%;
    position: fixed;
    text-align: right;
}
#menu a {
    text-decoration: none;
    color: #fff;
    text-shadow: 1px 1px 2px #000;
    display: inline-block;
    padding: 10px 20px;
    font-size: 14px;
    border-right: solid 1px var(--darkish);
}
#menu a:hover {
    color: var(--lite_y);
}
#menu a:last-child {
    border-right: none;
}
#menu a.contact {
	background: #4caf50;
	padding: 5px 20px;
	margin-left: 15px;
    border-radius: 2px;
	color: #fff;
}
#menu a.contact:hover {
	background: #68dc6c;
}
#menu img {
    display: inline-block;
    padding: 2px 4px;
    width: 55px;
}
.inner {
    color: #fff;
    text-shadow: 1px 1px 2px #000;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);    
    /* unnecessary styling properties */
    max-width: 50%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.inner div {
    display: inline-block;
    width: 90%;
}
.inner h1 {
    margin-bottom: 15px;
	font-size: 30px;
	font-weight: 400;
    color: var(--yellow);
}
h2 {
    border-top: 1px solid var(--red7);
    color: var(--darkish);
    color: var(--red);
    position: relative;
    top: 10px;
    margin: 15px 0 15px;
}
.dark h2 {
    border-top: 1px solid #fff7;
}
.dark h2 span {
	background: var(--red);
}
h2 span {
    text-decoration: none;
    font-size: 20px;
    text-align: center;
    padding: 2px 15px;
    border: 1px solid var(--red);
    border-radius: 30px;
    padding: 5px 18px !important;
    background: #fff !important;
    width: unset;
    margin: 0 auto;
    display: inline-block;
    position: relative;
    top: -19px;	
    left: 41%;
    font-weight: 100;
}
.inner p {
	font-size: 17px;
    color: var(--lite_g);
}
.inner img {
    display: inline-block;
    padding: 2px 4px;
    width: 70%;
    /* filter: drop-shadow(1px 1px 1px #fff7); */
    margin-bottom: 15px;
}
.triangle {
	position: relative;
    margin-top: -26px;
}
.mySlides.fade img {
	width:100%;
}
.slideshow-container {
	background:#000;
    position: relative;
}
.prev, .next {
    color: var(--lite_y);
}
.dot {
	background-color: var(--dark_g);
}
.active {
	background-color: var(--lite_y);
}
.row {
    padding: 30px 40px 40px;
	min-height: 170px;
}
.container.lite, .row.lite {
    background: #fff;
    background-size: cover;
	background-image: url('/weare30/images/bg2.jpg');
	color: var(--dark);
}
.container.dark, .row.dark {
    background: var(--red);
	color: var(--lite);
}
.row h1 {
	font-size: 48px;
    margin-bottom: 15px;
	font-size: 54px; font-weight: 300; line-height: 58px; margin: 0 0 58px;
}
.row h1::first-letter  {
	border-bottom: 5px solid var(--lite_g);
}
.lite p {
    color: var(--darkish);
}
.dark p {
    color: var(--lite);
}
.dark h1 {
    color: #fff;
}
.col {
    display: inline-flex;
    flex-direction: column;
    width: 48%;
}
.col.left {
	margin-right: 4%;
}
.btn {
    text-decoration: none;
    display: inline-block;
    border: 1px solid var(--lite_g);
    border-radius: 2px;
    color: var(--lite_g);
    padding: 1px 8px 2px;
    margin: 1px;
    font-size: 14px;
    font-weight: 400;
}
.btn:hover {
    background: var(--lite_g);
    color: #fff;
}
.event {
    display: inline-block;
    border: 1px solid lightgrey;
    border-left: 5px solid var(--yellow);
    border-radius: 5px;
    padding: 15px 10px;
    margin: 5px 2px;
    background: #fff;
    width: 47%;
	text-align: center;
}
.e_contain {
    display: flex;
    align-items: center;
    min-height: 75px;
}
.event p, .event h3 {
	color: var(--darkish);
}
.event h3 {
    font-weight: 600;
    font-size: 17px;
}
.e_date h3 {
	padding: 3px 0;
    color: var(--yellow);
}
.e_info h3 {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 3px;
    color: var(--red);
}
.event p {
    font-size: 13px;
}
.e_date {
    display: inline-block;
    width: 18%;
    border-right: 1px solid lightgrey;
	padding: 0 1% 0;
}
.e_info {
    display: inline-block;
    width: 53%;
    text-align: left;
    border-right: 1px solid lightgrey;
	padding: 0 1% 0;
}
.e_venue {
    display: inline-block;
    width: 23%;
	padding: 0 1% 0;
}
.c_contain {
    text-align: center;
}
.card {
    display: inline-block;
    margin: 0 10px 15px;
    width: 190px;
    text-align: center;
    font-size: 13px;
	position: relative;
	z-index: 10000;
}
.card .pic {
    width: 100%;
}
/*.dload {
	display: inline-block;
    background: var(--lite_g);
    margin: 0 auto 5px;
    padding: 5px 10px;
    border-radius: 5px;
    color: #fff !important;
    width: 78%;
	text-decoration: none;
}

 CSS */
.dload {
    align-items: center;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.25rem;
    box-shadow: rgb(0 0 0 / 2%) 0 1px 3px 0;
    box-sizing: border-box;
    color: rgba(0, 0, 0, 0.85);
    cursor: pointer;
    display: inline-flex;
    font-family: system-ui,-apple-system,system-ui,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 13px;
    font-weight: 600;
    justify-content: center;
    line-height: 1.25;
    margin: 10px auto 7px;
    padding: 5px 43px;
    position: relative;
    text-decoration: none;
    transition: all 250ms;
    -webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: baseline;
    width: 96%;
}
.dload:hover,
.dload:focus {
  border-color: rgba(0, 0, 0, 0.15);
  box-shadow: rgba(0, 0, 0, 0.1) 0 4px 12px;
  color: rgba(0, 0, 0, 0.65);
}
.dload:hover {
  transform: translateY(-3px);
}
.dload:active {
  background-color: #F0F0F1;
  border-color: rgba(0, 0, 0, 0.15);
  box-shadow: rgba(0, 0, 0, 0.06) 0 2px 4px;
  color: rgba(0, 0, 0, 0.65);
  transform: translateY(0);
}
.title {
    font-weight: 500;
    padding: 0px 4px 0px;
    background: #fff;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--red) !important;
}
.bio {
    padding: 4px 4px 8px;
    min-height: 76px;
}
.cont_wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--lite_g);
	background-image: var(--grad_bg);
}
.cont_wrap .col.left {
    margin: 0 2%;
    padding: 30px 15px;
}
.cont_wrap p {
    color: #fff;
    margin-bottom: 3px;
    padding: 4px 1px 4px 44px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 24px 24px;
}
.cont_wrap p.address {
	background-image: url('/weare30/images/pin.png');
}
.cont_wrap p.tel {
	background-image: url('/weare30/images/tel.png');
}
.cont_wrap p.email {
	background-image: url('/weare30/images/mail.png');
}
.cont_wrap p a {
    color: #fff;
    text-decoration: none;
}
.cont_wrap p a:hover {
    color: var(--dark_g);
}
#social {
	height: 40px;
    margin: 20px 0 5px;
    text-align: center;
}
#social a {
	padding-right: 12px;
}
#social img {
	height: 30px;
	filter: grayscale(90%);
}
#social img:hover {
	filter: none;
}
.col form *{
    width: 99%;
    margin: 1px auto 2px;
    font-size: 14px;
	border: none;
    text-shadow: 1px 1px 2px #000;
}
.col form {
    /* background: var(--dark); */
    padding: 25px 30px;
	background-image: url('/weare30/images/contact_bg.jpg');
	background-size:cover;
}
form label {
    color: var(--dark);
    display: block;
    padding: 10px 0 2px;
    font-weight: 600;
	display:none;
}
input[type="text"], input[type="email"], textarea {
    padding: 6px 4px;
    background: #0003;
    margin: 8px 0 !important;
	color: #fff;
}
input:focus, textarea:focus {
    /* border: 1px solid #8bc34a; */
    box-shadow: 0 0 5px #000;
    outline-offset: 0;
    outline: none;
}
textarea {
	height: 90px;
}
::-webkit-input-placeholder { /* Edge */
	color: #fff;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #fff;
}
::placeholder {
	color: #fff;
}
input[type="submit"], input[type="reset"] {
    background: #23ab63;
    background: var(--lite_g);
    width: 150px;
    padding: 6px 4px;
    color: #fff;
    margin: -1px 0px 0px -1px;
	cursor: pointer;	
    text-shadow: none;
}
input[type="submit"]:hover {
    background: #0ebc61;
    background: #7cb536;
}
input[type="reset"] {
    background: #e5ad4e;
}
input[type="reset"]:hover  {
    background: #f1b755;
}
footer {
    background: var(--dark);
    padding: 15px 0;
    text-align: center;
    font-size: 10px;
    color: #fff;
    margin-bottom: 20px;
	background-image: var(--grad_bg);
}
@media only screen and (max-width: 1096px) {
	.wrapper {
		width: 720px;
	}
	.inner {
		max-width: unset;
		width: 65%;
	}
	.inner h1 {
		margin : 15px 5px;
		font-size: 28px;
	}
	h2 span {
		font-size: 17px;
		top: -17px;
	}
	/* .inner img, .dots {
		width: 70px;
		    margin-bottom: 0px;
	} */
	.inner img {
		width: 60%;
		margin-bottom: 0px;
	}
	.row {
		padding: 20px 40px 20px;
	}
	.row h1 {
		font-size: 35px;
		margin-bottom: 10px;
	}
	.col form {
		padding: 15px 8px;
	}
	.event {
		width: 96%;
	}
	.timeline-content-txt {
		padding: 8px 8px 0 !important;
	}
	footer {
		margin: 0 0 20px;
	}
}
@media only screen and (max-width: 800px) {
	.wrapper {
		width: 480px;
	}
	#container {
		min-height: 420px;
	}
	#menu {
		padding: 5px 0;
		text-align: center;
	}
	#menu img {
		display: block;
		margin: 0 auto;
	}
	#menu a {
		padding: 10px 15px;
	}
	.inner {
		width: 90%;
	}
	.inner h1 {
		margin : 5px 5px;
		font-size: 19px;
	}
	.inner img {
		width: 50%;
		margin-bottom: 5px;
	}
	.row {
		padding: 20px 50px 20px;
	}
	.row h1 {
		font-size: 30px;
		margin-bottom: 10px;
	}
	.col {
		width: 100%;
	}
	.col.left {
		margin-right: 0;
	}
	.columnx {width: 50% !important;}
	h2 span {
		left: 24%;
	}
	.cont_wrap {
		display: block;
	}
	.cont_wrap .col.left {
		margin: unset;
	}
	.card {
		width: 49%;
	}	
	footer {
		margin: 0 0 20px;		
	}
}
@media only screen and (max-width: 480px) {
	.wrapper {
		width: 100%;
	}
	#menu a {
		padding: 10px 10px;
	}
}
@keyframes firework {
  0% { transform: translate(var(--x), var(--initialY)); width: var(--initialSize); opacity: 1; }
  50% { width: 0.5vmin; opacity: 1; }
  100% { width: var(--finalSize); opacity: 0; }
}

/* @keyframes fireworkPseudo {
  0% { transform: translate(-50%, -50%); width: var(--initialSize); opacity: 1; }
  50% { width: 0.5vmin; opacity: 1; }
  100% { width: var(--finalSize); opacity: 0; }
}
 */
.firework,
.firework::before,
.firework::after
{
  --initialSize: 0.5vmin;
  --finalSize: 45vmin;
  --particleSize: 0.2vmin;
  --color1: yellow;
  --color2: khaki;
  --color3: white;
  --color4: lime;
  --color5: gold;
  --color6: mediumseagreen;
  --y: -30vmin;
  --x: -50%;
  --initialY: 60vmin;
  content: "";
  animation: firework 2s infinite;
  position: fixed;
  z-index: 9999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, var(--y));
  width: var(--initialSize);
  aspect-ratio: 1;
  background: 
    /*
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 0% 0%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 100% 0%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 100% 100%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 0% 100%,
    */
    
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 50% 0%,
    radial-gradient(circle, var(--color2) var(--particleSize), #0000 0) 100% 50%,
    radial-gradient(circle, var(--color3) var(--particleSize), #0000 0) 50% 100%,
    radial-gradient(circle, var(--color4) var(--particleSize), #0000 0) 0% 50%,
    
    /* bottom right */
    radial-gradient(circle, var(--color5) var(--particleSize), #0000 0) 80% 90%,
    radial-gradient(circle, var(--color6) var(--particleSize), #0000 0) 95% 90%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 90% 70%,
    radial-gradient(circle, var(--color2) var(--particleSize), #0000 0) 100% 60%,
    radial-gradient(circle, var(--color3) var(--particleSize), #0000 0) 55% 80%,
    radial-gradient(circle, var(--color4) var(--particleSize), #0000 0) 70% 77%,
    
    /* bottom left */
    radial-gradient(circle, var(--color5) var(--particleSize), #0000 0) 22% 90%,
    radial-gradient(circle, var(--color6) var(--particleSize), #0000 0) 45% 90%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 33% 70%,
    radial-gradient(circle, var(--color2) var(--particleSize), #0000 0) 10% 60%,
    radial-gradient(circle, var(--color3) var(--particleSize), #0000 0) 31% 80%,
    radial-gradient(circle, var(--color4) var(--particleSize), #0000 0) 28% 77%,
    radial-gradient(circle, var(--color5) var(--particleSize), #0000 0) 13% 72%,
    
    /* top left */
    radial-gradient(circle, var(--color6) var(--particleSize), #0000 0) 80% 10%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 95% 14%,
    radial-gradient(circle, var(--color2) var(--particleSize), #0000 0) 90% 23%,
    radial-gradient(circle, var(--color3) var(--particleSize), #0000 0) 100% 43%,
    radial-gradient(circle, var(--color4) var(--particleSize), #0000 0) 85% 27%,
    radial-gradient(circle, var(--color5) var(--particleSize), #0000 0) 77% 37%,
    radial-gradient(circle, var(--color6) var(--particleSize), #0000 0) 60% 7%,
    
    /* top right */
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 22% 14%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 45% 20%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 33% 34%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 10% 29%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 31% 37%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 28% 7%,
    radial-gradient(circle, var(--color1) var(--particleSize), #0000 0) 13% 42%
    ;
  background-size: var(--initialSize) var(--initialSize);
  background-repeat: no-repeat;
}

.firework::before {
  --x: -50%;
  --y: -50%;
  --initialY: -50%;
/*   transform: translate(-20vmin, -2vmin) rotate(40deg) scale(1.3) rotateY(40deg); */
  transform: translate(-50%, -50%) rotate(40deg) scale(1.3) rotateY(40deg);
/*   animation: fireworkPseudo 2s infinite; */
}

.firework::after {
  --x: -50%;
  --y: -50%;
  --initialY: -50%;
/*   transform: translate(44vmin, -50%) rotate(170deg) scale(1.15) rotateY(-30deg); */
  transform: translate(-50%, -50%) rotate(170deg) scale(1.15) rotateY(-30deg);
/*   animation: fireworkPseudo 2s infinite; */
}

.firework:nth-child(2) {
  --x: 30vmin;
}

.firework:nth-child(2),
.firework:nth-child(2)::before,
.firework:nth-child(2)::after {
  --color1: pink;
  --color2: violet;
  --color3: fuchsia;
  --color4: orchid;
  --color5: plum;
  --color6: lavender;  
  --finalSize: 40vmin;
  left: 30%;
  top: 43%;
  animation-delay: -0.25s;
}

.firework:nth-child(3) {
  --x: -30vmin;
  --y: -50vmin;
}

.firework:nth-child(3),
.firework:nth-child(3)::before,
.firework:nth-child(3)::after {
  --color1: cyan;
  --color2: lightcyan;
  --color3: lightblue;
  --color4: PaleTurquoise;
  --color5: SkyBlue;
  --color6: lavender;
  --finalSize: 35vmin;
  left: 70%;
  top: 60%;
  animation-delay: -0.4s;
}
/*		iFrame Video	*/
#video {
    display: block;
    margin: 30px auto -30px;
}
/* Responsive image gallery rules begin*/
.rowx > .columnx {
  padding: 0px;
}
.rowx:after {
  content: "";
  display: table;
  clear: both;
}
.columnx {
  float: left;
  width: 12.5%;
}
/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 10001;
  padding-top: 80px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: #000000b8;
}
/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 850px;
}
/* The Close Button */
.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}
.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}
.mySlidesx {
  display: none;
}
.cursor {
  cursor: pointer;
}
/* Number text (1/3 etc) */
.numbertext {
	color: #f2f2f2;
	font-size: 16px;
	text-shadow: 1px 1px 2px #000;
	padding: 12px 12px;
	position: absolute;
	top: 0;
}
.columnx img {
	margin-bottom: -4px;
	-webkit-filter: grayscale(90%); /* Safari 6.0 - 9.0 */
	filter: grayscale(90%);
	z-index: 9999;
	position: relative;
}
.columnx img:hover {
  -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
  filter: grayscale(0%);
}
.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;
}
.demo {
  opacity: 0.6;
}
.activex,
.demo:hover {
  opacity: 1;
}
img.hover-shadow {
  transition: 0.3s;
}
.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
@media only screen and (min-width: 768px) {
	.image-gallery {
		flex-direction: row;
	}

}
@media only screen and (max-width: 480px) {
	.firework:nth-child(2),
	.firework:nth-child(2)::before,
	.firework:nth-child(2)::after {
	  top: 20%;
	}
}
@media only screen and (max-width: 800px) {
	.firework:nth-child(2),
	.firework:nth-child(2)::before,
	.firework:nth-child(2)::after {
	  top: 29%;
	}
}
/* overlay styles */
.image-item {
	position: relative;
	cursor: pointer;
}
.overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(57, 57, 57, 0.502);
	top: 0;
	left: 0;
	transform: scale(0);
	transition: all 0.2s 0.1s ease-in-out;
	color: #fff;
	/* center overlay content */
	display: flex;
	align-items: center;
	justify-content: center;
}
/* hover */
.image-item:hover .overlay {
	transform: scale(1);
}
.wrapper2 {
    margin: 0 auto;
    width: 100%;
}
.inner-wrapper-padding {
    padding: 0;
	margin: 0;
}
.about-timeline{background-color:unset; padding: 5px 25px 5px 45px;}
/* .about-timeline:active {cursor: url('/weare30/images/closed.png'), grab !important;} */
.about-timeline img{width: 200px;margin-bottom: 5px;}
.timeline-box h6{font-size: 18px; line-height: 1; color: #d21e1e; font-weight: 100; font-family: 'Poppins', sans-serif;background-color: #fff;border: 1px solid #a9a9a9;border-radius: 30px;padding: 5px 20px;position: relative; z-index: 1; display: inline-block; width: auto;margin-top: 0; transform: translate(0,-50%);} 
.timeline-box p{font-size: 13px; line-height: 18px; color: var(--darkish); font-weight: 400;margin: 0 0 5px !important;font-family: 'Inter', sans-serif;} 
.timeline-box p:last-of-type{margin-bottom:15px;}
.timeline-box p strong {
    display: block;
    font-size: 13px;
    margin-bottom: 5px;
}

/* Read More */
.read-more-state {
	display: none;
}
.read-more-target {
	opacity: 0;
	max-height: 0;
	font-size: 0;
	transition: .75s ease !important;
}
.read-more-state:checked ~ .read-more-wrap .read-more-target {
	opacity: 1;
	font-size: inherit;
	max-height: 999em;
}
.read-more-state ~ .read-more-trigger:before {
	content: 'Show more';
}
.read-more-state:checked ~ .read-more-trigger:before {
	content: 'Show less';
}
.read-more-trigger {
    cursor: pointer;
    display: inline-block;
    padding: 0 20px;
    color: #666;
    font-size: 18px;
    line-height: 2;
    border: 1px solid #ddd;
    border-radius: 0.25em;
    background: #fff;
    position: relative;
    left: 43%;
    top: -10px;
    z-index: 10001;
}
.start-point h4{font-size: 15px; line-height: 23px; color: #ffffff; font-weight: 400;text-transform: uppercase;background-color: #d21e1e;border-radius: 16px;display: block; width: auto; text-align: center; padding: 5px 15px;position: relative;font-family: 'Inter',sans-serif;} 
.black-dot{width: 21px;height: 21px;background-color: #000;border-radius: 50%;display: block;margin: 0 auto 62px;z-index: 1;} 
.start-point{position: relative;display: flex; justify-content: center; flex-direction: column; align-items: center} 
.start-point:before{content:'';position: absolute;left: 0;height: 100%;width: 0px;background-color: #aaa;left: 50%;top: 0;transform: translate(-50%,0%);-webkit-transform: translate(-50%,0%);-moz-transform: translate(-50%,0%); border-left: 1px solid #aaa;} 
.timeline-row .horizontal-line {border-top: 1px solid #aaa; width: calc(100% - 150px); margin: 0 auto; position: absolute; top: 0; left: 50%; z-index: 0; transform: translate(-50%,0%); }
.timeline-row .verticle-line { margin: 0; padding: 0; width: 2px; border-right: 1px solid #aaa; height: calc(100% - 150px); position: absolute; top: 0; right: 0; margin: auto 0; bottom: 0; } 
.timeline-row:nth-child(2n+2) .verticle-line { left: -2px; right: inherit; } 
.corner { position: absolute; border-right: 1px solid #aaa; width: 76px; height: 76px; right: 0; border-top: 1px solid #aaa; top: 74.9px; border-radius: 0 70px 0 0;top: 0; } 
.timeline-row:nth-child(2n+2) .corner { right: inherit; left: 0; border-left: 1px solid #aaa; border-right: 0; border-radius: 70px 0 0 0; } .corner.bottom { bottom: -76px; top: inherit; border-radius: 0; border-top: 0; border-bottom: 1px solid #aaa; border-radius: 0 0 70px 0; right: 0;z-index: 1;bottom: -1px; } 
.timeline-row:nth-child(2n+2) .corner { right: inherit; left: 0; border-left: 1px solid #aaa; border-right: 0; border-radius: 70px 0 0 0; } 
.timeline-row:nth-child(2n+2) .corner.bottom { border-radius: 0 0 0 70px; } 
.timeline-row { display: flex; justify-content:space-around; flex-wrap: wrap; padding-bottom: 0px; position: relative;/*padding: 0 66px 130px;margin-right: 111px;*/ } 
.timeline-row:nth-child(2n+2) { justify-content: space-around;text-align: right; padding:  0 2%; } 
.timeline-row:nth-child(2n+2) { flex-direction: row-reverse; } 
/*.timeline-row:nth-child(2n+2) .timeline-content-txt { text-align: center; }*/
.timeline-box { /*padding: 45px 50px 130px;*/ max-width: 550px;position: relative;} 
.timeline-main{margin-top: 75px;} 
.timeline-row:first-child {margin: 0 0px 0 auto; max-width: 50%; justify-content: space-between; padding: 0; }
.corner.bl{bottom: 0;left: 0;border-left: 1px solid #aaa; border-bottom: 1px solid #aaa; border-radius: 0 0 0px 100%; border-right: none; border-top: none; height: 76px; width: 76px;} .start-point .corner.bl{left: 50%; bottom: 0px; transform: translateY(100%); top: unset;} 
.timeline-box:before{content: '';position: absolute;left: 0;top: 27.5px;height: 1px;width: 100%;} 
.timeline-box-wrap { padding: 45px 0px 0; position: relative; background: inherit; /*min-height: 318px;*/padding: 0;margin-bottom: 50px; } 
/*.timeline-row:after{content: ''; position: absolute; left: 50%; top: 74.5px; height: 1px; width: 91%; background-color: #aaa; transform: translateX(-50%);top: 0;} .timeline-row .verticle-line { margin: 0; padding: 0; width: 1px; border-right: 1px solid #aaa; height:calc(100% - 126px); position: absolute; top: calc( 50% + 75px );; right: 0; margin: auto 0; bottom: unset; transform: translateY(-50%);top: 50%; } */
.timeline-row:first-child::after {left: -54px;width: 97%; transform: none; } 
/*.timeline-row:first-child .timeline-box:last-child{margin-right: 5%;} */
.timeline-content { padding: 10px 10px 0; max-width: 200px; text-align: center;} 
.timeline-content-txt { padding: 0; } 
.timeline-box.img-right .timeline-content,.timeline-box.img-left .timeline-content{display: flex; align-items: flex-start;} 
.timeline-box.img-right .timeline-content img{margin-left: 18px;} 
.timeline-box.img-left .timeline-content img{margin-right: 18px;} 
.timeline-box.img-left .timeline-content{flex-direction: row-reverse;} 
.timeline-row:first-child .timeline-box:first-child img{filter: drop-shadow(0 0 27px rgba(0,0,0,0.16));-webkit-filter: drop-shadow(0 0 27px rgba(0,0,0,0.16));display: block;margin: 0;width: 140px;}
.timeline-row:first-child .timeline-box:first-child p{text-align:center;}
hr {
    width: 60px;
    border: none;
    border-bottom: 1px solid #d3d3d3;
}
.timeline-box-wrap .timeline-content img {filter: drop-shadow(0 0 27px rgba(0,0,0,0.16));-webkit-filter: drop-shadow(0 0 27px rgba(0,0,0,0.16));z-index: 2;position: relative;} 
.timeline-row:last-child .corner.bottom{display: none;} 
.timeline-row:nth-child(2n+1) .timeline-box:last-child .timeline-box-wrap{text-align: center;}
.start-point.end-point:before{display: none;}
.start-point.end-point{ position: absolute; bottom: 15%; right: 0%; transform: translateX(50%); }
.timeline-row:nth-child(2n+2) .start-point.end-point{left: 0;transform: translateX(-50%);right: unset;}
.timeline-box.img-right .timeline-content-txt {text-align: right;}
.timeline-box.img-left .timeline-content-txt {text-align: left;}
.timeline-box.img-left, .timeline-box.img-right {text-align: center;}
.timeline-row:first-child .timeline-box::after {left: auto; right: 0; -webkit-transform: translate(100%,-50%) rotate(0deg); transform: translate(100%,-50%) rotate(0deg);}
.timeline-row:first-child .timeline-box:first-child {width: 36%;}
.timeline-row .timeline-box:nth-child(3)::after {display: none;}
.timeline-row:last-child .verticle-line::after {display: none;}
.timeline-row:first-child .timeline-box:nth-child(2)::after {display: none;}
.timeline-content-img .timeline-content {position: relative;}
/*==============Responsive==============*/
@media screen and (max-width: 1800px) {
.timeline-box {max-width: 460px;}
  .timeline-box.img-right .timeline-content img, .timeline-box.img-left .timeline-content img {max-width: 220px; max-height: 230px;}
  .timeline-box-wrap .timeline-content img {max-width: 100%;}
}
@media screen and (max-width: 1600px){ 
  .timeline-row:first-child .timeline-box:first-child {width: 38%;}
  .timeline-box {max-width: 380px;}
  .timeline-box.img-right .timeline-content img, .timeline-box.img-left .timeline-content img {max-width: 180px; max-height: 190px;}
  /* .timeline-box p {font-size: 16px;} */
}
@media screen and (max-width: 1440px) {  
  .start-point h4 {font-size: 15px; letter-spacing: 0;}
  .timeline-row:first-child .timeline-box:first-child {width: 45%;}
  .timeline-box p {font-size: 15px; line-height: 1.2;}
  .timeline-box {max-width: 300px;}
  .timeline-box.img-right .timeline-content img, .timeline-box.img-left .timeline-content img {max-width: 140px; max-height: 200px;}
  .timeline-box-wrap .timeline-content img {max-width: 100%;}
  .timeline-row:first-child .timeline-box:nth-child(2) {width: 90px;}
}
@media screen and (max-width: 1199px) {
  .timeline-box {max-width: 240px;}
  .timeline-row:first-child {padding: 0 0 0 60px;}
  .timeline-row:first-child .timeline-box:first-child {width: 42%;}
  .timeline-box.img-right .timeline-content, .timeline-box.img-left .timeline-content {flex-wrap: wrap;}
  .timeline-box.img-right .timeline-content img, .timeline-box.img-left .timeline-content img {max-width: 180px; max-height: 200px;}
  .top-timeline-arrow.timeline-content-img .timeline-content::after {right: 0;}
  .img-right.timeline-content-img .timeline-content::after {top: -20px; right: -45px;}
  .timeline-box.img-right .timeline-content-txt {width: 90%;}
  .columnx {width: 16.6%;}
}
@media screen and (max-width: 1024px) {
	.about-timeline {
		max-height: unset;
		overflow: unset;
		cursor: unset !important;
		position: relative;
		z-index: 10001;
		transition: unset;
	}
	.corner {display: none;}
  .timeline-row .horizontal-line {display: none;}
  .timeline-row:first-child {max-width: 100%; padding: 0;}
  .timeline-main {margin-top: 0;}
  .timeline-row .verticle-line {right: 50%; transform: translate(50%,0); height: calc(100% - 0px);}
  .timeline-row:nth-child(2n+2) .verticle-line {left: auto; right: 50%;}
  .verticle-line::after {display: none;}  
  .timeline-row .timeline-box {width: 100%; max-width: 100%; margin: 0;}
  .timeline-row:first-child .timeline-box:first-child {width: 100%; margin: 0;}
  .timeline-row:first-child .timeline-box:nth-child(2) {width: 100%;}
  .timeline-box p br {display: none;}
  .timeline-box h6 {transform: translate(0,-0%);margin: 0 5px;}
  .timeline-content {padding: 0;}
  .timeline-box.img-right .timeline-content-txt {width: 100%;}
  .start-point.end-point {right: 50%;}
  .start-point h4 {margin-bottom: 0;}
  .timeline-box::after {-webkit-transform: translate(-100%,100%) rotate(180deg); transform: translate(-100%,100%) rotate(180deg); right: 50%; top: 20px; left: 50%;}
  .timeline-box-wrap {width: 50%; text-align: right; padding: 0 30px 0 0; margin: 40px 0 0 0;}
  .timeline-row .timeline-box img {margin: 6px 0px 0 6px;}
  .timeline-row:first-child .timeline-box:nth-child(2)::after {display: block;}
  .timeline-row:first-child .timeline-box:first-child img {margin: 0 0 0 auto;}
  .timeline-box.img-right .timeline-content img, .timeline-box.img-left .timeline-content img {margin: 0 0 0 auto;}
  .timeline-row .timeline-box:nth-child(2n) .timeline-box-wrap {margin: 40px 0 0 auto; padding: 0 0 0 30px; text-align: left;}
  .timeline-row:nth-child(2n+1) .timeline-box::after {left: auto; right: 50%; -webkit-transform: translate(0%,100%) rotate(180deg); transform: translate(0%,100%) rotate(180deg); top: 20px;}
  .timeline-row .timeline-box:nth-child(2n)::after {transform: translate(100%,100%) rotate(0deg); -webkit-transform: translate(100%,100%) rotate(0deg); right: 50%; left: auto;}
  .timeline-row .timeline-box:nth-child(3)::after {display: block;}
  .timeline-box.img-left .timeline-content-txt {text-align: right;}
  .timeline-row:last-child {padding-bottom: 70px;}
}
@media screen and (max-width: 640px) {
  .timeline-box p {font-size: 14px; line-height: 1.4;}
  .timeline-box-wrap {margin: 30px 0 0 0;}
  .timeline-row .timeline-box:nth-child(2n) .timeline-box-wrap {margin: 30px 0 0 auto;}
  .timeline-box::after, .timeline-row:nth-child(2n+1) .timeline-box::after {top: 6px;}
  .timeline-box-wrap .timeline-content img {max-width: 100%;}
  .timeline-box.img-right .timeline-content img, .timeline-box.img-left .timeline-content img {max-width: 100%; max-height: unset;}
}