@font-face {
  font-family: "Guillon Regular";
  src: url('../fonts/Guillon.ttf') format('truetype');
}
@font-face {
  font-family: "Guillon Demi";
  src: url('../fonts/Guillon-Demi.ttf') format('truetype');
}
@font-face {
  font-family: "Guillon Black";
  src: url('../fonts/Guillon-Black.ttf') format('truetype');
}
@font-face {
  font-family: "Guillon Light";
  src: url('../fonts/Guillon-Light.ttf') format('truetype');
}
@font-face {
  font-family: "Poppins Bold";
  src: url('../fonts/Poppins-Bold.ttf') format('truetype');
}
@font-face {
  font-family: "Poppins Regular";
  src: url('../fonts/Poppins-Regular.ttf') format('truetype');
}
@font-face {
  font-family: "Poppins Medium";
  src: url('../fonts/Poppins-Medium.ttf') format('truetype');
}
@font-face {
  font-family: "Poppins Light";
  src: url('../fonts/Poppins-Light.ttf') format('truetype');
}
#outlook a { padding:0; }
body { margin:0;padding:0;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%; }
table, td { border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt; }
img { border:0;height:auto;line-height:100%; outline:none;text-decoration:none;-ms-interpolation-mode:bicubic; }
p { display:block;margin:13px 0; }

.col{
  flex: 1;
  height: 25vw;
  position: relative;
}
.time{
  color: #1e194c;
  text-transform: uppercase;
  width: 100%;
  display: flex;
  justify-content: center;
}
.middle{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  text-align: center;
}
.time span{
  padding: 0 2vw;
  font-family: "Guillon Regular";
  font-size: 3vw;
}
.time span div{
  font-family: "Guillon Black";
  font-size: 9vw;
}

.reveal{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: all 1s ease;
}
.reveal.active{
  transform: translateY(0);
  opacity: 1;
}

.revealonce.up{
  position: relative;
  transform: translateY(380px);
  opacity: 0;
}
.revealonce.down{
  position: relative;
  transform: translateY(-380px);
  opacity: 0;
}
.revealonce.active{
  transform: translateY(0);
  opacity: 1;
  transition: all 1s ease;
}
.video-play-td {
	padding:10px 25px;
	text-align:left;
}
.video-play-link {
	  text-align: left;
	  width: 100%;
}
.video-play {
	height:auto;
	max-width:150px;
}
.hidden {
	display: none;
}
.close-modal-btn {
    right: -24px;
    top: -24px;
    font-size: 12px;
	background: #444;
    border-radius: 50%;
    border: 1px solid #777;
}

@media only screen and (min-width:480px) {
.mj-column-per-40 { width:40% !important; max-width: 40%; }
.mj-column-per-60 { width:60% !important; max-width: 60%; }
.mj-column-per-25 { width:25% !important; max-width: 25%; }
.mj-column-per-50 { width:50% !important; max-width: 50%; }
.mj-column-per-20 { width:20% !important; max-width: 20%; }
.mj-column-per-100 { width:100% !important; max-width: 100%; }
.mj-column-per-5 { width:5% !important; max-width: 5%; }
.mj-column-per-90 { width:90% !important; max-width: 90%; }
.mj-column-per-15 { width:15% !important; max-width: 15%; margin-bottom: 30px; }
.mj-column-per-30 { width:30% !important; max-width: 30%; margin-bottom: 30px; }
.mj-column-per-70 { width:70% !important; max-width: 70%; }
.mj-column-per-0 { width:0% !important; max-width: 0%; }
}

@media only screen and (max-width:480px) {
  table.mj-full-width-mobile { width: 100% !important; }
  td.mj-full-width-mobile { width: auto !important; }
  .mj-column-per-5 { height: 15px !important; }
  .mj-column-per-0 { width:100% !important; max-width: 100%; height: 30px !important; }
  .center {
	text-align: center !important;
  }
  div.title {
	font-size: 4.5vw !important;
  }
  a.download {
	font-size: 5vw;
	padding: 2.5vw 4vw 2.8vw;
	border-radius: 5vw;
  }
  div.meet {
	font-size: 7vw !important;
  }
  span.name {
	font-size: 5vw !important;
  }
  span.work {
	font-size: 3vw !important;
  }
  .video-play-td {
	text-align:center;
  }
  .video-play-link {
	text-align: center;
  }
}

@media only screen and (max-width:1024px) {
  span.name {
	font-size: 3.5vw;
  }
  span.work {
	font-size: 2vw;
  }
}

@media only screen and (min-width:1024px) {
  a.download {
	font-size: 50px !important;
  }
  span.name {
	font-size: 36px !important;
  }
  span.work {
	font-size: 18px !important;
  }
}

@media only screen and (min-width:1280px) {
  div.title {
	font-size: 48px !important;
  }
  div.meet {
	font-size: 90px !important;
  }
  a.download {
	padding: 32px 50px 38px !important;
  }
} 

@media only screen and (min-width:1330px) {
	.time span{
	  padding: 0 26px !important;
	  font-size: 40px !important;
	}
	.time span div{
	  font-size: 7.5vw !important;
	}
}

@media only screen and (min-width:1600px) {
  .col {
	height: 400px !important;
  }
}