 .left-block, .right-block {
	 float: left;
	 padding: 1.5em;
	 box-sizing: border-box;
}
 .left-block {
	 width: 70%;
}
 .right-block {
	 width: 30%;
}
 .entry {
	 background: #cc66da;
	 padding: 0.5rem 1.5rem;
	 transition: background 0.25s ease;
}
 .entry:nth-child(even) {
	 background: #cc66da;
}
 .entry-info {
	 font-style: italic;
	 font-size: 0.75rem;
	 margin-bottom: 0;
	 padding-bottom: 0;
}
 .entry-info p {
	 margin-bottom: 0.125rem;
}
 .entry-info .author {
	 color: #a51c3c;
	 font-weight: bold;
}
 .entry-text p {
	 margin-top: 0;
}
 .guestbook-links {
	 margin: 1rem 0;
	 text-align: center;
}
 .guestbook-links a {
	 padding: 1rem 4rem;
	 display: inline-block;
	 margin: 0 0.5rem;
}
 .links {
	 margin-top: 2em;
}
 .links a {
	 text-align: center;
	 display: block;
	 padding: 0.5rem;
	 margin: 0.5rem 0;
}
 .manage-entry {
	 overflow: hidden;
	 height: 100px;
}
 .manage-entry .entry-left {
	 width: calc(80% - 2em);
	 float: left;
	 position: relative;
	 top: 50%;
	 transform: translateY(-50%);
	 padding-right: 2em;
}
 .manage-entry .entry-options {
	 box-sizing: border-box;
	 width: 20%;
	 float: left;
	 border-left: solid 2px #cddbe2;
	 text-align: center;
	 padding: 1em 0;
	 position: relative;
	 top: 50%;
	 transform: translateY(-50%);
}
 .icon {
	 color: #000;
	 font-size: 1.25em;
	 font-weight: bold;
	 display: inline-block;
	 margin: 0 1.5em 0 0;
}
 img.icon {
	 max-height: 0.75em;
	 margin-left: -0.25rem;
	 margin-right: 0;
}
 .checkmark {
	 display: inline-block;
}
 .checkmark:after {
	 content: '';
	 display: block;
	 width: 7px;
	 height: 14px;
	 border: solid #000;
	 border-width: 0 2px 2px 0;
	 transform: rotate(45deg);
}
 .form-element {
	 width: 90%;
	 display: block;
	 margin: 1em 0;
	 padding: 0.5em;
	 border: none;
	 resize: none;
	 background: #cc66da;
	 color: #000;
}
 .form-element::placeholder {
	 color: #000;
}
 .form-element:focus {
	 outline-color: #ed1b51;
}
 .form-element.short {
	 width: 30%;
}
 .form-button {
	 padding: 1rem 4rem;
	 display: inline-block;
	 border: none;
	 margin-right: 0.5rem;
	 color: #cddbe2;
	 background: #a51c3c;
	 transition: all 0.25s ease;
}
 .form-button:hover {
	 background: #ed1b51;
	 color: #fff;
}
 .overlay {
	 position: fixed;
	 top: 0;
	 bottom: 0;
	 left: 0;
	 right: 0;
	 background: rgba(0, 0, 0, 0.7);
	 transition: opacity 500ms;
	 visibility: hidden;
	 opacity: 0;
	 overscroll: none;
}
 .overlay:target {
	 visibility: visible;
	 opacity: 1;
}


.popup {
	 margin: 23px auto;
	 padding: 20px;
	 border-radius: 5px;
	 width: 30%;
	 position: relative;
	 transition: all 5s ease-in-out;
}
 .popup h2 {
	 margin-top: 0;
	 color: #333;
	 font-family: Tahoma, Arial, sans-serif;
}
 .popup .close {
	 position: absolute;
	 top: 20px;
	 right: 30px;
	 transition: all 200ms;
	 font-size: 30px;
	 font-weight: bold;
	 text-decoration: none;
	 color: #fff;
}
 .popup .close:hover {
	 color: #06d85f;
}
 .popup .content {
	 max-height: 30%;
	 overflow: auto;
}
 @media screen and (max-width: 700px) {
	 .box {
		 width: 70%;
	}
	 .popup {
		 width: 70%;
	}
}

