/*
Timeline Template
http://www.templatemo.com/preview/templatemo_427_timeline
*/

@import url(https://fonts.googleapis.com/css?family=Raleway:400,300,500,600,700,800,900);

@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,700,300,100);

@import url(https://fonts.googleapis.com/css?family=Dosis:200,300,400,500,600,700,800);

@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700');


html {
    box-sizing: border-box;
}

body{
	background: transparent;/*#ffffff;/*#71b532;*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	color:#666666;
}



div.jupas a{color:#029398; cursor: pointer;}
div.jupas a:hover{color:#158090;}
div.jupas a.hover_red:hover{color:red;}
div.jupas a.inverse{ color:#ffdb00;}


div.das a{color:#ff7400;cursor: pointer;}
div.das a:hover{color:#cc6108;}
div.das a.hover_red:hover{color:red;}
div.das a.inverse{ color:#ffec7b;}

div.senior_year a{color:#679600;cursor: pointer;}
div.senior_year a:hover{color:#4d6f00;}
div.senior_year a.hover_red:hover{color:red;}
div.senior_year a.inverse{ color:#ffdb00;}

div.mainland a{color:#BF1640;cursor: pointer;}
div.mainland a:hover{color:#a30028;}
div.mainland a.inverse{ color:#fbffbe;}



#fullpage{
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#fullpage.jupas{
	background: url('../images/bg_jupas.jpg') no-repeat fixed center;
    -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#fullpage.das{
	background: url('../images/bg_das.jpg') no-repeat fixed center;
}
#fullpage.senior_year{
	background: url('../images/bg_senior_year.jpg') no-repeat fixed center;
}
#fullpage.mainland{
	background: url('../images/bg_mainland.jpg') no-repeat fixed center;
}


#top {
	margin-top: 50px;
	-webkit-box-shadow: 0 8px 6px -6px #999;
    -moz-box-shadow: 0 8px 6px -6px #999;
    box-shadow: 0 8px 6px -6px #999;
}

/* Top Navbar */

.navbar-default {
	padding-top:10px;
	padding-bottom:10px;
    border-color: transparent;
}
.navbar-default.jupas {	background-color:  #02B8BF;}
.navbar-default.das {	background-color:  #ff8d00;}
.navbar-default.senior_year {	background-color:  #78AE00;}
.navbar-default.mainland {	background-color:  #BF1640;}


.navbar-brand p, .navbar-brand span {
    font-family: 'Roboto Condensed';
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
}

.navbar-brand em {
    font-style: normal;
}

.nav .navbar-nav {
    text-align: center;
}

.navbar-right a {
    font-family: 'Roboto Condensed';
	text-align: center;
    font-size: 1.2em;
    color: #ffffff !important;
    text-transform: uppercase;
	padding: 0px;
    line-height: 1;
    position: relative;
    z-index: 211;
    -webkit-transition: all 350ms ease-in-out;
    -moz-transition: all 350ms ease-in-out;
    -o-transition: all 350ms ease-in-out;
    transition: all 350ms ease-in-out;
}

.navbar-right li a:hover {
	color: #999 !important;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #FFFFFF;
}

.navbar-default .navbar-toggle{
	border-color:transparent ;
}


.curr_table {border:solid 2px #000000;}
.curr_table tr.sect {border-top:solid 2px #000000;}
.curr_table td, .curr_table th {padding:3px 8px;vertical-align:top; border: 1px solid #000000 !important;}
.curr_table th {font-style:italic;}
.curr_table td.facult_td {font-weight:bold;}
.curr_table td.code_td {text-align:center;}


footer {
	background-color: #999999; 
    margin-top: 40px;
}

.copyright-text {
    margin-top: 25px;
}

.copyright-text p {
    font-family: 'Dosis';
    font-size: 1.1em;
    color: #fff; /*#666;*/
}

.copyright-text a {
   color: #fff; /*#666;*/
}

.copyright-text em {
    font-style: normal;
    color: #666;
}

.back-to-top {
    margin-top: 15px;
    margin-left: 25%;
    width: 170px;
    height: 34px;
    text-align: center;
    display: inline-block;
}

.back-to-top a {
    font-family: 'Dosis';
    font-size: 1.2em;
    font-weight: 600;
    text-transform: uppercase;
    border: 3px solid #ccc;
    width: 170px;
    height: 40px;
    display: inline-block;
    line-height: 35px;
    text-align: center;
    color: #fff;
    text-decoration: none;
    background-color: #999;
}

.back-to-top a:hover {
    background-color: #666;
    border-color: #aaa;
}


a.anchor {
    display: block;
    position: relative;
    top: -75px;
    visibility: hidden;
}

.content{
	background-color: rgba(0,0,0,0.6); 
	padding:40px 80px 80px;
}

#back_to_top{
	text-decoration:none;
	color:#FFF;
}





/* Header*/
h1 {font-family:'Roboto Condensed';text-transform: uppercase;font-weight:700;color:#02B8BF;}
div.jupas h1.main-header{text-align:left;color:#02B8BF;}
div.das h1.main-header{text-align:left;color:#ff8d00;}
div.senior_year h1.main-header{text-align:left;color:#78AE00;}
div.mainland h1.main-header{text-align:left;color:#BF1640;}


h1 > span { display: block; font-size: 0.6em; font-weight: normal; line-height: 1; color:#333333;}

h2 {font-family:'Roboto Condensed';text-align:center;text-transform: uppercase;font-weight:700;}
h2.white {color:#FFF;}
h2.dot:after {padding-left:2vh;font-family: FontAwesome; content: "\f111"; font-size:0.3em;}

div.jupas h2{color:#02B8BF;}
div.jupas h2.white {color:#FFF;}
div.jupas h2.dot.white:after {color:#00f6ff;}
div.jupas h2.dot:after {color:#999;}

div.das h2{color:#ff8d00;}
div.das h2.white {color:#FFF;}
div.das h2.dot.white:after {color:#ffec7b;}
div.das h2.dot:after {color:#6a6a6a;}

div.senior_year h2{color:#78AE00;}
div.senior_year h2.white {color:#FFF;}
div.senior_year h2.dot.white:after {color:#b0ff00;}
div.senior_year h2.dot:after {color:#999999;}

div.mainland h2{color:#BF1640;}
div.mainland h2.white {color:#FFF;}
div.mainland h2.dot.white:after {color:#fd7294;}
div.mainland h2.dot:after {color:#999999;}


h3{font-family:'Roboto Condensed';text-transform: uppercase;font-weight:700; color:#333;}
h3.white {color:#FFF;}

h4 {font-family:'Roboto Condensed';text-transform: uppercase;font-weight:700;}
h5 {font-family:'Roboto Condensed';text-decoration:underline;font-weight:600;}
h4.white, h5.white{color:#FFF;}


hr{border-top: 1px solid #999;}


#home-menu{
	display: block;
	position:fixed;
	top:13vw;
	left:2vw;
	z-index: 999;
	width: 18vw;
	padding: 0;
	margin:0;
}

#home-menu nav{
	padding:1vw;
	height:100%;
	background-color:rgba(255,255,255,1);
	border-radius: 25px;
    padding: 20px; 
}

#home-menu .menu.jupas{	border: 2px solid #02B8BF;}
#home-menu .menu.das{	border: 2px solid #ff8d00;}
#home-menu .menu.senior_year{	border: 2px solid #78AE00;}
#home-menu .menu.mainland{	border: 2px solid #BF1640;}

#home-menu ul.ip-sub{
	margin-left:-1vw;
}

#home-menu li {
	margin-left:-1vw;
	color: #000;
}

#home-menu nav.jupas li.active, #home-menu nav.jupas li.active a{	color: #02B8BF; }
#home-menu nav.das li.active, #home-menu nav.das li.active a{	color: #ff8d00; }
#home-menu nav.senior_year li.active, #home-menu nav.senior_year li.active a{	color: #78AE00; }
#home-menu nav.mainland li.active, #home-menu nav.mainland li.active a{	color: #BF1640; }

#home-menu li a{
	text-decoration:none;
	color: #333;
	font-family:'Roboto Condensed';
	font-style:italic;
	font-size:16px;
}

#home-menu .menu.jupas li a:hover{	background-color: #c6f5f6;}
#home-menu .menu.das li a:hover{	background-color: #ffec7b;}
#home-menu .menu.senior_year li a:hover{	background-color:	#caf000;}
#home-menu .menu.mainland li a:hover{	background-color:	#fdd1dc;}

#home-menu li a,
#home-menu li.active a{
	padding: 3px 8px;
	display:block;
}



.bs-wizard {margin-bottom: 60px;}

/*Form Wizard*/
.bs-wizard {border-bottom: solid 1px #e0e0e0; padding: 0 0 10px 0;}
.bs-wizard > .bs-wizard-step {padding: 0; position: relative;}
.bs-wizard > .bs-wizard-step + .bs-wizard-step {}
.bs-wizard > .bs-wizard-step .bs-wizard-stepnum {color: #595959; font-size: 14px; margin-bottom: 5px;}
.bs-wizard > .bs-wizard-step .bs-wizard-info {color: #999; font-size: 12px;}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot {position: absolute; width: 30px; height: 30px; display: block; top: 45px; left: 50%; margin-top: -15px; margin-left: -15px; border-radius: 50%;} 


.bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {content: ' '; width: 14px; height: 14px; background: #fbbd19; border-radius: 50px; position: absolute; top: 8px; left: 8px; } 
.bs-wizard > .bs-wizard-step > .progress {position: relative; border-radius: 0px; height: 8px; box-shadow: none; margin: 20px 0;}
.bs-wizard > .bs-wizard-step > .progress > .progress-bar {width:0px; box-shadow: none; }

.bs-wizard.jupas > .bs-wizard-step > .progress > .progress-bar, 
.bs-wizard.jupas > .bs-wizard-step > .bs-wizard-dot, 
.bs-wizard.jupas > .bs-wizard-step > .bs-wizard-dot:after 
{background: #02B8BF;}

.bs-wizard.das > .bs-wizard-step > .progress > .progress-bar, 
.bs-wizard.das > .bs-wizard-step > .bs-wizard-dot, 
.bs-wizard.das > .bs-wizard-step > .bs-wizard-dot:after  
{background: #ff8d00;}

.bs-wizard.senior_year > .bs-wizard-step > .progress > .progress-bar, 
.bs-wizard.senior_year > .bs-wizard-step > .bs-wizard-dot, 
.bs-wizard.senior_year > .bs-wizard-step > .bs-wizard-dot:after  
{background: #78AE00;}

.bs-wizard.mainland > .bs-wizard-step > .progress > .progress-bar, 
.bs-wizard.mainland > .bs-wizard-step > .bs-wizard-dot, 
.bs-wizard.mainland > .bs-wizard-step > .bs-wizard-dot:after  
{background: #BF1640;}

.bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {width:100%;}
.bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {width:50%;}
.bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {width:0%;}
.bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {width: 100%;}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {background-color: #f5f5f5;}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {opacity: 0;}
.bs-wizard > .bs-wizard-step:first-child  > .progress {left: 50%; width: 50%;}
.bs-wizard > .bs-wizard-step:last-child  > .progress {width: 50%;}
/*END Form Wizard*/



/* Lighting alarm effect*/

.area {
   position: relative;
   animation: 3s linear 0s infinite alternate advanced;
}

@keyframes advanced {
  0%, 25% {
    transform: translateX(-90%);
    left: 100%;
  }
  75%,
  100% {
    transform: translateX(-110%);
    left: 100%;
  }
}


a.short-link { display: none; }

@media (min-width:320px){ 

#homepage{
	padding-top:3vh;
}

h1.main-header{font-size:1.8em;}
h2{font-size:1.6em;padding-top:1.5vh;padding-bottom:1.6em;}
h2.link{padding-bottom:0vh;}
h3{font-size:1.3em;padding-bottom:2vh;}
h4{font-size:1.2em;padding-top:2vh;padding-bottom:1vh;}
h5{font-size:1.0em;padding-top:2vh;padding-bottom:1vh;}

h2.dot:after{font-size:6px;}

/*p, b, em {font-size:1em;}*/
p, b, em {font-size:15px;}

.navbar-brand p, .navbar-brand span {
	font-size:0.75em;
}

.fa-stack.larger {
    font-size: 2em;
}

.container.page{
	width:80%;
}



.menu ul li {
	font-size:0.8em;
}

a.short-link { display: inline-block; }
a.full-link { display: none; }

}



@media (min-width:768px){ 

#homepage{
	padding:6%;
}

h1.main-header{font-size:4.5em;}
h2{font-size:3.2em;padding-top:0;padding-bottom:1em;}
h2.link{padding-bottom:0;}
h3{font-size:1.8em;}
h4{font-size:1.6em;padding-top:2vh;padding-bottom:1vh;}
h5{font-size:1.3em;padding-top:2vh;padding-bottom:1vh;}
h2.dot:after{font-size:8px;}

p, b, em {font-size:15px;}
ul li {font-size:15px;}
ul li ul li {font-size:15px;}

.navbar-brand p, .navbar-brand span {
	font-size:1.2em;
}

.fa-stack.larger {
    font-size: 4em;
}

.container.page{
	padding:3% 6%;
	width:95%;
}

.menu ul li {
	font-size:1.2em;
}

a.short-link { display: inline-block; }
a.full-link { display: none; }

}


@media (min-width:1024px){ 

#homepage{
	padding:6% 6% 6% 22vw;
}

h1.main-header{font-size:4.5em;}
h2{font-size:3.2em;padding-top:0;padding-bottom:5%;}
h2.link{padding-bottom:0;}
h3{font-size:1.8em;}
h4{font-size:1.6em;padding-top:2vh;padding-bottom:1vh;}
h5{font-size:1.3em;padding-top:2vh;padding-bottom:1vh;}
h2.dot:after{font-size:0.2em;}

/*p, b, em, ul {font-size:1.1em;}*/
p, b, em {font-size:15px;}
ul li {font-size:15px;}
ul li ul li {font-size:15px;}

.navbar-brand p, .navbar-brand span {
	font-size:1.2em;
}

.fa-stack.larger {
    font-size: 4em;
}

.container.page{
	padding:3% 6% 6% 22vw;
	width:95%;
}

.container.detail{
	padding:3% 6% 0% 22vw;
	width:95%;
}

.menu ul li {
	font-size:1.2em;
}

a.short-link { display: none; }
a.full-link { display: inline-block; }
}