@import url("../fonts/fonts.css");
@import url("../styles/vgrid-im-menu.css");





body {
	margin: 0px;
	font: 14px;
	background: #000;
	font-family: 'PT Sans';
	top: 0px;
	background: #000;

-webkit-user-select:none;
-moz-user-select:none;
-o-user-select:none;
-ms-user-select:none;
user-select:none;	

}

img {border: 0px;
	border-width: 0px;
}
a a:link {
	text-decoration: none;	
}

/*___________________________________________________________*/
h1 {
	font: 52pt "BebasNeue Bold";
	text-shadow: none;
	margin-left: 0px;
	padding-left: 0px;
	text-shadow: 0px 5px 10px rgba(0,0,0,0.3);
	color: #FFF;
}
h2 {
	color: #CCCCCC;
	text-shadow: none;
	font: 28pt "BebasNeue Book";
	margin-left: 0px;
	letter-spacing: 2px;
	word-spacing: 1px;
}
h3 {
	line-height: 36px; font-size: 24px;
}
h4 {
	font: 20pt "BebasNeue Bold";
	text-shadow: none;
	margin-left: 0px;
	padding-left: 0px;
	text-shadow: 0px 5px 10px rgba(0,0,0,0.3);
	color: #FFF;
}
h5 {
	font: 20pt "BebasNeue Bold";
	text-shadow: none;
	margin-left: 0px;
	padding-left: 0px;
	text-shadow: 0px 5px 10px rgba(0,0,0,0.3);
	color: #FFF;
	letter-spacing: 1px;
}
h6 {
	line-height: 24px; font-size: 14px;
}

/*___________________________________________________________*/

/*progress-bar*/

#overlay{
	position: fixed;
	z-index: 209000;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: rgba(0,0,0,0.8);
	transition: 1s 0.4s;
}
#progress{
	height: 26px;
	background: #009999;
	position: fixed;
	width: 0;
	top: 100px;
	z-index: 210000;
	;
}
#progstat{
	font: 10pt Arial, Helvetica, sans-serif;
	letter-spacing: 3px;
	position: fixed;
	top: 12px;
	width: 100%;
	text-align: center;
	color: #fff;
	z-index: 211000;
}

/* main content ////////////////////////////////////// */

#wrapper-body {
	margin: 0px auto;
	height: auto;
	width: 960px;
}
#topmenu-base {
	margin: 0px;
	height: auto;
	width: 960px;
	background: #30C;
	display: block;
	position: absolute;
	z-index: 1900;
}
#backgr-gray {
	margin: 0px auto;
	height: 55px;
	width: 100%;
	background: #282828;
	display: block;
	position: absolute;
	z-index: 1880;
	top: 32px;
}

#backgr-gray-in {
	margin: 0px auto;
	height: 55px;
	width: 100%;
	background: #282828;
	display: block;
	position: absolute;
	z-index: 1880;
	top: 32px;
}
#start-content {
	height: 100px;
	width: 100%;
	z-index: 0;
	top: 0px;
	
}
#start-content-project-pages {
	height: 280px;
	width: 100%;
	z-index: 0;
	top: 0px;
	background: #009999;
	
}
#before-calendars {
	height: 2200px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-catalogues {
	height: 1100px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-advertisements {
	height: 1460px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-brochures {
	height: 1300px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-flyers {
	height: 1060px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-note-books {
	height: 1080px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-packings-labels {
	height: 1520px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-posters {
	height: 1300px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-logos {
	height: 2300px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}

#before-billboards {
	height: 1200px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-vehicle-advertising {
	height: 1300px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-window-displays {
	height: 1700px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-identity {
	height: 680px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}

#before-web-design {
	height: 860px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}
#before-web-banners {
	height: 980px;
	width: 100%;
	z-index: 0;
	top: 0px;	
}


#start-content-project-pages-about {
	height: 460px;
	width: 100%;
	z-index: 0;
	top: 0px;
	background: #009999;
	
}
#carousel-background {
	width: 960px;
	position: relative;
	display: block;
	background: #414141;
	height: 101px;
	margin: 79px auto 0px;	
}

.content {
	height: auto;
	width: 100%;
	
	z-index: 1;
	float: left;
	margin: 0px auto;
	
}


.inner-content {/*basic-box-for-content, projects ...*/
	/*background: #000000;
	border: 0px;
	margin: 0px auto;
	text-align: center;*/
	
	margin-top: 26px;
	position: relative;
	margin-bottom: 60px;
	display: block;
}
.title-box-project-pages {
	display: block;
	width: 960px;
	top: 0px;
	position: absolute;
	z-index: 2;
	margin-top: 80px;
	background: #282828;
	border-bottom: 4px solid #009999;
	padding-bottom: 16px;
}
#title-1 {
	
	display: block;
	width: auto;
	margin-top: 100px;
	margin-left: 20px;
	height: auto;	
}
#title-2 {
	display: block;
	width: auto;
	margin-top: -20px;
	margin-left: 180px;
	height: auto;	
	
}
#title-2-posters {
	display: block;
	width: auto;
	margin-top: -20px;
	margin-left: 160px;
	height: auto;	
	
}
#title-2-careta {
	display: block;
	width: auto;
	margin-top: -20px;
	margin-left: 220px;
	height: auto;	
}

#title-2-trans {
	display: block;
	width: auto;
	margin-top: -20px;
	margin-left: 20px;
	height: auto;	
	
}
#title-identity {
	display: block;
	width: auto;
	margin-top: -20px;
	margin-left: 110px;
	height: auto;	
	
}
#title-web {
	display: block;
	width: auto;
	margin-top: -20px;
	margin-left: 60px;
	height: auto;	
	
}
#title-web-banners {
	display: block;
	width: auto;
	margin-top: -20px;
	margin-left: 160px;
	height: auto;
}

