body, html {
  overflow-x: hidden;
}

body {
  background-image: url(../images/body_bg_2.png);
  background-attachment: fixed;
}

.logo img {
  height:120px;
  width: auto;
}

img.fogsi {
  height: 100px;
  margin-left: 15px;
}

.timerSection {
  margin-top: -50px;
}

.timerContainer {
  z-index: 999999;
}

.timerContainer .timerMain {
  background-color: var(--orange) !important;
  border-radius: 30px;
  box-shadow: 0px 0px 8px darkorange;
}

.timerContainer .timerMain .text p {
color:darkred;
}

.user-img {
  overflow: hidden;
  border: 2px solid gold;
  transition: all 1s;
}

.testimony-wrap:hover {
  background-color: var(--semiBrown);
  color: var(--white95) !important;
  transition: all 1s;
  cursor: pointer;
}

.testimony-wrap:hover .name, .testimony-wrap:hover .position {
  color: var(--white95) !important;
}

.msgBottomContent small{
  width: 100%;
  display: block;
  margin-top: -10px;
clear: both;
color: var(--semiBrown);
}

.user-img img {
  height: 100%;
  width: 100%;
  transition: all 1s;
}

.user-img img:hover
{
  transform: scale(0.95);
  transition: all 1s;
}

.icon-wrap {
  overflow: hidden;
}

.services-2 {
  padding: 10px;
}

.services-2:hover {
  background-color: var(--yellowBrownLight);
  transform: scale(1.1);
  transition: all 1s;
  color:var(--black90);
}

.msgBottomContent {
  padding: 12px;
  text-align: center !important;
}

.messageBox {
  background-color: #fadcc1;
  border: 1px dashed var(--red);
}

.messageBox p {
color:var(--black90);
}

.msgBottomContent img {
  height: 180px;
  width: 180px;
  border-radius: 50%;
}

.icon-wrap img {
  height: 100%;
  width: 100%;
}

.registrationSection {
  background-color: var(--red) !important;
  color: var(--white95) !important;
}

.regTblHome {
  background-color:rgb(242, 188, 172);
  border: 2px solid salmon;
}

.animate-charcter
{
   text-transform: uppercase;
  background-image: linear-gradient(
    -225deg,
    var(--darkBlue2) 0%,
    var(--orange) 29%,
    var(--orange) 67%,
    var(--yellow) 100%
  );
  background-size: auto auto;
  background-clip: border-box;
  background-size: 200% auto;
  color: #fff;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: textclip 4s linear infinite;
  display: inline-block;
}

@keyframes textclip {
  to {
    background-position: 200% center;
  }
}

.custom-btn {
    background-color: var(--red);
    font-size: 16px;
    color:#f3f3f3;
}

.custom-btn:hover {
  background-color: salmon;
  transition: 1s all;
}

.importantLinks .iconImg img{
    height: 120px;
    width: 120px;
border-radius: 50%;
border: 1px solid var(--orange);
}

.rotate{
  animation: spinner 10.5s linear infinite; 
}
@keyframes spinner {
  to { transform: rotate(360deg); }
}


/* SPINNER JUST FOR DEMO */
.spinner {
  display: inline-block; width: 50px; height: 50px;
  border-radius: 50%;
  box-shadow: inset -2px 0 0 2px #0bf;
}

.imgSpinner{
  animation: imgSpinner 10.5s linear infinite; 
}

@keyframes imgSpinner {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}

.flip {
    transition: all 2s;
    position: relative;
}


.flip:hover {
    transform: rotateY(180deg);
    transition: all 2s;
}

.section-title h2
{
  color: var(--darkRedTitle);
  font-size: 2rem;
  position: relative;
}

.toLeft {
  position: relative;
  left: -2000px;
}

.fontWhite95 {
color: var(--white95) !important;
}
/*
.section-title h2::before {
  position: absolute !important;
  left: 0 !important;
  bottom: 0;
  width: 85px !important;
  height: 4px !important;
  content: "" !important;
  right: 0px !important;
  background-color: red !important;
}

.section-title h2::after{
  position: absolute !important;
  left: 0 !important;
  bottom: 0;
  width: 85px !important;
  height: 4px !important;
  content: "" !important;
  right: 0px !important;
  background-color: red !important;
}
*/

