/* Department CSS Document */
/*For mobile first adaptive design place styles for mobile and up in the mobile and up area.
Place styles for tablet and up inside the media query in the tablet and up area.
Place styles for desktop only inside the media query in the desktop only area.

For questions or media query training contact Web & Mobile Solutions.
*/
/*===============MOBILE AND UP===============*/
header.uccu-global-header {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr auto 1fr;
	min-height: 80px;
	padding: 20px;
	align-items: center;
}

header.uccu-global-header .uccu-logo img {
	width: 140px;
	max-width: 100%;
}

header.uccu-global-header .uccu-social-header {
	display: none;
}

/* Hide the structural state checkbox */
.menu-toggle {
  display: none;
}

/* Floating Hamburger Button Design */
.hamburger-btn {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 30px;
  height: 21px;
  cursor: pointer;
}

.hamburger-btn span {
  display: block;
  height: 3px;
  width: 100%;
  background-color: #0079C2;
  border-radius: 3px;
  transition: all 0.3s ease-in-out; /* Smooth transition when turning into an X */
}

/* Off-Screen Slideout Panel Styles */
.slideout-menu {
  position: fixed;
  top: 0;
  right: 0;
  width: 280px;
  height: 100vh;
  background-color: #fff;
  z-index: 999;
  padding: 20px;
  /* Push panel completely off-screen to the left */
  transform: translateX(110%); 
  transition: transform 0.3s cubic-bezier(0.77, 0.2, 0.05, 1.0);
  box-shadow: 2px 0 10px rgba(0, 0, 0, 0.3);
	overflow-y: auto;
}

/* Menu Navigation Links */
.slideout-menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.slideout-menu ul li a {
    display: block;
    padding: 15px 0;
    text-decoration: underline;
    transition: background 0.2s ease;
    font-family: "Calibri", sans-serif;
    font-size: 27px;
    font-weight: normal;
    color: #707070;
}

.slideout-menu ul li a:hover {
  text-decoration: none;
}

.slideout-menu h2 {
	font-family: "Rajdhani", sans-serif;
    font-size: 36px;
    font-weight: 600;
}

/* Main Body Content Formatting */
.main-content {
  padding: 40px 40px 40px 80px;
  transition: transform 0.3s cubic-bezier(0.77, 0.2, 0.05, 1.0);
}

/* ==========================================
   STATE TRIGGERS (The Pure-CSS Magic)
   ========================================== */

/* 1. Slide the menu viewport into position when checked */
.menu-toggle:checked ~ .slideout-menu {
  transform: translateX(0);
}

/* 2. Optional: Shift main text layout slightly right (Push Content Effect) */
.menu-toggle:checked ~ .main-content {
  transform: translateX(40px);
}

/* 3. Morph hamburger lines into an 'X' close icon */
.menu-toggle:checked + .hamburger-btn span:nth-child(1) {
  transform: translateY(9px) rotate(45deg);
  background-color: #0079C2; /* Changes color to contrast with dark menu */
}

.menu-toggle:checked + .hamburger-btn span:nth-child(2) {
  opacity: 0; /* Hides middle line */
}

.menu-toggle:checked + .hamburger-btn span:nth-child(3) {
  transform: translateY(-9px) rotate(-45deg);
  background-color: #0079C2;
}

/**** Footer ****/

	footer {
			border-top: 11px solid #00A88F;
	border-bottom: 11px solid #000;
	}
.uccu-footer .logo-desktop {
	display: none;
}

.uccu-footer .logo-desktop img, .uccu-footer .logo-mobile img {
	max-width: 200px;
}
.uccu-footer {
	display: grid;
	grid-template-rows: auto 1fr;
	grid-template-columns: 1fr;	
}

.footer-contact {
	background-color: #000;
	color: #fff;
	grid-row: 2/3;
	padding: 40px;
	justify-items: center;
	font-family: "Calibri", sans-serif;
	font-size: 16px;
	color: #fff;
}