/*-------------about-page-css---------------------------------*/
#title-mod {
	display: block;
	width: 100%;
	height: 60px;
	background: #666666;
}
#title-mod-txt {
	display: block;
	width: 960px;
	height: 34px;
	background: #000000;
	font: 38px "BebasNeue Bold";
	margin-right: auto;
	margin-left: auto;
	top: 26px;
	text-transform: capitalize;
	color: #666;
	vertical-align: bottom;
	position: relative;
	letter-spacing: 2px;
	word-spacing: 4px;
	text-align: center;
}
#holder-about {
	display: block;
	width: 100%;
	background: #009999;
	margin-top: 40px;
	min-height: 260px;
	
}
#holderline-top {
	display: block;
	width: 960px;
	background: #e5e5e5;
	margin: 0px auto;
	height: 26px;
	position: relative;
	top: -26px;
}
#holderline-bottom {
	display: block;
	width: 960px;
	background: #e5e5e5;
	margin: 0px auto;
	height: 26px;
	
	
}
#holder-boxcontent {
	display: block;
	width: 960px;
	background: #282828;
	min-height: 260px;
	position: relative;
	margin: -26px auto 0px;
	height: auto;
	}

#holder-logo {
	display: block;
	width: 220px;
	height: 180px;
	vertical-align: middle;
	float: left;
	margin-left: 0px;
	background: url(../images/logo-whyweare.png) no-repeat center center;
	margin-top: 40px;
	}






/*SLABTEXT - CSS - ST ///////////////////////////////////*/	
	.slabtexted .slabtext {
        display:-moz-inline-box;
        display:inline-block;
        white-space:nowrap;
        }
.slabtextinactive .slabtext {
        display:inline;
        white-space:normal;
        font-size:1em !important;
        letter-spacing:inherit; !important;
        word-spacing:inherit; !important;
        *letter-spacing:0 !important;
        *word-spacing:0 !important;
        }
	.slabtextdone .slabtext{
	display: block;
	line-height: 0.8;
	}
	
		.activity
            {
	width: 144px;
	float: left;
	margin-left: 40px;
	margin-top: 40px;
            }
		a
            {
            color:#111;
            }
        h4 a
            {
            text-decoration:none;
            }
        h4 a:hover
            {
            color:#a82222;
            }
		
/* Set font-sizes for the headings to be given the slabText treatment */
        h4
            {
	text-align: left;
	text-transform: uppercase;
	color: #999;
	font: normal 100% "BebasNeue Bold";
            }
        /* Smaller font-size for the side-by-side demo */

		
        .activity h4
            {
            font-size: 30px;
            }

/* Fun with media queries - resize your browser to view changes. */
        @media screen and (max-width: 140px) 
            {
                
                .activity
                    {
                    float:none;
                    margin:0;
                    width:100%;
                    }
                h4
                    {
                    font-size:36px;
                    }
            }

/* Adjust the line-height for all headlines that have been given the
           slabtext treatment. Use a unitless line-height to stop sillyness */
        
.amp
            {
	font-family:'sorts_mill_goudyitalic';
	
            }

/*SLABTEXT - CSS - END ////////////////////////////////////*/


/*/////////// PROGRESS BAR - ST ///////////*/     
.progresbar-box {
	min-height: 1px;
	display: block;
	height: auto;
	width: 960px;
	top: 0px;
	margin: 0px auto;
	padding: 0px;
	background: #000;
}     
/*----------------------------------------------------------*/
.progress {
	background: rgb(153,153,153);
	border-radius: 0px;
	height: 4px;
	overflow: visible;
	box-shadow: inset 0px 1px 2px rgba(0,0,0,0.1);
	margin-bottom: 14px;
	margin-top: 2px;
}
.progresbar-txt{
	font: 10pt Arial, Helvetica, sans-serif;
	color: #666;
	display: block;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 2px;
	letter-spacing: 10px;
	word-spacing: 4px;
}
.progress-bar {
	border-radius: 0px; position: relative; box-shadow: none; background-color: rgb(204, 204, 204);
}
.progress-bar-tooltip {
	padding: 1px 8px;
	border-radius: 3px;
	top: -25px;
	right: 5px;
	color: #e5e5e5;
	display: block;
	position: absolute;
	opacity: 0;
	font: 11px/15px Arial, Helvetica, sans-serif;
	background: rgb(102,102,102);
}
.progress-bar-tooltip::after {
	border-width: 5px 5px 0px; border-style: solid; border-color: rgb(102,102,102) transparent; left: 13px; width: 0px; bottom: -5px; display: block; position: absolute; content: "";
}
.progress-label{
	color: #666;
	font: 9pt Arial, Helvetica, sans-serif;
}

/*--bootstrap-----------------------------------------------*/
.progress-bar {
	transition:width 0.6s; width: 0px; height: 100%; text-align: center; color: rgb(255, 255, 255); line-height: 20px; font-size: 12px; float: left; box-shadow: inset 0px -1px 0px rgba(0,0,0,0.15); background-color: rgb(51, 122, 183); -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15); -webkit-transition: width .6s ease; -o-transition: width .6s ease;
}

/*--------------------------------------*/
.progress-bar-primary {
	background: rgb(0, 153, 153);
}
/*--------------------------------------*/
/*/////////// PROGRESS BAR - END ///////////*/




/*///////////////////////////////////////////////////////////////*/


/*BTN-SLOGAN style - ST//////////////////////////*/

#company-logo {
	z-index: 2010;
	width: 240px;
	text-align: center;
	position: absolute;
	background: #000;
	display: block;
	height: 68px;
	margin-top: 0;
	margin-left: 0px;
	top: 32px;
}
#Btn-slogan {
	z-index: 2012;
	width: 240px;
	height: 68px;
	position: relative;
	background-color: rgb(255,0,0);
	border-width: 0px;
}