.footerBottom {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;  
}

.footerBottom p {
  padding: 10px;
  color: var(--white-color);
}

.ifasLogo img{
  height: 75px;
}

.venue-img {
  margin: 0 auto;
  padding: 20px;
  box-shadow: 0px 0px 3px darkgrey;
}

.venue-img img {
  width:100%;
}

.distanceTravel
{
  padding: 12px;
  margin: 10px auto;
  box-shadow: 0px 3px 2px grey;
}

.btn-light-bg
{
  background-color: var(--yellowBrownLight) !important;
  color: var(--black90) !important;
}

.bgblackLight {
  /*background-color: rgba(19,18,17,0.5) !important;*/
  background-color: rgba(255,165,0,0.5) !important;
}

.colorlightYellowBrown {
  color: var(--yellowBrownLight) !important;
}

.fontWhite {
  color: var(--white) !important; 
}

.timer .text {
  margin: 10px;
  padding: 10px;
  text-align: center;
  height: 120px;
  width: 120px;
  box-shadow: 2px 2px 3px grey;
  border-radius: 50%;
  background-color: var(--white95);
}

.txtUpper {
  text-transform: uppercase !important;
}

.rotatedPlaces {
  height: 320px;
  width: 320px;
  background-color: transparent;
  border: 3px solid skyblue;
  border-radius: 50%;
  margin: 0 auto;
}

.borderImg {
  height: 120px;
  width: 120px;
  border: 1px solid var(--white);
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  margin: 20px;
}

.borderImg img {
  height: 100%;
  width: 100%;
}

:root{
    /* ---- theme */
  --darkBrown:#381207;/* RGB - 56/18/7*/
  --semiBrown:#803823;/* RGB - 128/56/35*/
  --veryLightBrown:#af8477;/* RGB - 175/132/119*/

  --yellowBrown:#d7a44a; /* RGB - 215/164/72*/
  --yellowBrownLight:#f8c264; /* RGB - 248/194/100*/

  --blueSemi:#0d50ab;/* RGB - 13/80/171*/
  --blueLightBright:#27a5da;/* RGB - 39/165/218*/
  --black90:#131211;/* RGB - 19/18/17*/
  --white95:#f5f3f1;/* RGB - 245/243/241*/
  --white:#ffffff;/* RGB - 255/255/255*/
}


.pageTitle {
  box-shadow: 2px 3px 2px grey;
  color: var(--darkRedTitle);
  padding: 10px;
  text-transform: capitalize;
  position: relative;
}

.section-titles h2::before {
  content: "";
  position: absolute;
  width: 200px;
  height: 2px;
  background: var(--skyblueDark);
  bottom: -4px;
  margin: 0 auto;
}

.section-titles h2::after {
  content: "";
  position: absolute;
  width: 60px;
  height: 4px;
  background: var(--skyblue);
  bottom: -6px;
  left: 0;
  margin: 0 auto;
}

.bold {
  font-weight: bold !important;
}

.underlineDoubleSky {
  text-decoration: underline double skyblue;
}

.buttongo {
  position: relative;
  cursor: pointer;
  padding: 10px;
  border-radius: 12px;
  background-color: forestgreen;
  border: 1px solid green;
  color:#fff;
}

.buttongold {
  position: relative;
  cursor: pointer;
  padding: 10px;
  border-radius: 12px;
  background-color: gold;
  border: 1px solid orange;
  color:#000;
}

.registration table {
  border:1px solid var(--black90);
}

.registration thead {
  background: var(--yellowBrownLight);
  color:var(--black90);
}

.registration table td, .registration table tbody th {
  border: 1px solid var(--semiBrown);
}

/*.regTblCol1 {
  background-color: var(--darkBrown);
  color: var(--black90) !important;
}*/

/* animation */

/* spin bg */
.spin-bg {
  animation: spin 1s linear;
}
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.bounce-in-right {
  animation: bounce-in-right 2s ease;
}
@keyframes bounce-in-right {
  0% {
    opacity: 0;
    transform: translateX(2000px);
  }
  60% {
    opacity: 1;
    transform: translateX(-30px);
  }
  80% { transform: translateX(10px); }
  100% { transform: translateX(0); }
}

