/*
CSS for log.minty.nu
Hand-coded by Ainna (https://fan.minty.nu) (c) 2019-2023

Kusakabe Maron of KAMIKAZE KAITOU JEANNE (c) Tanemura Arina
    http://twitter.com/arinacchi
    
Image use is guided by the Fair Use Clause 
    https://fairuse.stanford.edu/overview/fair-use/what-is-fair-use/

No copyright infringement intended. 

*/

































































/*

LEARN

FROM

YOUR

OWN

SOURCES!


Feel free to learn from bits and parts of the css here, but do NOT just copy and paste the ENTIRE style and html markup here to get my layout. That's plagiarism, and it's just not cool. I put together a LOT of tutorials in the web to come up with the final design, so it would be nice if you could RESPECT my efforts a little. Learn from your own research, and give credit where credit is due!

*/




































@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap');

html, body {
	height: 100vh;
	 -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}

body {
    width: 100vw;
    overflow-x: hidden;
    margin: 0px;
    padding: 0px;
    font: 0.9rem/140% 'Quicksand', Verdana, Sans-serif;
    background: #fff; 
    color: #77bebe;
}

a, a:visited, a:active  {
    text-decoration: none;
    color: #7089a9;
    border-bottom: 1px dotted #ccc;
}

a:hover, #footer a:hover {
    color:#9c605d;
    text-decoration: none;
    background-color: #fff;
}

h1 {
    font: 1.6rem/120% 'Quicksand';
    color: #96bece;
    text-align:left;
    letter-spacing:-1px;
}


h2 {
    font:1.2rem/120% 'Quicksand';
    /*color: #d55d6c;*/
}

.yellow {
    margin-top: -10px;
    margin-bottom: -10px;
    border-bottom: 3px solid #f2f2ea;
    width: 15%;
}

i, em {
    color: #ffd8d3;
}


.center {
    text-align:center;
    margin:0 auto;
}


.left {
    float: left;
    padding-right: 20px;
}

.right {
    float: right;
    margin-left: 20px;
}

.nav {
    font-size: 20px;
    letter-spacing: 1px;
}

.accent {
    color: #e19f9f;
}

.corners, input, textarea, select, .bq {
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px; 
    -khtml-border-radius: 20px; 
}

.opacity, input, textarea, select {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
    filter: alpha(opacity=65);
    opacity: 0.65;
}

.shadow, .name, .sitewide {
    -moz-box-shadow: 5px 5px 3px rgba(69, 126, 131, 0.4);
    -webkit-box-shadow: 5px 5px 3px rgba(69, 1265, 131, 0.4);
    box-shadow: 5px 5px 3px rgba(69, 126, 131, 0.4);
}

.nbsp {
    margin: 0 3px 2px 0;
}

p {
    color: #598e8e;
}

.bq, blockquote {
    width: 85%;
    text-align: center;
    padding: 20px;
    margin: 0 auto;
    letter-spacing: 1px;
    background: rgba(255, 255, 255, 0.9);
}

.stat {
    color: #777;
    font: 0.8rem/100% 'Quicksand', Verdana, Sans-serif;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 1px;
}


.credit {
    font: 0.5rem/100% 'Quicksand', Verdana, Sans-serif;
    text-transform: lowercase;
}


.scented, .subnav {
    font: 0.6rem/110% 'Quicksand', Verdana, Sans-Serif;
}

#container {
    width: 1200px;
    height: 650px;
    margin: 0 auto;
    background: #fff;
    position: relative;
	top: 50%;
	transform: translateY(-50%);
}

#left {
        float: left;
        padding: 30px;
}

#header {
        background: url('maron.jpeg') no-repeat;
        background-size: contain;
        width: 400px;
        height: 400px;
        margin: 0 auto;
        color: #768c80;
}


#right {
    width: 55%;
    padding: 30px;
    float: left;
    margin-top: -80px;
    margin-left: -80px;
}

#content {
    text-align: justify;
    padding-right: 20px;
}