/**
 * Name: booNavigation.css
 * Date:Sun 16 Feb 2014
 * Author: Noemi Losada Estrella <info@noemilosada.com>
 * Creative Commons License <http://creativecommons.org/licenses/by-sa/3.0/>
 */

/** General
================================================== */
#booNavigation ul {
    margin: 0;
    padding: 0;
}
/*
body {
    font-family: 'Maven Pro', sans-serif;
    font-size: 1.1em;
    font-weight: 500;
    color: #333;
}
*/

.wrapper {
    width:100%;
	height:100%;
	/*background:#001a71;*/
	background:#333333;
}
@media screen and (max-width: 750px) {
	.wrapper {
    	font-size: 0.90em;
	}
}

@media screen and (max-width: 700px) {
	.wrapper {
    	font-size: 0.85em;
	}
}

@media screen and (max-width: 650px) {
	.wrapper {
    	font-size: 0.80em;
	}
}

@media screen and (max-width: 600px) {
	.wrapper {
    	font-size: 0.75em;
	}
}

@media screen and (max-width: 550px) {
	.wrapper {
    	font-size: 0.70em;
	}
}

@media screen and (max-width: 500px) {
	.wrapper {
    	font-size: 0.70em;
	}
}
/* ========== THE MAIN FONT 2018========== */
@font-face{
	font-family:"BebasNeue";
	src:url('fonts/BebasNeue-webfont.eot');
	src:url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
		url('fonts/BebasNeue-webfont.woff') format('woff'),
		url('fonts/BebasNeue-webfont.woff2') format('woff2'),
		url('fonts/BebasNeue-webfont.ttf') format('truetype'),
		url('fonts/BebasNeue-webfont.svg#BebasNeue') format('svg');
	}
	
	.menu{
	width:1140px;
	height:42px;
	/*background:#001a71;*/
	background:#333333;
	}
/* ========== END 2018========== */
ul li {
    list-style-type: none;
}

a {
    color: #333;
    text-decoration: none;
}

/** Navigation theme
================================================== */
.booNavigation {
    position: relative;
	max-width: 100%;
	margin: 0 auto;
	top: 0px; 
	left: 0px;
	width: 1100px;
	height:100%;
}

.booNavigation li.navItem {
	/**background-color: #001a71;*/
	background-color: #333333; 
	/** border-top: 5px solid #083555;*/
    padding: 0.5em 1.3% /**2%*/;
	text-align:center;
	float: left;
	text-decoration: none;

    transition: all .3s ease;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
	
}

.booNavigation li.navItem:hover {
    background-color: #282828;
	/** background-color: #555;*/
    border-color: #000;
    cursor: pointer;
}

.booNavigation li.navItem:hover > a {
    color: #64C1FF;
}

.booNavigation li.navItem > a {
	/**color: #fff;
	font-size: 1em;*/
	
	/** 2018 */
	display:block;
	font:22px "BebasNeue";
	color:#FFF;
	text-decoration:none;
	text-transform:uppercase;
	-webkit-transition:color 180ms linear 20ms, background 180ms linear 20ms;
	-moz-transition:color 180ms linear 20ms, background 180ms linear 20ms;
	-ms-transition:color 180ms linear 20ms, background 180ms linear 20ms;
	-o-transition:color 180ms linear 20ms, background 180ms linear 20ms;
	transition:color 180ms linear 20ms, background 180ms linear 20ms;
	}
	
.booNavigation li.navItem .navContent {
    background-color: #333333;
	/** background-color: #555;*/
    left: 0;
    position: absolute;
	text-align:left;
	top:auto;
    width: 100%;
    z-index: 999;
}

.booNavigation .navContent > li {
    color: #fff;
    float: left;
    padding: 10px;
	width: auto;
	font-family: 'Maven Pro', sans-serif;
    font-size: 0.9em;
}
.titlesection {
	/**DropMenu Titles */
	/** font-family: 'Arial', sans-serif;
	color:#99CCFF;
	font-weight:500;
	font-size: 1em;*/
	
	/** 2018 */
	font:21px "BebasNeue";
	color:#cbc6c6;
	text-transform:uppercase;
	border-bottom:solid 1px #FFFFFF;
	/** 2018:  width:350px;*/
}

.titlesection a {
	/**DropMenu Titles */
	/** font-family: 'Arial', sans-serif;
	color:#99CCFF;
	font-weight:500;
	font-size: 1em;*/
	
	/** 2018 */
	font:21px "BebasNeue";
	color:#cbc6c6;
	text-transform:uppercase;
	border-bottom:solid 1px #FFFFFF;
	/** 2018:  width:350px;*/
}


.booNavigation .titlesection1 ul li a {
	
	/** 2018 */
	font:21px "BebasNeue";
	color:#ff3333;
	text-transform:uppercase;
	border-bottom:solid 1px #FF3333;
	/** 2018:  width:350px;*/
	
}

