/*button*/
@import url("https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900");
body {
background-image:
url("../images/personal/schleife.png");
background-repeat: repeat;
background-attachment: fixed;
}
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: "Poppins", sans-serif;

}



.content {
 width: 72%;
    float: right;
    position: relative;
    padding-bottom: 20px;
  
}

.content h2 {
	color: #fff;
	font-size: 3em;
	position: absolute;
	transform: translate(-50%, -50%);
}

.content h2:nth-child(1) {
	color: transparent;
	-webkit-text-stroke: 2px #03a9f4;
}

.content h2:nth-child(2) {
	color: #03a9f4;
	animation: animate 4s ease-in-out infinite;
}

@keyframes animate {
	0%,
	100% {
		clip-path: polygon(
			0% 45%,
			16% 44%,
			33% 50%,
			54% 60%,
			70% 61%,
			84% 59%,
			100% 52%,
			100% 100%,
			0% 100%
		);
	}

	50% {
		clip-path: polygon(
			0% 60%,
			15% 65%,
			34% 66%,
			51% 62%,
			67% 50%,
			84% 45%,
			100% 46%,
			100% 100%,
			0% 100%
		);
	}
}
a.one:link
{
  background:transparent!important;   
}
a.one:hover
{
  background:transparent!important;
  
  
}
/*End*/
.bgimg {
    background-image: url('../images/Valheim.jpg');
}
table.custom_class {
  max-width: 995px;
  height: 250px;
  border: 0px solid #1C6EA4;
  background-image:
url("../images/personal/valheim.png")!important;
   background-repeat: no-repeat;
  text-align: center;
}
table.custom_class td, table.custom_class th {
  border: 0px solid #1C6EA4;
    padding: 0px;
    vertical-align: top;
    border-top: 0px solid #ddd;
    line-height: 0,5;
    text-align: center;
}
table.custom_class thead {
  }
table.custom_class thead th {
  font-weight: bold;
}
table.custom_class tfoot {
  font-weight: bold;
}
table.custom_class tr {
    margin:0;
    padding:0px;
}
table.custom_class th:hover, table.custom_class thead tr:hover th, table.custom_class thead tr:hover td, table.custom_class thead tr td:hover
 {
   background-color: transparent !important;   
}

table.custom_class tr:hover
 {
   background-color: transparent!important;   
}
table.custom_class td:hover
 {
  background-color: transparent !important;   
}

table.custom {
  max-width: 1450px!important;
  height: 550px;
  border: 0px solid #1C6EA4;
  
   background-repeat: no-repeat;
  text-align: center;
}
table.custom {
  border: 0px solid #1C6EA4;
    padding: 0px;
    vertical-align: top;
    border-top: 0px solid #ddd;
    line-height: 0,5;
    text-align: center;
}
table.custom thead {
  }
table.custom thead th {
  font-weight: bold;
}
table.custom tfoot {
  font-weight: bold;
}
table.custom_class tr {
    margin:0;
    padding:0px;
}
table.custom th:hover, table.custom_class thead tr:hover th, table.custom_class thead tr:hover td, table.custom_class thead tr td:hover
 {
   background-color: transparent !important;   
}

table.custom tr:hover
 {
   background-color: transparent!important;   
}
table.custom td:hover
 {
  background-color: transparent !important;   
}

img.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto }

$gradient-start: #ed6ea0;
$gradient-end: #ec8c69;