#slogan-content {
	background: #9933ff;
	display: block;
	height: 24px;
	width: 720px;
	padding-left: 20px;
	font: 18px 'PT Sans';
	color: #FFF;
	letter-spacing: 5px;
	text-align: left;
	word-spacing: 1px;
	padding-right: 20px;
}
#slogan-content span {
	font: bold 18px 'PT Sans';	
}
#slogan-content-en {
	background: #9933ff;
	display: block;
	height: 24px;
	width: 720px;
	padding-left: 20px;
	font: 18px 'PT Sans';
	color: #FFF;
	letter-spacing: 4px;
	text-align: left;
	word-spacing: 1px;
	padding-right: 20px;
}
#slogan-content-en span {
	font: bold;	
}

/*BTN-SLOGAN style - END//////////////////////////*/




/*DROPDOWN-PANEL-ST-//////////////////////////*/
.inner{
	width: 960px;
	margin: 0 auto;
	text-align: left;
	position: fixed;
	z-index: 10010;
}
#droppanel{
	height: 6px;
	z-index: 10000;
	position: fixed;
	width: 100%;
	border-bottom: 26px solid #000;
	background: #fff;
}
#droppanel .inner{position:relative;height:100%;z-index:10010}
#droppanel .inside{
	overflow: hidden;
	height: 100%;
	display: none;
	background: #fff;
}
/*---------------CONTENT DROPPANEL ST ------------------------*/

/*------ADRESS box ST --------*/
#droppanel-adress-box {
	float: left;
	height: auto;
	width: 100%;
	background: #fff;
	display: block;
	margin-left: 0px;
	margin-top: 30px;
}
.droppanel-adress-box-logo {
	float: left;
	display: block;
	margin-right: 40px;
	height: 45px;
	width: auto;
}


#droppanel-adress-box p {
	font: 12pt/18px 'PTSans-Narrow';
	letter-spacing: 1px;
	color: #94aab0;
	float: left;
	height: 60px;
	width: auto;
	display: block;
	margin-left: 210px;
	text-align: left;
	margin-top: 0px;
	margin-bottom: 0px;
}
#droppanel-adress-box p a {
	color: #009999;
	text-decoration: none;	
}

.droppanel-adress-box-activity{
	font: 28pt "BebasNeue Bold";
	color: #94aab0;
	float: right;
	display: block;
	margin-top: 1px;
	letter-spacing: 2px;
	height: auto;
	width: auto;
            }
/*------ADRESS box END --------*/

/*------SITEMAP box ST --------*/
#droppanel-sitemap-box {
	float: left;
	height: auto;
	width: 960px;
	background: #fff;
	display: block;
	margin-top: 16px;
	border-top: 2px dotted #94AAB0;
	border-bottom: 2px dotted #94AAB0;
	position: relative;
	padding-bottom: 26px;
}
#droppanel-sitemap-title {
	background: #fff;
	display: block;
	font: 12px 'PT Sans';
	color: #94aab0;
	text-align: center;
	vertical-align: middle;
	margin: 0px auto;
	padding: 2px 10px;
	position: relative;
	top: -12px;
	height: 16px;
	width: 130px;
	letter-spacing: 1px;
}
#droppanel-sitemap-menu {
	display: block;
	margin: 0px 0px 0px;
	height: auto;
	width: 960;
	position: relative;
	text-align: left;
}
#droppanel-sitemap-menu p {
	display: block;
	font: bold 14px 'PT Sans';
	color: #009999;		
}
#droppanel-sitemap-menu ul {
	display: block;
	font: 12pt/20px 'PTSans-Narrow';
	color: #94AAB0;
	float: left;
	width: auto;
	padding-right: 32px;
	letter-spacing: 1px;
}

#droppanel-sitemap-menu ul li {
	background: url(../images/ring-mark.svg) no-repeat left 8px;
	padding-left: 12px;
}
#droppanel-sitemap-menu ul li a {
	font: 12pt/18px 'PTSans-Narrow';
	color: #94AAB0;
	text-decoration: none;	
}
#droppanel-sitemap-menu ul li a:hover {
	border-bottom: 1px dotted #94AAB0;
}


/*------SITEMAP box END --------*/

/*------TECHNICAL INFO box ST --------*/
#droppanel-techinfo-box {
	float: left;
	height: 72px;
	width: 960px;
	background: #fff;
	display: block;
	margin-top: 30px;
	border-top: 1px dotted #94AAB0;
	border-bottom: 1px dotted #94AAB0;
	font: 10px Verdana, Geneva, sans-serif;
	text-align: center;
	padding: 10px 0px 5px;
	margin-bottom: 10px;
}
#droppanel-techinfo-title {
	background: #fff;
	display: block;
	font: 11px 'PT Sans';
	color: #94aab0;
	text-align: center;
	vertical-align: middle;
	margin: 0px auto;
	padding: 2px 5px;
	position: relative;
	top: -20px;
	height: 16px;
	width: 200px;
	letter-spacing: 1px;
}
.droppanel-techinfo-txt {
	background: #E8EAF0;
	display: block;
	font: 10pt/16px 'PTSans-Narrow';
	color: #94aab0;
	text-align: center;
	vertical-align: middle;
	margin: 0px auto;
	padding: 4px 10px 6px;
	position: relative;
	top: -16px;
	letter-spacing: 1px;
}
.droppanel-techinfo-txt span {
	color: #009999;
	
}
.droppanel-techinfo-txt a {
	color: #798e8a;
	text-decoration: underline;	
}



