/*html {
        height: 100%;
}
body {
        padding-top: 65px;
        margin: 0;
        height: 100%;
        display: flex;
}

main {
        width: 100%;
	margin: 20px auto;
        font-family: sans-serif;
}

img {
        display: block;
        padding: 20px;
        margin-bottom: 10px;
}


h1 {
        margin-top 60px;
}

h2 {
	text-align: center;
	vertical-align: center;
        margin-top 0;
}

*/
/* Navigation bar */
/*
ul {*/
	/*height: 14vh;*/
      /*  position: fixed;
        top: 0;
        width: 100%;
        list-style-type: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background-color: #400080;
}

li {
        margin: 0;
        float: left;
}

li a {
        display: block;
        color: white;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
}

li a:hover {
        background-color: #663299;
}

.active {
  background-color: #8080ff;
}
*/
.quadrant {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
/*	background-color: green;
	clip-path: polygon(0% 0%, 100% 0%, 50% 50%);*/
        }
.top {
	background-color: #B6CDE2;
        clip-path: polygon(0% 0%, 100% 0%, 50% 50%);
}
.right {
	background-color: #F6DEB6;
        clip-path: polygon(100% 0%, 100% 100%, 50% 50%);
}
.right:hover{
	background-color: yellow;
	clip-path: polygon(100% 0%, 100% 100%, 50% 50%);
}
.bottom {
	background-color: #B9AEC1;
        clip-path: polygon(0% 100%, 100% 100%, 50% 50%);
}
.left {
	background-color: #BDD5AF;
        clip-path: polygon(0% 0%, 0% 100%, 50% 50%);
}
	/*
.container {
  position: relative;
	height: 0;
}
.area {
      position: absolute;
      overflow: hidden;
    }
.right{
  border-top: 43vh solid transparent;
  border-right: 50vw solid #F6DEB6;
  border-bottom: 43vh solid transparent;
  top:0;
  right:0;
}
.left{
  border-top: 43vh solid transparent;
  border-left: 50vw solid #BDD5AF;
  border-bottom: 43vh solid transparent;
  top:0;
  left:0;
}
.bottom{
      border-bottom: 43vh solid #B9AEC1;
      border-left: 50vw solid transparent;
      border-right: 50vw solid transparent;
      left: 0;
      top: 43vh;
}
.top{
 height:43vh;
  border-top: 43vh solid #B6CDE2;
      border-left: 50vw solid transparent;
      border-right: 50vw solid transparent;
  left: 0;
  top: 0;
}
*/