/*
    ▒█▀▀▀█ █▀▀█ █▀▀█ █▀▀█ 　 ▒█▀▀▀█ █░░█ █▀▀█ █▀▀█ █▀▀█ █▀▀▄ 
    ░▀▀▀▄▄ █▄▄█ █▄▄▀ █▄▄█ 　 ░▀▀▀▄▄ █░░█ █░░█ █░░█ █▄▄█ █░░█ 
    ▒█▄▄▄█ ▀░░▀ ▀░▀▀ ▀░░▀ 　 ▒█▄▄▄█ ░▀▀▀ █▀▀▀ █▀▀▀ ▀░░▀ ▀░░▀ 
    
    Designed + Developed by Isaac Ruder
    https://isaacruder.us
*/

html {font-size: 16px; -webkit-font-smoothing: antialiased;}
html, body {margin: 0; padding: 0; width: 100%; height: 100%; background-color: #ffffff;}

.clear {clear:both;}

img, a img {width: 100%; height: auto; margin: 0; padding: 0;}

* { cursor: none !important; }
/*html,body,a,img {cursor: url("cursorblank.png") 0 0, pointer;}*/
#cursor {display: block; position: absolute; z-index: 9999; margin-left: -34px; margin-top: -2px; pointer-events:none;}
@media only screen and (max-width: 768px) {
	#cursor{display: none;}
	* { cursor: default !important; }
	/*html,body,a,img {cursor: pointer;}*/
}
/* Typography */

h1, h2, p {margin: 0; padding: 0; font-weight: normal;}
h1 {font-family: 'CirrusCumulus', monospace; 
		font-size: 3.6rem; line-height: 3.8rem;}
h2 {margin-bottom: 0.35rem; margin-top:  1.48rem;}
p, h2 {font-family: 'Athletics', Helvetica, Arial, sans-serif; 
		font-size: 1.19rem; line-height: 1.48rem;}
.ptitle {margin-bottom: 0.35rem;}

em {font-family: 'Athletics-Italic';}
strong, b {font-family: 'Athletics'; font-weight: normal;}

a, a:visited, a:hover, a:active {text-decoration: underline; font-size: inherit; line-height: inherit;}
a, a:visited {color: #000000;}
a:hover, a:active {color: #ff0c0c;}

::-moz-selection {background: #ff0c0c; color: #000000; text-shadow: none;}
		 ::selection {background: #ff0c0c; color: #000000; text-shadow: none;}


/* Layout */
#container, #containerabout {width: calc(100% - 1.4rem); position: relative; padding: 0.7rem; margin: 0;}
#containerabout {max-width: 480px;}

#namelogo, #about, #contact {position: fixed; z-index: 100;}
#name {top: 0.5rem; left: 0.7rem; position: fixed; z-index: 0;}
#namelogo {top:  0.5rem; left:  -0.32rem;}
#about {left: 0.68rem; bottom: 3.65rem;}
#namelogo a, #about a, #namelogo a:visited, #about a:visited {color: #ff0c0c;}
#namelogo a:hover, #about a:hover, #namelogo a:active, #about a:active {color: #000000;}
#contact {left: 1rem; bottom: 0.75rem; width: 5.9rem}

#contactsvg .st0{fill:#FF0C0C;}
#contactsvg:hover .st0 {fill:#000000;}

#wgradient {display: none;}

.aboutwrap {display: inline-block; float: right; margin: 0; padding: 0;}
.aboutcolA, .aboutcolB {display: inline-block; float: left; margin: 0; padding: 0;}
.aboutcolA {width: 3.5rem;}
.aboutcolB {width: calc(100% - 3.5rem);}

h1 a, h1 a:visited, h1 a:hover, h1 a:active {text-decoration: none;}

.indexlistspace {width: 100%; height: 5.25rem;}
@media only screen and (max-width: 480px) {
	.indexlistspace {height: 9rem;}
}


#pgcontainer {width: 100%; display: inline-block; float: left; padding: 0;
	position: relative; flex: 1 0 auto; margin: 0;}
.pgcontent {display: none;}
.pgcontentmobile {margin-top: 3rem; display: block;} 
.gridmob {width: 12rem; position: relative; left: calc(50% - 6rem); margin-bottom: 3rem;}
/*.gribmob img {max-width: 100%; max-height: 12.5rem !important;}*/

.pLmenu {width: 100%; height: 100%;
	position: fixed; z-index: 111;
	top: 0; left: 0;
	/*background-color: rgb(255,12,12);*/
	/*background-color: rgba(255,12,12, .25);*/
	overflow-x: hidden;}
.pLcontent {width: calc(100% - 1.4rem); position: relative; padding: 0.7rem; margin: 0;
	position: relative;
	top: 0; left: 0;}
.pLcontent h1, .pLcontent h1 a, .pLcontent h1 a:visited, .pLmenu h1 a, .pLmenu h1 a:visited {color: #ffffff !important}
.pLcontent h1 a:hover, .pLmenu h1 a:hover {color: #000000 !important}
.pLmenu .pLclose {position: fixed;
	top: -0.6rem; right: 0.7rem;
	z-index: 222;}


@media only screen and (min-width: 800px) {
	#pgcontainer {width: calc(100% - 24rem); max-width: 1600px;}
	.pgcontent {margin-top: 2.5rem; display: inline-block;}
	.pgcontentmobile {display: none;}
	.grid.columns {width: 6rem; margin-right: 6rem; margin-bottom: 4.4rem;}
	.griditemwrap {position: relative !important; padding-top: 75%; width: 100%;}
	.griditem {position: absolute !important; top: 0; left: 0; bottom: 0; right: 0;}
	.griditem img {max-height:100%; max-width:100%; width: auto; position: absolute; top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);}

	.gtypefour.columns	{width: calc(24rem - 0.7rem); margin-right: 0.7rem;}

	#wgradient {display: block; position: fixed; z-index: 90; width: 25rem; bottom: 0; left: 0; height: 14rem; pointer-events:none;}
	#wgradient:after { content: "";
		background: -moz-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 33%, rgba(255,255,255,0) 100%);
		background: -webkit-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 33%, rgba(255,255,255,0) 100%);
		background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 33%, rgba(255,255,255,0) 100%);
		position: absolute !important;
		/*margin-top: -1.4rem;*/
		width: 25rem;
		height: 14rem;
	}
}


/* Grid */

.mobile {display: inline-block !important;}
.desktop {display: none !important;}

.column, .columns {display: inline-block; float: left; margin: 0; padding: 0;}
.column, .typecolumn, .one.columns, .two.columns, .three.columns, .four.columns, .five.columns, .six.columns, .seven.columns, .eight.columns, .nine.columns, .ten.columns, .eleven.columns, .twelve.columns, .typeone.columns, .typetwo.columns, .typethree.columns, .typefour.columns, .typefive.columns, .typesix.columns, .typeseven.columns, .typeeight.columns, .typenine.columns, .typeten.columns, .typeeleven.columns, .typetwelve.columns {width: 100%;}
.typeone.columns, .typetwo.columns, .typethree.columns, .typefour.columns, .typefive.columns, .typesix.columns, .typeseven.columns, .typeeight.columns, .typenine.columns, .typeten.columns, .typeeleven.columns, .typetwelve.columns {margin-right: 0;}
.offsetbyone, .offsetbytwo, .offsetbythree, .offsetbyfour, .offsetbyfive, .offsetbysix, .offsetbyseven, .offsetbyeight, .offsetbynine, .offsetbyten, .offsetbyeleven, .offsetbytypeone, .offsetbytypetwo, .offsetbytypethree, .offsetbytypefour, .offsetbytypefive, .offsetbytypesix, .offsetbytypeseven, .offsetbytypeeight, .offsetbytypenine, .offsetbytypeten, .offsetbytypeeleven {margin-left: 0;}

@media only screen and (min-width: 1175px) { /*768*/
	.mobile {display: none !important;}
	.desktop {display: inline-block !important;}

	#containerabout {max-width: 1200px;}

	.one.columns	{width: 8.333%}
	.two.columns	{width: 16.666%}
	.three.columns	{width: 25%}
	.four.columns	{width: 33.333%}
	.five.columns	{width: 41.666%}
	.six.columns	{width: 50%}
	.seven.columns	{width: 58.333%}
	.eight.columns	{width: 66.666%}
	.nine.columns	{width: 75%}
	.ten.columns	{width: 83.333%}
	.eleven.columns	{width: 91.666%}
	.twelve.columns	{width: 100%}

	.offsetbyone	{margin-left: 8.333%;}
	.offsetbytwo	{margin-left: 16.666%;}
	.offsetbythree	{margin-left: 25%;}
	.offsetbyfour	{margin-left: 33.333%;}
	.offsetbyfive	{margin-left: 41.666%;}
	.offsetbysix	{margin-left: 50%;}
	.offsetbyseven	{margin-left: 58.333%;}
	.offsetbyeight	{margin-left: 66.666%;}
	.offsetbynine	{margin-left: 75%;}
	.offsetbyten	{margin-left: 83.333%;}
	.offsetbyeleven	{margin-left: 91.666%;}

	.typeone.columns	{width: calc(6rem - 0.7rem); margin-right: 0.7rem;}
	.typetwo.columns	{width: calc(12rem - 0.7rem); margin-right: 0.7rem;}
	.typethree.columns	{width: calc(18rem - 0.7rem); margin-right: 0.7rem;}
	.typefour.columns	{width: calc(24rem - 0.7rem); margin-right: 0.7rem;}
	.typefive.columns	{width: calc(30rem - 0.7rem); margin-right: 0.7rem;}
	.typesix.columns	{width: calc(36rem - 0.7rem); margin-right: 0.7rem;}
	.typeseven.columns	{width: calc(42rem - 0.7rem); margin-right: 0.7rem;}
	.typeeight.columns	{width: calc(48rem - 0.7rem); margin-right: 0.7rem;}
	.typenine.columns	{width: calc(54rem - 0.7rem); margin-right: 0.7rem;}
	.typeten.columns	{width: calc(60rem - 0.7rem); margin-right: 0.7rem;}
	.typeeleven.columns	{width: calc(66rem - 0.7rem); margin-right: 0.7rem;}
	.typetwelve.columns	{width: calc(72rem - 0.7rem); margin-right: 0.7rem;}

	.offsetbytypeone	{margin-left: 6rem}
	.offsetbytypetwo	{margin-left: 12rem}
	.offsetbytypethree	{margin-left: 18rem}
	.offsetbytypefour	{margin-left: 24rem}
	.offsetbytypefive	{margin-left: 30rem}
	.offsetbytypesix	{margin-left: 36rem}
	.offsetbytypeseven	{margin-left: 42rem}
	.offsetbytypeeight	{margin-left: 48rem}
	.offsetbytypenine	{margin-left: 54rem}
	.offsetbytypeten	{margin-left: 60rem}
	.offsetbytypeeleven	{margin-left: 66rem}
}


/*Typeface Embed*/
@font-face {
		font-family: 'CirrusCumulus';
		src: url('fonts/CirrusCumulus.woff') format('woff'),
				 url('fonts/CirrusCumulus.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
}

@font-face {
		font-family: 'Athletics';
		src: url('fonts/Athletics-Medium.woff2') format('woff2'),
				url('fonts/Athletics-Medium.woff') format('woff');
		font-weight: 500;
		font-style: normal;
}

@font-face {
		font-family: 'Athletics-Italic';
		src: url('fonts/Athletics-MediumItalic.woff2') format('woff2'),
				url('fonts/Athletics-MediumItalic.woff') format('woff');
		font-weight: 500;
		font-style: italic;
}