@charset "UTF-8";

		/* Mode Media Queries */

		div, p, a, li, td { -webkit-text-size-adjust:none; }
		
		
		/*///////   Phones & Small Desktop   /////////*/
		
		
		@media only screen 
		and (min-width : 320px) 
		and (max-width : 768px) {
			
			 a, .on {font-size:26px;}
			.buttons {margin:0 10px 0 0; display:inline-block;}
			.royalSlider.rsDefault {padding: 50px 0 50px 0 !important;}
			.thumbnails-header {font-size:14px; width:80%; padding: 25% 0 0 5%;}
			.thumbnails-header h1 {font-size: 20px !important; padding-bottom:0;}
			.thumb_text_on {padding-top: 0 !important}
			.size-small, .size-medium, .size-big {width:47% !important; margin: 0 3% 3% 0 !important;}
			.box {width:98% !important; margin: 0 0 5% 0 !important;}
			.icon-th:before { font-size: 0.8em !important; content: '\e803'; }
			.icon-th-large:before { font-size: 0.8em  !important; content: '\e80a';}
			.art {font-size:16px !important;}
			
			.gallery-nav-prev {left: 20px;}
			.gallery-nav-next {right: 130px;}
			.labelIndex {font-size:12px; top:6px; left:-40px; opacity:1 !important;}
			.rs-caption, .ex-caption, .gallery-nav-next, .gallery-nav-prev, .labelThumbs {display:none !important;}
			
			#menoo {
			width: 100%;
			height: 400px;
		    max-width: 100%;
		    top: auto;
		    bottom: -360px;
		    left: 0;
		    text-align: left;
		    padding: 10px 0 0 0;
		
			-webkit-border-radius: 0px;
		    -moz-border-radius: 0px;
		    -o-border-radius: 0px;
		    -ms-border-radius: 0px;
		    -khtml-border-radius: 0px;
		    border-radius: 0px;
			}
			
			#arrows {display:block;}
			#title, #next, #prev, #counter {display:none !important;}
			#logo {padding:2px 0 0 15px; text-align:left;}
			#logo h1 {font-size:26px !important; letter-spacing:-1px; padding-left:0px; line-height:26px;}
			#name {font-size:14px; top:14px; right:auto; left:10px; text-align:left; padding:0 0 0 0; height:10px;}		
			#center {width:90%; padding:30px 0 0 15px; line-height:30px; margin: 0;}
			#thumbs_container {width:94%; margin:5% 2% 0 4%; padding:0 0 60px 0;}
			#thumbnails, #projthumbs {bottom:auto; top:10px; right:10px;}
			#projthumbs {left:auto; right:40px;}
			
			#content {position:static; font-size:16px; width:80%; margin:5% auto 0 auto; line-height:20px; padding-bottom:30px;}
			#content img {display:none;}	
			#content a {font-size:16px;}
			
			#social {position:static !important; width:80% !important; padding:0 0 100px 0 !important; margin:0 auto 0 auto !important;}
			#helloName {font-size:30px; letter-spacing:0px;}
			
		}		
		
		
		@media only screen 
		and (min-width : 320px) 
		and (max-width : 768px) 
		and (orientation : landscape) {
			
			.box {width:47% !important; margin:0 3% 3% 0 !important;}	
			
		}
		
		
		/*///////   Tablets & Small Desktop   /////////*/
		
		
		@media only screen 
		and (min-width : 768px) 
		and (max-width : 1024px) {
			
			 a {font-size: 30px;}
			.buttons {line-height:30px;}
			.on {font-size:30px; line-height:30px;}
			.royalSlider.rsDefault {padding: 0 220px 0 0 !important;}
			.box {width:25% !important; margin:0 3% 3% 0 !important;}
			.art {font-size:16px !important;}
		
			#menoo {max-width:220px;}			
			#center {padding:40px 40px 0 30px;}
			#name {left:20px;}
			#content {top:30px;}	
			
			#logo, #title {width:auto; padding: 30px 40px 10px 30px;}		
			#logo h1 {font-size:40px; line-height:45px;}
			

			
		}
		
		@media only screen 
		and (min-width : 768px) 
		and (max-width : 1024px)
		and (orientation : portrait) {
			
			.box {width:47% !important; margin:0 3% 3% 0 !important;}
			.royalSlider.rsDefault {padding: 100px 0 100px 0 !important;}
			
			#menoo {max-width:100% !important;}
			#logo {padding:2px 0 0 15px; text-align:left;}
			#logo h1 {font-size:26px !important; letter-spacing:-1px; padding-left:0px; line-height:26px;}
			
		}
		
		
		/*  iPad Pro  */		
		
		
		@media only screen 
		and (min-device-width : 1024px) 
		and (max-device-width : 1366px)
		and (-webkit-min-device-pixel-ratio: 1.5) {
		
			
		
		}
		
		
		@media only screen 
		and (min-device-width : 1024px) 
		and (max-device-width : 1366px)
		and (orientation: portrait) 
		and (-webkit-min-device-pixel-ratio: 1.5) {
			
			 a, .on {font-size:26px;}
			.buttons {margin:0 10px 0 0; display:inline-block;}
			.royalSlider.rsDefault {padding: 50px 0 50px 0 !important;}
			.thumbnails-header {font-size:14px; width:80%; padding: 25% 0 0 5%;}
			.thumbnails-header h1 {font-size: 20px !important; padding-bottom:0;}
			.thumb_text_on {padding-top: 0 !important}
			.size-small, .size-medium, .size-big {width:47% !important; margin: 0 3% 3% 0 !important;}
			.box {width:47% !important; margin:0 3% 3% 0 !important;}
			.icon-th:before { font-size: 0.8em !important; content: '\e803'; }
			.icon-th-large:before { font-size: 0.8em  !important; content: '\e80a';}
			.art {font-size:16px !important;}
			
			.gallery-nav-prev {left: 20px;}
			.gallery-nav-next {right: 130px;}
			.labelIndex {font-size:12px; top:6px; left:-40px; opacity:1 !important;}
			.rs-caption, .ex-caption, .gallery-nav-next, .gallery-nav-prev, .labelThumbs {display:none !important;}
			
			#menoo {
			width: 100%;
			height: 400px;
		    max-width: 100%;
		    top: auto;
		    bottom: -360px;
		    left: 0;
		    text-align: left;
		    padding: 10px 0 0 0;
		
			-webkit-border-radius: 0px;
		    -moz-border-radius: 0px;
		    -o-border-radius: 0px;
		    -ms-border-radius: 0px;
		    -khtml-border-radius: 0px;
		    border-radius: 0px;
			}
			
			#arrows {right:30px; display:block;}
			#title, #next, #prev, #counter {display:none !important;}
			#logo {padding:2px 0 0 30px; text-align:left;}
			#logo h1 {font-size:26px !important; letter-spacing:-1px; padding-left:0px; line-height:26px;}
			#name {font-size:14px; top:14px; right:auto; left:10px; text-align:left; padding:0 0 0 0; height:10px;}		
			#center {width:90%; padding:30px 0 0 30px; line-height:30px; margin: 0;}
			#thumbs_container {width:94%; margin:5% 2% 0 4%; padding:0 0 60px 0;}
			#thumbnails, #projthumbs {bottom:auto; top:10px; right:10px;}
			#projthumbs {left:auto; right:40px;}
			
			#content {position:static; font-size:16px; width:80%; margin:5% auto 0 auto; line-height:20px; padding-bottom:30px;}		
			#content a {font-size:16px;}
			
			#social {position:static !important; width:80%; padding:0 0 100px 0 !important; margin:0 auto 0 auto;}
			#helloName {font-size:30px; letter-spacing:0px;}
			
		}