@charset "UTF-8";
/* CSS Document */


/* =====================================

The dark night is of earth
Deep dreams, other my lives
Changes by day, found at sleep
The bright light speaks of time
When the animals did play
We found the hidden shores
White ship, silver key
Tomorrow matures today
 
======================================== */


html, body {
	margin:0;
	padding:0;
	height: 100%;
	width: 100%;
	font-family: 'Raleway', sans-serif;
	font-weight:300;
	line-height:125%;
	color:#000000;
	font-size:15px;
	-webkit-text-size-adjust: 100%; /* Removes the iphones font resize rules */
	-webkit-tap-highlight-color: rgba(0,0,0,0); /* Removes the iphones default active state styling */
	-webkit-text-stroke: 0.1px; /* Adds just a TINY amount of fake weight to solve the aliasing in Chrome-Windows */
}


/* This targets Safari 10.1+ since the Masonry plugin breaks due to Google Font initialization */
/* http://stackoverflow.com/questions/16348489/is-there-a-css-hack-for-safari-only-not-chrome */
@media not all and (min-resolution:.001dpcm) { @media {
html, body {font-family: 'Helvetica Neue', Arial, sans-serif !important;}
}}


a {outline: none;} /* Removes the firefox dotted outline hyperlink upon click */
a:link {color: #f65535; font-weight:400; text-decoration: none;}
a:visited {color: #f65535; font-weight:400; text-decoration: none;}
a:hover {color: #f65535; font-weight:400; text-decoration: underline;}
a:active {color: #df2500; font-weight:400; text-decoration: underline;}


#background_beauty {
	min-height: 100%;
}

/* Safari performs very slowly when using a fixed background... */
/* But this can be fixed by using a pseudo-element and adding the will-change property */
/* More info - https://medium.com/vehikl-news/fixed-background-image-performance-issue-6b7d9e2dbc55 */
/* If this CSS solution causes problems, then use Jquery solution instead - https://github.com/jquery-backstretch/jquery-backstretch */
/* Also the original CSS gradient was rendering oddly with in Safari, so I flattened it - https://bennettfeely.com/gradients */
#background_beauty::before {
	will-change: transform;
	background-image: url(random/beauty-gradient.png);
	background-size:100% 100%;
	position: fixed;
	content:'';
	height: 100%;
	width: 100%;
	z-index: -1;
}

#whole_container {
	max-width: 1024px;
	margin: 0 auto;
}

#masonry_container {
	width: 100%;
	margin: 0 auto;
	padding-top:20px;
	padding-bottom:20px;
	border-top:5px #FFF dotted;
	border-bottom:5px #FFF dotted;
}

.section_title {
	font-size: 35px;
	font-weight:500;
	line-height:100%;
}

.info_box {
	width:492px;
	background-color:#FFF;
	padding:5px;
	margin:5px;
}

.title_flare {
	border-bottom:3px #fefae8 solid;
	-webkit-clip-path: polygon(0 0, 98% 0, 100% 100%, 0% 100%);
	clip-path: polygon(0 0, 98% 0, 100% 100%, 0% 100%);
}

.info_title {
	font-size:25px;
	padding-top:40px;
	padding-bottom:3px;
	margin-bottom:5px;
	border-bottom:1px #CCC dashed;
	display:block;
	line-height:110%;
}

.page_cut {
	width:99% !important;
	border-bottom:2px #FFF solid;
	padding:0px !important;
	margin:30px 5px 30px 5px !important;
}

#software_left {
	display:inline-block;
	text-align:right;
	padding-right:15px;
}

#software_right {
	display:inline-block;
	width:395px;
}

.award_indent {
	padding:5px 10px;
	border:1px dashed #CCC;
	margin:5px 0px 0px 5px;
	display:inline-block;
}

.medium_weight_text {
	font-weight:400;
	display:inline-block;
}

.smaller_text {
	font-size:12px;
	line-height:140%;
}

.awards_cut {
	width:100%;
	border-bottom:1px #ebebeb dotted;
	margin:20px 0px 15px 0px;
}

#download_button, #download_button:link, #download_button:visited {
	background-color:#f65535;
	padding:10px;
	text-align:center;
	color:#FFF;
	font-size:25px;
	display:block;
	font-weight:300;
	text-decoration: none;
}
#download_button:hover {background-color:#ff6445;}
#download_button:active {background-color:#ff6d50;}


/* IPHONE, IPAD, AND MOBILE SPECIFIC */

/* iPhone [portrait + landscape] */
@media only screen and (max-device-width: 480px) {
html,body {font-weight:500 !important;}
a:link {font-weight:500 !important;}
a:visited {font-weight:500 !important;}
a:hover {font-weight:500 !important;}
a:active {font-weight:500 !important;}
.section_title {font-weight:600 !important;}
} 

/* iPad [portrait + landscape] */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
html,body {font-weight:500 !important;}
a:link {font-weight:500 !important;}
a:visited {font-weight:500 !important;}
a:hover {font-weight:500 !important;}
a:active {font-weight:500 !important;}
.section_title {font-weight:600 !important;}
}