.menu {
  background-image: linear-gradient(
    to right,
    $gradient-start 0%,
    $gradient-end 100%
  );
  border-radius: 0.5rem;
  text-transform: uppercase;
  box-shadow: inset 0.1rem 0.1rem 0.5rem rgba(0, 0, 0, 0.15);
  a {
    color: #fff;
    text-decoration: none;
    font-weight: 300;
    &:focus,
    &:focus-within {
      outline: none;
    }
  }
  > ol {
    display: flex;
    > li {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
    }
  }
}
@media (min-width: 45rem) {
  .menu {
    > ol {
      justify-content: space-around;
      &:hover,
      &:focus-within {
        > li:first-child {
          > a {
            opacity: 0.6;
          }
        }
      }
      > li {
        flex: 1 1 0;
        &:last-child:after {
          content: "";
          position: absolute;
          top: 0;
          width: 100%;
          bottom: 0;
          margin-right: -50%;
          background: rgba(0, 0, 0, 0.1);
          border-radius: 0.5rem;
          z-index: 0;
          transition: 350ms cubic-bezier(1, 0.49, 0.09, 1.29) all;
          pointer-events: none;
        }
        @for $i from 1 to 12 {
          &:first-child:nth-last-child(#{$i}) ~ li:last-child:after {
            right: 50% + 100% * ($i - 1);
          }
        }
        @for $i from 1 to 12 {
          &:first-child:nth-last-child(#{$i}),
          &:first-child:nth-last-child(#{$i}) ~ li {
            @for $j from 1 to $i {
              &:nth-child(#{$j}):hover,
              &:nth-child(#{$j}):focus,
              &:nth-child(#{$j}):focus-within {
                ~ li:last-child:after {
                  right: 50% + 100% * ($i - $j);
                }
                > ol a {
                  box-shadow: inset 0 0 0 3rem rgba(0, 0, 0, 0),
                    inset 0 0 0 3rem rgba(237, 110, 160, (1 - (1 / $i) * $j));
                  &:hover,
                  &:focus,
                  &:focus-within {
                    box-shadow: inset 0 0 0 3rem rgba(0, 0, 0, 0.1),
                      inset 0 0 0 3rem rgba(237, 110, 160, (1 - (1 / $i) * $j));
                  }
                }
              }
              &:last-child:hover:after,
              &:last-child:focus:after,
              &:last-child:focus-within:after {
                right: 50%;
              }
            }
          }
        }
        &:first-child {
          > a {
            opacity: 1;
          }
        }
        > a {
          padding: 2rem 0;
          font-size: 1.6vw;
          position: relative;
          width: 100%;
          text-align: center;
          z-index: 1;
          opacity: 0.7;
          transition: 250ms ease all;
        }
        > ol {
          position: absolute;
          top: 100%;
          left: 0;
          width: 100%;
          visibility: hidden;
          > li {
            margin-top: 0.5rem;
            transition: 250ms cubic-bezier(0.42, 0.83, 0.49, 1.35) transform;
            transform: scale(0);
            > a {
              display: block;
              text-align: center;
              border-radius: 0.2rem;
              padding: 1rem 0.5rem;
              font-size: 1.4vw;
              background: $gradient-end;
              color: rgba(255, 255, 255, 0.6);
              transition: 250ms ease all;
              &:hover,
              &:focus,
              &:focus-within {
                box-shadow: inset 0 0 0 3rem rgba(0, 0, 0, 0.1);
                color: rgba(255, 255, 255, 1);
              }
            }
          }
        }
        &:hover,
        &:focus,
        &:focus-within {
          > a {
            opacity: 1 !important;
          }
          > ol {
            visibility: visible;
            > li {
              transform: scale(1);
              &:first-child {
                transition-delay: 150ms;
              }
            }
            @for $k from 1 to 12 {
              > li:nth-child(#{$k}) {
                transition-delay: 150ms * $k;
              }
            }
          }
        }
      }
    }
  }
}
@media (max-width: 45rem) {
  .menu {
    background-image: linear-gradient(
      to bottom,
      $gradient-start 0%,
      $gradient-end 100%
    );
    a {
      font-size: 1.4rem;
      padding: 1rem 0.5rem;
    }
    > ol {
      flex-direction: column;
      > li {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        > a:nth-last-child(2) {
          position: relative;
          &:after {
            content: "";
            position: absolute;
            top: 50%;
            margin-top: -0.25rem;
            right: 1.5rem;
            border-top: 0.5rem solid #fff;
            border-left: 0.3rem solid transparent;
            border-right: 0.3rem solid transparent;
            transition: 250ms ease all;
          }
        }
        &:focus-within,
        &:focus,
        > a:hover,
        > a:focus-within,
        > a:focus {
          &:nth-last-child(2) {
            &:after {
              transform: rotate(180deg);
            }
          }
          + ol {
            max-height: 12rem;
          }
        }
        > ol {
          background: rgba(0, 0, 0, 0.1);
          box-shadow: inset 0.1rem 0.1rem 0.5rem rgba(0, 0, 0, 0.15);
          overflow: hidden;
          max-height: 0;
          transition: 250ms ease all;
          > li {
            a {
              display: block;
              font-size: 1.2rem;
            }
          }
        }
      }
    }
  }
}


#mainMenu {
display: inline-block;
    list-style-type: none;
	margin: 10px!important;
	width: 100%!important;
	font-family: sans-serif!important;
font-size: 12px!important;
text-align:center;
   
}
#mainMenu li {
	display:block!important;
	width:90px!important;
	float:left!important;
	margin-left:2p!importantx;
	border:1px solid #000;
        border-radius: 5px;
}
#mainMenu a {
	display:block!important;
	padding:3px!important;
	text-decoration:none!important;
	background-color:#fff!important;
	color:#009!important;

}
#mainMenu a:hover {
	background-color:#009!important;
	color:#fff!important;
}
#mainMenu {
	margin:10px!important;
	width:1522px!important;
	font-family: sans-serif;
}
#mainMenu li {
	display:block!important;
	width:80px!important;
	float:left!important;
	margin-left:2px!important;
	border:1px solid #000!important;
}