/*------TECHNICAL INFO box END --------*/
#copyright-info {
	display: block;
	font: 11px 'PT Sans';
	color: #94aab0;
	text-align: center;
	margin: 0px auto;
	width: auto;
	letter-spacing: 1px;
	
}
/*-------------------------------------*/
#lang-bg{
	position: absolute;
	right: 0px;
	bottom: -26px;
	width: 26px;
	height: 26px;
	z-index: 10050;
	display: block;
	margin-right: 3px;
	border-left: 1px solid #CCC;		
}
#lang-en{
	position: absolute;
	
	right: 0px;
	bottom: -26px;
	width: 26px;
	height: 26px;
	z-index: 10050;
	display: block;
	margin-right: 30px;
	
}
.lang-bg-en-def{
	text-decoration: none;
	font: 14px 'PT Sans';
	color: #e5e5e5;
	text-align: center;
	display: block;
	margin-top: 3px;	
}


.lang-bg-en{
	text-decoration: none;
	font: 14px 'PT Sans';
	color: #9d9d9d;
	text-align: center;
	display: block;
	margin-top: 3px;	
}
.lang-bg-en:hover{
	text-decoration: none;
	font: 14px 'PT Sans';
	color: #e5e5e5;
	text-align: center;
	display: block;
	margin-top: 3px;	
}
#sitemap{
	position: absolute;
	right: 0px;
	bottom: -28px;
	width: 34px;
	height: 34px;
	z-index: 10050;
	display: block;
	margin-right: 60px;
}

.btn-info{
	width: 34px;
	height: 34px;
	background: url(../images/btn-sm.png) no-repeat 0px 0px;
}
.btn-info-click{
	width: 34px;
	height: 34px;
	background: url(../images/btn-sm.png) no-repeat 0px -34px;
}



#socialandlanguage{
	position: absolute;
	right: 0px;
	bottom: -26px;
	width: 960px;
	height: 26px;
	font-size: 16px;
	color: #000000;
	text-transform: none;
	z-index: 10012;
	background: #000000;
	display: block;
	margin: 0px auto;
}

#top-line {
	background: #E5E5E5;
	display: block;
	height: 6px;
	width: 100%;
	position: absolute;
	bottom: 0px;	
	
}

#top-line-in {
	background: #E5E5E5;
	display: block;
	height: 6px;
	width: 100%;
	position: absolute;
	bottom: 0px;
	z-index: 10012;	
	
}
/*DROPDOWN-PANEL-END-//////////////////////////*/

/*CAROUSEL-CSS-ST-/////////////////////////////////*/
/*NAV*/

#btn-carousel-box {
	display: block;
	position: absolute;
	height: 40px;
	width: 40px;
	left: 0px;
	top: 0px;
	float: left;
	z-index: 104;
	margin-left: 332px;
	margin-top: 55px;
}
.btn-carousel-box-title {
	display: block;
	position: absolute;
	height: 80px;
	width: 400px;
	float: left;
	z-index: 104;
	margin-left: 20px;
	margin-top: 20px;
	font: 27pt/24px 'BebasNeue Book';
	color: #CCCCCC;
	letter-spacing: 6px;
	text-align: left;
	padding-top: 48px;
}
.btn-carousel-box-title p {
	display: block;
	float: left;	
	
}
.btn-carousel-box-title p span {
	font: 27pt 'BebasNeue Bold';
	
	
}
.gallery {
	height: 100px;
	width: 560px;
	position: absolute;
	display: block;
	margin-left: 400px;
	z-index: 110;
	margin-top: 40px;
}
.btn-gallery {
	TEXT-INDENT: -9999px;
	WIDTH: 26px;
	FLOAT: left;
	HEIGHT: 26px;
}
.left {
	Z-INDEX: 110;
	BACKGROUND: url(../images/carousel-btn.jpg) no-repeat 0px -26px;
	MARGIN-LEFT: 0px
	float: left;
}
.right {
	Z-INDEX: 110;
	BACKGROUND: url(../images/carousel-btn.jpg) no-repeat;
	MARGIN-RIGHT: 6px
}
/*NAV*/

#carousel-raper {
	margin: 0px auto;
	width: 960px;
	position: relative;
	display: block;
	z-index: 100;
	top: 500px;
	background: rgba(102,102,102,1);
}


#carousel-top-line {
	width: 100%;
	position: absolute;
	display: block;
	z-index: 101;
	background: #666;
	height: 40px;
}
#carousel-top-line-b {
	width: 960px;
	display: block;
	z-index: 102;
	background: #666;
	height: 26px;
	margin-top: 40px;
	position: absolute;
	float: right;
	right: 0px;
}
#carousel-bottom-line {
	width: 100%;
	position: absolute;
	display: block;
	z-index: 101;
	background: #e5e5e5;
	height: 40px;
	margin-top: 145px;
}
.carousel {
	POSITION: relative;
	PADDING-BOTTOM: 0px;
	LIST-STYLE-TYPE: none;
	MARGIN: 0px;
	PADDING-LEFT: 0px;
	WIDTH: 160px;
	PADDING-RIGHT: 0px;
	HEIGHT: 100px;
	OVERFLOW: hidden;
	PADDING-TOP: 0px;
	background: #999;	
}
.carousel LI {
	POSITION: absolute;
	PADDING-BOTTOM: 0px;
	PADDING-LEFT: 0px;
	WIDTH: 940px;
	PADDING-RIGHT: 0px;
	FLOAT: left;
	OVERFLOW: hidden;
	TOP: 0px;
	PADDING-TOP: 0px;
	LEFT: 0px
}
/*CAROUSEL-HOLDER*/
.carousel-holder {
	WIDTH: 560px;
	FLOAT: left;
	OVERFLOW: hidden;
	height: 100px;
}
.info {
	DISPLAY: none
}
.carousel-info {
	POSITION: relative;
	WIDTH: 400px;
	HEIGHT: 160px;
	OVERFLOW: hidden;
	margin: -92px 0px 0px 180px;
}
.carousel-info LI {
	POSITION: absolute;
	WIDTH: 400px;
	OVERFLOW: hidden;
	TOP: 0px;
	LEFT: 0px;
	LIST-STYLE-TYPE: none;
}
.carousel-info P {
	WIDTH: 380px;
	FLOAT: left;
	margin-top: 5px;
	font: normal 10pt/13pt "open_sanscondensed_light";
	color: #CCCCCC;
	display: block;
	position: relative;
	text-align: left;
	letter-spacing: 1px;
}
.carousel-info-header {
	WIDTH: 380px;
	FLOAT: left;
	display: block;
	margin-top: 0px;
	position: relative;
	text-align: left;
	font: 14pt "BebasNeue Bold";
	color: #CCCCCC;
	letter-spacing: 1px;
	word-spacing: 2px;
	LIST-STYLE-TYPE: none;
}

