*{padding: 0; margin: 0; box-sizing: border-box;}
html{
	scroll-behavior: smooth;
}

body{height: 900px;}
header {
	background: url('https://unsplash.com/photos/n8Qb1ZAkK88');
	text-align: center;
	width: 100%;
	height: auto;
	background-size: cover;
	background-attachment: fixed;
	position: relative;
	overflow: hidden;
	border-radius: 0 0 85% 85% / 30%;
}
header .overlay{
	width: 100%;
	height: 100%;
	padding: 50px;
	color: #FFF;
	text-shadow: 3px 3px 3px #333;
	background: linear-gradient(-45deg, #eeaa52, #e73c7e, #23a6d5, #23d5ab);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
}
@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}




nav.sidebar .navbar-nav .open .dropdown-menu {
	position: static;
	float: none;
	width: auto;
	margin-top: 0;
	background-color: transparent;
	border: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
}

nav.sidebar .navbar-collapse, nav.sidebar .container-fluid{
    padding: 0 0px 0 0px;
}

navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
    color: #777;
}

nav.sidebar{
	width: 200px;
	height: 100%;
    margin-left:-168px;
	float: left;
	z-index: 8000;
	margin-bottom: 0px;
}

nav.sidebar li {
    width: 100%;
}

nav.sidebar:hover{
    margin-left: -20px;
}

div > nav > div > ul{
    width:198px;
}

nav.sidebar, .main{
    -webkit-transition: margin 300ms ease-out;
    -moz-transition: margin 300ms ease-out;
    -o-transition: margin 300ms ease-out;
    transition: margin 300ms ease-out;
}
header:hover > span::before {
    margin-right: 3px;
    content: '<';
}

header:hover > span::after {
    margin-left: 3px;
    content: '>';
}

.nav1 a:hover{
	text-decoration: none;
}


@media only screen and (max-width: 1023px) {
	#navbar{
		display: none;
	}
	
	#aboutme{
		width: 100%;
	}
	#myimg{
		width: 100%;
	}
	#detail{
		width: 100%;
	}
}
@media only screen and (min-width: 1023px) {
	
	#mobnav{
		display: none;
	}
	
}
@media only screen and (max-width: 991px) {
	#navbar{
		display: none;
	}
	
}