#mainMenu a {
	display:block!important;
	padding:3px!important;
	text-decoration:none!important;
	background-color:#fff!important;
	color:#009!important;
}

#mainMenu a:hover {
	background-color:#009!important;
	color:#fff!important;
}
.moduletable_nav.menu.mainMenu.mod-list {
	border: solid 1px #ddd!important;
	background: #f9f9f9!important;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px!important;
	padding: 20px!important;
	margin-bottom: 20p!importantx
}

ul.nav.menu.mainMenu.mod-list {
	margin: 0 0 20px 0!important;
	padding: 0!important;
}

ul.mainMenu,ul.mainMenu ul {
	list-style-type: none!important;
}

ul.mainMenu a {
	display: block!important;
	margin: 0!important;
	text-decoration: none!important;
	padding: 5px 0!important;
	border-bottom: solid 1px #ddd!important;
}

ul.mainMenu li:last-child a {
	border: 0!important;
	box-shadow: none!important;
}

ul.mainMenu ul {
	margin: 0!important;
	padding: 0!important:
}

ul.mainMenu ul a {
	padding-left: 20px!important:
}

ul.mainMenu ul ul a {
	padding-left: 30px!important:
}

ul.mainMenu ul ul ul a {
	padding-left: 40px!important;
}

ul.mainMenu ul ul ul ul a {
	padding-left: 45px!important;
}
nav.menu.mainMenu.mod-list
.center {
  margin: auto;
  width: 100%;
  padding: 10px;
   text-align: center;
}
.card-body {
    background-color: black !important;
}
.card {
    --card-spacer-y: 1rem;
    --card-spacer-x: 1rem;
    --card-title-spacer-y: 0.5rem;
    --card-border-width: 0px!important;
    --card-border-color: #dfe3e7;
    --card-border-radius: 0.25rem;
    --card-box-shadow: ;
    --card-inner-border-radius: calc(0.25rem - 1px);
    --card-cap-padding-y: 0.5rem;
    --card-cap-padding-x: 1rem;
    --card-cap-bg: rgba(0,0,0,.03);
    --card-cap-color: ;
    --card-height: ;
    --card-color: ;
    --card-bg: #fff;
    --card-img-overlay-padding: 1rem;
    --card-group-margin: 0.5em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    word-wrap: break-word;
    background-clip: border-box;
    background-color: #f4433605!important;
    border: var(--card-border-width) solid var(--card-border-color);
    border-radius: var(--card-border-radius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: var(--card-height);
    min-width: 0;
    position: relative
}
.blog-featured
{
background-color: #808080 !important;
}
.card-body
{
background-color: #808080 !important;
}

.container-header 
{
background-color: none !important;

height: 30px!important;
width: 1522px!important;

	text-align: left!important;
	display: block!important;


}

.container-topbar

{
background: url(../images/pills.png)  center!important;
background-repeat: no-repeat!important
background-color: none !important;
padding: 0!important;
height: 30px!important;
width: 1522px!important;
display: inline-block;
list-style-type: none;
position:absolute!important;
left:50%!important;
margin-left:-750px!important;


}

.nav
{

background-color: none !important;
padding: 0!important;
height: 30px!important;
width: 1522px!important;


}






