@charset "UTF-8";

/* 
 * Google Web Font Kit decleration 
 *	Webfont Family	:	Titillium Web
 */
@import url("../Fonts/embedded-fonts.css");

.cbp-hrmenu {
	width: 100%;
    list-style: none;
    margin-top: 55px;
	float: right;
	text-align: right;
	z-index: 1000;
	font-family: TitilliumWebRegular;
    list-style: none;
}

/* general ul style */
.cbp-hrmenu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* first level ul style */
.cbp-hrmenu > ul,
.cbp-hrmenu .cbp-hrsub-inner {
	width: 98%;
	max-width: 70em;
	margin: 0 auto;
	padding: 0 1.5em;
}

.cbp-hrmenu > ul > li {
	display: inline-block;
    list-style: none;
}

.cbp-hrmenu > ul > li > a {
	padding: 1em 1em;
	color: #e8e8e8;
	display: inline-block;
	font-size: 14pt;
	font-family: TitilliumWebSemiBold;
	text-decoration: none;
	outline: none;
    list-style: none;
    background: url(../Images/Icon/anamenu_ok.png) no-repeat 0 25px;
}

.cbp-hrmenu > ul > li > a:hover {
	color: #7bafd4;
    background: url(../Images/Icon/anamenu_ok_over.png) no-repeat 0 25px;
	
	/* transition effects */
	-webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}

.cbp-hrmenu > ul > li.cbp-hropen a,
.cbp-hrmenu > ul > li.cbp-hropen > a:hover {
	color: #7bafd4;
    background: url(../Images/Icon/anamenu_ok_over.png) no-repeat 0 25px;
    list-style: none;
    text-decoration: none;
	outline: none;
	
	/* transition effects */
	-webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}

/* sub-menu */
.cbp-hrmenu .cbp-hrsub {
	display: none;
	position: absolute;
	background-color: #FFF;
	background-color: rgba(255, 255, 255, 0.9);
	border-top: 3px solid #7bafd4;
	width: 988px;
	left: 0;
	text-align: left;
	margin-top: -8px;
	z-index: 1000;
    list-style: none;
}

.cbp-hropen .cbp-hrsub {
	display: block;
	padding-bottom: 2em;
    list-style: none;
}

.cbp-hrmenu .cbp-hrsub-inner > div {
	width: 23%;
	float: left;
    text-align: left;
	padding: 0 0.5em 0;
    list-style: none;
}

.cbp-hrmenu .cbp-hrsub-inner > div li {
	list-style: none;
    font-size: 6pt;
    line-height: 2.5em;
    text-align: left;
    padding: 0;
    margin-left: -20px;
    left: 0;
	font-family: TitilliumWebRegular;
}

.cbp-hrmenu .cbp-hrsub-inner:before,
.cbp-hrmenu .cbp-hrsub-inner:after {
	content: " ";
	display: table;
}

.cbp-hrmenu .cbp-hrsub-inner:after {
	clear: both;
}

.cbp-hrmenu .cbp-hrsub-inner > div li a {
	line-height: 0em;
	font-size: 10pt;
    color: #333;
    text-align: left;	
    outline: none;
    list-style: none;
    background: none;
}

.cbp-hrmenu .cbp-hrsub-inner > div li a:hover {
	color:  #999;
	
	/* transition effects */
	-webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}

.cbp-hrmenu .cbp-hrsub-inner > div a {
	line-height: 0em;
	font-size: 10pt;
    color: #333;
    text-align: left;	
    outline: none;
    list-style: none;
    background: none;
}
.cbp-hrmenu .cbp-hrsub-inner > div a:hover {
	color: #333;
	
	/* transition effects */
	-webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}

.cbp-hrmenu .cbp-hrsub-inner > div h4 {
	list-style: none;
    color: #999;
    font-size: 12pt;
	font-family: TitilliumWebSemiBold;
    border: none;
}



/* ==========================================================================
   itu.edu.tr media-queries
   ========================================================================== */
   
@media screen and (max-width: 1024px) {
	.cbp-hrmenu {
		width: 688px;
        position: relative;
	}

    /* sub-menu */
	.cbp-hrmenu .cbp-hrsub {
		width: 688px;
        position: absolute;
		left: 0;
		text-align: left;
		z-index: 2000;
		background-color: rgba(255, 255, 255, 0.9);
	}

}

@media screen and (max-width: 640px) {

	.cbp-hrmenu {
		width: 280px;
		position: relative;
		text-align: left;
		border: none;
		margin-bottom: 5px;
		top: 35px;
	}
	
	/* sub-menu */
	.cbp-hrmenu .cbp-hrsub {
		width: 280px;
        max-width: 280px;
        position: absolute;
		left: 0;
		text-align: left;
		margin-top: 15px;
        margin-left: -21px;
		z-index: 2000;
		background-color: rgba(255, 255, 255, 1);
	}
	
    .cbp-hrmenu .cbp-hrsub-inner > div {
	width: 100%;
	float: left;
    text-align: left;
	
}

	.cbp-hrmenu > ul > li {
		display: block;
		position: relative;
		margin-left: -24px;
	}
	
	.cbp-hrmenu > ul > li > a {
		color: #e8e8e8;
		display: block;
		font-size: 12pt;
		text-decoration: none;
		outline: none;
		line-height: 0.5em;
		margin-left: 6px;
		margin-top: -15px;
        background: url(../Images/Icon/anamenu_ok.png) no-repeat 0 15px;
	}
	
    .cbp-hrmenu > ul > li > a:hover {
	    background: url(../Images/Icon/anamenu_ok_over.png) no-repeat 0 15px;
    }

    .cbp-hrmenu > ul > li.cbp-hropen a,
    .cbp-hrmenu > ul > li.cbp-hropen > a:hover {
	    color: #7bafd4;
        background: url(../Images/Icon/anamenu_ok_over.png) no-repeat 0 15px;
        list-style: none;
        text-decoration: none;
	    outline: none;
    }

    .cbp-hrmenu .cbp-hrsub-inner > div li a {
	    line-height: 0em;
	    font-size: 9pt;
        color: #333;
        text-align: left;	
        outline: none;
        list-style: none;
        background: none;
    }

    .cbp-hrmenu .cbp-hrsub-inner > div li a:hover {
	    color:  #999;
    }

    .cbp-hrmenu .cbp-hrsub-inner > div h4 {
	    list-style: none;
        color: #999;
        font-size: 12pt;
	    font-family: TitilliumWebRegular;
        border: none;
    }
		
}