 @font-face{
        font-family:"PF DinText W01 Regular";
        src:url("../fonts/8dc82415-2d8e-4b90-a589-ad35ba67c719.woff2") format("woff2"),url("../fonts/aac2149f-11f5-4c35-857f-3817474f8f07.woff") format("woff");
}

body{
    width:100%;
    height: 100%;
    background:#FFFFFF !important;
    font-family: 'PF DinText W01 Regular',Helvetica,Arial,Lucida,sans-serif !important;
}

p,
h1,
span{
    font-family: 'PF DinText W01 Regular',Helvetica,Arial,Lucida,sans-serif !important;
}

#globalnav {
    background :rgb(0, 52, 120);
    left:0;
    top:0;
    width:100%;
    height:30px;
    clear:both;
    z-index:999;
}

header{
	width:100%;
	height:120px;
	margin:0 auto;
	position:relative;
	vertical-align:middle;
	z-index:1;
	background:#FFFFFF;
}
header h1{
	display:block;
	height:116px;
	width:181px;
	float:left;
	margin-right:5px;
}
header h1 a{
	display:block;
	text-indent:-9999px;
	width:181px;
	height:90px;
	background:url('https://www3.ntu.edu.sg/cits2/maintenance/img/logo/logo_bw.gif') top left no-repeat;
	outline:none;
	margin-right:5px;
}

header nav{
	display:block;
	width:auto;
	top:45px;
	left:9.5%;
	position:absolute;
	z-index:90;
	padding-left:5px;
}
header nav ul{
	width:auto;
	height:auto;
	list-style:none;
	position:relative;
}
header nav ul li{
	display:inline-block;
	position:relative;
	float:left;
	/*font-family:Arial,  franklin-gothic-urw,"FranklinGothicURW-Med",sans-serif;*/
	font-family: 'PF DinText W01 Regular',Helvetica,Arial,Lucida,sans-serif !important;
	font-style: normal;
	font-weight: 700;
	font-size:16px;
	line-height:25px;
	padding:0 18px;

	/* NHN fix - avoid hidding logo */
	padding-left:15px;
	padding-right:15px;
	border-right:dotted 1px #808080;
	height:25px;
}
header nav ul li:last-child{
	border:none;
}
header nav ul li a{
	display:block;
	/*font-family: Arial, franklin-gothic-urw,"FranklinGothicURW-Med",sans-serif;*/
	font-family: 'PF DinText W01 Regular',Helvetica,Arial,Lucida,sans-serif !important;
	font-style: normal;
	font-weight: 700;
	font-size:16px;
	line-height:25px;
	color: #181C62 !important;
}
header nav ul li a:hover{
	text-decoration:underline;
	/*color:#A6A8AB;*/
	opacity:0.7;
}
header nav ul li ul{
	display:none;
	position:absolute;
	left:0px;
	top:25px;
	border:none;
	background:#1a4884;
	padding:0;
	margin:0;
	padding:15px;
	/*NHN fix - avoid hidding logo */
	padding-left:12px;
	padding-right:12px;
	border-right:dotted 1px #808080;
}
header nav ul li ul:last-child{
	border-right:none;
}
header nav ul li ul li{
	display:block;
	clear:both;
	border:none;
	/*font-family:Arial,  franklin-gothic-urw,"FranklinGothicURW-Med",sans-serif;*/
	font-family: 'PF DinText W01 Regular',Helvetica,Arial,Lucida,sans-serif !important;
	font-style: normal;
	font-weight: 500;
	font-size:11px;
	line-height:12px;
	text-transform:none;
	height:auto;
	margin:0; padding:0;
	margin-bottom:10px;
	*width:100px;
}

header nav ul li ul li a{
	color:white;
	text-decoration:none;
	font-size:11px;
	line-height:12px;
	text-transform:none;
	/*font-family:Arial,  franklin-gothic-urw,"FranklinGothicURW-Med",sans-serif;*/
	font-family: 'PF DinText W01 Regular',Helvetica,Arial,Lucida,sans-serif !important;
	font-style: normal;
	font-weight: 500;
	padding:1px 1px 1px 1px;
}