/*CAROUSEL-CSS-END-/////////////////////////////////*/



/*-/////////////////////////////////////////////////////////////
///////////////PAGE-SLIDE/MODAL-WIN-RIGHT-ST///////////////////
///////////////////////////////////////////////////////////////*/
#pageslide {
	/* These styles MUST be included. Do not change. */
	display: none;
	position: fixed;
	top: 0;
	height: 100%;
	z-index: 999999;
	/* Specify the width of your pageslide here */
	width: 560px;
	padding: 0px;
	color: #FFF;
	background: #fff;
	-webkit-box-shadow: outset 0 0 5px 5px #222;
	-moz-shadow: outset 0 0 5px 5px #222;
	box-shadow: outset 0 0 5px 5px #222;	
}

.btn-close-modal {
	width: 48px;
	height: 48px;
	border: none;
	background: url(../images/close-form.png) no-repeat center center;
	left: -68px;
	position: relative;
	top: 20px;
}

#modal-header {
	float: left;
	height: auto;
	width: 100%;
	background: #fff;
	display: block;
	margin-left: 0px;
}
.modal-header-logo {
	float: left;
	display: block;
	margin-bottom: 80px;
	margin-right: 30px;	
}


#modal-header p {
	font: 12pt/18px 'PTSans-Narrow';
	letter-spacing: 1px;
	color: #94aab0;
	float: left;
	height: auto;
	width: 480px;
	display: block;
	margin-left: 60px;
	text-align: left;
	margin-top: 20px;
	margin-bottom: 5px;
}
#modal-header p a {
	color: #009999;
	text-decoration: none;	
}


#modal-header-social {
	float: left;
	height: auto;
	width: 180px;
	display: block;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	background: #CCC;
	position: relative;
}




#modal-content {
	float: left;
	height: 100%;
	width: 100%;
	padding-left: 0px;
	text-align: left;
}

.contact-form-frame {
	float: left;
	margin-left: 60px;
	margin-top: 10px;
	height: 510px;
	min-height: 510px;
	width: 460px;
	border: 2px dotted #999;
	overflow: auto;
}

#modal {
	display: none;
}
/*#modal a {
	background: #e5e5e5;
	color: #333;
	font-weight: bold;
	border: none;
}
#modal a:hover {
	background: #FFFFFF;
}*/ 
/*BODY-FADEOUT-CSS-ST ///////////////////////////////////////*/
/*zatumn sloi*/
.p_body {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0.9;
	-moz-transition: opacity 800ms;
	-o-transition: opacity 800ms;
	-webkit-transition: opacity 800ms;
	transition: opacity 800ms;
	z-index: 12000;
}
.p_body-proba {
	position: fixed;
	top: 200px;
	left: 0;
	width: 100%;
	height: 100%;
	background: #F00;
	opacity: 0.9;
	-moz-transition: opacity 800ms;
	-o-transition: opacity 800ms;
	-webkit-transition: opacity 800ms;
	transition: opacity 800ms;
	z-index: 80000;
}
/* JS-styles — declaratively */


.js__p_start {
}
.js__p_close {
}
.js__p_body {
}
.js__slide_top {
height: 0;
overflow: hidden;
top: 0;
}
.js__fadeout {
height: 0;
overflow: hidden;
opacity: 0;
}



/*BODY-FADEOUT-CSS-END ///////////////////////////////////////*/

/*-/////////////////////////////////////////////////////////////
///////////////PAGE-SLIDE/MODAL-WIN-RIGHT-END///////////////////
///////////////////////////////////////////////////////////////*/


 

/*///////////////// SCROLL BAR STYLE - ST /////////////////*/
.scrbar-txt {
	font: normal 11pt/19px "open_sanscondensed_light";
	height: 190px;
	width: 710px;
	float: left;
	margin-left: 30px;
	text-align: left;
	padding: 0px;
	color: #999;
	letter-spacing: 2px;
	word-spacing: 1px;
	margin-top: 36px;
}
.scrbar-txt span {
	font: normal 11pt/19px "open_sans_condensedbold";
}

#scrbar-txt-slogan {
	font: normal 14pt/19px "open_sanscondensed_light";
	color: #009999;
	display: block;
	letter-spacing: 2px;
	word-spacing: 1px;
	cursor: pointer;
}
#scrbar-txt-slogan span {
	font: normal 14pt/19px "open_sans_condensedbold";
	letter-spacing: 4px;
	word-spacing: 1px;
}

/*///////////////// SCROLL BAR STYLE - END /////////////////*/




/* /////////General button style (reset)///////-ST */
#div-btn{/*background btn colour*/
	background: #CCC;
	height: auto;
	width: auto;
	display: block;
	padding: 0px;
	}
#div-btn-tn{/*background btn colour*/
	background: #CCC;
	height: auto;
	width: auto;
	display: block;
	padding: 0px;
	text-align: center;
	margin: 0px auto;
	}

#div-btn-s{/*background btn colour*/
	background: #CCC;
	height: auto;
	width: auto;
	display: block;
	padding: 0px;
	margin-top: 10px;
	}



