First Commit

_static/assets/css/header-0.css

@@ -0,0 +1,251 @@
+#topMain {
+	position:fixed;
+	left:0; top:0;
+	right:0; bottom:0;
+	background-color:rgba(0,0,0,0.95);
+	height:100%;
+	width:100%;
+	display:table;
+	z-index:9999;
+
+	-webkit-transform: translate3d(-100%,0,0);
+	transform: translate3d(-100%,0,0);
+	-webkit-transition: -webkit-transform 0.4s;
+	transition: transform 0.4s;
+	-webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
+	transition-timing-function: cubic-bezier(0.7,0,0.3,1);
+}
+
+#topMain .menu-content {
+	display: table-cell;
+	vertical-align: middle;
+	color:#fff;
+}
+#topMain .menu-content span a:hover,
+#topMain .menu-content p a:hover {
+	color:#fff;
+	text-decoration:none;
+}
+	#topMain .menu-content>.container {
+		position:inherit;
+	}
+
+
+
+
+/* Shown Menu */
+body.show-menu {
+	overflow: hidden;
+}
+body.show-menu #topMain {
+    -webkit-transform: translate3d(0,0,0);
+    transform: translate3d(0,0,0);
+    -webkit-transition: -webkit-transform 0.34s;
+    transition: transform 0.34s;
+    -webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
+    transition-timing-function: cubic-bezier(0.7,0,0.3,1);
+}
+
+body.show-menu .menu-list,
+body.show-menu .menu-list ul li {
+    -webkit-transform: translate3d(0,0,0);
+    transform: translate3d(0,0,0);
+    -webkit-transition: -webkit-transform 0.8s;
+    transition: transform 0.8s;
+    -webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
+    transition-timing-function: cubic-bezier(0.7,0,0.3,1);
+}
+
+body.show-menu .menu-list ul li {
+    -webkit-transition-duration: 0.9s;
+    transition-duration: 0.9s;
+    text-decoration: none;
+}
+
+
+/* menu list */
+.menu-list ul {
+	font-family:sans-serif;
+}
+.menu-list ul li {
+	line-height: 54px;
+}
+.menu-list ul li a {
+	color:#fff;
+	font-weight: 900;
+	font-size: 30px;
+	text-decoration:none;
+	letter-spacing: 2.5pt;
+}
+
+/* open button */
+ul.topNavBtn {
+	margin:0;
+}
+
+#menu_overlay_open:not(.custom-button) {
+    display: block;
+    border: none;
+    padding: 0;
+    cursor: pointer;
+    z-index: 1000;
+    height: 35px;
+    width: 35px;
+    background: transparent;
+    outline: 0;
+    float: right;
+    position: relative;
+    margin: 0;
+	margin-top:50%;
+}
+	#header.header-sm #menu_overlay_open {
+		margin-top:8px;
+	}
+	#header.header-md #menu_overlay_open {
+		margin-top:12px;
+	}
+	#header.fixed #menu_overlay_open {
+		margin-top:8px;
+	}
+
+#menu_overlay_open:not(.custom-button):hover{
+    border: 0;
+    box-shadow:none;
+}
+
+#menu_overlay_open:not(.custom-button)>span {
+    -webkit-transition: all 0.1s ease 0s;
+    transition: all 0.1s ease 0s;
+    display: block;
+    position: absolute;
+    width: 25px;
+    height: 2px;
+    left: 0;
+    right: 0;
+	top:21px;
+    margin: auto;
+    background: #545454;
+}
+
+#menu_overlay_open:not(.custom-button)>span:before,
+#menu_overlay_open:not(.custom-button)>span:after {
+    -webkit-transition: all 0.2s ease 0s;
+    transition: all 0.2s ease 0s;
+    position: absolute;
+    content: '';
+    width: 25px;
+    height: 2px;
+    background: #545454;
+    left: 0;
+}
+
+#menu_overlay_open:not(.custom-button)>span:after{
+    top: -5px;
+}
+
+#menu_overlay_open:not(.custom-button)>span:before{
+    bottom: -5px;
+}
+
+#menu_overlay_open:not(.custom-button)>span:before {
+  bottom: -5px;
+}
+#menu_overlay_open:not(.custom-button)>span:after {
+  top: -5px;
+}
+
+html.no-touch #menu_overlay_open:not(.custom-button):hover>span:after {
+    top: -7px;
+}
+
+html.no-touch #menu_overlay_open:not(.custom-button):hover>span:before {
+    bottom: -7px;
+}
+
+/* close button */
+#menu_overlay_close {
+	color: #fff;
+	position: absolute;
+	left: 50%; margin-left:-20px;
+	top: 0;
+	font-size: 25px;
+	width:60px;
+	height:60px;
+	cursor: pointer;
+	border:0;
+	background-color: rgba(255,255,255,0.1);
+
+	-webkit-transition: all .300s;
+	   -moz-transition: all .300s;
+		 -o-transition: all .300s;
+			transition: all .300s; 
+}
+#menu_overlay_close:hover {
+	background-color: rgba(255,255,255,0.15);
+}
+
+
+
+
+
+/* search */
+#header li.search {
+	padding-top:35px;
+}
+#header li.search .search-box {
+	display:none;
+	right: 0;
+	top: 100%;
+	padding: 15px;
+	background: #fcfafb;
+	position: absolute;
+	border-top: solid 2px #333;
+	box-shadow: 5px 5px rgba(91, 91, 91, 0.2);
+	width: 274px;
+	margin: -5px 0 0 0;
+	z-index: 22;
+}
+#header li.search i.sepy {
+	width: 1px;
+	height: 25px;
+	background: #eaeaea;
+	position: relative;
+	margin: 0 18px 0 16px;
+	display: inline-block;
+}
+#header li.search i.fa {
+	color: #333;
+	font-size: 16px;
+	cursor: pointer;
+	position: relative;
+	top: -6px;
+	width: 15px;
+	height: 15px;
+	opacity: 0.6;
+}
+form.mobile-search {
+	display:none;
+}
+	#header li.search .search-box form {
+		margin:0;
+	}
+
+
+
+
+
+
+@media only screen and (max-width: 768px) {
+	/*
+	#topMain {
+		position:absolute;
+	}
+	*/
+	#menu_overlay_close {
+		left: auto; right:0;
+		margin-left:0;
+	}
+	.menu-list ul li a {
+		font-size: 27px;
+	}
+}