.package-design {font-family: Raleway;}
.package-design .page-top {margin: 0; }
.package-design .page-top .main-content {width: 750px; padding: 0;}
.package-design .main-content {text-align: center; width: 750px; padding:  0 0 20px 0;}
.package-design .main-page-title {margin: 50px 0 0 0; width: 100%; text-align: left; font-size: 50px;}
.package-design .main-page-title span {display: block; font-weight: 200; font-style: italic; font-size: 35px; margin: 80px 0 0 0;}

.package-design .page-subtitle {font-weight: 200; font-size: 20px; text-transform: lowercase; text-align: left; line-height: 1;  }
.package-design .page-subtitle span {display: inline-block; float: left; margin: 0 5px 0 0; }
.package-design .page-subtitle img {width: 150px; display: inline-block; margin: -8px 0 0 0;}
.package-design .section-title {font-size: 30px; line-height: 1; margin: 50px 0 10px 0; padding: 20px 0; color: var(--primary-color); text-transform: capitalize; font-weight: 700; text-align: center; display: inline-table; width: 100%;}
.package-design #s3 .section-title {text-align: left;}
#s1 .button, #s2 .button, #s3 .button, #s4 .button, #s5 .button {margin: 40px 0 40px 0; }
#s2 .left-column {width: 50%; float: left;}
#s2 .right-column {width: 50%; float: right;}

ul.two-columns {display: flex; gap: 20px; list-style: none; margin: 5% 0 0 0; }
ul.two-columns li {flex: 1; text-align: left;}
ul.two-columns li img {width: 90%; height: auto;}
ul.two-columns li:nth-of-type(2) {padding: 5% 0 0 0; }

.section-gysfttfs {width: 100%; float: left; color: white; background-image: url(../images/package-design/business-meeting.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; background-color: var(--tertiary-color); margin-bottom: 50px; padding: 10px 0 0 0; }
.section-gysfttfs .section-title {color: white;}
.section-gysfttfs .button {background-color: white; color: var(--primary-color) !important; margin: 50px 0 0 0;}
.section-gysfttfs .button:hover {	background-color: var(--primary-color); color: white !important; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; -o-transition: all 1s ease-out; transition: all 1s ease-out;}
.package-example {width: 400px; height: auto; margin: 8% auto;}

.columns-zxcv li {display: inline-table; position: relative; width: 180px; list-style: none; line-height: 1; margin: 0 0 40px 0;}
.columns-zxcv li b {margin: auto; color: var(--primary-color); font-weight: 800; font-size: 18px; text-transform: uppercase; display: flex; text-align: center; width: 65%;}
.columns-zxcv li img {width: 160px; height: auto; margin: 20px 0 0 0;}

.lqnp {background: var(--secondary-color-gradient); color: var(--primary-color);}

.package-design .two-columns div {width: 100%;}
#s3 ul.two-columns li img {width: 100%;}
.image-rotator { position: relative; width: 100%;  height: 330px; overflow: hidden; margin: 50px 0 0 0;}
.image-rotator img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0;  animation: rotateImages 12s infinite ease-in-out; }

.image-rotator img:nth-child(2) {  animation-delay: 4s;}

.image-rotator img:nth-child(3) { animation-delay: 8s;}

@keyframes rotateImages {
  0% {
	opacity: 0;
  }
  5% {
	opacity: 1; /* Fade in quickly */
  }
  33.33% {
	opacity: 1; /* Stay visible for 1/3 of the total timeline */
  }
  38.33% {
	opacity: 0; /* Fade out quickly */
  }
  100% {
	opacity: 0; /* Stay invisible until the next loop cycle */
  }
}


@media (max-width: 800px) {
	.package-design .main-content {width: 85%; }
}


@media (max-width: 600px) {
	ul.two-columns {display: inline-block; width: 100%; }
	.package-design .main-page-title {font-size: 40px;}
	.package-design .main-page-title span {font-size: 25px;}
	.package-design .page-subtitle {font-size: 18px;}
	.package-design .page-subtitle img {width: 120px; margin: -5px 0 0 0;}
	.image-rotator { margin: 0; height: 400px;}
	#s3 ul.two-columns li:nth-of-type(2) {padding: 0;}
	.section-gysfttfs {padding: 0 0 50px 0;}
}

@media (max-width: 500px) {
	.package-design .page-top .main-content {width: 90%;}
}