header nav ul li ul li a:visited{
	color:white;
}
header nav ul li ul li a:hover{
	/*color:#808080;*/
	color:#003478;
    display: block;  /* to increase clickable area as a's default to inline */
    background-color:#d0cfcb;
    text-decoration: none;
    padding:1px 1px 1px 1px;
}

.navhomevd{
    padding-left:3%;
    padding-right:3%;
}

.navhomevd_active{
	text-decoration:underline;
}

.navslick_active{
	background:rgba(0, 0, 0, 0.1);
	border-radius: 3px;
}

.slicknav_nav{
    position: absolute;
    margin-top: 27.5% !important;
    width:100%;
}
.slicknav_nav ul{
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    border-color: #181c62;
    background: #FFFFFF;
    border-top: 3px solid #2ea3f2;
    margin: 0 4% !important;
}
.slicknav_nav a{
    color: #181C62 !important ;
    
}

ol li{
    color:#FFFFFF;
    margin-bottom:1%;
    font-family: 'PF DinText W01 Regular',Helvetica,Arial,Lucida,sans-serif !important;
    list-style-type: none;
    counter-increment: list;
}

ol li::before{
    content: counter(list) ".";
    color:#D71440 !important;
    left: 4px;
    position: absolute;
    text-align: right;
}

.slicknav_btn{
    margin: 7.7% 2% !important;
    font-size: 19px;
    color: #000000;
}

.divMainContent {
    width: 85%;
    height: auto;
    position: relative;
    margin: 0px auto;
    padding-top: 5%;
}

.banner {
    width: 100%;
    height: 329px;
    display: block;
}

.banner2 {
    line-height:329px; 
    font-size: 60px; 
    font-weight: 800; 
    text-align: center; 
    color: white; 
}

.imageContainer {
  display:inline-table;
  position: relative !important;
  margin-left: 0 !important;
  left: 0 !important;
  width :100% !important;
}
.imageContainer > img {
  flex: 1;
  width: 17.6%;
  margin-right:3%;
}

/* Modal Design*/
.divModal {
    width: 70%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    display: none;
}

.modal {
    display: none;
    position: fixed;
    z-index: 1 !important;
    padding: 0;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto !important;
    background-color: rgba(0,0,0,0.4);
}

.modal-content {
    background:url('../images/Boarder-box-background.jpg') 0 0/100% 100% no-repeat;
    /*background:url('../images/MOSHED.gif') 0 0/100% 100% no-repeat;*/
    /*background-color: #0F0F0F !important;*/
    position: absolute !important;
    margin: auto;
    left: 50%;
    top: 0;
    transform: translate(-50%, 3%);
    padding: 0px 0px 10px 0px;
    border: 0 !important;
    width: 50% !important;
    border-radius: 10px !important;
    -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3) !important;
    -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3) !important;
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3) !important;
}

.modalHeader {
    height: 25px;
    margin: 10px 7px 0px 14px;
    padding-bottom: 0px;
}
.modalBody {
    width: 100%;
    position: relative;
}

.modalTitle{
    float: left;
    font-size: 24px;
    font-weight: bold;
}

.close {
    color: lightgray !important;
    float: right;
    font-size: 24px;
    font-weight: bold;
}

.close:hover, 
.close:focus {
    color: #FFFFFF !important;
    text-decoration: none;
    cursor: pointer;
}

.carousel-inner .carousel-item-right.active,
.carousel-inner .carousel-item-next {
  transform: translateX(24%);
}

.carousel-inner .carousel-item-left.active, 
.carousel-inner .carousel-item-prev {
  transform: translateX(-24%)
}
  
.carousel-inner .carousel-item-right,
.carousel-inner .carousel-item-left{ 
  transform: translateX(0);
}

