@import url('https://fonts.googleapis.com/css2?family=Reenie+Beanie&display=swap');

/* Container */

.container {
    margin:auto 0;
    position:relative;
    margin-top:50px;
    max-width : 1028px;
    padding-left: 150px;
    margin-bottom:100px;
}

* {
    box-sizing: border-box;
}

.column {
    float: left;
    padding: 10px;
}

.left {
    width: 25%;
}

.left h2{
    font-family:  Arial, sans-serif
}

.right {
    width: 75%;
    padding-top: 0px;
}

.right p{
    margin-right: 120px;
    font-family: Arial, sans-serif;
    font-size: 20px;
}

.right h2{
    font-family: "Reenie Beanie", cursive;
    font-weight: 200;
    padding-top:0px;
    font-size:60px;
}

.right h3{
    font-family: Arial, sans-serif;
    font-weight: 1;
    padding-top:0px;
    font-size: 25px;
}

.right banner{
  /* crop your banners to 500 x 140! */
      height: 140px;
			overflow: hidden;
			background: #666;
			text-align: end;
			padding: 12px;
			background-position: 1px;
			background-size: cover;
			color: #EEE;

		}
 
.row:after{
    content: "";
    display: table;
    clear: both;
}

.overlay{
    position:absolute;
    pointer-events:none;
    top:20px;
    transform: translateX(220%);
    z-index : 2;
}

.icon{
    position:absolute;
    pointer-events:none;
    top:75px;
    transform: translateX(520%);
    z-index : 3;
}

/* Navigation */

.navbar {
                background-color: #c5bae3;
                /* navbar color */
                width: 100%;
                padding: 10px;
                order: 1;
            }

.navbar li {
    list-style-type: none;
}

.navbar a {
                display: flex;
                font-family: Arial, sans-serif;
                color: #0768ff;
                font-weight: 700;
                text-decoration: none;
                text-align: center;
                margin: 0;
                padding:5px;
                list-style-type: none;
                justify-content: space-evenly;
            }

.navbar a:hover {
                color: #0757ff;
                text-decoration: underline;
            }

.flex {
                display: flex;
            }

/* Body */

body {
    margin:0;
    cursor: url(minishrines/minishrine_images/purple_cursor.png), auto;
}