.booNavigation .navContent ul li a {
	/**DropMenu Level 1*/
	/**color: #fff;
	display: block;
	padding: 1px;*/
	
	/** off 2019*//**  transition: all .3s ease;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;*/
	/** 2018 */
	padding:0;
	font:16px/24px Tahoma, Geneva, sans-serif;
	color:#a49382;
	text-transform:none;
	text-decoration:none;
	border:none;
}

.booNavigation .navContent ul li a:hover {
    /** off 2019*//**background-color: #555;
    padding-left: 20px;*/
	/** 2018 */color:#64C1FF;
}

.booNavigation .navContent ul li a.titlesection {
	transition:none;
	-webkit-transition:none;
	-moz-transition:none;
    -ms-transition:none;
    -o-transition:none;
	color:#99CCFF;
}

.booNavigation .navContent ul li a.titlesection:hover {
	background-color: #555;
    padding-left:1px;
}









/**
 * Name: booNavigation1.css
 * Date: April 2018
 * Author: Noemi Losada Estrella <info@noemilosada.com>
 * Creative Commons License <http://creativecommons.org/licenses/by-sa/3.0/>
 */

/** General
================================================== */
#booNavigation1 ul {
    margin: 0;
    padding: 0;
}
/*
body {
    font-family: 'Maven Pro', sans-serif;
    font-size: 1.1em;
    font-weight: 500;
    color: #333;
}
*/

.wrapper1 {
    width:990px;
	height:42px;
	background:#06df06;
}
}
@media screen and (max-width: 1300px) {
	.booNavigation {
    width: 100%;
	}
}
@media screen and (max-width: 1200px) {
	.booNavigation {
    width: 100%;
	}
}
@media screen and (max-width: 990px) {
	.booNavigation {
    width: 750px;
	}
}
@media screen and (max-width: 800px) {
	.booNavigation {
    width: 750px;
}
}
@media screen and (max-width: 750px) {
	.wrapper1 {
    	font-size: 0.90em;
	}
}

@media screen and (max-width: 700px) {
	.wrapper1 {
    	font-size: 0.85em;
	}
	.booNavigation {
   	width: 550px;
}
}

@media screen and (max-width: 650px) {
	.wrapper1 {
    	font-size: 0.80em;
	}
}

@media screen and (max-width: 600px) {
	.wrapper1 {
    	font-size: 0.75em;
	}
	.booNavigation {
    width: 390px;
	
	}
}

@media screen and (max-width: 550px) {
	.wrapper1 {
    	font-size: 0.70em;
	}
}

@media screen and (max-width: 500px) {
	.wrapper1 {
    	font-size: 0.70em;
	}
}
@media screen and (max-width: 400px) {
	
	.booNavigation {
    width: 390px;
	
}
}

/* ========== THE MAIN FONT 2018========== */
@font-face1{
	font-family:"BebasNeue";
	src:url('https://mpu.usj.edu.lb/manuel/css/fonts/BebasNeue-webfont.eot');
	src:url('https://mpu.usj.edu.lb/manuel/css/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
		url('https://mpu.usj.edu.lb/manuel/css/fonts/BebasNeue-webfont.woff') format('woff'),
		url('https://mpu.usj.edu.lb/manuel/css/fonts/BebasNeue-webfont.woff2') format('woff2'),
		url('https://mpu.usj.edu.lb/manuel/css/fonts/BebasNeue-webfont.ttf') format('truetype'),
		url('https://mpu.usj.edu.lb/manuel/css/fonts/BebasNeue-webfont.svg#BebasNeue') format('svg');
	}
	
/* ========== END 2018========== */

/** Navigation theme
================================================== */
.booNavigation1 {
    position: relative;
}

.booNavigation1 li.navItem {
	background-color: #ff3333;
	/**background-color: #333333; */
	/** border-top: 5px solid #083555;*/
    padding: 0.4em /**2%*/;
	float: left;
	text-decoration: none;

    transition: all .3s ease;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
	
}

.booNavigation1 li.navItem:hover {
    background-color: #ffffff;
	/** background-color: #555;*/
    border-color: #000;
    cursor: pointer;
}

.booNavigation1 li.navItem:hover > a {
    color: #4bd0ea;
}

.booNavigation1 li.navItem > a {
	color: #5b5b5b;
	font-size: 0.9em;
	}
	
.booNavigation1 li.navItem .navContent {
    background-color: #000000;
	/** background-color: #555;*/
    left: 0;
    position: absolute;
	text-align:left;
    top: 37px;
    width: 100%;
    z-index: 999;
}

.booNavigation1 .navContent > li {
    color: #fff;
    float: left;
    padding: 10px;
    width: 30%;
	font-family: 'Maven Pro', sans-serif;
    font-size: 0.9em;
}

.booNavigation1 .navContent ul li a {
	/**DropMenu Level 1*/
	/**color: #fff;
	display: block;
	padding: 1px;*/
	transition: all .3s ease;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	/** 2018 */
	color:#4bd0ea;
	text-transform:none;
	text-decoration:none;
	border:none;
}

.booNavigation1 .navContent ul li a:hover {
    background-color: #ffffff;
    padding-left: 10px;
	/** 2018 */color:#4bd0ea;
}