#myCarousel a,
#flamdesc a,
#rushdesc a,
#fopdesc a,
#zendesc a,
#colordesc a {
    color: #FF0068 !important;
    font-family: 'PF DinText W01 Regular',Helvetica,Arial,Lucida,sans-serif !important;
}

#myCarousel a:hover,
#flamdesc a:hover,
#rushdesc a:hover,
#fopdesc a:hover,
#zendesc a:hover,
#colordesc a:hover {
    color: #FFFFFF !important;
}

#sliderContent img{
    padding: 0 0.5%;
}
.img-fluid {
    width: 24.9%;
}

.legacylogo {
  position: relative !important;
  left: 0 !important;
  width :100% !important;
  text-align:center  !important;
  display:table !important;
}

.legacyDiv {
    flex:1;
    width:30% !important;
    display:inline-table;
    cursor: pointer;
    overflow: hidden;
}
.legacyDiv > img{
    width:100% !important;
    transition: transform .5s ease !important;   
}
.legacyDiv:hover > img {
    transform: scale(1.2) !important;  
    background: green;
}

.legacydesc {
    margin-bottom:2%;
}

.legacyH {
    font-size:24px;
    font-weight:500;
    color:white;
}

.legacyP {
    font-size:14px;
    color:white;
}
#flamdesc,
#rushdesc,
#fopdesc,
#zendesc,
#colordesc{
   /*padding: 0 5%  !important;*/
}

#flamdesc p,
#rushdesc p,
#fopdesc p,
#zendesc p,
#colordesc p{
    color: #FFFFFF !important;
    text-align: justify !important;
}

#video1 {
    width:100%;
    height: 100%;
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
}

.linkLogo img{
    width: 20.5%;
    margin-right: 4%;
}

.cssanimation1, .cssanimation span {
    animation-duration: 2s;
    animation-fill-mode: both;
}

.cssanimation2, .cssanimation span {
    animation-duration: 2s;
    animation-fill-mode: both;
}

.cssanimation3, .cssanimation span {
    animation-duration: 3s;
    animation-fill-mode: both;
}

.cssanimation4, .cssanimation span {
    animation-duration: 4s;
    animation-fill-mode: both;
}

.cssanimation5, .cssanimation span {
    animation-duration: 4s;
    animation-fill-mode: both;
}

.cssanimation span { display: inline-block }

