html, body {
  width: 100%;
  height:100%;
}

body {
    background: linear-gradient(-45deg, #ee7752, #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%;
    }
}


#all {
  width: 1040px !important;
	background: #282629;
	color: #fff;
}
  
/* Header */
.logoheader {
background: url(../images/personal/header.png) no-repeat right;
  margin: 0px auto 0;
	color:#424242;
	min-height: 400px;
    width: 1040px;
    padding: 0;
    text-align: left;
    font-weight: normal;
    line-height: 1.5em
}
#header {
    display: block !important;
    position: relative;
    padding: 4em 0 0 0 !important;
    overflow: hidden;
}

/*End Header */


/*Headermenue */
#header ul {
    position: absolute;
  min-height: 30px;
  width: 1030px;
    left: 0;
    top: 0em;
    right: 0;
    display: block;
    margin: 0 0 0px 0;
    text-align: right;
    list-style-type: none;
    padding: 0px 0;
      
}
#header ul.menu {background: url(../images/personal/unten.png)  center;
  background-repeat: no-repeat;
  color:#ffffff;
	float: left;
	text-align: left;
	width: 1040px;
  min-height: 37px;
  margin-left: -2px;
  margin-top: 15px;
	text-align: left;
	display: block;
	/*-webkit-border-radius: 4px 4px 0 0;
	-moz-border-radius: 4px 4px 0 0;
	border-radius: 4px 4px 0 0;
	margin: 0 0px*/
}

#header ul.menu li {
	display: inline;
	padding: 0;
	margin: 0;
}

/*#header ul.menu li a:link,#header ul.menu li a:visited,#header ul.menu li:last-child a
	{
	font-weight: bold;
	text-decoration: none;
	margin: 0;
	display: inline-block;
	padding: 12px 15px;
	position: relative;
	border-right: 0px solid #f5f5f5;
	box-shadow: 0px 0 0 #f5f5f5;
}*/

#header ul.menu li:first-child a {
	border-radius: 4px 0 0 0;
	margin-left: -1px
}
/*Headermenue */


/* breadcrumb */
#breadcrumbs {
	/*display: block;*/
	background: url(../images/personal/unten.png) no-repeat center;
  background-repeat: no-repeat;
  color:#ffffff;
	float: left;
	text-align: left;
	width: 1040px;
  min-height: 37px;
  margin-left: -22px;
  padding-left: 5px;
}
/*End breadcrumb */
$screen-sm-min: 576px;

@mixin sm {
  @media (max-width: #{$screen-sm-min}) {
    @content;
  }
}
#header ul {
    position: absolute;
  min-height: 30px;
  width: 1030px;
    left: 0;
    top: 0em;
    right: 0;
    display: block;
    margin: 0 0 0px 0;
    text-align: right;
    list-style-type: none;
    padding: 0px 0;
      
}
#header ul.nav {background: url(../images/personal/unten.png)  center;
  background-repeat: no-repeat;
  color:#ffffff;
	float: left;
	text-align: left;
	width: 1040px;
  min-height: 37px;
  margin-left: -2px;
  margin-top: 15px;
	text-align: left;
	display: block;
	/*-webkit-border-radius: 4px 4px 0 0;
	-moz-border-radius: 4px 4px 0 0;
	border-radius: 4px 4px 0 0;
	margin: 0 0px*/
}

#header  ul.nav {
      list-style: none;
      display: inline-block;
      margin: 0;}

#header ul.nav li a:link,#header ul.nav li a:visited,#header ul.nav li:last-child a{
        display: inline-block;
        margin-right: 2em;
        padding: 1em 1.5em;
        box-shadow: -2px -2px 8px 1px rgba(161, 161, 201, 0.2),
          2px 2px 8px 1px rgba(0, 0, 0, 0.8);
        border-radius: 5px;
        transition: background 0.2s ease;
        cursor: pointer;

        @include sm {
          display: none;
          margin-right: 0;
        }

        &.mobile {
          display: none;

          @include sm {
            display: inline-block;
          }
        }

        > i {
          margin-right: 15px;
          @include sm {
            margin-right: 0px;
          }
        }

        &ul.nav :hover,
        &ul.nav .active {
          background-color: #f73859;
          box-shadow: 2px 2px 8px 1px rgba(74, 24, 2, 0.8),
            inset -1px -1px 5px 1px rgba(255, 255, 255, 0.2),
            inset 2px 2px 8px 1px rgba(74, 24, 2, 0.8);
        }
      }
    }
  }
#header ul.nav li a:hover,#header ul.nav li a.active {
          background-color: #f73859 !important;
          box-shadow: 2px 2px 8px 1px rgba(74, 24, 2, 0.8),
            inset -1px -1px 5px 1px rgba(255, 255, 255, 0.2),
            inset 2px 2px 8px 1px rgba(74, 24, 2, 0.8);
        }
      }