/* from left */
.bounce-in-left {
  animation: bounce-in-left 2s ease;
}
@keyframes bounce-in-left {
  0% {
    opacity: 0;
    transform: translateX(-2000px);
  }
  60% {
    opacity: 1;
    transform: translateX(-30px);
  }
  80% { transform: translateX(10px); }
  100% { transform: translateX(0); }
}

/* bounce-titter */
.animated { 
  -webkit-animation-duration: 4s;
  animation-duration: 4s; 
  -webkit-animation-fill-mode: both; 
  animation-fill-mode: both;
  animation-delay: 2s; 
}

@-webkit-keyframes bounce { 
  0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 
  40% {-webkit-transform: translateY(-60px);} 
  60% {-webkit-transform: translateY(-30px);} 
} 

@keyframes bounce { 
  0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 
  40% {transform: translateY(-30px);} 
  60% {transform: translateY(-15px);} 
}

.bounce { 
  -webkit-animation-name: bounce; 
  animation-name: bounce; 
}


@-webkit-keyframes bounce2 { 
  0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 
  40% {-webkit-transform: translateY(60px);} 
  60% {-webkit-transform: translateY(30px);} 
} 

@keyframes bounce2 { 
  0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 
  40% {transform: translateY(30px);} 
  60% {transform: translateY(15px);} 
}

.bounce2 { 
  -webkit-animation-name: bounce2; 
  animation-name: bounce2; 
}
/* wave text */
.waveTextAnimated span {
  display: inline-block;
  -webkit-animation: wave-text 2.5s ease-in-out infinite;
          animation: wave-text 2.5s ease-in-out infinite;
}
.waveTextAnimated span:nth-of-type(1) {
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}
.waveTextAnimated span:nth-of-type(2) {
  -webkit-animation-delay: 0.12s;
          animation-delay: 0.12s;
}
.waveTextAnimated span:nth-of-type(3) {
  -webkit-animation-delay: 0.25s;
          animation-delay: 0.25s;
}
.waveTextAnimated span:nth-of-type(4) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.waveTextAnimated span:nth-of-type(5) {
  -webkit-animation-delay: 0.45s;
          animation-delay: 0.45s;
}

.waveTextAnimated span:nth-of-type(6) {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}

.waveTextAnimated span:nth-of-type(7) {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}

.waveTextAnimated span:nth-of-type(7) {
  -webkit-animation-delay: 0.05s;
          animation-delay: 0.05s;
}

.waveTextAnimated span:nth-of-type(8) {
  -webkit-animation-delay: 0.15s;
          animation-delay: 0.15s;
}

.waveTextAnimated span:nth-of-type(9) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}

.waveTextAnimated span:nth-of-type(10) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
@-webkit-keyframes wave-text {
  0% {
    transform: translateY(0em);
  }
  60% {
    transform: translateY(-0.3em);
  }
  100% {
    transform: translateY(0em);
  }
}
 
@keyframes wave-text {
  00% {
    transform: translateY(0em);
  }
  60% {
    transform: translateY(-0.3em);
  }
  100% {
    transform: translateY(0em);
  }
}

/*ocean wave */
.ocean {
  height: 5%;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  background: #015871;
}

.oceanwave {
  background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/85486/wave.svg) repeat-x;
  position: absolute;
  width: 6400px;
  top: -198px;
  left: 0;
  height: 198px;
  transform: translate(0, 0, 0);
  animation: wave 7s ease infinite;
}

.oceanwave:nth-of-type(2) {
  top: -168px;
  animation: swell 4s ease infinite;
  opacity: 1;
}

@keyframes wave {
  0% { margin-left: 0; }
  100% { margin-left: -1600px;}
}
@keyframes swell {
  0%, 100% {
    transform: translate(0, -30px);
  }
  50% {
    transform: translate(0, 5px);
  }
}

/* phone ring */

.phoneRing {
  animation: ring 4s .7s ease-in-out infinite;
  transform-origin: 50% 4px;
}