.fadeInBottom { animation-name: fadeInBottom }
@keyframes fadeInBottom {
    from {
        opacity: 0;
        transform: translateY(100%);
    }
    to { opacity: 1 }
}

 /* TIMELINE
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.timeline ul {
  padding: 50px 0;
}

.timeline ul li {
  list-style-type: none;
  position: relative;
  width: 6px;
  margin: 0 auto;
  padding-top: 3.2%;
  background: #fff;
}

.timeline ul li::after {
  content: attr(date);
  position: absolute;
  color: #FFFFFF;
  left: 50%;
  top: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 193px;
  height: 35px;
  font-size: 24px;
  background: grey;
  padding: 17px 7px 0;
  text-align: center;
}

.timeline ul li div{
  position: relative;
  bottom: 0;
  background: transparent;
}

.timeline ul li:nth-child(odd) div {
  left: 121px;
}

.timeline ul li:nth-child(odd) div::before{
  left: -15px;
  border-width: 8px 16px 8px 0;
  border-color: transparent #F45B69 transparent transparent;
}

.timeline ul li:nth-child(even) div{
    right:426px;
}

.timeline ul li:nth-child(even) div::before{
  right: -15px;
  border-width: 8px 0 8px 16px;
  border-color: transparent transparent transparent #F45B69;
}

.titleEvent {
  display: block;
  font-size: 25px;
  color: #FFFFFF;
  font-weight: bold;
  margin-top: 1.5%;
}

/* EFFECTS
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.timeline ul li::after {
  transition: background .5s ease-in-out;
}

.timeline ul li.in-view::after {
  background:#FF0068;
}

.timeline ul li div {
  visibility: hidden;
  opacity: 0;
  transition: all .5s ease-in-out;
}

.timeline ul li:nth-child(odd) div {
  transform: translate3d(200px, 0, 0);
}

.timeline ul li:nth-child(even) div {
  transform: translate3d(-200px, 0, 0);
}

.timeline ul li.in-view div {
  transform: none;
  visibility: visible;
  opacity: 1;
}


.arrowbox
{
    height: 50px;
    background-color:#D71440;
    position: relative;
    color: #FFFFFF;
    font-size: 27px;
}

.arrowbox:after {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: '';
	position: absolute;
	border-left-color: #D71440;
	border-width: 25px;
	margin-top: -25px;
}

.arrowbox > span {
    padding-left: 6%;
    top: 34%;
    position: relative;
}

.titleLink {
    color: #000000;
    flex-grow:1;
    margin:0.9% 3% 0 4.5%;
    font-size: 15px;
    font-weight: bold;
    text-decoration: underline;
    line-height: 15px;
}

.resources {
    color:#D71440;
    font-size:26px;
}

.resources ul {
    margin: 0 0 0 0%;
}

.resources ul li {
    margin-top: 2%;
}
.resources ul li a {
    color:#FFFFFF;
    font-size:18px;
    text-decoration: none;
    line-height: 15px;
    font-weight: bold;
    font-family: 'PF DinText W01 Regular',Helvetica,Arial,Lucida,sans-serif !important;
}

.resources ul li span {
    font-size: 15px;
    text-decoration: underline;
    color: #A6A8AB;
    line-height: 15px;
    font-family: 'PF DinText W01 Regular',Helvetica,Arial,Lucida,sans-serif !important;
}

.titleCategory{
    margin-left: 2%;
    line-height: 41px;
    font-weight: bold;
}

 /*Important dates*/
.Idatebox{
    position:absolute;
    text-align:left;
    font-size:36px;
    font-weight:bold;
    text-transform:uppercase;
    line-height:1.1;
    margin: 3.1% 0 0 2%;
    color:#181C62;
    width:20.5%;
}
    
.Inamebox {
    position:absolute;
    margin: 14.5% 1% 0 2%;
    width:19.5%;
}
.Inamebox h{
    line-height: 30px !important;
}

.Idate {
    color:white;
    font-size: 14px;
}
    
.Iname {
    font-size: 24px;
    font-weight: bold;
    color: #FFFFFF;
}
    
.Icontact {
    position:absolute;
    width:6%;
    height:6%;
    margin-left:19%;
    margin-top:3%;
    cursor:pointer;
}

.column {
  float: left;
  width: 25%;
  height: 420px;
  margin:2% 9.5% 2% 0;
}

.columnTitle{
    float: left;
    font-size: 36px;
    width: 100%;
    color:#181C62;
}

#imgBox1,
#imgBox2,
#imgBox3,
#imgBox4,
#imgBox5,
#imgBox6,
#imgBox7,
#imgBox8,
#imgBox9,
#imgBox10{
    position: absolute;
    width: 22.5%;
    height: 420px;
}

.et_pb_section,
.et_pb_row {
    padding: 40px 0;
    position: relative;
}

