/* ****** basic settings *************************************************** */

html {
	font-size: 1em;
}
body {
    background-color: #20b2aa; 
}

/* ****** fullsize frame *************************************************** */

.wrapper {
	position: fixed;
	z-index: 999;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	border: #20b2aa solid 20px;
}
.box {
	max-width: 120px;
	margin: 2em 0 0 2em;
}

/* ****** typography *************************************************** */

p {
    font-family: 'Cormorant Garamond', Helvetica, Arial, "Lucida Grande", sans-serif;
	font-weight: 400;
	font-size: 1.375rem;
	color: #424242;
	text-align: center;
	text-transform: none;
	letter-spacing: 0px;
}
.caption {
	font-size: 0.9em;
}
h1, h2, h3 {
    font-family: 'Cormorant Garamond', Helvetica, Arial, "Lucida Grande", sans-serif;
	font-weight: 400;
	text-align: center;
	color: #424242;
}
h1 {
	font-size: 3.157em;
}
h2 {
	font-size: 2.827em;
}
h3 {
	font-size: 1.999em;
}
.small, .font_small {
	font-size: 0.75em;
}
img {
    width: 100%;
    height: auto;
}
.logo {
	width: 50%;
}

/* ****** text container *************************************************** */

.my-div {               
    position: absolute;
    height: auto;
    max-width: 900px;
    padding: 2rem;    
    left: 50%;
    top: 50%;
    background: transparent;
    transform: translate(-50%, -50%);    
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

/* ****** links *************************************************** */

a.mylinks {	
	color: rgb(66,66,66);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	text-decoration: none;
	border-bottom: 1px solid rgb(66,66,66);
}
a:hover.mylinks {
	color: rgb(255,250,240);
	background: none;
	padding: 0;
	text-decoration: none;
	border-bottom: 1px solid rgb(255,250,240);
}
a {
   outline: 0;
}

/* ****** colors *************************************************** */

.white {
	color: #fff;
}
.red {
	color: #ff0000;
}
.blue {
	color: #0099ff;
}
.deepsky {
	color: #00bfff;
}
.yellowgreen {
	color: #9acd32;
}
.burlywood {
	color: #deb887;
}

/* ****** Image Shadow *************************************************** */

img.shadow {
	border-radius: 0px;
	box-shadow: 0 3px 6px #b3b3b3;
}

/* ****** resizing for mobile devices *************************************************** */

@media screen and (max-width: 740px) {
p {
    font-size: 1em;
    line-height: 1.25em;
}
h1 {
	font-size: 1.999em;
}
.box {
	margin: 1em 0 0 1em;
}
img {
	max-width: 75%;
}
.wrapper {
	position: fixed;
	z-index: 999;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	border: #00c5cd solid 10px;
}
}