.btn {
	border: none;
	color: #333;
	background: none;/*always*/
	cursor: pointer;
	padding: 4px 8px;
	display: inline-block;
	letter-spacing: 1px;
	outline: none;
	height: auto;
	position: relative;
	width: auto;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	text-transform: none;
}

.btn:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}


/* Button 1 */
.btn-1 {
	border: 1px solid #fff;
	color: #333;
	z-index: 1;
	text-decoration: none;
	text-transform: uppercase;
	font: normal 12px Arial, Helvetica, sans-serif;
	text-align: left;
}
.btn-tn {
	border: 1px solid #fff;
	color: #333;
	z-index: 1;
	text-decoration: none;
	font: normal 12px Arial, Helvetica, sans-serif;
	text-align: center;
}
.btn-tn span {
	font: bold 12px Arial, Helvetica, sans-serif;
}
/* Button 1b */
.btn-1b:after {
	width: 100%;
	height: 0;
	top: 0;
	left: 0;
	background: #333;	
}

.btn-1b:hover,
.btn-1b:active {
	color: #FFFFFF;	
}

.btn-1b:hover:after,
.btn-1b:active:after {
	height: 100%;
}
/* Button 1e -----for the get-in-touch Btn ST*/
#box-btn-offer{
	display: inline-block;
	float: left;
	height: auto;
	width: auto;
	padding: 15px 40px 0px 20px;
}
.btn-offer-img {
	display: block;
	margin-left: 10px;
	border-style: none;
	float: right;
	vertical-align: text-bottom;
}
.entypo {
	display: block;
	float: right;
	height: 14px;
	width: 1px;
	margin: -3px 14px 0px 8px;
	font: normal 24pt/0 EntypoRegular;
}

.entypo.export:after{content: '\E715';

}
.entypo1 {
	display: block;
	float: right;
	height: 14px;
	width: 1px;
	margin: -1px 14px 0px 4px;
	font: normal 25pt/0 EntypoRegular;
}

.entypo1.search:after{content: '\1F50D';

}

/*for the get-in-touch Btn END*/

/* /////////General button style (reset)///////-END */

/*SOCIAL MENU-ST-//////////////////////////*/
/*----------BTN-container*/
#btnslide-div {
	display: none;
	background: #000000;
	position: relative;
	height: 26px;
	width: auto;
	padding: 0px;
	float: right;
	
	
}
/*----------BTN-style*/
#btnbasic {/*wrapper-div*/
	display: block;
	height: 26px;
	width: 26px;
	position: relative;
	float: right;
	z-index: 100;
	margin-right: 100px;
	cursor: pointer;	
}

.prev-image {
	POSITION: relative;
	MARGIN: 0px;
	WIDTH: 26px;
	DISPLAY: block;
	FLOAT: right;
	HEIGHT: 26px;
	OVERFLOW: hidden;
	CURSOR: pointer
}
.prev-image IMG {
	POSITION: absolute; TOP: 0px; LEFT: 0px
}

UL#portfolio-list {
	LIST-STYLE-TYPE: none;
	MARGIN: 0px;
	WIDTH: 172px;
	FLOAT: left;
	LIST-STYLE-IMAGE: none;
	padding: 0px;
}
UL#portfolio-list LI {
	LIST-STYLE-TYPE: none;
	FLOAT: left;
	LIST-STYLE-IMAGE: none;
	margin-left: 2px;
}
/*SOCIAL MENU-END-//////////////////////////*/





/*TOP-MENU //////////////////////////////start*/
nav a {
	font-family: "PT Sans";
	margin: 4px 0px 4px 30px;
	outline: none;
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: normal;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	font-size: 14px;
	display: inline-block;
	position: relative;
	letter-spacing: 1px;
}

.top-menu {
	background: #009999;
	display: block;
	height: auto;
	width: 700px;
	margin-top: 46px;
	z-index: 2000;
	position: absolute;
	margin-right: 0px;
	margin-left: 240px;
	padding-left: 20px;
}

#topMenuScroll{/*topMenu-Scroll*/
	width: 960px;
	padding: 0px;
	height: auto;
	display: block;
	position: fixed;
	top: -400px;
	z-index: 1002;
	background: #009999;
	margin-right: auto;
	margin-left: auto;
}


.menu-effect a {
	overflow: hidden;
}

.menu-effect a span {
	position: relative;
	display: inline-block;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}

.menu-effect a span::before {
	position: absolute;
	top: 100%;
	content: attr(data-hover);
	font-weight: bold;
	-webkit-transform: translate(0,0,0);
	-moz-transform: translate(0,0,0);
	transform: translate(0,0,0);
	height: auto;
	width: 300px;
	letter-spacing: 1px;
	padding: 0px;
}
.menu-effect a span::before, span:focus {
	position: absolute;
	top: 100%;
	content: attr(data-hover);
	font-weight: bold;
	-webkit-transform: translate(0,0,0);
	-moz-transform: translate(0,0,0);
	transform: translate(0,0,0);
	height: auto;
	
	
	letter-spacing: 1px;
	padding: 0px;
}
.menu-effect a:hover span,
.menu-effect a:focus span {
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	transform: translateY(-100%);
	height: auto;
	width: auto;
}

/*TOP-MENU //////////////////////////////start*/

/*SUB-MENU //////////////////////// ST*/

#sub-menu-container {
	display: block;
	height: auto;
	width: 740px;
	z-index: 1800;
	position: fixed;
}
.subm-about {
	visibility: hidden;
	background: #E5E5E5;
	display: block;
	width: 960px;
	z-index: 1800;
	padding-top: 26px;
	padding-bottom: 10px;
	margin: 70px auto 0px;
	border-bottom: 6px solid #FFF;
	position: absolute;
	height: auto;
	box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
}


