@font-face { font-family: replica; src:url("../fonts/lineto-replica-regular.eot"); src:url("../fonts/lineto-replica-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/lineto-replica-regular.woff") format("woff"); font-weight: normal; font-style: normal; }
@font-face { font-family: replica; src:url("../fonts/lineto-replica-bold.eot"); src:url("../fonts/lineto-replica-bold.eot?#iefix") format("embedded-opentype"), url("../fonts/lineto-replica-bold.woff") format("woff"); font-weight: bold; font-style: normal; }
@font-face { font-family: replica; src:url("../fonts/lineto-replica-italic.eot"); src:url("../fonts/lineto-replica-italic.eot?#iefix") format("embedded-opentype"), url("../fonts/lineto-replica-italic.woff") format("woff"); font-weight: normal; font-style: italic; }
@font-face { font-family: replica; src:url("../fonts/lineto-replica-bolditalic.eot"); src:url("../fonts/lineto-replica-bolditalic.eot?#iefix") format("embedded-opentype"), url("../fonts/lineto-replica-bolditalic.woff") format("woff"); font-weight: bold; font-style: italic; }

/** Initialization **************************************************/
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite,
	code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset,
	form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, figure,
	section, nav, input, select, textarea, button, 
	header, footer, article, aside, section { border: 0; box-sizing: border-box; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline; }
	:focus { outline: 0; }
	body { background: white; color: #000; line-height: 1; }
	ol, ul { list-style: none; }
	table { border-collapse: separate; border-spacing: 0; }	
	caption, th, td { font-weight: normal; text-align: left; }
	article, aside, figure, footer, header, hgroup, menu, nav, section { display: block; margin: 0; }
	.clearfix:before, .clearfix:after { content: " "; display: table; }
	.clearfix:after { clear: both; }
	.clearfix { *zoom: 1; }
	.hidden { display: none; }
	code.device { display: none; height: 1px; left: 0; pointer-events: none; position: fixed; top: 1px; width: 1px; opacity: 0; filter: alpha(opacity=0); }
	a { cursor: pointer; text-decoration: none; }
	* { -webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; -webkit-appearance: none; -webkit-border-radius: 0px; -webkit-text-size-adjust: 100%; }
	::selection { background: #000; color: #fff; }
	::-moz-selection { background: #000; color: #fff; }

/** Scaffolding **************************************************/
	body { color: #000; font-family: replica; font-weight: normal; }

	#projects div.project { display: block; }
	#projects div.project a { display: block; overflow: hidden; position: relative; }	
	#projects div.project:not(.no-border) { background: #000; border: 10px solid #000; }
	#projects div.project.about a { background: #fff; }
	#projects div.project img { display: block; }
	#projects div.project.video img { pointer-events: none ; opacity: 0; filter: alpha(opacity=0); }
	#projects div.project.video video { display: block; height: 100%; left: 0; object-fit: cover; position: absolute; top: 0; width: 100%; }
	#projects div.project div { display: none; }
	#projects div.template { display: none; }
	
	#project { display: none; }
	#project article { }
	#project aside { }
	
	body.project #projects { position: fixed !important; pointer-events: none; opacity: 0; filter: alpha(opacity=0); }
	body.project #project { background: #fff; display: block; z-index: 20; }
	
	#project span.close { background: url('../images/close.svg') center center no-repeat; bcursor: pointer; display: block; position: absolute; right: 0; top: 0; }
	#project div.videodetector { padding-bottom: 57%; position: relative; width: 100%; }
	#project div.videodetector iframe { display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
	#project input { display: none; }

	#project div.container div img { cursor: zoom-in; }
	#project img { display: block; width: 100%; }
	#project #cc-logo { height: 80px; padding-top: 20px; text-align: center; width: 100%; }
	#project #cc-logo span { background: url('../images/logo.svg') center center no-repeat; background-size: 80px auto; cursor: pointer; display: inline-block; height: 40px; position: relative; text-indent: -9999px; width: 40px; }
	#project h2,
	#project h3 { font-weight: bold; text-transform: uppercase; }
	#project strong { font-weight: bold; }
	#project em { font-style: italic; }
	#project a { border-bottom: 1px solid #000; color: #000; font-size: inherit !important; font-style: inherit !important; font-family: inherit !important; font-weight: inherit !important; position: relative; }
	#project ul li { margin-left: 20px; position: relative; }
	#project ul li::before { background: #000; content: ''; display: block; height: 4px; left: -15px; position: absolute; width: 4px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; }
	
	/** Mobile **********/
	@media all and (max-width: 767px){
		.desktop-only { display: none !important; }
		code#_mobile { display: block; }
		
		body { padding: 40px 20px; }
		
		#projects div.column { display: none; }
		#projects div.project { height: 100% !important; left: 0 !important; margin: 0 !important; position: relative !important; top: 0 !important; width: 100% !important; }
		#projects div.project:not(:last-of-type) { margin-bottom: 20px !important; }
		#projects div.project a img { width: 100%; }
		
		#project { font-size: 18px; line-height: 28px; height: 100%; overflow: auto; padding-top: 80px; position: relative; }
		#project div.container div a { margin-bottom: 4px; }
		#project div.container div figcaption { font-size: 12px; margin-bottom: 16px; }
		#project #cc-logo { margin: 40px auto 0 auto; }
		#project span.close { height: 40px; width: 40px; }
		#project h2,
		#project h3 { font-size: 22px; line-height: 25px; }
		#project h2:last-of-type { margin-bottom: 25px; }
		#project a { font-size: 17px !important; line-height: 23px; }
		#project article,
		#project aside { margin-bottom: 60px; }
		#project ul li::before { top: calc(50% - 1px); }
	}


	/** Tablet Device **********/
	@media all and (min-device-width: 768px) and (max-device-width: 1024px) {
		.mobile-only { display: none !important; }
		code#_tablet { display: block; }
		
		#projects { font-size: 0; padding: 20px; }
		#projects div.column { display: inline-block; vertical-align: top; width: calc(50% - 10px); }
		#projects div.column.left { margin-right: 10px; }
		#projects div.column.right { margin-left: 10px; }
		#projects div.project { height: 100% !important; left: 0 !important; margin: 0 !important; position: relative !important; top: 0 !important; width: 100% !important; }
		#projects div.project:not(:last-of-type) { margin-bottom: 20px !important; }
		#projects div.project a img { width: 100%; }

		#project { padding: 40px; }
		#project #cc-logo { margin: 40px auto 0 auto; }
		#project article,
		#project aside { margin-bottom: 60px; }
		#project div.container div figcaption { font-size: 14px; margin-bottom: 16px; }
	}

	/** Tablet & Desktop **********/
	@media all and (min-width: 768px) and (min-device-width: 1025px) {
		.mobile-only { display: none !important; }
		.code_desktop { display: block; }
		
		#projects { height: 100%; overflow: hidden; position: absolute !important; width: 100%; transform-style: preserve-3d; }
		#projects div.column { display: none; }
		#projects div.project { cursor: move; height: auto !important; position: absolute; width: auto !important; }
		#projects div.project:not(.dragged) { transform: translate3d(-50%, -50%, 0); -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); }
		#projects div.project#project-1 { left: calc(50% + 160px); top: calc(50% + 68px); z-index: 9; }
		#projects div.project#project-2 { left: calc(50% + 6px); top: calc(50% - 39px); z-index: 8; }
		#projects div.project#project-3 { left: calc(50% - 311px); top: calc(50% + 101px); z-index: 7; }
		#projects div.project#project-3 img { width: 399px; }
		#projects div.project#project-4 { left: calc(50% + 291px); top: calc(50% - 138px); z-index: 6; }
		#projects div.project#project-5 { left: calc(50% - 212px); top: calc(50% + 68px); z-index: 5; }
		#projects div.project#project-6 { left: calc(50% + 51px); top: calc(50% - 1px); z-index: 4; }
		#projects div.project#project-7 { left: calc(50% - 291px); top: calc(50% - 123px); z-index: 3; }
		#projects div.project#project-8 { left: calc(50% + 248px); top: calc(50% + 32px); z-index: 2; }
		#projects div.project#project-9 { left: calc(50% + 231px); top: calc(50% + 99px); z-index: 1; }
		#projects div.project a img { width: auto; }
		#projects div.project.about a img { width: 250px; }
		
		#project article,
		#project aside { display: inline-block; vertical-align: top; }
		#project article { margin-bottom: 40px; padding-right: 100px; width: calc(100% - 250px); }
		#project aside { width: 250px; }
		#project div.container div figcaption { font-size: 14px; margin-bottom: 16px; }
		
		.mfp-bg { border: 10px solid #000; }
	}
	
	/** Tablet Device and Desktop **********/
	@media all and (min-width: 768px) and (min-device-width: 768px) {
		
		#project { border: 10px solid #000; font-size: 0;  height: 100%; overflow: auto; position: absolute; width: 100%; }
		#project div.container { margin: 0 auto; max-width: 1090px; position: relative; }
		#project span.close { height: 50px; width: 50px; }
		#project h2,
		#project h3 { font-size: 50px; line-height: 55px; }
		#project h2 { width: calc(100% - 250px); }
		#project h2:last-of-type { margin-bottom: 50px; }
		#project article,
		#project aside { font-size: 22px; line-height: 28px; }
		#project ul li::before { top: 50%; }
		#project div.container div { display: inline-block; margin-top: 32px !important; vertical-align: top; width: calc((100% - 60px) / 3); }
		#project div.container div:nth-of-type(2) { margin: 0 20px; }	
		#project div.container div a { margin-bottom: 4px; }
	}
	
	/** Tablet */
	@media all and (min-width: 768px) and (max-width: 1024px) and (min-device-width: 1025px) {
		#project { padding: 40px; }
		#project #cc-logo { margin: 40px auto 0 auto; }
		#projects div.project a img { max-height: 300px; max-width: 300px; }
	}
	
	/** Desktop Small */
	@media all and (min-width: 1025px) and (max-width: 1400px){
		#projects div.project a img { max-height: 400px; max-width: 400px; }
		#project #cc-logo { margin: 40px auto; }
	}
	
	/** Desktop */
	@media all and (min-width: 1025px) {
		#project { padding: 72px 40px 0 40px; }
	}
	
	
.mfp-bg,.mfp-wrap{position:fixed;left:0;top:0}.mfp-bg,.mfp-container,.mfp-wrap{height:100%;width:100%}.mfp-bg{z-index:30042;overflow:hidden;background:#fff;opacity:.95;filter:alpha(opacity=95)}.mfp-wrap{z-index:31043;overflow-y:hidden!important;outline:0!important;-webkit-backface-visibility:hidden}.mfp-container{text-align:center;position:absolute;left:0;top:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.mfp-container:before{content:'';display:inline-block;height:100%;vertical-align:middle}.mfp-align-top .mfp-container:before{display:none}.mfp-content{position:relative;display:inline-block;vertical-align:middle;margin:0 auto;text-align:left;z-index:31045}.mfp-close,.mfp-preloader{text-align:center;position:absolute}.mfp-ajax-holder .mfp-content,.mfp-inline-holder .mfp-content{width:100%;cursor:auto}.mfp-ajax-cur{cursor:progress}.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:-moz-zoom-out;cursor:-webkit-zoom-out;cursor:zoom-out}.mfp-zoom{cursor:pointer;cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in}.mfp-auto-cursor .mfp-content{cursor:auto}.mfp-arrow,.mfp-close,.mfp-counter,.mfp-preloader{-webkit-user-select:none;-moz-user-select:none;user-select:none}.mfp-loading.mfp-figure{display:none}.mfp-hide{display:none!important}.mfp-preloader{color:#ccc;top:50%;width:auto;margin-top:-.8em;left:8px;right:8px;z-index:31044}.mfp-preloader a{color:#ccc}.mfp-close,.mfp-preloader a:hover{color:#fff}.mfp-s-error .mfp-content,.mfp-s-ready .mfp-preloader{display:none}button.mfp-arrow,button.mfp-close{overflow:visible;cursor:pointer;background:0 0;border:0;-webkit-appearance:none;display:block;outline:0;padding:0;z-index:31046;-webkit-box-shadow:none;box-shadow:none}button::-moz-focus-inner{padding:0;border:0}.mfp-close{width:44px;height:44px;line-height:44px;right:0;top:0;text-decoration:none;opacity:.65;filter:alpha(opacity=65);padding:0 0 18px 10px;font-style:normal;font-size:28px;font-family:Arial,Baskerville,monospace}.mfp-close:focus,.mfp-close:hover{opacity:1;filter:alpha(opacity=100)}.mfp-close:active{top:1px}.mfp-close-btn-in .mfp-close{color:#333}.mfp-iframe-holder .mfp-close,.mfp-image-holder .mfp-close{color:#fff;right:-6px;text-align:right;padding-right:6px;width:100%}.mfp-counter{position:absolute;top:0;right:0;color:#ccc;font-size:12px;line-height:18px}.mfp-figure,img.mfp-img{line-height:0}.mfp-arrow{position:absolute;opacity:.65;filter:alpha(opacity=65);margin:-55px 0 0;top:50%;padding:0;width:90px;height:110px;-webkit-tap-highlight-color:transparent}.mfp-arrow:active{margin-top:-54px}.mfp-arrow:focus,.mfp-arrow:hover{opacity:1;filter:alpha(opacity=100)}.mfp-arrow .mfp-a,.mfp-arrow .mfp-b,.mfp-arrow:after,.mfp-arrow:before{content:'';display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:inset transparent}.mfp-arrow .mfp-a,.mfp-arrow:after{border-top-width:13px;border-bottom-width:13px;top:8px}.mfp-arrow .mfp-b,.mfp-arrow:before{border-top-width:21px;border-bottom-width:21px;opacity:.7}.mfp-arrow-left{left:0}.mfp-arrow-left .mfp-a,.mfp-arrow-left:after{border-right:17px solid #fff;margin-left:31px}.mfp-arrow-left .mfp-b,.mfp-arrow-left:before{margin-left:25px;border-right:27px solid #3f3f3f}.mfp-arrow-right{right:0}.mfp-arrow-right .mfp-a,.mfp-arrow-right:after{border-left:17px solid #fff;margin-left:39px}.mfp-arrow-right .mfp-b,.mfp-arrow-right:before{border-left:27px solid #3f3f3f}.mfp-iframe-holder{padding-top:40px;padding-bottom:40px}.mfp-iframe-holder .mfp-content{line-height:0;width:100%;max-width:900px}.mfp-iframe-holder .mfp-close{top:-40px}.mfp-iframe-scaler{width:100%;height:0;padding-top:56.25%}.mfp-iframe-scaler iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;background:#000}img.mfp-img{width:auto;max-width:100%;height:auto;display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:40px 0;margin:0 auto}.mfp-figure small{color:#bdbdbd;display:block;font-size:12px;line-height:14px}.mfp-figure figure{margin:0}.mfp-bottom-bar{margin-top:-36px;position:absolute;top:100%;left:0;width:100%;cursor:auto}.mfp-title{text-align:left;line-height:18px;color:#f3f3f3;word-wrap:break-word;padding-right:36px}.mfp-gallery .mfp-image-holder .mfp-figure{cursor:pointer}@media screen and (max-width:800px) and (orientation:landscape),screen and (max-height:300px){.mfp-img-mobile .mfp-image-holder{padding-left:0;padding-right:0}.mfp-img-mobile img.mfp-img{padding:0}.mfp-img-mobile .mfp-figure:after{top:0;bottom:0}.mfp-img-mobile .mfp-figure small{display:inline;margin-left:5px}.mfp-img-mobile .mfp-bottom-bar{background:rgba(0,0,0,.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.mfp-img-mobile .mfp-bottom-bar:empty{padding:0}.mfp-img-mobile .mfp-counter{right:5px;top:3px}.mfp-img-mobile .mfp-close{top:0;right:0;width:35px;height:35px;line-height:35px;background:rgba(0,0,0,.6);position:fixed;text-align:center;padding:0}}@media all and (max-width:900px){.mfp-arrow{-webkit-transform:scale(.75);transform:scale(.75)}.mfp-arrow-left{-webkit-transform-origin:0;transform-origin:0}.mfp-arrow-right{-webkit-transform-origin:100%;transform-origin:100%}}.mfp-ie7 .mfp-img{padding:0}.mfp-ie7 .mfp-bottom-bar{width:600px;left:50%;margin-left:-300px;margin-top:5px;padding-bottom:5px}.mfp-ie7 .mfp-container{padding:0}.mfp-ie7 .mfp-content{padding-top:44px}.mfp-ie7 .mfp-close{top:0;right:0;padding-top:0}.mfp-fade.mfp-bg{opacity:0;-webkit-transition:all .15s ease-out;-moz-transition:all .15s ease-out;transition:all .15s ease-out}.mfp-fade.mfp-bg.mfp-ready{opacity:.95}.mfp-fade.mfp-bg.mfp-removing{opacity:0}
