#wrapper>.fixtop {
	position: relative;
	z-index: 10;
	top: 0;
	left: 0;
	right: 0;
}

/* https://blog.prototypr.io/css-only-multi-color-backgrounds-4d96a5569a20 */
#wrapper>.fixtop>header {
	background: -webkit-linear-gradient(-65deg, #fa7c30 20%, rgba(0, 0, 0, 0) 20%), url('../upload/pics/background.jpg');
	background: -o-linear-gradient(-65deg, #fa7c30 20%, rgba(0, 0, 0, 0) 20%), url('../upload/pics/background.jpg');
	background: -moz-linear-gradient(-65deg, #fa7c30 20%, rgba(0, 0, 0, 0) 20%), url('../upload/pics/background.jpg');
	background: linear-gradient(-65deg, #fa7c30 20%, rgba(0, 0, 0, 0) 20%), url('../upload/pics/background.jpg');
	/* background: -webkit-linear-gradient(110deg, #fa7c30 33%, rgba(0, 0, 0, 0) 33%), -webkit-linear-gradient(110deg, url('../upload/pics/background1-1.jpg') 66%, #fa7c30 66%);
	background: -o-linear-gradient(110deg, #fa7c30 33%, rgba(0, 0, 0, 0) 33%), -o-linear-gradient(110deg, url('../upload/pics/background1-1.jpg') 66%, #fa7c30 66%);
	background: -moz-linear-gradient(110deg, #fa7c30 33%, rgba(0, 0, 0, 0) 33%), -moz-linear-gradient(110deg, url('../upload/pics/background1-1.jpg') 66%, #fa7c30 66%); */
	/* background: linear-gradient(130deg, #fa7c30 15%, rgba(0, 0, 0, 0) 15%), linear-gradient(-60deg, #fa7c30 22%, rgba(0, 0, 0, 0) 22%), url('../upload/pics/background1-1.jpg'); */

	background-size: cover;
	background-position: 50% 21%;
	display: -webkit-flex;
	display: flex;
	height: 300px;
	opacity: 0.96;
	width: 100%;
}

#wrapper>.fixtop>header>h1 {
	color: white;
	margin: auto;
	transition-duration: 3s;
	cursor: pointer;
	text-shadow: black 5px 5px 5px;
	font-size: 35px;
}

#wrapper>.fixtop>header>h1:hover {
	transform: translateX(-30px);
	left: 10px;
	text-shadow: orangered 5px 5px 5px;
}

/* 2 - navigator 1 */
#wrapper>.fixtop>.nav1 {
	background-color: hsl(28, 5%, 10%);
	height: 60px;
}

#wrapper>.fixtop>.nav1 ul {
	max-width: 1000px;
	min-width: 640px;
	margin: auto;
	position: relative;
}

#wrapper>.fixtop>.nav1 li {
	display: inline-block;
	height: 50px;
	line-height: 50px;
	padding: 5px 15px;
	transition: all 0.8s;
}

#wrapper>.fixtop>.nav1 li:hover,
.item_active {
	background-color: hsla(28, 100%, 38%, 100%);
}

#wrapper>.fixtop>.nav1>ul>button {
	border-width: 0;
	background-color: transparent;
	position: absolute;
	background-image: url("../img/icons8-search-36.png");
	background-size: 100% 100%;
	width: 32px;
	height: 32px;
	top: 12px;
	margin-left: 20px;
	cursor: pointer;
}

#wrapper>.fixtop>.nav1>ul>button:hover {
	background-image: url("../img/icons8-search-36-orange.png");
}

#wrapper>.fixtop>.nav1 a {
	color: white;
	font-size: 18px;
}

/* -----navigator 2 for cell ---------- */
#wrapper>.fixtop>.nav2 {
	display: none;
	background-color: hsl(28, 5%, 10%);
	height: 5rem;
}

#wrapper>.fixtop>.nav2>#cellnavicon{
	background-color: hsla(28, 100%, 42%, 100%);
	float:left;
	align-items: center;
	justify-content: left;
	padding: 1rem 1.5rem;
}

#wrapper>.fixtop>.nav2>#cellnavicon:hover{
	cursor: pointer;
}

#wrapper>.fixtop>.nav2>#cellnavicon>span{
	position: relative;
}

#cellnavwrapper{
	position: absolute;
	top: 12.5em;
	left:0em;
	width: 40%;
	z-index: 100;
	background-color: hsl(28, 5%, 10%);
	border-radius: 0 5px 5px 0;
}

#menu-collapse{
	color: #fff;
	display: block;
	padding: 0.5em 1em;
	font-size: 1.4em;
}

.cellnav-line{
	border-bottom: 1px solid #666e75;
}

.cellnav-bg:hover{
	background-color:  hsla(28, 100%, 42%, 100%);
}

.cellnav-url{
	color: #fff;
	display: block;
	padding: 1.25em 1em;
	font-size: 1.25em;
	font-weight: bold;
	position: relative;
}

#wrapper>.fixtop>.nav2>button {
	border-width: 0;
	background-color: transparent;
	position: relative;
	background-image: url("../img/icons8-search-36.png");
	background-size: 100% 100%;
	width: 40px;
	height: 40px;
	margin-left: 2em;
	margin-top: 1.3em;
	cursor: pointer;
}

#wrapper>.fixtop>.nav2>button:hover {
	background-image: url("../img/icons8-search-36-orange.png");
}

.marquee {
	width: 100%;
	overflow: hidden;
	margin-left: 5%;
}

.marquee>.inner {
	margin-top: 0.3em;
	position: relative;
	width: 100%;
	display: flex;
	color: black;
	font-size: 1em;
	font-weight: bold;
}

.marquee .inner>* {
	white-space: nowrap;
	padding: 0 4em;
}