.sign-guest-book-popup {
	 height: min-content;
	 margin: 0px auto;
	 padding: 20px;
	 border-radius: 5px;
	 width: fit-content;
	 position: relative;
	 transition: all 5s ease-in-out;
}
 .sign-guest-book-popup h2 {
	 margin-top: 0;
	 color: #333;
	 font-family: Tahoma, Arial, sans-serif;
}
 .sign-guest-book-popup .close {
	 position: absolute;
	 top: 20px;
	 right: 30px;
	 transition: all 200ms;
	 font-size: 30px;
	 font-weight: bold;
	 text-decoration: none;
	 color: #333;
}
 .sign-guest-book-popup .close:hover {
	 color: #06d85f;
}
 .sign-guest-book-popup .content {
	 max-height: 30%;
	 overflow: auto;
}
 @media screen and (max-width: 700px) {
	 .box {
		 width: 70%;
	}
	 .sign-guest-book-popup {
		 width: 70%;
	}
}

 input:not([type="submit"]) {
	 padding: 0.75rem;
	 border-radius: 0.25rem;
	 outline: 0;
	 border: 1px solid #fff;
	 background: 0 0;
	 color: #000;
	 font-weight: 300;
}
 input:not([type="submit"])::placeholder {
	 background: 0 0;
	 opacity: 1;
	 color: #000;
	 transition: color 0.2s ease-in-out;
}
 input:not([type="submit"]):focus::placeholder {
	 opacity: 1;
}
 input:not([type="submit"]):placeholder-shown {
	 background: 0 0;
}
 input:not([type="submit"]):not(:placeholder-shown) {
	 background: #cc66da;
}
 input:not([type="submit"]):not(:focus):not(:placeholder-shown):valid {
	 border: 1px solid #00a34a;
}
 input:not([type="submit"]):not(:focus):not(:placeholder-shown):invalid {
	 border: 1px solid #a30008;
}
 input:not([type="submit"]):focus, input:not([type="submit"]):placeholder-shown:invalid:not(:focus), input:not([type="submit"]):placeholder-shown:valid:not(:focus) {
	 border: 1px solid grey;
}
 input:not([type="submit"]):focus {
	 background: #cc66da;
}
 form:invalid input[type="submit"] {
	 opacity: 0.5;
	 cursor: not-allowed;
}
 form:valid input[type="submit"] {
	 opacity: 1;
	 cursor: auto;
}
 @-webkit-keyframes fadeOut {
	 0% {
		 opacity: 1;
	}
	 99% {
		 opacity: 0.01;
		 width: 100%;
		 height: 100%;
	}
	 100% {
		 opacity: 0;
		 width: 0;
		 height: 0;
	}
}
 @keyframes fadeOut {
	 0% {
		 opacity: 1;
	}
	 99% {
		 opacity: 0.01;
		 width: 100%;
		 height: 100%;
	}
	 100% {
		 opacity: 0;
		 width: 0;
		 height: 0;
	}
}
 @keyframes fadeIn {
	 0% {
		 opacity: 0;
	}
	 100% {
		 opacity: 1;
	}
}
 @-moz-keyframes fadeIn {
	 0% {
		 opacity: 0;
	}
	 100% {
		 opacity: 1;
	}
}
 @-webkit-keyframes fadeIn {
	 0% {
		 opacity: 0;
	}
	 100% {
		 opacity: 1;
	}
}
 @-o-keyframes fadeIn {
	 0% {
		 opacity: 0;
	}
	 100% {
		 opacity: 1;
	}
}
 @-ms-keyframes fadeIn {
	 0% {
		 opacity: 0;
	}
	 100% {
		 opacity: 1;
	}
}


.aterisk_before:before {
    color: #e32;
    content: ' *';
    display:inline;
}

.aterisk_after:after {
    color: #e32;
    content: ' *';
    display:inline;
}

.max-length:after {
    color: #e32;
    content: "  *" " Max Length (50 Characters)";
    display:inline;
}
