﻿@font-face { font-family: 'YummoLight'; src: url('Yummo_Light/yummo_light.eot'); src: url('Yummo_Light/yummo_light.eot') format('embedded-opentype'),  url('Yummo_Light/yummo_light.woff') format('woff'),  url('Yummo_Light/yummo_light.ttf') format('truetype'),  url('Yummo_Light/yummo_light.svg#YummoLight') format('svg');}
@font-face { font-family: 'YummoSemiBold'; src: url('Yummo_SemiBold/yummo_semibold.eot'); src: url('Yummo_SemiBold/yummo_semibold.eot') format('embedded-opentype'),  url('Yummo_SemiBold/yummo_semibold.woff') format('woff'),  url('Yummo_SemiBold/yummo_semibold.ttf') format('truetype'),  url('Yummo_SemiBold/yummo_semibold.svg#YummoSemiBold') format('svg');}
p , li { font-family: "proxima-nova",sans-serif; font-style: normal; font-weight: 400; color:#fff; }
h1, h2, h3, h4, h5, h6 { font-family: 'YummoSemiBold'; color:#fff; font-weight:bold;}
h2 { font-size:3.1em;}
 
a , span.btnWelcome , .submitBtn span , .submitBtn input[type=submit]  { -moz-transition: all 0.2s ease-out;	-o-transition: all 0.2s ease-out;	-ms-transition: all 0.2s ease-out;	transition: all 0.2s ease-out;}
a.hover,  .btnWelcome1 ,.btnWelcome2 ,.btnWelcome3 , .submitBtn:hover span  { -moz-transition: all 0.2s ease-in;	-o-transition: all 0.2s ease-in;	-ms-transition: all 0.2s ease-in;	transition: all 0.2s ease-in;}
.clear{ clear: both;}
*{  box-sizing: border-box;  margin:0;  padding:0;}
.clearfix:before,.clearfix:after { content: " ";  display: table; }
.clearfix:after { clear: both;}
.clearfix { *zoom: 1;}
html{  height:100%;   overflow-y:scroll;  overflow-x:hidden;}
body{ width:100%; height:100%; line-height:1.5; font-family: "proxima-nova",sans-serif; font-style: normal; font-weight: 400; font-size:16px; background: url(../images/bgGallery.jpg) repeat;}
ul{  list-style-type: none;}
.main-wrapper {  width:100%;   position:relative;  overflow:hidden;  }
.dashboard {  margin:0 auto;   width:100% !important;  height:96%;  }
/*++++++++++++++++++++ Content Area++++++++++++++++++++++*/
.col1 { background: url(../images/bgGallery.jpg) repeat;background-size:100% auto;width:65%;padding: 0.5% 1%;height:100%;float:left; overflow:hidden; position:relative; top:-150%; opacity:0;}
.col1 > .screen { width:100%; position:absolute; bottom:200%; left:0; z-index:0;}
.col1 > .screen1 { z-index:1; bottom:0; width:103%;}
.col1 > .aboutscreen { width:103%;}
.screen3 iframe { width:100%; height:100%;}

a img
{
  border:none;
}
.logowrap { background: rgba(255,255,255,0.9); border-radius:100px; width:185px; height:185px; text-align:center; padding-top:2.5%; margin:1%; z-index:2; position:relative;}
.logowrap img { display:block; margin:auto; margin-bottom:5px;}
.typeFace-small {margin: 0; visibility: hidden;}
.typeFace-large {display:block; margin: 0; visibility: visible; margin: 12px 0px 0px 28px;}
.logowrap-small {height:100px; width:70px; padding-top: 10px; position: absolute; }
.logowrap-large {height: 185px;width: 185px;padding-top: 2.5%; position: relative;}

/*++++++++++++++++++++ Side Bar++++++++++++++++++++++*/
.col2 {width:35%; padding: 1.5% 2%; background: #3b0c5a url(../images/imgSep.jpg) repeat-y left top;  height:100%;  float:right;  position:relative;  text-align:center; bottom:-150%; opacity:0;}
.contentArea { overflow:hidden; height:90%; position:relative;}
.contentArea > div , .contentArea > table { position:absolute; left:300%; width:100%; top:0;}
.contentArea > div.welcome { position:absolute; left:-0%;}
/*++++++++++++++++++++ Main Navigation++++++++++++++++++++++*/
.navigation { background: url(../images/linePixel.jpg) repeat-x left center; position:relative; width:70%; margin:auto; height:50px; margin-bottom:20px; z-index:2;}
.navigation td { vertical-align:middle; text-align:center;}
.navigation td  div { background: #F78F1E; height:50px; width:50px; border-radius:30px; text-align:center; margin: auto; position:relative;}
.nav1 .centernav { text-align:center; width:27%;}
.nav1 .firstli , .nav1 .lastli { width:23%;}
.navigation .lastli > div { float:right;}
.navigation .firstli > div { float:left;}

.nav2 {visibility:hidden; height:0; margin:0; margin-top:-40px;}
.nav1-workactive {left:-100%;}
.nav1-workinactive {left:auto;}


/*
.nav1-workactive {margin-left:-80%;}
.nav1-workinactive {margin-left:15%;}
*/
.navigation td div a { display:inline-block; background: url(../images/icnNav.png) no-repeat;}
.navigation td div a.home { background-position: left top; width:28px; height:27px; margin-top:11px;}
.navigation td div:hover a.home { background-position: left -27px;}
.navigation td div.navAni1 a:after {
    content: "home";
    width:40px;
    margin-left:-20px;
}
.navigation td div.navAni2 a:after {
    content: "about";
    width:45px;
    margin-left:-22px;
}
.navigation td div.navAni3 a:after {
    content: "portfolio";
    width:60px;
    margin-left:-30px;
}
.navigation td div.navAni4 a:after {
    content: "contact";
    width:52px;
    margin-left:-26px;
}

.navigation td div a.profile { background-position: -44px top; width:25px; height:27px; margin-top:11px;}
.navigation td div:hover a.profile { background-position: -44px -27px;}
.navigation td div a.portfolio { background-position: -81px top; width:25px; height:23px; margin-top:14px;}
.navigation td div:hover a.portfolio { background-position: -81px -23px;}
.navigation td div a.contact { background-position: -123px top; width:24px; height:17px; margin-top:18px;}
.navigation td div:hover a.contact { background-position: -123px -17px;}


.navigation td div a:after { 
    overflow:hidden;
    position:absolute;
    left:50%;
    bottom:-5px;
    text-decoration:none;
    color: #F78F1E;
    font-family: 'YummoSemiBold';
    font-size: 18px;
    line-height: 18px;
    -webkit-transition:all 0.3s ease-in-out;
   -moz-transition:all 0.3s ease-in-out;
   -o-transition:all 0.3s ease-in-out;
   transition:all 0.3s ease-in-out;
   opacity:0;
}

.navigation td div:hover a:after { 
    opacity:1;
    bottom:-20px;
    -webkit-transition:all 0.3s ease-in-out;
   -moz-transition:all 0.3s ease-in-out;
   -o-transition:all 0.3s ease-in-out;
   transition:all 0.3s ease-in-out;
}

.navigation td div.activeNav:hover a:after {
    content : '' !important;
     opacity:0;
}
.navigation td div:after {
    top: 60%;
    opacity:0;
    -webkit-transition:all 1.0s ease-in-out;
   -moz-transition:all 1.0s ease-in-out;
   -o-transition:all 1.0s ease-in-out;
   transition:all 1.0s ease-in-out;
    border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(247, 143, 30, 0); border-top-color: #F78F1E; border-width: 17px; left: 50%; margin-left: -17px;
    z-index:-1;
}
.navigation td  div.activeNav:after { opacity:1; top: 86.5%; 
    -webkit-transition:all 1.0s ease-in-out;
   -moz-transition:all 1.0s ease-in-out;
   -o-transition:all 1.0s ease-in-out;
   transition:all 1.0s ease-in-out; }



/*++++++++++++++++++++ Main Gallery Navigation++++++++++++++++++++++*/
.secondryNav { padding:0 13%; height:45px; height:0px; z-index:100; position:relative; overflow:hidden; margin-top:-15px; margin-bottom:10px;}
ul.secondryNav li { display:inline-block; margin-right:45px; background: #3b0c5a; border:3px solid #F78F1E; height:45px; width:45px; margin:0 5%; border-radius:30px; text-align:center;}
ul.secondryNav li a.prevProject {width:19px; height:20px; display:inline-block; margin-top:10px;background: url(../images/btnPrev.png) no-repeat left center;}
ul.secondryNav li:hover a.prevProject {background-position: right top;}
ul.secondryNav li a.listProject {width:23px; height:16px; display:inline-block; margin-top:11px; background: url(../images/icnList.png) no-repeat left top;}
ul.secondryNav li:hover a.listProject {background-position: left bottom;}
ul.secondryNav li a.nextProject {width:19px; height:20px; display:inline-block; margin-top:10px; background: url(../images/BtnSubmit.png) no-repeat right top;}
ul.secondryNav li:hover a.nextProject {background-position: left top;}
ul.secondryNav li a {display:inline-block;background: url(../images/icnNav.png) no-repeat;  }
/*++++++++++++++++++++++++++++++++++ Footer+++++++++++++++++++++++++++++++++++++*/
footer {position:relative; z-index:1000; bottom:0; background: #f78f1e;  height:4%; width:100%; clear:both; border-top:1px solid #fff;}
footer p {padding:.25% .5%;}
.copy {font-family: 'YummoLight'; padding-top:3px; display:inline-block;}
.social {float:right; margin-right:10px;}
footer a {background: url(../images/icnSocial.png) no-repeat;display:inline-block;margin:0 5px;}
footer a.tweet {background-position: left top;width:27px;height:19px;}
footer a.tweet:hover {background-position: left -19px;}
footer a.fb {background-position: right top;width:9px;height:21px;}
footer a.fb:hover {background-position: right bottom;}
/*++++++++++++++++++++ Content - Well Come++++++++++++++++++++++*/
.welcome { text-align:center; height:100%; position:absolute; left:0; right:0;}
.welcome p { font-size: 60px; line-height: 60px; margin-bottom:25px; color:#f78f1e; font-family: 'YummoSemiBold';}
.welcome h1{   text-transform:uppercase;   font-size:64px;   line-height:70px;}
.welcome h2 {   text-transform:uppercase;   font-size:67px;   line-height:69px;}
.welcome h3{   text-transform:uppercase;   font-size:62px;   line-height:65px;   font-family: 'YummoSemiBold';}
.welcome h4 { text-transform:uppercase;   font-size:38px;   line-height:37px;}
.welcome h5 { margin-top:15px; color:#f78f1e; font-size:30px; line-height:32px; text-transform:uppercase; font-family:'YummoLight';}
.welcome h6 { color:#f78f1e; font-size:18px; line-height:20px; font-family:'YummoLight';}
.welcome h6 b { font-family: 'YummoSemiBold';}
.welcomeContent {overflow:hidden;height:80%;width:255px;margin:auto;text-align:center;}
.welcome > div.welcomeContent > div {width:255px;margin:auto;position:absolute;height:60%;text-align:center;}
.welcome > div > div * {position:absolute;width:100%;margin:auto;}
div.step1 {margin-top:17% !important;}
div.step2  {margin-top:17% !important;}
div.step3 {margin-top:25% !important;}
.steps-inactive-down{bottom:-200%;}
.steps-inactive-up{top:-250px;}
.step1-1-active {top:180px; font-size:24px; color:#f78f1e !important;}
.step1-2-active {top:120px; font-size:50px !important;}
.step1-3-active {top:63px;}
.step1-4-active {top:0;}
.step2-1-active {top:248px; font-size:33px !important;}
.step2-2-active {top:227px; font-size:35px !important;}
.step2-3-active {top:163px; font-size:64px !important;}
.step2-4-active {top:103px;}
.step2-5-active {top:69px;}
.step2-6-active {top:0;}
.step3-1-active {top:140px; font-size:37px !important; word-spacing:5px;}
.step3-2-active {top:78px;}
.step3-3-active {top:45px;}
.step3-4-active {top:-40px;}
.btnWelcome1 ,.btnWelcome2 ,.btnWelcome3 {cursor:pointer; background:#3b0c5a;border:3px solid #f78f1e; position:relative; z-index:100;background: url(../images/BtnWelcome.png) no-repeat center -20px; width:50px; height:50px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px; margin:0 45% 0; }
.btnWelcome1:hover,.btnWelcome2:hover,.btnWelcome3:hover {border:3px solid #fff;background-position: center 14px;}
/*++++++++++++++++++++++++++++++++++ Contact Button On Welcome Screen+++++++++++++++++++++++++++++++++++++*/
#tryContainer {position:relative; width:100%; margin:auto; text-align:center; overflow:hidden; margin-top:5px;}
#showTry1 , #showTry2 {color:#f78f1e; font-family:'YummoLight'; text-transform: uppercase; display:block; margin:-200px auto 0; width:100%;}
#showTry1 { font-size: 30px; line-height:30px;  }
#showTry2 {font-size:20px; line-height:20px; }
#showTry2 b {font-family: 'YummoSemiBold';cursor:pointer;}
/*++++++++++++++++++++++++++++++++++ About+++++++++++++++++++++++++++++++++++++*/
.about  { text-align:left; color:#f78f1e; bottom:25px; left:0; right:0; margin-top:8px;}
.about  p {color:#fff; padding-bottom:15px; font-family: "proxima-nova",sans-serif; font-style: normal; font-weight: 400;}
.about ul li { color:#fff; padding-bottom:5px; font-family: "proxima-nova",sans-serif; font-style: normal;font-weight: 400;}
.about ul li a { font-weight:bold; color:#fff; text-decoration:none;}
.about b {cursor:pointer;}
/*++++++++++++++++++++++++++++++++++ Contact+++++++++++++++++++++++++++++++++++++*/
.contactBox  { text-align:left; color:#f78f1e; margin-top:10px;}
.contactBox p {color:#fff; padding-bottom:15px; font-family: "proxima-nova",sans-serif; font-style: normal; font-weight: 400;}
.contactBox h1 , .about h1 { color:#f78f1e; padding-bottom:10px; font-size:45px; line-height:40px;}
.contactBox form p { line-height:38px; font-family: 'YummoSemiBold';}
.contactBox p label { width:20%; display:inline-block; margin-right:.2%; font-size:20px; font-family: 'YummoSemiBold'; line-height:30px;}
.contactBox p span { background: url(../images/bgInput.png) repeat-x left bottom; border:none; display:inline-block; width:70%; line-height:24px;}
.contactBox p input[type=text]{ background: none; border:none; width:100%; font-size:20px; color:#f78f1e; font-family: 'YummoLight'; outline:none;}
*:focus {outline: none;}
.contactBox p textarea { background: url(../images/bgInput.png) repeat left -8px; border:none; padding:2px; width:70%; float:left; height:180px; line-height:39px; font-size:24px; color:#f78f1e; resize:none; font-family: 'YummoLight';}
.contactBox b {cursor:pointer;}
.contactBox a {cursor:pointer; color:#fff; text-decoration:none;}

/*++++++++++++++++++++++++++++// Gallery+++++++++++++++++++++++++++++*/
.galleryShow {position:relative; left:-150%; height:100%;}
#r-slider-wrapper{ z-index: 1000;}
#r-slider-category-wrapper{  position:relative;  left:-200%;  text-align:center;  margin:5px auto 0; width:85%;}
#r-slider-category-wrapper > ul#thumbGallery {margin: 0;padding: 0;list-style: none;display: block;}
#r-slider-category-wrapper  > li {text-align: center;width: 100%;height: 550px;padding: 0;margin: 6px;display: block;float: left;}

ul.projectthumb { list-style: none; overflow:auto; width:80%;}
ul.projectthumb li:last-child:after {clear:both;}
ul.projectthumb li { float: left; width:31.3%; margin:1% 1%;}
ul.projectthumb li a img { width:100%; display:block;}
ul.projectthumb li a { display: block;}
ul.projectthumb li.r-cat-active {   border:1px solid #F78F1E;}		
.pagination {text-align: center;}
.pagination a {
	background: url(../images/pagination.png) 0 0px no-repeat transparent;
	width: 14px;height: 13px;margin: 0 5px 0 0;display: inline-block;}
.pagination a.selected {background-position: 0px -13px;cursor: default;}
.pagination a span {display: none;}


#r-slider-content-left{ width:100%; height:100%; overflow:hidden; position: relative; display: block; background: url(../images/bgGallery.jpg); margin-top:8%;}
#first-cat{width:100%; height:100%; overflow:auto; background: url(../images/bgGallery.jpg);}
#r-slider-content-left > div { background: url(../images/bgGallery.jpg);}
/*.r-img-wrap { background: url(../images/bgGallery.jpg); text-align:center; position: absolute; width: 100%;}
.r-img-wrap img{ width: 95%;}*/

.projectslider {background-color: #ccc;width: 100%; margin-bottom:500px;}
.projectslider ul {list-style: none;display: block; height:70%;}
.projectslider li { text-align: center; width: 100%; height:500px; display: block; float: left;}
.projectslider li > img { width: 70%; }
.list_carousel.responsive { width: auto; margin-left: 0;}

.r-nav{ height:15%; width:94%; margin:0 auto 5px; position:relative; text-align:center; border-top:2px dotted #7b459d;}
.r-nav h3 { color:#3b0c5a; font-size:1.4em; font-family: 'YummoLight'; margin-top:-15px; padding:0 45px;}
.r-nav a.weblinke{ color:#6a2d91; font-size:1.1em; font-family: 'YummoLight'; text-decoration:none;}
.r-prev, .r-next{ position:absolute; cursor: pointer; display: inline-block; top:-23px;}
.r-prev{ left:0;}
.r-next{ right:0;}
.mobilegallery-active {height:100%; overflow:hidden;}
.mobilegallery-inactive{height:0px; margin-bottom:0px;}
.secondryNav-active{height:48px; margin-bottom:10px; opacity:1;}
.secondryNav-inactive{height:0;margin:0; opacity:0;}
.line1 { width:3px;background:#F78F1E;height:3px;position:absolute;margin-top:-5px; right:36%; overflow:visible !important;}
.line2 { width:3px;background:#F78F1E;height:3px;position:absolute;left:0; bottom:0;opacity:0;}
table.projectdetail { position:absolute; width:100%; background:#3b0c5a;}
table.projectdetail tr td { padding:2%; vertical-align:top; text-align:left;   padding-bottom:4%;}
table.projectdetail tr td.label { padding-right:15px; border-right:2px dotted #fff;  width:24%;   }
table.projectdetail tr:first-Child td { padding-top:0; }
table.projectdetail tr td ul { margin:12px 0; }
table.projectdetail tr td ul li { margin-bottom:8px; vertical-align:top; text-align:left; line-height:1.5em; display:block; color:#fff; background: url(../images/icnLi.png) no-repeat left 3px; padding-left:23px; cursor:pointer;}
table.projectdetail tr td h3 { font-size:2em; line-height:.8em; font-family: 'YummoLight';}
table.projectdetail tr td h4 { font-size:1.3em; line-height:1.3em; font-family: verdana;}
p , li { font-size:.9em; line-height:1.3em;}

 /* ================= Tablet (Portrait) 768px - 959px ================= */
@media only screen and (width: 1024px) {
    #r-slider-category-wrapper {width:100%;}
    ul.projectthumb { width:100%; margin:10px auto 0; }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) { 
	p {font-size:0.8em;}
	.main-wrapper {height:672px;}
    .mobilegallery-active{height:600px;}
    
    .col1 > .screen1 , .col1 > .screen2 {width:110%; left:-5%; right:0;}
    .step2 h4 {letter-spacing:0 !important;}
    .scroll-pane .jspContainer .jspPane {width:100% !important; margin-left:0 !important; }
	.welcome > div.welcomeContent > div { margin-top:2%; height:70%; }
	.welcome > div.welcomeContent > div.step2 { margin-top:1%; }
	#r-slider-content-left { margin-top:15%; height:100%; }
    .projectslider li {height:380px; }
    .projectslider li img {width:90%; }

    

	table.projectdetail tr td h4 { font-size: 1.2em; padding-top:0; }
	table.projectdetail tr td h3 { font-size:1.5em; }
	table.projectdetail tr td.label { padding-left:0; padding-right:5px; padding-bottom:0px; }
	table.projectdetail tr td ul { margin-bottom:0px; }
	table.projectdetail tr td ul li { font-size:.8em; background-position:left top; }
	p , li { font-size:.8em; line-height:1.2em; }
	.contactBox p textarea { height:150px; width:75%; }
    .step1-1-active {font-size:38px !important;}
	.step2-1-active {font-size:32px !important;}
    .step2-2-active {font-size:34px !important;}
    .step2-3-active {font-size:62px !important;}
    .step2-4-active {font-size:64px !important;}
	.btnWelcome1, .btnWelcome2, .btnWelcome3 { margin:0 42%; }
	.welcomeContent { height:80%; }
	.contactBox p label { width: 21%; }
	.contactBox p span { width:75%; }
}
/* ================= Mobile (Portrait) < 767px ================= */

@media only screen and (max-width: 767px){ 
	.col2 { display:block; width:100%; height:65% }
	.col1 { display:block; width:100%; height:35%; background: url(../images/bgGallery.jpg) repeat; }
	.logowrap { height:150px; width:100px; margin:auto; padding-top:10px; }
	.logowrap .logoPic { width:55px; margin:auto; }
	.logowrap .typeFace { width:85px; margin:auto; }
	.welcomeContent > div { margin-top:0; }
	#r-slider-content-left { margin-top:20% !important; height:100% !important; }
    #r-slider-category-wrapper {width:100%;}
    
}
/* ================= Mobile (Landscape) 480px - 767px ================= */

@media only screen and (max-width: 769px){	
	.mobilegallery-active{height:450px;}
}
@media only screen and (width: 768px) {
    ul.projectthumb { width:100%; margin:10px auto 0; }
}
@media only screen and (min-width: 481px) and (max-width: 769px){
	.main-wrapper {height:895px; overflow:visible;}
	.mobilegallery-active {height:615px !important;}	
    	.mobilegallery-inactive {}
	.galleryShow { height:530px; }
    #r-slider-category-wrapper {width:62%;}
    ul.projectthumb { width:60%; margin:10px auto 0; }
	p, li { font-size:1em; }
	.col1 { width:100%; height:177px; background: url(../images/bgGallery.jpg) repeat; clear:both; }
	.col1 .screen { display:none; }
    .col2 { width:100%; height: 713px; clear:both; padding:2% 3%; background:#3b0c5a; }
    .line1 {display:none;}
    .logowrap { background:none; width:100px; height:104px; text-align:center; padding-top:.8%; margin:auto; border-radius:none; }
	.logowrap img.logoPic { width:50%; margin-bottom:5px; }
	
    .logowrap img.typeFace { width:90%; margin-bottom:5px; }
	.nav1 { display:none; }
	.nav2 { visibility:visible; height:40px; margin:auto;}
	.nav2 .centernav { text-align:center; width: 27%; }
	.nav2 .firstli , .nav2 .lastli { width: 23%; }

    ul.secondryNav { background: url(../images/linePixel.jpg) no-repeat center 20px; margin-top:0; }
	ul.secondryNav li { width:42px; height:42px; }
	ul.secondryNav li a.prevProject , ul.secondryNav li a.nextProject { margin-top:8px !important; }
	ul.secondryNav li a.listProject { margin-top:9px !important; }

    #r-slider-content-left { margin-top:10px !important; height:100%;}
    .projectslider li {height:350px; }
    .projectslider li img {width:80%; }

    footer { width:100%; height:42px; padding:5px; }
	.copy { width:75%; display:inline-block; font-size:1em; }
    .btnWelcome1, .btnWelcome2, .btnWelcome3 { margin:0 46.5%; }
	.social {margin-right:0px;}
}
/* ================= Mobile (Portrait) < 320px ================= */

@media only screen and (max-width: 480px){

    .mobilegallery-inactive {height:180px !important;}
	.mobilegallery-active {height:430px !important;}
	p, li { font-size:.8em; }
	.col1 { width:100%; height:180px; background: url(../images/bgGallery.jpg) repeat; clear:both; }
	.col1 .screen { display:none; }
	.logowrap { background: none; width:100px; height:115px; text-align:center; padding-top:2%; margin:auto; border-radius:none; }
	.logowrap img.logoPic { width:50%; margin-bottom:5px; }
	.col2 { width:100%; height:386px; clear:both; padding:2% 3%; background:#3b0c5a; }
	.contentArea {height:100%;}
	.contentArea > div {width:100%;}
	.logowrap img.typeFace { width:90%; margin-bottom:5px; }
	.line1 { display:none; }
	
    .navigation td  div.activeNav:after { top: 90%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(247, 143, 30, 0); border-top-color: #F78F1E; border-width: 13px; left: 50%; margin-left: -13px; }

	.navigation { width:80%; margin-bottom:5px; height:42px; }
	.navigation td div { width:42px; height:42px; }
	.navigation td div a.home {  margin-top:7px;  }
	.navigation td div a.profile {  margin-top:6px;  }
	.navigation td div a.portfolio {  margin-top:12px;  }
	.navigation td div a.contact{  margin-top:13px;  }
	.nav1 { display:none; }
	.nav2 { visibility:visible; height:40px; margin:auto;}
	.nav2 .centernav { text-align:center; width: 27%; }
	.nav2 .firstli , .nav2 .lastli { width: 23%; }
	table.projectdetail tr td ul li { background-image: url(../images/icnLi2.png); }
	ul.secondryNav { background: url(../images/linePixel.jpg) no-repeat center 20px; margin-top:0; }
	ul.secondryNav li { width:42px; height:42px; }
	ul.secondryNav li a.prevProject , ul.secondryNav li a.nextProject { margin-top:8px !important; }
	ul.secondryNav li a.listProject { margin-top:9px !important; }
	
	.btnWelcome1, .btnWelcome2, .btnWelcome3 { margin:0 42%; }
	.welcome { height:100%; }
	.welcomeContent { height:220px; }
	.welcome > div p { text-transform: uppercase; font-size: 40px; line-height: 40px; margin-bottom:5px; color:#f78f1e; font-family: 'YummoSemiBold';}
	.welcome > div h1 { text-transform:uppercase; font-size:47px; line-height:64px; }
	.welcome > div h2 { text-transform:uppercase; font-size:52px; line-height:52px; }
	.welcome > div h3 { text-transform:uppercase; font-size:45px; line-height:45px; font-family: 'YummoSemiBold'; }
	.welcome > div h4 { text-transform:uppercase; font-size:28px; line-height:25px; }
	.welcome > div h5 { text-transform:uppercase; font-size:29px; line-height:31px; }
	#showTry1 {font-size:22px;}
	#showTry2 { font-size:17px; }
	div.step1 { margin-top:0% !important; height:220px !important; }
	div.step2 { margin-top:0% !important; }
	div.step3 { margin-top:3% !important; }
    .steps-inactive-down{bottom:-200%;}
    .steps-inactive-up{top:-250px;}
    .step1-1-active {top:154px; font-size:30px !important;}
    .step1-2-active {top:110px; font-size:39px !important;}
    .step1-3-active {top:60px;}
    .step1-4-active {top:20px;}
    .step2-1-active {top:155px;  font-size:26px !important;}
    .step2-2-active {top:139px; font-size:28px !important;}
    .step2-3-active {top:90px; font-size:50px !important;}
    .step2-4-active {top:47px;}
    .step2-5-active {top:26px;}
    .step2-6-active {top:0;}
    .step3-1-active {top:125px; font-size:27px !important;}
    .step3-2-active {top:72px;}
    .step3-3-active {top:45px;}
    .step3-4-active {top:-10px;}
	.about { margin-top:0;}
    .galleryShow {overflow:hidden;}
    #r-slider-content-left { margin-top:25px !important; height:100%;}
    #r-slider-category-wrapper {width:100%;}
    ul.projectthumb {width:100% !important;}
    .projectslider li {height:200px; }
    .projectslider li img {width:77%; }
    #r-slider-content-left .r-prev, .r-next{width:35px; top:-18px; }
	#r-slider-content-left .r-nav h3 { font-size:1em; line-height:1em; margin-top:-22px;  padding:0 35px; }
	table.projectdetail tr td:nth-Child(1) { padding-left:0 !important; }
    table.projectdetail tr td:nth-Child(2) { padding-right:0 !important; }
	#r-slider-content-left .r-nav a.weblinke { font-size:.8em !important; }
	table.projectdetail tr td h3 { font-size:1.3em; }
	table.projectdetail tr td h4 { font-size: 1.1em; }
	.contactBox h1, .about h1 { font-size: 35px; line-height: 35px; }
	.contactBox {margin-top:0;}
	.contactBox p label {width: 25%;}
	.contactBox p span.infield { background: url(../images/bgInput.png) repeat-x left bottom; border:none; display:inline-block; width:67%; line-height:24px; }
	.emailblock { float:left; width:50%; }
	.emailblock p { padding-bottom:5px; font-size:17px;  }
	.contactBox p textarea { height:130px; }
   

	footer { width:100%; height:35px; padding:2%;}
	.copy { width:75%; display:inline-block; font-size:.8em; }
    .social {margin-right:0px; }

}

@media only screen and (max-width: 320px) {
    .projectslider li img {
        width:97%; 
    }
}

@media only screen and (min-width: 1024px) and (max-width: 1380px) {
    .projectslider li {
        height:400px;
    }
}