/*/
 * ================================
 * Copyright by Aelyn <https://aelysia.net>
 *
 * This site is an ongoing work in progress, and its governing codes may
 * change as development continues. You're welcome to study, discuss, and
 * analyze this work, but copying, repurposing, or misrepresenting it as
 * your own is strictly prohibited.
 * ================================
/*/







/*//------------------------------------------------------------------------
>>> FONTS:
-------------------------------------------------------------------------//*/

@import url('https://fonts.googleapis.com/css2?family=Alegreya+Sans&family=Fira+Sans&family=Amatic+SC&display=swap');




/*//------------------------------------------------------------------------
>>> GENERAL:
-------------------------------------------------------------------------//*/

body {
        padding: 0;
	margin: 0px;
	color: #aaa;
        background: url('bg_top.png') top center repeat-x,
                    url('bg_bottom.png') center bottom repeat-x,
                    url('bg.png') top center repeat;
        text-shadow: 0px 1px rgba(255, 255, 255, .75);
        }

td {
        font: normal 1.2em 'Alegreya Sans', sans-serif;
        line-height: 30px;
        letter-spacing: .3px;
        }

b, strong {
	font: bold 'Noto Serif', serif;
	color: #a59093;
	}

i, em {
	font: italic 'Noto Serif', serif;
	color: #d5bc97;
        text-decoration: none;
        line-height: 20px;
	}

u {
        font: normal 'Noto Serif', serif;
	color: #a59093;
        text-decoration: none;
        border-bottom: 1px solid #d5bc97;
	}





/*//------------------------------------------------------------------------
>>> FORMS:
-------------------------------------------------------------------------//*/

input, select, option {
    font: normal 1em 'Alegreya Sans', sans-serif;
    line-height: 30px;
    letter-spacing: .3px;
    background: #fff;
    border: 1px solid #eee;
    color: #aaa;
    padding: 0.5em;
    width: 100%;
    resize: none;
    box-sizing: border-box;
}

select optgroup {
        font: normal 1em 'Alegreya Sans', sans-serif;
        font-weight: normal;
        font-style: normal;
        }

input[type=submit] {
        width: 200px;
        float: none;
        background-color: initial;
	background-image: linear-gradient(-180deg, #00d775, #00bd68);
	border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.1) 0 2px 4px;
	color: #fff;
	white-space: nowrap;
	z-index: 9;
        border: 0px;
	}

input:hover[type=submit] {
        background: #00bd68;
        }

input[type=reset] {
        width: 200px;
        float: none;
        background-color: initial;
	background-image: linear-gradient(-180deg, #fe7b2f, #e73005);
	border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.1) 0 2px 4px;
	color: #fff;
	white-space: nowrap;
	z-index: 9;
        border: 0px;
	}

input:hover[type=reset] {
        background: #e73005;
        }

input:hover[type=text], input:hover[type=email]:hover, input:hover[type=url], textarea:hover, select:hover {
  	border: 1px dashed #a59093;
 	}

input[type=checkbox], input[type=radio] {
        width: 20px;
        float: none;
	}

textarea {
    font: normal 1em 'Alegreya Sans', sans-serif;
    line-height: 30px;
    letter-spacing: .3px;
    background: #fff;
    border: 1px solid #eee;
    color: #aaa;
    padding: 0.5em;
    float: none;
    width: 800px;
    height: 200px;
    resize: vertical;
    box-sizing: border-box;
}








/*//------------------------------------------------------------------------
>>> CLASS / ID:
-------------------------------------------------------------------------//*/

.center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.form {
    font-size: 1em;
    margin: 0 auto;
    width: 900px;
    text-align: center;
}

.form-row {
    display: flex;
    justify-content: center;
    gap: 20px;
    width: 800px;
    margin: 10px auto;
}

.form-row .form-group {
    width: 390px;
}

.form-group {
    text-transform: none;
    text-align: left;
    line-height: normal;
    display: block;
    margin: 0 auto;
}

.form-block {
    text-transform: none;
    text-align: left;
    display: block;
    clear: both;
    vertical-align: top;
    width: 800px;
    margin: 10px auto;
}

.req {
    color: #ff0000;
}

.help-block.with-errors {
    font: bold 1rem 'Noto Serif', serif;
    color: #ff5050;
    margin-top: 5px;
}

.help-block.with-errors ul {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

.captcha-row {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
}

.captcha-row #captcha {
    flex: 1;
    min-width: 0;
    width: auto;
}

.captcha-row #captcha_image {
    flex: 0 0 auto;
    height: 40px;
    width: auto;
}

.captcha-row #captcha_reload {
    flex: 0 0 auto;
    white-space: nowrap;
}





/*//------------------------------------------------------------------------
>>> LINKS:
-------------------------------------------------------------------------//*/

a {
	text-decoration: none;
	cursor: default;
        }

a:link, a:visited {
        color: #edcf6b;
        }

a:hover {
	cursor: help;
	text-decoration: none;
	color: #777;
        }





/*//------------------------------------------------------------------------
>>> CLASS:
-------------------------------------------------------------------------//*/

.outline {
	width: 900px;
        margin: 0px auto;
        }

.content {
        color: #27413c;
        width: 1000px;
        margin: 20px 500px auto auto;
        }

.info {
	font: normal 30px 'Amatic SC', cursive;
        color: #9adcfe;
        text-transform: uppercase;
        position: fixed;
        bottom: 10px;
        right: 0px;
        letter-spacing: 10px;
        }

.header {
        font: normal 1.12em 'Alegreya Sans', sans-serif;
        line-height: 30px;
        letter-spacing: .3px;
        color: #ecfefe;
        text-align: justify;
        text-transform: uppercase;
        width: 100%;
        padding: 20px 0px 0px 20px;
	}



/*//------------------------------------------------------------------------
>>> ALERTS:
-------------------------------------------------------------------------//*/

.alert {
        display: none;
	}

.alert.error .inner {
        border-radius: 5px;
	border: 1px solid rgb(238,211,215);
	background-color: rgb(242,222,222);
	color: rgb(185,74,72);
        text-shadow: none;
        text-align: justify;
        padding: 5px;
        margin: 0px auto;
        overflow: visible;
	}

.alert.error .inner b {
	color: rgb(185,74,72);
        text-shadow: none;
	}

.alert.success .inner {
	border-radius: 5px;
	border: 1px solid rgb(214,233,198);
	background-color: rgb(223,240,216);
	color: rgb(70,136,71);
        text-shadow: none;
        text-align: justify;
        padding: 5px;
        margin: 0px auto;
        overflow: visible;
	}

.alert.success .inner b {
	color: rgb(70,136,71);
        text-shadow: none;
	}






/*//------------------------------------------------------------------------
>>> FOOTER:
-------------------------------------------------------------------------//*/

.copyright {
        font: normal .7em 'Fira Sans', sans-serif;
        color: #aaa;
        text-transform: uppercase;
        text-shadow: none;
        padding: 10px;
        text-align: center;
        width: 600px;
        float: left;
        }

.copyright a, .copyright b {
        color: #a59093;
        }