-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */

	* {
margin: 0;
padding: 0;
}
	body {
		margin:0;
		font-family: Verdana, Arial;
		font-size: 62.5%;
		min-width:320px;
		padding:0;
		color:#333;		
	}

	
.clear { clear: both; }
.floatLeft { float: left;}
.floatRight { float: right;}

h1, h2, h3, h4,h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
dl, dt, dd, ol, fieldset, form, label, input, textarea, span, button{
//vertical-align: baseline;
line-height: 1em;
font-family: inherit;
font-weight: inherit;
font-style: inherit;
outline: 0;
padding: 0;
margin: 0;
border: 0;

}

h1, h2, h3, h4, h5, h6, ul, li, em, strong, pre, code, a {
padding: 0;
margin: 0;
line-height: 1em;

//font-weight: normal;
//font-style: normal;
border: 0;
outline: 0;
font-family: "open sans",arial,sans-serif;
}
ul {
list-style: none;
}
img {
border: 0;
}
p {
//margin: 1em 0;
}
a{
color: #333;
}

a:hover{
    color:#585858;
}

a:visited{

}

p {
padding: 0;
margin: 0;
}

.leftfloat{
    float: left;
}
	#wrap {
		width: 100%; /*96em*/
		margin:0 auto;
	    position: relative;	 
	            /*border-right: 1px solid #ccc;   
	            border-left: 1px solid #ccc;   */
	}
	


#topNav {
    position: relative;
    width: 100%;
    height: 3em;
    background-color: #1C5B40;
    color: #fff;
    display: flex;
    align-items: center;
    font-size: 1.5em;
}

/* Inner constrained row */
.topNav-inner {
    width: 100%;
    margin: 0 auto;
    padding: 6px 12px;

    display: flex;
    align-items: center;
    justify-content: flex-start; /* everything starts from left */
}

/* Left side: contact */
#contact {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
}

/* Phone */
.phone {
    white-space: nowrap;
}

/* Facebook icon (no image) */
.fb-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.4em;
    height: 1.4em;
    border: 1px solid #fff;
    border-radius: 50%;
    font-weight: bold;
    font-family: Arial, sans-serif;
    color: #fff;
    text-decoration: none;
    line-height: 1;
}

.fb-icon:hover {
    background: #fff;
    color: #1C5B40;
}

/* Right side: language switch */
#lang {
    margin-left: auto; /* pushes it to the far right */
    display: flex;
    gap: 10px;
}

#lang a {
    color: #fff;
    text-decoration: none;
    font-weight: 600;
}

#lang a:hover {
    color: orange;
}

#lang a:first-of-type {
    border-right: 1px solid #fff;
    padding-right: 0.5em;
}



/* RESET */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* HEADER */
#header {
    width: 100%;
    background-color: #fff;
    border: 1px solid #ccc;
}

/* INNER WRAPPER */
#headerwrap {
    max-width: 118em;
    margin: 0 auto;
    padding: 2em 1em;
    font-family: 'Nunito', serif;
    text-transform: uppercase;
}






/* FLEX ROW */
.header-row {
    display: flex;
    align-items: center;      /* vertical centering */
    justify-content: center; /* center the entire clickable group */
}



.header-row > a {
    display: flex;
    align-items: center;
    gap: 2em;
    text-decoration: none;
    width: fit-content; /* 🔑 KEY LINE */
}






/* LOGO */
#logo img {
    width: 8em;
    max-width: 100%;
    display: block;
}

/* TEXT BLOCK */

.header-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    gap: 1em; /* vertical space between the two rows */
    color: #1C5B40;
}


/* MAIN TITLE */
#webTitleMULS {
    font-size: 1.5em;
    line-height: 1.1;
}

#webTitleMULS a {
    text-decoration: none;
}

#webTitleMULS a:hover {
  /*  color: #FFA500;*/
}

/* SUB TITLE */
#webTitleSAB {
    font-size: 3.3em;
    margin-top: 0.3em;
}





/* =========================
   PRIMARY NAV WRAPPER
   ========================= */
#primary_nav_wrap {
    width: 100%;
    background: #1C5B40;
    position: relative;
    z-index: 9999;
    overflow: visible;
    text-transform: uppercase;
    font-size: 1.5em;
}

/* Centerwrap (optional) */
#centerwrap {
    
    
}

/* =========================
   FIRST-LEVEL UL
   ========================= */
#primary_nav_wrap ul {
    display: flex;           /* horizontal menu */
    align-items: center;
    justify-content: center; /* ✅ centers menu items */
    list-style: none;
    padding: 0;
    margin: 0;
}

/* =========================
   FIRST-LEVEL LI
   ========================= */