.subm-print {
	position: absolute;
	visibility: hidden;
	background: #E5E5E5;
	display: block;
	height: auto;
	width: 960px;
	z-index: 1800;
	padding-top: 26px;
	padding-bottom: 10px;
	margin: 80px auto 0px;
	border-bottom: 6px solid #FFF;
	box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
}

.subm-outdor {
	position: absolute;
	visibility: hidden;
	background: #E5E5E5;
	display: block;
	height: auto;
	width: 960px;
	z-index: 1800;
	padding-top: 26px;
	padding-bottom: 10px;
	margin: 70px auto 0px;
	border-bottom: 6px solid #FFF;
	box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
}

.subm-web {
	position: absolute;
	visibility: hidden;
	background: #E5E5E5;
	display: block;
	height: auto;
	width: 960px;
	z-index: 1800;
	padding-top: 26px;
	padding-bottom: 10px;
	margin: 70px auto 0px;
	border-bottom: 6px solid #FFF;
	box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
}



/*SUB-MENU-fixed - st --*/
#subm-about-fixed {
	background: #E5E5E5;
	height: auto;
	width: 100%;
	position: absolute;
	z-index: 1800;
	display: block;
	margin: 70px auto 0px;
	overflow: hidden;
	z-index: 1800;
	padding-top: 26px;
	padding-bottom: 10px;
	border-bottom: 6px solid #FFF;
	overflow: hidden;
	-webkit-animation: prob-in 1s linear 1 normal backwards;
	-moz-animation: prob-in 1s linear 1 normal backwards;
	-o-animation: prob-in 1s linear 1 normal backwards;
	-ms-animation: prob-in 1s linear 1 normal backwards;
	animation: prob-in 1s linear 1 normal backwards;
	box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
}
#subm-print-fixed {
	background: #E5E5E5;
	height: auto;
	width: 100%;
	position: absolute;
	z-index: 1800;
	display: block;
	margin: 80px auto 0px;
	overflow: hidden;
	z-index: 1800;
	padding-top: 26px;
	padding-bottom: 10px;
	border-bottom: 6px solid #FFF;
	overflow: hidden;
	-webkit-animation: prob-in 1s linear 1 normal backwards;
	-moz-animation: prob-in 1s linear 1 normal backwards;
	-o-animation: prob-in 1s linear 1 normal backwards;
	-ms-animation: prob-in 1s linear 1 normal backwards;
	animation: prob-in 1s linear 1 normal backwards;
	box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 8px 22px 0px rgba(0,0,0,0.5);
	left: 1px;
}


@-moz-keyframes prob-in {
	0% {
		-moz-transform:translateY(-180px);
		opacity:0;
	}
	90% {-moz-transform:translateY(8px);
		opacity:1;
	}
	100% {-moz-transform:translateY(0px);}
}

@-o-keyframes prob-in {
	0% {
		transform:translateY(-180px);
		opacity:0;
	}
	90% {transform:translateY(8px);
		opacity:1;
	}
	100% {transform:translateY(0px);}
}
@-ms-keyframes prob-in {
	0% {
		transform:translateY(-180px);
		opacity:0;
	}
	90% {transform:translateY(8px);
		opacity:1;
	}
	100% {transform:translateY(0px);}
}
@-webkit-keyframes prob-in {
	0% {
		-webkit-transform:translateY(-180px);
		opacity:0;
	}
	90% {-webkit-transform:translateY(8px);
		opacity:1;
	}
	100% {-webkit-transform:translateY(0px);}
}
@-keyframes prob-in {
	0% {
		transform:translateY(-180px);
		opacity:0;
	}
	90% {transform:translateY(8px);
		opacity:1;
	}
	100% {transform:translateY(0px);}
}
/*sub-menu-fixed - end*/
/*Sub-menu-lists-css*/
#subm-box ul {
	display: block;
	float: left;
	letter-spacing: 1px;
	text-align: left;
	word-spacing: 1px;
	padding: 0px;
	margin: 0px 0px 0px 25px;
}


#subm-box li {
	list-style: none;
	display: inline-block;
	float: left;
	height: 26px;
	width: 180px;
	position: relative;
	border-right: 1px solid #666;
	margin: 0px;
	padding: 0px;
}
#subm-box li:first-child {
	
	border-right: 1px solid #666;
	border-left: 1px solid #666;
}

#subm-box li a {
	font: 10pt 'PTSans-Narrow';
	color: #282828;
	display: block;
	height: 22px;
	width: 150px;
	border-bottom: 1px dotted #666;
	text-decoration: none;
	position: relative;
	margin: 0px auto;
	padding: 4px 12px 0px 0px;
	background: url(../images/sm-point.png) no-repeat left 1px;
	text-indent: 14px;
}
#subm-box li a:hover {
	font: 10pt 'PTSans-NarrowBold';
}
/*subm-box - align senter*/

#subm-box1 ul {
	display: block;
	float: left;
	letter-spacing: 1px;
	text-align: left;
	word-spacing: 1px;
	padding: 0px;
	margin: 0px 0px 0px 10px;
}


#subm-box1 li {
	list-style: none;
	display: inline-block;
	float: left;
	height: 26px;
	position: relative;
	border-right: 1px solid #666;
	margin: 0px;
	padding: 0px;
}
#subm-box1 li:first-child {
	
	border-right: 1px solid #666;
	border-left: 1px solid #666;
}

#subm-box1 li a {
	font: 10pt 'PTSans-Narrow';
	color: #282828;
	display: block;
	height: 22px;
	width: auto;
	border-bottom: 1px dotted #666;
	text-decoration: none;
	position: relative;
	margin: 0px 10px;
	padding: 4px 12px 0px 16px;
	background: url(../images/sm-point.png) no-repeat left 1px;
	text-indent: 14;
}
#subm-box1 li a:hover {
	font: 10pt 'PTSans-NarrowBold';
}

/*SUB-MENU //////////////////////// END*/