.et_pb_posts_nav a,
.et_pb_row,
.et_pb_row_inner,
.et_pb_column,
.et_pb_module,
.et_pb_counters .et_pb_counter_container,
.et_pb_portfolio_item,
.et_pb_pricing_table,
.et_pb_all_tabs,
.et_pb_tab,
.et_pb_slide,
.et_pb_with_background{
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.et_pb_row{
    margin:auto;
}

.et_pb_column{
    z-index: 2;
    float: left;
    position: relative;
}

.et_pb_row_0_tb_footer{
    width: 90%;
    max-width: 2560px;
}

.et_pb_css_mix_blend_mode_passthrough{
    mix-blend-mode: unset !important;
}

.et_pb_text_0_tb_footer.et_pb_text p,
.et_pb_text_1_tb_footer.et_pb_text p,
.et_pb_text_2_tb_footer.et_pb_text p,
.et_pb_text_3_tb_footer.et_pb_text p {
    color: #FFFFFF !important;
    line-height: 2em !important;
    font-size: 19px !important;
    margin-bottom: 0 !important;
}

.et_pb_text_3_tb_footer.et_pb_text a{
     color: #FFFFFF !important;
     font-size: 19px !important;
}

.et_pb_module{
    -webkit-animation-duration: 200ms;
    -moz-animation-duration:200ms;
    -o-animation-duration: 200ms;
    animation-duration:200ms;
    -webkit-animation-timing-function:linear;
    -moz-animation-timing-function:linear;
    -o-animation-timing-function:linear;
    animation-timing-function:linear;
}

.et_pb_text_align_left{
    text-align:left;
}

.et_pb_text > :last-child{
    padding-bottom: 0;
}

.et_pb_text_inner{
    position: relative;
}

p:not(.has-background):last-of-type{
    padding-bottom: 0;
}

.et_pb_row:after{
    display: block;
    visibility: hidden;
    clear: both;
    width: 0;
    height: 0;
    line-height: 0;
    content: "";
}

.et-l--footer ul{
    padding: 0 0 23px 1em;
    line-height: 26px;
    list-style-type: disc;
}

.et_pb_social_media_follow li {
    display: inline-block;
    position: relative;
    margin-bottom: 8px;
}

.et_pb_social_media_follow li a {
    display: inline-block;
    position: relative;
    margin-right: 8px;
    text-align: center;
    text-decoration: none;
}

.et_pb_social_media_follow li a.icon {
    border-radius: 3px;
    box-sizing: content-box;
    width: 32px;
    height: 32px;
    padding: 0;
}

.et_pb_with_border{
    border: 0px solid #333;
}

ul.et_pb_social_media_follow{
    margin: 0 0 22px;
    padding: 0;
    list-style-type: none !important;
}

.et_pb_social_media_follow_0_tb_footer li.et_pb_social_icon a.icon:before {
    color: #ffffff;
}

.et_pb_social_media_follow li a.icon::before {
    display: block;
    position: relative;
    z-index: 10;
    width: 32px;
    height: 32px;
    color: #fff;
    font-size: 16px;
    line-height: 32px;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}

.et_pb_social_media_follow li:last-child a {
    margin-right: 0;
}

.et_pb_social_icon a.icon:before{
    text-shadow: 0 0;
    font-family: "ETmodules" !important;
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1;
    text-transform: none;
    speak: none;
}

.et-social-facebook a.icon:before {
    content: url("http://www3.ntu.edu.sg/cits2/CITS_web_resources/UI/headerfooter/common1/responsive/images/s-fb.gif");
    /*content: "\e093";*/
}

.et-social-twitter a.icon:before {
    content: url("http://www3.ntu.edu.sg/cits2/CITS_web_resources/UI/headerfooter/common1/responsive/images/s-twit.gif");
    /*content: "\e094";*/
}

.et-social-youtube a.icon:before {
    content: url("http://www3.ntu.edu.sg/cits2/CITS_web_resources/UI/headerfooter/common1/responsive/images/s-yt.gif");
    /*content: "\e0a3";*/
}

.et-social-instagram a.icon:before {
    content: url("http://www3.ntu.edu.sg/cits2/CITS_web_resources/UI/headerfooter/common1/responsive/images/s-ins.gif");
    /*content: "\e09a";*/
}

.et-social-linkedin a.icon:before {
    content: url("http://www3.ntu.edu.sg/cits2/CITS_web_resources/UI/headerfooter/common1/responsive/images/s-li.gif");
    /*content: "\e09d";*/
}

.et_pb_social_media_follow_network_name {
    display: none;
}

.clearfix:after {
    display: block;
    visibility: hidden;
    clear: both;
    height: 0;
    font-size: 0;
    content: " ";
}