:root {
  --bg:       #0D0D0D;
  --surface:  #161616;
  --border:   #2A2A2A;
  --text:     #fff;
  --muted:    #7A746E;
  --dot:      12px;
  --ease:     cubic-bezier(.22,.68,0,1.2);
  --company: #1b90cf;
}
h1{margin-bottom:2rem}
h2{padding: 2rem 0; font-size:2rem}
a{text-decoration: none;}

.dropdown-menu{min-width:200px}

#home-quote {
    background-color: var(--company);
    font-size: 2.1rem;
    color: #fff;
}
#home-quote i,#home-quote svg{color: #fff;}
.pink {
    color: #CC0066;
}

.box1{background-color:#1B90CF}
.box2{background-color:#222529}
.box3{background-color:#122F42}

#experts{background: rgba(0, 0, 0, 0) linear-gradient(to right, #ed30a0, #0b86a6) repeat scroll 0 0;}
.team_more_info{
    padding: 10px 30px;
    border: 1px solid #ccc;
    border-radius: 5px;
    color: #FFF;
    display: inline-block;
    margin-bottom: 30px;
}

.bloginfo {
    background: none repeat scroll 0 0 #f2f2f2;
    border-radius: 5px;
    display: inline-block;
    font-size: 90%;
    margin: 5px 10px 15px 0;
    padding: 5px 10px 5px 10px;
    text-transform: lowercase;
}
.footer_top{background-image: linear-gradient(#122F42, #122637);}
.footer_bottom{background-color: #122F42;}
.social_icon{color: var(--company);}
.hp-field {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
/*TEAM FLIP*/
.card-wrapper {
    position: relative;
    width: 100%;
    margin: 0;
    -webkit-perspective: 800px;
    perspective: 800px;
    height:435px;
}
.card-wrapper .card-rotating {
    height: 100%;
    -webkit-transition: .5s;
    transition: .5s;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}
.card-wrapper .card {
    font-weight: 400;
    border: 0;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
}

.card-wrapper .card-rotating .front, .card-wrapper .card-rotating .back {
    -webkit-transition: 1s;
    transition: 1s;
}
.card-wrapper .card-rotating .front {
    z-index: 1;
}

.card-wrapper .card-rotating .face {
    position: absolute;
    z-index: 2;
    width: 100%;
    background: #fff;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.card-wrapper .card-up {
    height: 200px;
    overflow: hidden;
}
.card-wrapper .card-up img {
    vertical-align: middle;
}


.card-wrapper .card-rotating .back {
    -webkit-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
}

.card-wrapper .avatar {
    display: block;
    width: 120px;
    margin-top: -60px;
    overflow: hidden;
}
.white_flipper {
    background-color: #fff !important;
}
.card-wrapper .avatar img {
    width: 100%;
    background: none repeat scroll 0 0 #fff;
    border: 5px solid #fff;
}
.img-fluid, .modal-dialog.cascading-modal.modal-avatar .modal-header, .video-fluid {
    max-width: 100%;
    height: auto;
}

.card-wrapper:hover .card-rotating {
  transform: rotateY(180deg);
}
.bio{font-size:smaller;overflow-y: auto; height:260px;text-align: left;}

.teamitem {
    position: relative;
    margin-top: 120px;
    padding: 65px 0px 0px;
    background: #005872;
    border-radius: 3px;
    outline: none;
    border-radius: 10px;
}

.teamitem-team{margin: 25px 0 55px;}
.teamitem .teamitem-image-wrapper {
    background: #005872 none repeat scroll 0 0;
    border-radius: 50px;
    height: 100px;
    left: 50%;
    position: absolute;
    top: -50px;
    transform: translateX(-50%);
    width: 100px;
}

.teamitem .twitter-profile {
    border: 4px solid white;
    border-radius: 44px;
    height: 88px;
    left: 6px;
    position: absolute;
    top: 6px;
    width: 88px;
}

.teamitem .teamitem-info {
    height: 60px;
}
.teamitem .name {
  
    text-align: center;
	color:#FFF;
}



.teamitem .teamitem-title {
    -moz-box-flex: 1;
    color: #005872;
    flex: 1 1 0;
    text-align: center;
    text-transform: uppercase;
}

/* --------------------------------------------
   TIMELINE  –  desktop (= 700 px)
   Centre line, cards alternate left / right
   -------------------------------------------- */



.timeline {
  position: relative;
}

/* vertical rule */
.timeline::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0; bottom: 0;
  width: 1px;
  transform: translateX(-50%);
  background: linear-gradient(
    to bottom,
    transparent,
    var(--border) 6%,
    var(--border) 94%,
    transparent
  );
}

/* -- ITEM -- */
.tl-item {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 0;
  align-items: start;
  position: relative;
  margin-bottom: clamp(2rem, 5vw, 3.5rem);
  opacity: 0;
  transform: translateY(24px);
  animation: fadeUp .5s var(--ease) forwards;
}

.tl-item:last-child { margin-bottom: 0; }

.tl-item:nth-child(1) { animation-delay: .00s; }
.tl-item:nth-child(2) { animation-delay: .10s; }
.tl-item:nth-child(3) { animation-delay: .20s; }
.tl-item:nth-child(4) { animation-delay: .30s; }
.tl-item:nth-child(5) { animation-delay: .40s; }
.tl-item:nth-child(6) { animation-delay: .50s; }

/* -- DOT -- */
.tl-dot {
  position: absolute;
  left: 50%;
  top: 1.1rem;
  transform: translate(-50%, -50%);
  width: var(--dot);
  height: var(--dot);
  border-radius: 50%;
  background: var(--bg);
  border: 2px solid var(--border);
  transition: transform .3s var(--ease), border-color .3s;
  z-index: 2;
}

.tl-item:hover .tl-dot {
  transform: translate(-50%, -50%) scale(1.7);
  border-color: var(--accent, #FF6B35);
}

/* -- ODD: date LEFT, card RIGHT -- */
.tl-item:nth-child(odd) .tl-date {
  grid-column: 1;
  grid-row: 1;
  text-align: right;
  padding-right: 2.2rem;
}

.tl-item:nth-child(odd) .tl-card {
  grid-column: 2;
  grid-row: 1;
  padding-left: 2.2rem;
}

/* -- EVEN: card LEFT, date RIGHT -- */
.tl-item:nth-child(even) .tl-card {
  grid-column: 1;
  grid-row: 1;
  padding-right: 2.2rem;
}

.tl-item:nth-child(even) .tl-date {
  grid-column: 2;
  grid-row: 1;
  text-align: left;
  padding-left: 2.2rem;
}

/* -- DATE BLOCK -- */
.tl-date {
  padding-top: .4rem;
}

.tl-date .month {
  display: block;
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: .2rem;
}

.tl-date .year {
  display: block;
  font-size: 2.6rem;
  font-weight: 900;
  line-height: 1;
  color: var(--text);
  opacity: .12;
  letter-spacing: -.04em;
}

/* -- CARD -- */
.tl-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: clamp(1rem, 2.5vw, 1.5rem) clamp(1.1rem, 3vw, 1.7rem);
  position: relative;
  overflow: hidden;
  transition: border-color .3s, transform .3s var(--ease);
}

.tl-card::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 3px;
  background: var(--accent, #FF6B35);
  opacity: 0;
  transition: opacity .3s;
}

.tl-item:nth-child(odd)  .tl-card::before { left: 0; right: auto; }
.tl-item:nth-child(even) .tl-card::before { right: 0; left: auto; }

.tl-item:hover .tl-card { border-color: #3a3a3a; }
.tl-item:hover .tl-card::before { opacity: 1; }

.tl-item:nth-child(odd):hover  .tl-card { transform: translateX( 4px); }
.tl-item:nth-child(even):hover .tl-card { transform: translateX(-4px); }

/* -- CARD CONTENT -- */
.tl-card-top {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-bottom: .6rem;
}

.tl-icon { font-size: 1.2rem; line-height: 1; }

.tl-label {
  font-size: .58rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--accent, #FF6B35);
  border: 1px solid currentColor;
  padding: .18em .5em;
  border-radius: 2px;
}

.tl-card h2 {
  
  font-size: clamp(1rem, 2vw, 1.25rem);
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: .5rem;
  letter-spacing: -.01em;
	color:#FFF;
}

.tl-card p {
  font-size: clamp(.8rem, 1.4vw, 1.1rem);
  line-height: 1.75;
  color: #9E9890;
}

/* -- ANIMATION -- */
@keyframes fadeUp {
  to { opacity: 1; transform: translateY(0); }
}

/* --------------------------------------------
   MOBILE  (< 700 px)  –  single column
   -------------------------------------------- */
@media (max-width: 699px) {

  .timeline::before {
    left: 10px;
    transform: none;
  }

  .tl-item {
    display: block;
    padding-left: 36px;
  }

  .tl-dot {
    left: 10px;
    top: 1.6rem;
    transform: translate(-50%, -50%);
  }

  .tl-item:hover .tl-dot {
    transform: translate(-50%, -50%) scale(1.7);
  }

  /* date above card on mobile */
  .tl-item:nth-child(odd)  .tl-date,
  .tl-item:nth-child(even) .tl-date {
    text-align: left;
    padding: 0 0 .45rem 0;
    display: flex;
    align-items: baseline;
    gap: .5rem;
  }

  .tl-item:nth-child(odd)  .tl-card,
  .tl-item:nth-child(even) .tl-card {
    padding-left: 0;
    padding-right: 0;
  }

  .tl-date .year {
    font-size: 1rem;
    opacity: 1;
    color: var(--muted);
    font-weight: 700;
  }

  .tl-item:nth-child(odd):hover  .tl-card,
  .tl-item:nth-child(even):hover .tl-card { transform: translateX(4px); }

  .tl-item:nth-child(odd)  .tl-card::before,
  .tl-item:nth-child(even) .tl-card::before { left: 0; right: auto; }
}