/* /////////////////LeftMenuStyle-START ////////////////////// */
#leftMenuBox {
	width: 40px;
	padding: 126px 0px 0px;
	height: auto;
	display: block;
	position: fixed;
	top: -700px;/*dimension to top*/
	color: #999;
	z-index: 1000;
	margin-left: -60px;
}
#leftMenuBoxAbout {
	width: 40px;
	padding: 126px 0px 0px;
	height: auto;
	display: block;
	position: fixed;
	top: -600px;/*dimension to top*/
	color: #999;
	z-index: 1000;
	margin-left: -60px;
}
#leftMenu-inBoxes {
	width: 40px;
	height: auto;
	display: block;
	padding-bottom: 16px;
	border-bottom: 1px dotted #FFF;
}
.left-menu-btn-logo {
	width: 40px;
	height: 40px;
	display: block;
	background: url(../images/left-menu-btn-logo.png) no-repeat left top;
	border: 1px solid #FFF;
}
.left-menu-btn-tnmenu {
	width: 26px;
	height: 26px;
	display: block;
	background: url(../images/left-menu-btn-tnmenu.png) no-repeat left top;
	margin: 16px auto 0px;
}
.left-menu-btn-top {
	width: 26px;
	height: 26px;
	display: block;
	background: url(../images/left-menu-btn-top.png) no-repeat left top;
	margin: 16px auto 0px;
	border: 1px solid #FFF;
}
#sidemenu {
	width: 40px;
	height: auto;	
}
#sidemenu ul {
	list-style: none;
	height: auto;
	width: 26px;
	display: block;
	margin: 0px auto;
	text-align: center;
	
}
#sidemenu li {
	height: 8px;
	width: 8px;
	display: block;
	z-index: 1001;
	margin: 8px auto 0px;
	position: relative;
	text-align: center;
	
}
#sidemenu a {
	height: 8px;
	width: 8px;
	display: block;
	position: relative;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-o-border-radius: 50%;
	-ms-border-radius: 50%;
	border-radius: 50%;
	
	margin: 0px auto;
	border: 1px solid #fff;
}
#sidemenu a:hover{
	text-decoration: none;
	background: #fff;
	border: 1px solid #FFF;
}

#sidemenu .mPS2id-highlight {
	background: rgba(255,255,255,1);
	height: 8px;
	width: 8px;
	display: block;
	position: relative;
	border: 1px solid #fff;
	z-index: 1010;
	-moz-border-radius: 0%;
	-webkit-border-radius: 0%;
	-o-border-radius: 0%;
	-ms-border-radius: 0%;
	border-radius: 0%;
	margin: 0px auto;
}


#sidemenu span {
	/* Container properties */
	width: 0;
	padding: 0px 0px 2px;
	left: 20px;
	position: absolute;
	overflow: hidden;
	letter-spacing: 1px;
	/* CSS3 Transition: */
	-webkit-transition: 0.5s;
	/* Future proofing (these do not work yet): */
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
	font: 12pt 'PTSans-Narrow';
	color: #ffffff;
	top: -6px;
	background: #FFF;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	-ms-border-radius: 3px;
	border-radius: 3px;
	opacity: 0.8;
	filter: alpha(opacity=80);
	white-space: nowrap;
	height: auto;
}
#sidemenu a:hover span{
	width: auto;
	padding: 0px 10px 2px;
	overflow: visible;
	color: #000;
	height: auto;
	vertical-align: top;
}

/* /////////////////LeftMenuStyle-END ////////////////////// */

#footer{
	width: 100%;
	height: 220px;
	background: #282828;
	display: block;
	
}
#footer-box {
	height: 20px;
	width: 960px;
	display: block;
	border-top: 2px dotted #94AAB0;
	position: relative;
	padding-bottom: 20px;
	margin: 0px auto;
	padding-top: 20px;
}
.footer-box-logo {
	float: left;
	display: block;
	margin-right: 40px;
	height: 45px;
	width: auto;
}
#footer-box-menu {
	display: block;
	margin: 0px;
	height: auto;
	width: 960;
	position: relative;
	text-align: left;
}
#footer-box-menu p {
	display: block;
	font: bold 14px 'PT Sans';
	color: #009999;	
}
#footer-box-menu ul {
	display: block;
	font: 12pt/20px 'PTSans-Narrow';
	color: #94AAB0;
	float: left;
	width: auto;
	padding-right: 32px;
	letter-spacing: 1px;
}

#footer-box ul li {
	background: url(../images/ring-mark.svg) no-repeat left 8px;
	padding-left: 12px;
}
#footer-box ul li a {
	font: 12pt/18px 'PTSans-Narrow';
	color: #94AAB0;
	text-decoration: none;	
}
#footer-box ul li a:hover {
	border-bottom: 1px dotted #94AAB0;
}

#footer-box-copyright-info {
	display: block;
	font: 11px 'PT Sans';
	color: #94aab0;
	text-align: left;
	width: auto;
	float: left;
	margin-left: 0px;
	margin-top: 20px;
	letter-spacing: 1px;
}


UL#portfolio-list-footer {
	LIST-STYLE-TYPE: none;
	MARGIN: 14px 0px 0px;
	WIDTH: 480px;
	FLOAT: right;
	LIST-STYLE-IMAGE: none;
	padding: 0px;
	display: block;
}
UL#portfolio-list-footer P {
	display: block;
	font: 11px 'PT Sans';
	color: #94aab0;
	text-align: right;
	width: auto;
	float: right;
	margin-right: 14px;
	margin-top: 6px;
	letter-spacing: 1px;
}

UL#portfolio-lis-footert LI {
	LIST-STYLE-TYPE: none;
	FLOAT: right;
	LIST-STYLE-IMAGE: none;
	display: block;
	height: 26px;
	width: 26px;
	margin-left: 10px;
}


/*-----------------------------------------------------------------*/

#project-info-content {
	
}