#primary_nav_wrap ul li {
    position: relative;      /* anchor for submenu */
    margin: 0;
    padding: 0;
    white-space: nowrap;
}

/* =========================
   FIRST-LEVEL LINKS
   ========================= */
#primary_nav_wrap ul li > a {
    display: block;
    padding: 0 25px;
    color: #fff;
    text-decoration: none;
    line-height: 2.5em;
}

#primary_nav_wrap ul li > a:hover {
    color: #FFA500;
    background: #1C5B40;
}



/* =========================
   SECOND-LEVEL SUBMENU
   ========================= */
#primary_nav_wrap ul li ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;                     /* default direction */
    background: #1C5B40;
    width: max-content;
    min-width: 100%;
    max-width: 320px;
    z-index: 10000;
    box-shadow: 0 6px 16px rgba(0,0,0,0.25);
}

/* Show submenu on hover */
#primary_nav_wrap ul li:hover > ul {
    display: block;
}

/* =========================
   FLIP SUBMENU FOR LAST ITEMS
   ========================= */
#primary_nav_wrap ul li:last-child ul,
#primary_nav_wrap ul li:nth-last-child(2) ul {
    left: auto;
    //right: 0;
}

/* =========================
   SECOND-LEVEL LI
   ========================= */
#primary_nav_wrap ul li ul li {
    width: 100%;
    text-align: left;
}

/* =========================
   SECOND-LEVEL LINKS
   ========================= */
#primary_nav_wrap ul li ul li a {
    display: block;
    padding: 6px 25px;
    color: #fff;
    text-decoration: none;
    line-height: 1.4em;
}

#primary_nav_wrap ul li ul li a:hover {
    color: #FFA500;
    background: #444;
}



a {
text-decoration: none;
}


#heroSlider{
    position: relative;
    width: 100%;
    height: 23em;
    margin: 0 auto;
    z-index: 1;
}



/* Each slide */
#heroSlider .slide {
  position: absolute;
  inset: 0; /* top:0; right:0; bottom:0; left:0 */
  opacity: 0;
  transition: opacity 0.8s ease;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
}

/* Active slide visible */
#heroSlider .slide.active {
  opacity: 1;
  z-index: 1;
}

/* Overlay for text */
#heroSlider .overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* Overlay text */
#heroSlider .overlay-content h2 {
  font-size: 2rem;
  margin: 0;
}

/* Link inside headline */
#heroSlider .overlay-content h2 a {
  color: #fff;
  text-decoration: none;
}

#heroSlider .overlay-content h2 a:hover {
  text-decoration: underline;
}

/* Dots */
#heroSlider .dots {
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
  z-index: 2;
}

#heroSlider .dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(255,255,255,0.4);
  cursor: pointer;
}

#heroSlider .dot.active {
  background: #fff;
}






#centeredmenu {
   float:left;
   width:100%;
   overflow:hidden;
   position:relative;
   background-color: #dbdbdb;
}


#main {
	position: relative;
	width: 100%;	
	margin:0 auto;
	//border-right: 1px dashed #1C5B40;
}

#main li, #main a{
    font-size: 1.2em;
    line-height: 1.5em;
    text-align: justify;
}
	
#main:after{
    clear: both;
    content: "";
    display: block;
}



#contentWrapper{	
	width: 108em;
	margin: 0 auto;
}


#contentHome {
position: relative;
width: 100%;
}

	
#contentHome p {
font-size: 1.2em;
line-height: 1.5em;
margin-bottom: 1em;
text-align: justify;
}

#contentHome h1{
	font-size: 3em;	
	font-weight: -10;
}

#contentHome h2{
	font-size: 2em;	
	font-weight: -10;
}

#contentHome h3{
	font-size: 1.5em;	
	font-weight: -10;
	text-align: center;
	color:#eee;
}

#contentHome h1, h3, h4, h5, h6,  #contentRight h1, h3, h4, h5, h6{
	line-height: 2em;
}
	


#contentHome a:hover{
	color: #FFA500 !important;
}


#contentHome a:hover h3,
#contentHome a:hover h4,
#contentHome a:hover
 {
  color: #FFA500 !important;
}

#newsContainer{
    width: 100%;
    background-color: #FDFBF7;
    height: auto;
    padding: 3em 0;
}


#newsWrapper, #degreeWrapper, #internationalWrapper, #hubWrapper{
    position: relative;
    width: 136.6em;
    margin: 0 auto;
}

#newsWrapper{
    display: flex;
    justify-content: space-between;
}

#news{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto auto;
    gap: 1.3em;
    width: 101.6em;
}

.newsTitleGen{
    padding: .1em 0 2em 0;
    font-weight: bold;
    grid-column: 1 / -1;
    justify-self: start;
    text-align: left;
}