.footer-contact a {
	color: #fff;
	text-decoration: underline;
}

.footer-contact a:hover {
	text-decoration: none;
}

.footer-links {
	grid-row: 1/2;
	padding: 40px;
}

.footer-links h2 {
	font-family: "Rajdhani", sans-serif;
	font-size: 36px;
	font-weight: bold;
}

.footer-links ul {
	list-style: none;
	padding-left: 0px;
}

.footer-links ul li {
	margin: 15px 0;
}

.footer-links ul li:last-of-type {
	margin-bottom: 40px;
}

.footer-links ul li a {
	font-family: "Calibri", sans-serif;
	font-size: 27px;
	color: #707070;
	text-decoration: underline;
}

.footer-links ul li a:hover {
	text-decoration: none;
}

.swiper-footer .swiper-slide img {
    display: block;
    width: 100%;
    max-width: 1000px;
    height: auto;
    margin-inline: auto;
}

/**** End Footer Mobile ****/



/*End mobile and up styles*/
/*===============TABLET AND UP===============*/
@media only screen and (min-width: 760px) {
	


	
	
}/*end media query*/
/*End tablet and up styles*/
/*===============DESKTOP ONLY===============*/
@media only screen and (min-width: 1100px) {

header.uccu-global-header {
	grid-template-columns: 150px auto 300px;
}

	header.uccu-global-header .uccu-social-header {
	font-size: 27px;
	justify-self: end;
	display: flex;
}

.hamburger-btn {display: none;}
	
.slideout-menu {
position: relative;
        height: auto;
        width: auto;
        translate: none;
        /*padding: 0 100PX;*/
        display: flex;
        flex-direction: row;
        overflow-y: visible;
        box-shadow: none;
        transform: none;
        justify-content: flex-end;
}

.slideout-menu h2 {
	font-family: "Calibri", sans-serif;
	font-size: 22px;
	color: #000;
	font-weight: normal;
	margin: 0px 50px 0 0;
}
	
	
.uccu-nav ul {
	display: none;
	position: absolute;
        background-color: #fff;
        z-index: 999;
        border-radius: 8px;
        box-shadow: 0px 3px 6px #00000043;
        padding: 30px;
}
	
.uccu-nav:hover > ul.nav-items  {
        display: block;
        
}	
	
	.slideout-menu ul.nav-items li a {
		font-size: 22px;
		color: #000;
		text-decoration: none;
	}
	
	.slideout-menu ul.nav-items li a:hover {
		text-decoration: underline;
	}
	
	
	/**** Footer ****/

	.uccu-footer {
		max-width: 1000px;
		margin: 0px auto;
	}
	
.uccu-footer .logo-mobile {
	display: none;
}
	

	
	.uccu-footer .logo-desktop {
	display: block;
		margin-bottom: 70px;
}
	
.uccu-footer {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr 1fr;	
	padding: 70px 0;
}
	
.footer-contact {
	background-color: #fff;
	color: #fff;
	grid-column: 1/2;
	grid-row: 1/1;
	padding: 0;
	justify-items: start;
	font-size: 18px;
	color: #707070;
	align-content: center;
}

.footer-contact a {
	color: #707070;
	text-decoration: underline;
}

.footer-contact a:hover {
	text-decoration: none;
}

.footer-links {
	grid-column: 2 / 3;
        grid-row: 1 / 1;
        padding: 0px;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
	
}
	
.footer-links h2 {
	font-size: 27px;
}
.footer-links ul li a {
	font-size: 20px;
}
	
	.footer-links ul li:last-of-type {
		margin-bottom: 0;
	}

	
	/**** End Footer Desktop ****/ 
	
}/*end media query*/
/*end desktop only styles*/
/*===============WIDE DESKTOP ONLY===============*/
@media only screen and (min-width: 1600px) {
		.uccu-footer {
		max-width: 1500px;
		margin: 0px auto;
	}
}/*end media query*/
/*end wide desktop only styles*/
/*END OF DOCUMENT*/