first commit

wwwuser/res/fonts/font.css

@@ -0,0 +1,12 @@
+@font-face {
+    font-family: 'bebas_neueregular';
+    src: url('BebasNeue-webfont.eot');
+    src: url('BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
+         url('BebasNeue-webfont.woff') format('woff'),
+         url('BebasNeue-webfont.ttf') format('truetype'),
+         url('BebasNeue-webfont.svg#bebas_neueregular') format('svg');
+    font-weight: normal;
+    font-style: normal;
+
+}
+

wwwuser/res/js/custom-youtube.js

@@ -0,0 +1 @@
+/***   ------------------------------------------------------   ***/

wwwuser/res/js/custom.js

@@ -0,0 +1,21 @@
+/***   ------------------------------------------------------   ***/
+/***     PLEASE NOTE                                            ***/
+/***     THIS FILE USED TO NON YOUTUBE VIDEO BACKGROUND         ***/
+/***   ------------------------------------------------------   ***/
+jQuery(document).ready(function($){
+
+	/***   ------------------------------------------------------   ***/
+	/***     CHANGE DATE                                            ***/
+	/***     DATE FORMAT: Month Date, Year Hour:Minute:Second       ***/
+	/***   ------------------------------------------------------   ***/
+	var options = {
+		startDate : new Date(),
+		endDate: new Date("January 1, 2018 8:00:00")
+		
+		/***   TRANSLATION : Enable following line by delete //   ***/
+		// ,titleDays : 'hari', titleHours : 'jam', titleMinutes : 'menit', titleSeconds : 'detik'
+	};	
+	
+	$('#container').cemara(options);
+	
+});

wwwuser/res/js/script.js

@@ -0,0 +1,287 @@
+/**
+ * Custom plugin for cemara theme
+ */
+(function($){
+	
+	$.fn.cemara = function( opt ){
+		
+		var obj = this,
+			
+			/***   Default options   ***/
+			defaults = {
+				startDate : new Date(),
+				endDate : new Date(),
+				titleDays : 'days',
+				titleHours : 'hours',
+				titleMinutes : 'minutes',
+				titleSeconds : 'seconds',
+				theme: 'custome',
+				videoID: ''
+			};
+		obj.options = $.extend(defaults, opt);
+	
+		obj.init = function(){
+			
+			// Activate nav animation
+			$(".nav-wrap", obj).hover(
+				function(){
+					$(this).addClass('hover');
+					$('.menu', obj).stop().animate(
+						{
+							dist: 300
+						},
+						{							
+							step: function(now, twin){
+								$(this).css('clip', 'rect(0px '+ now +'px auto 0px)');
+							}
+						}
+					);
+				},
+				function(){
+					$(this).removeClass('hover');
+					$('.menu', obj).stop().animate(
+						{
+							dist: 0
+						},
+						{
+							step: function(now, twin){
+								$(this).css('clip', 'rect(0px '+ now +'px auto 0px)');
+							}
+						}
+					);
+				}
+			);
+			
+			// Activate page animation
+			$('.menu a', obj).bind('click', function(event){
+				event.preventDefault();
+				var width = $(window).width();
+				var thePage = $($(this).attr('href'), obj);
+				if(thePage.size()){
+					obj.addClass('popup');
+					if(obj.currentPage || obj.activePage){
+						(obj.currentPage ? obj.currentPage : obj.activePage).stop().animate(
+							{
+								dist: 0
+							},
+							{
+								duration: 2000,
+								step: function(now, twin){
+									$(this).css('clip', 'rect(0px '+ now +'px auto 0px)');
+								},
+								complete: function(){
+									obj.currentPage = thePage;
+									obj.openCurrentPage(500);
+								}
+							}
+						);
+					}else{
+						obj.currentPage = thePage;
+						obj.openCurrentPage();
+					}
+				}				
+			});
+			
+			// Activate page close animation
+			$('.close-this').bind('click', function(event){
+				event.preventDefault();
+				if(obj.currentPage || obj.activePage){
+					(obj.currentPage ? obj.currentPage : obj.activePage).stop().animate(
+						{
+							dist: 0
+						},
+						{
+							duration: 2000,
+							step: function(now, twin){
+								$(this).css('clip', 'rect(0px '+ now +'px auto 0px)');
+							},
+							complete: function(){
+								obj.currentPage = null;
+								obj.activePage = null;
+								obj.removeClass('popup');
+							}
+						}
+					);
+				}
+			});
+				
+			
+			// Activate count down
+			$("#countdown", obj).dsCountDown( obj.options );
+			
+			// Activate placeholder for old browser
+			$(":input[placeholder]", obj).placeholder();
+			
+			// Activate newsletter popup
+			$('.popup-trigger', obj).cemaraClipBottom();
+			
+			// Activate ajax form
+			$('form', obj).submit(function(event){
+				event.preventDefault();
+				
+				var form = $(this);
+				
+				if(form.hasClass('processing')){
+					return false;
+				}
+				
+				var send_destination = form.attr('action') + '?ajax=1';
+				var send_data = form.serialize();
+				
+				form.addClass('processing');
+				$.ajax({
+					type: 'POST',
+					url: send_destination,
+					dataType: 'json',
+					data: send_data,
+					success: function(result){
+					
+						if(result.error){
+							form.find('.message').html(result.message);
+						}else if(result.success){
+							form.find('.message').html(result.message);
+							form.find('input[type="text"]').val('');
+							form.find('textarea').val('');
+						}
+						
+						form.removeClass('processing');
+						
+					}
+				});
+				
+			});
+			
+			//Activate Nav Clicked
+			$('.btn-trigger', obj).bind('click', function(event){
+				event.preventDefault();
+				
+			});
+			
+			$('#preloader', obj).fadeOut('slow', function(){
+				obj.removeClass('still-loading');
+			});
+			
+			
+			
+			// Activate background
+			if( obj.options.videoId ){
+				// Nothing todo since it's done by on ready state
+			}else{
+				var bg = $('#background img', obj);
+				if( bg.size() == 1){
+					var imageSrc = bg.attr('src');
+					$.vegas({
+						src: imageSrc,
+						fade: 1500
+					});
+				}else if(bg.size() > 1){
+					var theBackgrounds = [];
+					bg.each(function(){
+						theBackgrounds[theBackgrounds.length] = {
+							src: $(this).attr('src'),
+							fade: 1500
+						};
+					});
+					$.vegas('slideshow', {
+						delay: 7000,
+						backgrounds: theBackgrounds
+					})('overlay', {
+						src: 'images/slider-overlay.png'
+					});
+				}
+			}
+		}
+		
+		// Open current Page
+		obj.openCurrentPage = function(delay){
+			var width = $(window).width();
+			obj.currentPage.delay(delay).animate(
+				{
+					dist: width
+				},
+				{	
+					duration: 1500,
+					step: function(now, twin){
+						$(this).css('clip', 'rect(0px '+ now +'px auto 0px)');
+					},
+					complete: function(){
+						obj.activePage = obj.currentPage;
+						obj.currentPage = null;
+						$(this).css('clip', 'rect(0px auto auto 0px)');
+					}
+				}
+			);
+		}
+		
+		// Do preloader
+		obj.preloading = function(){
+			obj.addClass('still-loading');
+			var preloader = $('<div id="preloader"><div class="loading"><div class="label">loading...</div><div class="loading-indicators"></div></div></div>');
+			obj.prepend(preloader);
+			preloader.numberBg = $('#background img', obj).size();
+			if( preloader.numberBg ){
+				$('#background img', obj).each(function(index){
+					$('.loading-indicators', preloader).append('<span class="indicator-'+ index +'"></span>');
+					var bg = $(this);
+					bg.itemIndex = index;
+					var img = new Image();
+					img.onload = function(){
+						$('.indicator-' + bg.itemIndex, preloader).addClass('done');
+						if( $('.done', preloader).size() >= preloader.numberBg ){
+							setTimeout(function(){ obj.init(); }, 500);
+						}
+					};
+					img.src = $(this).attr('src');
+				});
+			}else{
+				obj.init();
+			}
+		}
+		
+		obj.preloading();
+		
+	}
+	
+	/* Custom cemara clip animation */
+	$.fn.cemaraClipBottom = function(){
+		var elm = this;
+		elm.dist = elm.attr('href');
+		$(elm.dist).css({'clip': 'rect(0px auto 0px 0px)', 'position': 'absolute'});
+		elm.bind('click', function(e){
+			e.preventDefault();
+			$(elm.dist).stop().animate(
+				{
+					dist: $(elm.dist).height()
+				},
+				{
+					duration: 1000,
+					step: function(now, twin){
+						$(this).css('clip', 'rect(0px auto '+ now +'px 0px)');
+					},
+					complete: function(){
+						$(this).css('clip', 'rect(0px auto auto 0px)');
+					}
+				}
+			);
+		});
+		$(elm.dist + ' .close-popup').bind('click', function(e){
+			e.preventDefault();			
+			$(elm.dist).stop().animate(
+				{
+					dist: 0
+				},
+				{
+					duration: 1000,
+					step: function(now, twin){
+						$(this).css('clip', 'rect(0px auto '+ now +'px 0px)');
+					}
+				}
+			);
+		});
+	}
+	
+	$(window).load(function(){
+		$(".page-container").mCustomScrollbar({theme:"dark"});
+	});
+	
+})(jQuery);

wwwuser/res/style/style.css

@@ -0,0 +1,771 @@
+/* == Preloader Section == */
+#preloader {
+	position: fixed;
+	width: 100%;
+	height: 100%;
+	z-index: 999;
+	background: #fff;
+	box-shadow: inset 0px 0px 250px 0px #aaa;
+}
+.loading {
+	line-height: 1;
+	text-align: center;
+	position: relative;
+	top: 30%;
+}
+.loading span{
+	display: inline-block;
+	width: 1px;
+	height: 10px;
+	border: 1px solid #000;
+	background: none #444;
+	margin: 0 10px;
+	
+	-webkit-transition: all 0.5s ease-in-out;
+	-moz-transition: all 0.5s ease-in-out;
+	-ms-transition: all 0.5s ease-in-out;
+	-o-transition: all 0.5s ease-in-out;
+	transition: all 0.5s ease-in-out;	
+}
+.loading span.done{		
+	background: none #fff;
+	outline: none;
+	border-color: #9ecaed;
+	width: 30px;
+	
+	box-shadow: 0 0 10px #9ecaed;
+}
+.loading .label {
+	color: #000;
+	text-transform: uppercase;
+	margin: 10px 0;
+	font-size: 12px;
+	padding-top: 90px;
+}
+
+
+/* == Typography == */
+body, p{
+	font-family: 'Open Sans', Arial, Helvetica, Sans-serif;
+	font-size: 18px;
+	color: #333;
+}
+p {
+	margin: 16px 0;
+	line-height: 1.25;
+}
+a{
+	color: #333;
+	
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+	-ms-transition: all 0.25s ease-in-out;
+	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;	
+}
+a:hover{
+	border-bottom: 1px solid #000;
+	text-decoration: none;
+}
+h1{
+	font-size: 45px;
+	font-weight: 200;
+	line-height: 1em;	
+}
+h2{
+	font-size: 40px;
+	font-weight: 200;
+	line-height: 1;	
+	margin: 25px 0;
+}
+h5 {
+	font-size: 25px;
+	font-weight: normal;
+	line-height: 1;
+	margin: 10px 0;
+}
+blockquote {
+	font-size: 20px;
+	line-height: 1.25em;
+	font-style: italic;
+	color: #666;
+	text-transform: lowercase;
+	padding: 20px;
+	text-align: right;
+	position: relative;
+}
+blockquote:before{
+	color: #fff;
+	content: "\201C";
+	font-size: 5em;
+	position:absolute;
+	right:5px;
+	top: 26px;
+	line-height: 0.1em;
+}
+blockquote:after{
+	color: #fff;
+	content: "\201D";
+	font-size: 5em;
+	position:absolute;
+	left:3px;
+	bottom: 0em;
+	line-height: 0.1em;
+}
+ul{
+	margin-left: 22px;
+}
+ul li {
+	line-height: 1.25em;
+	margin: 3px 0;
+}
+ul.home{
+	list-style-image: url(../images/icons/home.png);
+}
+ul.mail{
+	list-style-image: url(../images/icons/mail.png);
+}
+ul.phone{
+	list-style-image: url(../images/icons/phone.png);
+}
+ul.file{
+	list-style-image: url(../images/icons/file.png);
+}
+ul.gear{
+	list-style-image: url(../images/icons/gear.png);
+}
+ul.next{
+	list-style-image: url(../images/icons/next.png);
+}
+i {
+	display: inline-block;
+	width: 20px;
+	content: " ";
+	height: 1em;
+	vertical-align: baseline;
+}
+i.home{
+	background: url(../images/icons/home.png) no-repeat center 4px  transparent;
+}
+i.mail{
+	background: url(../images/icons/mail.png) no-repeat center 4px  transparent;
+}
+i.phone{
+	background: url(../images/icons/phone.png) no-repeat center 4px  transparent;
+}
+i.file{
+	background: url(../images/icons/file.png) no-repeat center 4px  transparent;
+}
+i.gear{
+	background: url(../images/icons/gear.png) no-repeat center 4px  transparent;
+}
+i.next{
+	background: url(../images/icons/next.png) no-repeat center 4px  transparent;
+}
+
+
+/* == Top Section == */
+html,body{
+	width: 100%;
+	height: 100%;
+}
+.header{
+	position: absolute;
+	top: 10px;
+	width: 100%;
+	z-index: 9;
+	
+	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+	filter: Alpha(Opacity=100);/* IE 5-7 */
+	-moz-opacity: 1; /* Netscape */
+	-khtml-opacity: 1; /* Safari 1.x */
+	opacity: 1;	/* Good browsers */
+	
+	-webkit-transition: all 0.5s ease-in-out;
+	-moz-transition: all 0.5s ease-in-out;
+	-ms-transition: all 0.5s ease-in-out;
+	-o-transition: all 0.5s ease-in-out;
+	transition: all 0.5s ease-in-out;
+}
+.header:after{
+	content: " ";
+	display: block;
+	clear: both;
+}
+body.popup .header{	
+	margin-top: -40px;
+	
+	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+	filter: Alpha(Opacity=0);/* IE 5-7 */
+	-moz-opacity: 0; /* Netscape */
+	-khtml-opacity: 0; /* Safari 1.x */
+	opacity: 0;	/* Good browsers */
+}
+h1#logo a span{
+	display: none;
+}
+h1#logo a{
+	display: block;
+	width: 114px;
+	height: 32px;
+	background: url(../images/logo.png) no-repeat center center transparent;
+	margin: 0 10px;
+}
+h1#logo a:hover{
+	border: 0;
+}
+.align-left{
+	float: left;
+}
+.align-right{
+	float: right;
+}
+#subscriber {
+	position: absolute;
+	right: 10px;
+}
+a.popup-trigger {
+	float: right;
+	font-size: 13px;
+	text-decoration: none;
+	margin-right: 10px;
+	color: #fff;
+}
+a.popup-trigger:hover{
+	text-decoration: underline;
+}
+.popup-form {
+	background: #fff;
+	right: 0;
+	top: -10px;
+	width: 300px;
+}
+.popup-form a.close-popup {
+	color: #aaa;
+	font-size: 24px;
+	text-decoration: none;
+	position: absolute;
+	right: 8px;
+	top: 8px;
+	line-height: 0.5em;
+}
+.popup-form a.close-popup:hover{
+	color: #333;
+	border: 0;
+}
+.popup-form form {
+	padding: 22px;
+}
+.popup-form form input{
+	width: 87%;
+}
+.popup-form form .btn {
+	width: 100%;
+}
+#background{
+	display: none;
+}
+
+
+
+/* == Main Page Section== */
+.page{
+	position: absolute;
+	clip: rect(0px 0px 0px 0px);
+	height: 100%;
+	width: 100%;
+	overflow: hidden;
+	background: none rgba(255,255,255,0.8);
+	z-index: 99;	
+	display: table;
+}
+/* lt IE 9 bug fix */
+.ie7 .page, .ie8 .page{
+	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjY1QzEzMDlENjE2MzExRTM5MTgyRkQ3MTU2QzdBMzkyIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjY1QzEzMDlFNjE2MzExRTM5MTgyRkQ3MTU2QzdBMzkyIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NjVDMTMwOUI2MTYzMTFFMzkxODJGRDcxNTZDN0EzOTIiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NjVDMTMwOUM2MTYzMTFFMzkxODJGRDcxNTZDN0EzOTIiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4zwFoKAAAAEElEQVR42mL6////GYAAAwAJ0gPMHnRekwAAAABJRU5ErkJggg==);
+}
+#main-page {
+	clip: auto;
+	position: fixed;
+	background: none transparent;
+	width: 100%;
+	height: 100%;
+	text-align: center;
+	vertical-align: middle;
+	z-index: 5;
+}
+#main-page .wrap{
+	display: table-cell;
+	vertical-align: middle;
+	padding-bottom: 50px;
+}
+.main-tagline {
+	font-family: 'bebas_neueregular', Arial, Helvetica, Sans-serif;
+	color: #fff;
+	font-size: 224px;
+	line-height: 1em;
+	padding: 0;
+	letter-spacing: -.04em;
+	overflow: hidden;
+	font-weight: normal;
+	text-shadow: 0px 0px 30px rgba(0,0,0,0.3);
+	margin: 0;
+	
+	-webkit-transition: all 0.5s ease-in-out;
+	-moz-transition: all 0.5s ease-in-out;
+	-ms-transition: all 0.5s ease-in-out;
+	-o-transition: all 0.5s ease-in-out;
+	transition: all 0.5s ease-in-out;
+}
+body.popup h2.main-tagline{
+	padding-bottom: 40px;
+	
+	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+	filter: Alpha(Opacity=0);/* IE 5-7 */
+	-moz-opacity: 0; /* Netscape */
+	-khtml-opacity: 0; /* Safari 1.x */
+	opacity: 0;	/* Good browsers */
+}
+#countdown {
+	margin-top: -20px;
+	display: block;
+	
+	-webkit-transition: all 0.5s ease-in-out;
+	-moz-transition: all 0.5s ease-in-out;
+	-ms-transition: all 0.5s ease-in-out;
+	-o-transition: all 0.5s ease-in-out;
+	transition: all 0.5s ease-in-out;
+}
+body.popup #countdown{
+	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+	filter: Alpha(Opacity=0);/* IE 5-7 */
+	-moz-opacity: 0; /* Netscape */
+	-khtml-opacity: 0; /* Safari 1.x */
+	opacity: 0;	/* Good browsers */
+}
+.ds-element {
+	color: #fff;
+	display: inline-block;
+	width: 70px;
+	height: 70px;
+	border: 2px solid #fff;
+	margin: 0px 4px;
+	border-radius: 100%;
+}
+.ds-element-value {
+	font-size: 30px;
+	font-family: 'bebas_neueregular', Arial, Helvetica, Sans-serif;
+	margin-top: 2px;
+	font-size: 30px;
+}
+.ds-element-title {
+	position: relative;
+	font-size: 12px;
+	top: 42px;
+}
+
+
+
+/* == About & Contact Us Section == */
+a.close-this {
+	position: absolute;
+	right: 10px;
+	top: 10px;
+	color: #fff;
+	border: 2px solid #fff;
+	display: block;
+	padding: 0px 10px;
+	text-decoration: none;
+	font-size: 30px;
+}
+a.close-this:hover{
+	border: 2px solid #333;
+	color: #333;
+}
+.page-container {
+	width: 1003px;
+	position: absolute;
+	height: 80%;
+	top: 10%;
+	right: 0;
+}
+.wrap aside {
+	float: right;
+	width: 305px;
+	margin: 0px 17px 0 17px;
+}
+.wrap article{
+	float: right;
+	width: 600px;
+	margin: 0 17px 30px 17px;
+}
+h2.section-title {
+	margin-top: 0;
+	border-bottom: 3px solid #333;
+	padding-bottom: 10px;
+}
+aside iframe {
+	height: 383px;
+	width: 305px;
+	margin-top: 84px;
+}
+/* -- Form Style -- */
+::-webkit-input-placeholder { /* WebKit browsers */
+	color:    #888;
+}
+:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
+	color:    #888;
+}
+::-moz-placeholder { /* Mozilla Firefox 19+ */
+	color:    #888;
+}
+:-ms-input-placeholder { /* Internet Explorer 10+ */
+	color:    #888;
+}
+input.textfield{
+	font: 18px 'Open Sans', Arial, Helvetica, sans-serif, serif;
+	font-weight: normal;
+	background: none transparent;
+	border: 1px solid #333;
+	color: #000;
+	outline: none;
+	line-height: 1em;
+	padding: 7px 15px;
+	width: 400px;
+	margin: 0 0 10px 0;
+	box-shadow: none;
+}
+
+input.textfield:hover,
+input.textfield:focus{
+	outline: none;
+	border-color: #9ecaed;
+	box-shadow: 0 0 6px #9ecaed;
+}
+
+textarea.textarea{
+	font: 18px 'Open Sans', Arial, Helvetica, sans-serif, serif;
+	font-weight: normal;
+	background: none transparent;
+	border: 1px solid #333;
+	color: #000;
+	outline: none;
+	line-height: 1em;
+	padding: 7px 15px;
+	width: 400px;
+	height: 100px;
+	margin: 0 0 4px 0;
+	box-shadow: none;
+}
+
+textarea.textarea:hover,
+textarea.textarea:focus{
+	outline: none;
+	border-color: #9ecaed;
+	box-shadow: 0 0 6px #9ecaed;
+}
+button::-moz-focus-inner {
+	border:0;
+	padding:0;
+}
+.btn {
+	font: 18px 'Open Sans', Arial, Helvetica, sans-serif, serif;
+	font-weight: normal;
+	border: 3px solid #333;
+	background: none #fff;
+	padding: 5px 15px;
+	margin: 0;
+	color: #333;
+	cursor: pointer;
+	outline: none 0;
+	text-transform: lowercase;
+	text-decoration: none;
+	
+	-webkit-transition: all 0.25s ease-in-out;
+	-moz-transition: all 0.25s ease-in-out;
+	-ms-transition: all 0.25s ease-in-out;
+	-o-transition: all 0.25s ease-in-out;
+	transition: all 0.25s ease-in-out;		
+}
+
+.btn:hover{
+	background: none #333;
+	color: #fff;
+}
+
+form .btn {
+	width: 432px;
+}
+
+.message {
+	font-family: Arial, Helvetica, sans-serif;
+	font-size: 14px;
+}
+.error {
+	color: #c11;
+	display: inline-block;
+	padding: 5px 15px;
+}	
+.info {
+	color: #1c1;
+	display: inline-block;
+	padding: 5px 15px;
+}
+@keyframes shake{ 
+	0% { transform: translate(3px, 0); }
+	50% { transform: translate(-3px, 0); }
+	100% { transform: translate(0, 0); }
+}
+@-moz-keyframes shake{ 
+	0% { -moz-transform: translate(3px, 0); }
+	50% { -moz-transform: translate(-3px, 0); }
+	100% { -moz-transform: translate(0, 0); }
+}
+@-webkit-keyframes shake {
+	0% { -webkit-transform: translate(3px, 0); }
+	50% { -webkit-transform: translate(-3px, 0); }
+	100% { -webkit-transform: translate(0, 0); }
+}
+.shake {
+	animation-name: shake; 
+	animation-duration: 150ms; 
+	animation-iteration-count: 2; 
+	animation-timing-function: linear;
+ 
+	-moz-animation-name: shake; 
+	-moz-animation-duration: 150ms; 
+	-moz-animation-iteration-count: 2; 
+	-moz-animation-timing-function: linear;
+ 
+	-webkit-animation-name: shake;
+	-webkit-animation-duration: 150ms;
+	-webkit-animation-iteration-count: 2;
+	-webkit-animation-timing-function: linear;
+}
+
+
+
+
+/* == Footer Section == */
+.nav {
+	position: absolute;
+	bottom: 10px;
+	left: 10px;
+	width: 300px;	
+	z-index: 105;
+}
+.menu {
+	clip: rect(0px 0px auto 0px);
+	position: absolute;
+	bottom: 43px;
+	left: 0;
+	margin: 0;
+}
+.menu a{
+	font-size: 20px;
+	color: #333;
+	display: inline-block;
+	background: none #fff;
+	text-decoration: none;
+	padding: 10px 20px;
+	margin-bottom: 1px;
+}
+.menu a:hover{
+	background: none #333; 
+	color: #fff;
+	border: 0;
+}
+a.nav-trigger{
+	display: inline-block;
+	width: 56px;
+	height: 40px;
+	background: url(../images/menu.png) no-repeat center center transparent;
+}
+a.nav-trigger:hover{
+	border: 0;
+}
+.nav-wrap {
+	width: 56px;
+}
+.nav-wrap.hover a.nav-trigger{
+	background-color: #333; 
+}
+
+footer {
+	position: absolute;
+	right: 10px;
+	bottom: 5px;	
+	z-index: 999;
+}
+.social-links {
+	list-style: none;
+	margin: 0;
+}
+.social-links li {
+	display: inline;
+}
+a.icon {
+	display: inline-block;
+	width: 26px;
+	height: 26px;
+}
+a.icon:hover {
+	background-color: #333;
+	border: 0;
+}
+a.aim{
+	background: url(../images/social_icons/aim.png) no-repeat center center transparent;
+}
+a.amazon{
+	background: url(../images/social_icons/amazon.png) no-repeat center center transparent;
+}
+a.behance{
+	background: url(../images/social_icons/behance.png) no-repeat center center transparent;
+}
+a.deviantart{
+	background: url(../images/social_icons/deviantart.png) no-repeat center center transparent;
+}
+a.dribbble{
+	background: url(../images/social_icons/dribbble.png) no-repeat center center transparent;
+}
+a.facebook{
+	background: url(../images/social_icons/facebook.png) no-repeat center center transparent;
+}
+a.ffffound{
+	background: url(../images/social_icons/ffffound.png) no-repeat center center transparent;
+}
+a.flickr{
+	background: url(../images/social_icons/flickr.png) no-repeat center center transparent;
+}
+a.forrst{
+	background: url(../images/social_icons/forrst.png) no-repeat center center transparent;
+}
+a.lastfm{
+	background: url(../images/social_icons/lastfm.png) no-repeat center center transparent;
+}
+a.picasa{
+	background: url(../images/social_icons/picasa.png) no-repeat center center transparent;
+}
+a.pinterest{
+	background: url(../images/social_icons/pinterest.png) no-repeat center center transparent;
+}
+a.rss{
+	background: url(../images/social_icons/rss.png) no-repeat center center transparent;
+}
+a.skype{
+	background: url(../images/social_icons/skype.png) no-repeat center center transparent;
+}
+a.tumblr{
+	background: url(../images/social_icons/tumblr.png) no-repeat center center transparent;
+}
+a.twitter{
+	background: url(../images/social_icons/twitter.png) no-repeat center center transparent;
+}
+a.vimeo{
+	background: url(../images/social_icons/vimeo.png) no-repeat center center transparent;
+}
+a.yahoo{
+	background: url(../images/social_icons/yahoo.png) no-repeat center center transparent;
+}
+a.yelp{
+	background: url(../images/social_icons/yelp.png) no-repeat center center transparent;
+}
+a.youtube{
+	background: url(../images/social_icons/youtube.png) no-repeat center center transparent;
+}
+
+
+
+
+
+/* == Mobile Device Section == */
+
+/* ------- iPad Portrait ------- */
+@media screen and (min-width: 641px) and (max-width: 767px),
+screen and (min-device-width: 768px) and (max-device-width: 768px){
+	.wrap article {
+		width: 500px;
+		margin: 0 10px 30px 0;
+	}	
+	.wrap aside {
+		width: 215px;
+		margin: 0 10px 0 17px;
+	}
+	aside iframe {
+		width: 100%;
+	}
+	.mCSB_container {
+		width: auto;
+		margin-right: 10px;
+	}
+}
+
+/* ------- Smartphone Landscape ------- */
+@media all and (min-width: 480px) and (max-width: 640px){
+	.popup-form {
+		border-left: 1px solid #aaa;
+		border-bottom: 1px solid #aaa;
+		border-right: 1px solid #aaa;
+	}
+	.wrap article {
+		width: 430px;
+		margin: 0 10px 30px 0;
+	}
+	.wrap aside {
+		width: 150px;
+		margin: 0px 17px 0 17px;
+	}	
+	aside iframe {
+		width: 100%;
+	}
+}
+
+/* ------- Smartphone Portrait ------- */
+@media all and (min-width: 320px) and (max-width: 479px){
+	.page-container {
+		width: 100%;
+	}
+	.popup-form {
+		border-left: 1px solid #aaa;
+		border-bottom: 1px solid #aaa;
+		border-right: 1px solid #aaa;
+	}
+	.main-tagline {
+		font-size: 180px;
+	}
+	.ds-element {
+		width: 54px;
+		height: 54px;
+	}
+	.ds-element-value {
+		margin-top: 0px;
+		font-size: 25px;
+	}
+	.ds-element-title {
+		top: 31px;
+	}
+	.wrap article {
+		float: left;
+		width: auto;
+	}
+	.wrap aside {
+		float: left;
+		width: auto;
+		border-top: 2px solid #333;
+	}	
+	aside iframe {
+		margin-top: 14px;
+		width: 100%;
+	}
+	.mCSB_container {
+		margin-right: 0;
+	}
+	textarea.textarea {
+		width: 88%;
+	}
+	input.textfield {
+		width: 88%;
+	}
+	form .btn {
+		width: 100%;
+	}
+}