@keyframes ring {
  0% { transform: rotate(0); }
  40% { transform: rotate(-24deg); }
  45% { transform: rotate(22deg); }
  50% { transform: rotate(-20deg); }
  55% { transform: rotate(18deg); }
  60% { transform: rotate(-16deg); }
  65% { transform: rotate(14deg); }
  70% { transform: rotate(-12deg); }
  75% { transform: rotate(10deg); }
  80% { transform: rotate(-8deg); }
  85% { transform: rotate(6deg); }
  90% { transform: rotate(-4deg); }
  95% { transform: rotate(2deg); }
  100% { transform: rotate(-1deg); }
}

.phoneRing2 {
  animation: ring 4s .7s ease-in-out infinite;
  transform-origin: 50% 4px;
}

@keyframes ring2 {
  0% { transform: rotate(0); }
  5% { transform: rotate(30deg); }
  10% { transform: rotate(-28deg); }
  15% { transform: rotate(34deg); }
  20% { transform: rotate(-32deg); }
  25% { transform: rotate(30deg); }
  30% { transform: rotate(-28deg); }
  35% { transform: rotate(26deg); }
  40% { transform: rotate(-24deg); }
  45% { transform: rotate(22deg); }
  50% { transform: rotate(-20deg); }
  55% { transform: rotate(18deg); }
  60% { transform: rotate(-16deg); }
  65% { transform: rotate(14deg); }
  70% { transform: rotate(-12deg); }
  75% { transform: rotate(10deg); }
  80% { transform: rotate(-8deg); }
  85% { transform: rotate(6deg); }
  90% { transform: rotate(-4deg); }
  95% { transform: rotate(2deg); }
  100% { transform: rotate(-1deg); }
}

.wavUpDown {
  animation: upDown 3s ease-in-out infinite;
  transform-origin: 50% 4px;
  position: relative;
}

@keyframes upDown {
  0% {margin-top: 0px;color:var(--green)}
  50% {margin-top: -10px;color:var(--custom-btn-bg-color);}
  100% {margin-top: 0px;color:red;}
}

/*earth rotation */
.iconSize {
  height:26px;
  width:26px;
  display: inline-block;
  vertical-align: middle;
}
#earthRotate {
 /* height:30px;
  width:30px;*/
  background: url(https://web.archive.org/web/20150807125159if_/http://www.noirextreme.com/digital/Earth-Color4096.jpg);
  border-radius: 50%;
  /*box-shadow: inset 8px 36px 80px 36px rgb(0, 0, 0), inset -6px 0 12px 4px rgba(255, 255, 255, 0.3);*/
  animation-name: earthRotate;
  animation-duration: 12s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -webkit-animation-name: earthRotate;
     -webkit-animation-duration: 12s;
     -webkit-animation-iteration-count: infinite;
     -webkit-animation-timing-function: linear;
}
@keyframes earthRotate {
  from {
    background-position: 0px 0px;
  }
  to {
    background-position: 610px 0px;
  }
}
@-webkit-keyframes earthRotate {
  from {
    background-position: 0px 0px;
  }
  to {
    background-position: 610px 0px;
  }
}



/* animation end */

/* effects */

.curl {
	width:120px;
	height:120px;
	position: relative;
	top:-10px;
	left:-10px;
	background : 
		linear-gradient(
			135deg, 
			#fff, 
			#f3f3f3 45%, 
			#ddd 50%, 
			#aaa 50%, 
			#bbb 56%, 
			#ccc 62%, 
			#f3f3f3 80%,
			#fff 100%
		);
	box-shadow : 0 0 10px rgba(0, 0, 0, .5);
	transition: all .5s ease;
}
.curl:before,
.curl:after {
	content: '';
	position: absolute;
	z-index: -1;
	left: 12.5%;
	bottom: 5.8%;
	width: 70%;
	max-width: 300px;
	max-height: 100px;
	height: 55%;
	box-shadow: 0 12px 15px rgba(0, 0, 0, .3);
	transform: skew(-10deg) rotate(-6deg);
}
.curl:after {
	left: auto;
	right: 5.8%;
	bottom: auto;
	top: 14.16%;
	transform: skew(-15deg) rotate(-84deg);
}

.curl:hover {
	width: 240px;
	height: 240px;
}
.curl:hover:before,
.curl:hover:after {
	box-shadow: 0 24px 30px rgba(0, 0, 0, .3);
}