@import url("util/main.css");


/*NAVIGATOR*/
#top_bar{
	/*margin-top: 20px;*/
	height: 50px;
	padding-top: 10px;
}
#top_bar div._block{
/*	display: inline-block;
	float: left;
	height: 70px;
	width: 100%;
	overflow: auto;*/

	-ms-overflow-style: none; /* Dành cho IE and Edge cũ */
    scrollbar-width: none;    /* Dành cho Firefox */
    
    /* Các thuộc tính cũ của bạn */
    display: inline-block;
    float: left;
    height: 50px;
    width: 100%;
    overflow: auto;
    cursor: grab;
    white-space: nowrap;
}
/* 2. Dành cho WebKit Browsers (Chrome, Safari) */
#top_bar div._block::-webkit-scrollbar {
    display: none; /* Ẩn toàn bộ thanh cuộn */
}
#top_bar div._block.active-dragging {
    cursor: grabbing;
}
#top_bar ul{
	list-style: none;
	display: inline-flex;
/*    width: 100%;
    justify-content: space-between;*/
}
#top_bar ul li{
	display: block;
	width: 100px;
	min-width: 150px;
	margin-right: 10px;
	line-height: 50px;
	border-radius: 10px;

	background-color: #FFFFFF;

	flex-shrink: 0; /* Đảm bảo li không bị co lại */
    text-align: center;
}
#top_bar ul li:hover{
	background-color: #BFBFBF;
}


/*TOP*/
section.acatalog_title{
	height: 200px;

	background-image: url(../image/sample/tech.jpg);
	background-size:cover;
	background-position: center;
	background-repeat: no-repeat;
}
section.acatalog_title div#_frm{
	display: block;
	width: 100%;
	height: 200px;
	text-align: center;
	line-height: 200px;
	color: rgba(255,255,255,0.5);
	font-size: 40px;
	font-weight: bold;

	background-color: rgba(0,0,0,0.7);
}

/*============＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*学習と技術のメモのSTYLE*/
/*============＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#techlist{
	background-image: url(../img/sample/techlist.jpg);
}


/*============＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*本棚のSTYLE*/
/*============＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#library{
	background-image: url(../img/sample/library.jpg);
}

/*============＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*オフの時間にしていること*/
/*============＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#hoppies{
	background-image: url(../img/sample/hoppies.jpg);
}

/*============＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*個人プロジェクト*/
/*============＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
#project{
	background-image: url(../img/sample/projects.jpg);
}