.homeTitleLinksBig{
    color: #333;
    text-transform: uppercase;
}

/* ===============================
   NEWS CARD (GRID OVERLAY METHOD)
   =============================== */

.transplayer{
    display: grid;
    grid-template-areas: "stack";
    overflow: hidden;
    grid-row: 2;
    align-items: end;
}

/* stack all children */
.transplayer > *{
    grid-area: stack;
}

/* image layer */
.transplayer img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    z-index: 1;
}

/* category badge (top-left) */
.catTitle{
    align-self: start;
    justify-self: start;
    margin: 8px;
    color: #555;
    padding: 4px 6px;
    font-size: 1em;
    text-decoration: none;
    background: rgba(255,255,255,0.85);
    z-index: 3;
    max-width: calc(100% - 16px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


/* 1. Target the H3 now, not the link */
.newsTitle {
    align-self: end;
    margin: 0;
    padding: 10px;
    background: rgba(89, 89, 89, 0.7); 
    color: #fff;
    line-height: 1.4;
    z-index: 2;
    width: 100%; /* Ensure it spans the full width of the card */
    box-sizing: border-box; /* Prevents padding from breaking the width */
    text-align: center;
    overflow: hidden;
}

/* 2. Simplified link styles */
.newsTitle a {
    color: #fff;
    text-decoration: none;
    display: block; 
    font-size: 14px;
    background: none !important; /* Forces no background on the link itself */
    
    
    

    width: 100%;
    text-align: center;
    white-space: normal;        /* allow wrapping */
    word-break: break-word;     /* break long words */
    overflow-wrap: anywhere;    /* modern fallback */

    line-height: 1.35;
}
/* ===============================
   NEWS AD COLUMN
   =============================== */

#newsAd{
    display: grid;
    grid-template-rows: auto 1fr;
    width: 33em;
}


#degreeContainer{
    width: 100%;
    background-color: lightyellow;
    height: auto;
    padding: 8em 0;
}


#degreePrograms{
  display: flex;
  gap: 10em;
}

.degreeType {
  flex: 1;
  min-width: 0;
  box-sizing: border-box;
}

.degreeType h3{
    text-transform: uppercase;
    padding-bottom: 1em;
}

#internationalContainer{
    width: 100%;
    background-color: #ddd;
    height: auto;
    padding: 8em 0;
}


#internationalPrograms{
  display: flex;
  gap: 10em;
}

.internationalType {
  flex: 1;
  min-width: 0;
  box-sizing: border-box;
}

.internationalType h3{
    text-transform: uppercase;
    padding-bottom: em;
}


#hubContainer{
    width: 100%;
    background-color: #e2f6ed;
    height: auto;
    padding: 8em 0;
}


#hubPrograms{
  display: flex;
  gap: 10em;
}

.hubType {
  flex: 1;
  min-width: 0;
  box-sizing: border-box;
}

.hubType h3{
    text-transform: uppercase;
    padding-bottom: 1em;
}


.dateMore{
	padding-top: 1em;
	padding-right: 1em;
	padding-bottom: 1em;
}

.dateMoreBorder{
	border-bottom: 1px solid #f4f4f4;
}

	

/*
.newsitem{
	padding-left: 1em;
	padding-right: 1em;
	padding-bottom: 2em;
	text-align: justify;
	box-sizing: border-box;
}

.newsitem h4{
	font-size: 1.2em;
	font-weight: bolder;
	text-align: left;
	line-height: 1.2em;
	text-transform: uppercase;
	text-shadow: 0 0 0 #4c4c4c;
}
*/
.pagination{
	 text-align:center;
}

.pagination ul{
display: inline-table;
}

.pagination ul li{
	float: left;
	padding-right: 1em;
	display: inline;
}


#slider11{
	padding: 1em 0;
}
#footer {
	clear:both;
	/*border: 1px solid #333;8*/
	height: auto;
	padding: 2em 0;
    width: 100%;
    text-align: center;	
	background-color: #1C5B40;
	font-style: strong;
	}

#footer a{
color: #fff;
}	

#footer a:hover{
color: #FFA500;
}	

#ffs{
display: inline-block; //centering
}

.ff	{
float: left;
color: #fff;
position: relative;
font-size: 1.2em;
line-height:1.5em;
width:23em;
border-right: 1px solid lightgray; 
}

.ff:first-child {
  //width: 18em;
}

.ff:last-child {
  border-right: none;
  width: 28em;
}




#footer p {
		margin:0;
    }
    
* html #footer {
 		height:.1em;
	}

	
.WireFatalError {
	background: #a30000; 
	color: #fff; 
	padding: 1em; 
	position: relative;
	z-index: 9999;
}

