@import url(http://fonts.googleapis.com/css?family=Titillium+Web:400,900,700italic,700,600italic,600,400italic,300italic,300,200italic,200);
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300);
@import url(http://fonts.googleapis.com/css?family=Oswald);
@import url(http://fonts.googleapis.com/css?family=Armata);
@font-face {
    font-family: 'BebasNeueRegular';
    src: url('fonts/BebasNeue-webfont.eot');
    src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BebasNeue-webfont.woff') format('woff'),
         url('fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
*{padding:0;margin:0}
html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; height: 100%; }
body { margin: 0; font-size: 13px;font-family: 'Titillium Web', sans-serif;  cursor:default; line-height: 1.231; height: 100%; min-height: 100%;overflow-x:hidden; }
::-moz-selection { background: #f0f0f0; color: #fff; text-shadow: none; }
::selection { background: #f0f0f0; color: #fff; text-shadow: none; }

a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #fff; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { color: #000; text-decoration: none; }
mark { color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }



/* ==|== primary styles =====================================================
   Author: 
   ========================================================================== */

header { position: absolute; width: 100%; z-index: 5000; }

nav 		{ float:left; margin-left: 330px;}
nav ul.b-mainmenu li 	{ float: left; font-size: 1.25em;padding:25px 0px 25px 0px;margin:1px;}
nav ul.b-mainmenu li a { color: black; width:100px; height:100px; box-shadow: 
		inset 0 1px 1px rgba(0,0,0,0.5), 
		0 1px 1px rgba(255,255,255,0.9);  background:#b5b536; padding:20px; text-transform:uppercase; letter-spacing:2px;-webkit-transition:all 1s ease-in-out;-moz-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;-ms-transition:all 1s ease-in-out;transition:all 1s ease-in-out; border-radius:33px; text-decoration: none; font-weight:bold; font-family: 'Titillium Web', sans-serif; }
nav ul.b-mainmenu li a:hover {
	background:#e7e749;
}

#lunarCont, #lunarCont .alapon a {
	transition: all .4s;
	-moz-transition: all .4s;
	-webkit-transition: all .4s;
}

#lunarCont {
	background:url(../imgroot/lunarContline.png) no-repeat;
	width:480px;
	position: fixed;
	z-index: 100000;
}

#lunarCont {
	left: 0; /* Change to right: 0; if you want the panel to display on the right side. */
}

#lunarCont:hover, #lunarCont:focus {
	left: 0 !important; /* Change to right: 0 !important; if you want the panel to display on the right side. */
}

#lunarCont .alapon {
	right: 2px; /* Change to left: 2px; if you want the panel to display on the right side. */
}

#lunarCont .alapon {
	color: rgba(0,0,0,0.75); /* Arrow color */
	width: 16px;
	height: 25px;
	display: block;
	position: absolute;
	top: 20px;
	cursor: default;
}

#lunarCont:hover .alapon {
	transform: rotate(-180deg) translate(6px,-3px);
	-moz-transform: rotate(-180deg) translate(6px,-3px);
	-webkit-transform: rotate(-180deg) translate(6px,-3px);
}

/* ==|== non-semantic helper classes ======================================== */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/* ==|== media queries ====================================================== */

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


}

@media only screen and (min-width: 768px) {

}






.test {
  position: absolute;
  top: 30px;
  left: 30px;
  z-index: 100000;
  width: 500px;
  height: 500px;

  border: solid 1px red;
  background: red;
 
  -webkit-transform: skew(45deg);
  -ms-transform: skew(45deg);
 
}

/* ==|== client styles ======================================================= */
#clientProforma{position:relative;padding:0;right:70px;}#laneClients{height:24px;position:absolute;left:0;width:820px;}#areaClients{width:840px;}#areaClients
.left{float:left;background-image:url(../imgroot/shadowLeft.png);background-repeat:no-repeat;height:67px;width:34px;background-position:right;margin-top:60px;position:relative;z-index:300}#areaClients
.right{float:right;background-image:url(../imgroot/shadowRight.png);background-repeat:no-repeat;height:67px;width:34px;background-position:left;margin-top:60px;position:relative;z-index:300}#areaClients .left
.arrow{background-image:url(../imgroot/arrowLeft.png);background-repeat:no-repeat;float:right;width:22px;height:38px;margin-top:16px;cursor:pointer}#areaClients .right
.arrow{background-image:url(../imgroot/arrowRight.png);background-repeat:no-repeat;background-position:right;width:22px;height:38px;margin-top:16px;cursor:pointer}#clientProforma
.align{width:820px;margin-right:55px;}#clientProforma
li{height:170px;width:820px}#clientProforma ul.carouselClients
.box{height:170px;background-position:bottom;float:left;background-repeat:no-repeat;position:relative}#clientProforma ul.carouselClients
.box1{width:170px;background-image:url(../imgroot/box1.png)}#clientProforma ul.carouselClients
.box2{width:162px;background-image:url(../imgroot/box1.png)}#clientProforma ul.carouselClients
.box3{width:164px;background-image:url(../imgroot/box1.png)}#clientProforma ul.carouselClients
.box4{width:162px;background-image:url(../imgroot/box1.png)}#clientProforma ul.carouselClients
.box5{width:162px;background-image:url(../imgroot/box1.png)}#clientProforma
.carouselContainer{position:absolute;top:3px;z-index:100;width:820px}#clients
a.box{display:block}#clientProforma .box
img{margin-top:55px;position:absolute;display:block}#clientProforma .box1
img{left:15px}#clientProforma .box2 img, #clientProforma .box4 img, #clientProforma .box5
img{left:6px}#clientProforma .box3
img{left:7px}#clientProforma .box
img.off{z-index:200}#clientProforma .box
img.on{z-index:100}


a.packWeb{
	width:45px;
	height:200px;
	position:absolute;
	top:-114px; left:0px;
	background:url(../imgroot/pack.png) no-repeat;
}
.panel {
position: fixed;
top: 151px;
left:180px;
display: none;
background: #b7b7b7;
border:1px solid #d1d1d1;
border-top-right-radius:25px 25px;
box-shadow:0 2px 2px rgba(0,0,0,.3);
width: 300px;
height:340px;
padding: 50px;
padding-top:8px;
filter: alpha(opacity=85);
opacity: .85;
}
.panel a, .panel a:visited{
margin: 0;
padding: 0;
color: #9FC54E;
text-decoration: none;
border-bottom: 1px solid #9FC54E;
}

.panel a:hover, .panel a:visited:hover{
margin: 0;
padding: 0;
color: #fff;
text-decoration: none;
border-bottom: 1px solid #fff;
}

a.trigger{
position:absolute;
text-decoration: none;
top:-75px; 
left:10px;
width:45px;
height:220px;
padding:0;
font-weight: 700;
background:url(../imgroot/pack.png) no-repeat;
display: block;
}
a.active.trigger {
background:url(../imgroot/packX.png) no-repeat;
}

.scroll{height:250px; width:300px; overflow:hidden;}
.track{ width:20px; height:299px; padding:0 0; top:38px !important; left:320px !important; background: url(../imgroot/scroll_track.png) 0 0 no-repeat}
.shuttle{ width:20px; height:76px; background: url(../imgroot/scroll_drag.png) 0 0 no-repeat; margin-left:0px;}


/* The Magic */
.lunarPack:hover .packages:hover .indv-pack,
.lunarPack .packages--default .indv-pack {
    height: 16.4em;
}

.indv-pack,
.lunarPack:hover .indv-pack {
    height: 0;
    overflow: hidden;
    -webkit-transition: height .5s;
       -moz-transition: height .5s;
        -ms-transition: height .5s;
         -o-transition: height .25s;
            transition: height .5s;
}

/* Aesthetic */
.lunarPack {
    padding: 0;
    margin:10px auto;
    width:335px;
}

.lunarPack .packages {
    background-image: -webkit-linear-gradient(60deg, #666, #444, #ccc);
    background-image:         linear-gradient(30deg, #888, #bbb, #666);
  border-bottom: 1px solid #888;
  padding: .1em;
}

.lunarPack h2 {
  margin: 0;
  padding:4px;
  text-align:center;
  text-transform:uppercase;
  font-size:15px;
	text-shadow: 0px 1px 0px rgba(255,255,255,.4), 0px -1px 0px rgba(0,0,0,.6);
	color: #2F2F00;
	letter-spacing:1px;
}
.lunarPack h3 {
  margin: 0;
  padding:4px;
  text-align:center;
  text-transform:none;
  font-size:.9em;
	color: #111;
	letter-spacing:1px;
}
.lunarPack .packages:nth-child(1) {
box-shadow: 
		inset 0 1px 1px rgba(0,0,0,0.3), 
		0 0 1px rgba(255,255,255,0.9);
}

.lunarPack .packages:nth-child(2) {
  box-shadow: 
		inset 0 1px 1px rgba(0,0,0,0.3), 
		0 0 1px rgba(255,255,255,0.9);
}

.lunarPack .packages:nth-child(3) {
  box-shadow: 
		inset 0 1px 1px rgba(0,0,0,0.3), 
		0 0 1px rgba(255,255,255,0.9);
}

.lunarPack .packages:nth-child(4) {
  box-shadow: 
		inset 0 1px 1px rgba(0,0,0,0.3), 
		0 0 1px rgba(255,255,255,0.9);}
.lunarPack .packages:nth-child(5) {
  box-shadow: 
		inset 0 1px 1px rgba(0,0,0,0.3), 
		0 0 1px rgba(255,255,255,0.9);

}
table.stats{
text-align: center;
font-weight: normal;
font-size: 11px;
width: 328px;
margin:0;
margin-left:3px;
border-spacing: 0px;}

table.stats td
{
padding:1px;
letter-spacing:1px;
text-align:center;
font-size:12px;
color:#111;
font-weight:normal;
border:1px solid #555;
	}
	
table.stats th
{
padding: 2px;
font-weight:normal;
text-align: center;
text-transform:uppercase;
font-size:13px;
color:#202000;
	}
#wrap {width:380px; margin:45px 20px 0; height:1500px;}
#wrap h5 {margin-bottom:20px; width:320px;position:relative; margin:auto; margin-top:135px;background:#f9f8f6 url(../imgroot/folded.png) bottom no-repeat; padding-bottom:100px;font-family: 'Oswald', Arial, sans-serif; font-weight:normal;border-radius: 6px;box-shadow: 0 0 1px #999, inset 0 1px 1px #fff;border: 7px solid #fff; color:#666; text-shadow:none; letter-spacing:2px; text-align:center;font-size:12px; }
#lunarCont h4 {margin-bottom:20px; letter-spacing:2px; text-align:left;font-size:15px; width:320px;margin:auto; margin-top:25px;background:url(../imgroot/ribb.png) left no-repeat; height:32px; text-transform:uppercase; font-family: 'Open Sans Condensed', sans-serif;font-weight:normal;text-shadow:none; }
#lunarCont h6 {margin-bottom:20px; width:320px;margin:auto; margin-top:15px;font-family: 'Oswald', Arial, sans-serif; font-weight:normal; text-shadow:none; letter-spacing:2px;color:#777; text-align:left;font-size:12px; }

	#form_wrap { overflow:hidden; height:326px; position:relative; top:0px;
		-webkit-transition: all 1s ease-in-out .3s;
		-moz-transition: all 1s ease-in-out .3s;
		-o-transition: all 1s ease-in-out .3s;
		transition: all 1s ease-in-out .3s;}
	
	#form_wrap:before {content:"";
		position:absolute;
		bottom:90px;left:0px;
		background:url('../images/before.png');
		width:380px;height:227px;}
	
	#form_wrap:after {content:"";position:absolute;
		bottom:0px;left:0;
		background:url('../images/after.png');
		width:380px;height:184px; }

	#form_wrap.hide:after, #form_wrap.hide:before {display:none; }
	#form_wrap:hover {height:400px;top:20px;}


	form {background:#f9f8f6;
		background:rgba(249,248,246,1);
		position:relative;top:45px;overflow:hidden;
		height:240px;width:320px;margin:0px auto;padding:20px; 
		border: 1px solid #fff; padding-top:2px; padding-bottom:50px;
		border-radius: 3px;
		box-shadow: 0 0 2px #888, inset 0 1px 1px #fff;
		-webkit-transition: all 1s ease-in-out .3s;
		-moz-transition: all 1s ease-in-out .3s;
		-o-transition: all 1s ease-in-out .3s;
		transition: all 1s ease-in-out .3s;}


		#form_wrap:hover form { height:280px;}

		label {
			margin: 0px 5px 0 5px; 
			font-size: 11px;
			font-family: 'Oswald', Arial, sans-serif;
			color: #b3aba1; padding:0;
			text-transform: uppercase;
			letter-spacing:3px;
		}

		input[type=text], textarea {
			font-size: 11px;font-family: 'Armata', sans-serif;
			color: #7c7873;background:#F8F8F8; letter-spacing:1px;
			width: 310px; height:15px; margin:2px;
			border:1px solid #fbf9f6; font-weight:normal;
			box-shadow:inset 0 1px 1px rgba(0,0,0,0.1), 0 0 1px rgba(255,255,255,0.6);
		}
		span.required{
  			font-size: 11px !important;
  			color: red !important;
						}
	.errormsg {
  display: block;
  width:245px;
  height: 22px;
  line-height: 22px;
  color:red;
  font-family: 'Oswald', Arial, sans-serif;
  position:relative;
  background:rgba(255,255,255,.8);
  border-left:7px solid #ccc;
  border-top-right-radius:25px 25px;
  font-style:italic;
  letter-spacing:2px;
  font-size:12px;
  padding: 3px 10px 3px 30px;
  margin:0;
}

.msgSent {
  font-size: 15px;
  text-align: center;
  letter-spacing:2px;
  color:#560820;
}	

		textarea { height:40px;}

		textarea:focus, input[type=text]:focus {background:rgba(235,235,235,.35);}

		#form_wrap input[type=submit] {
			position:relative;font-family: 'Oswald', Arial, sans-serif;
			font-size:13px; color: #7c7873; margin-left:122px; margin-top:8px;
			width:77px; padding:7px; letter-spacing:2px; text-align:center;opacity:0;
			text-transform:uppercase;background:#F3F3F3; border-radius:3px; 
			border:1px solid #fff;cursor: pointer;
			box-shadow:inset 0 1px 1px rgba(0,0,0,0.1), 0 1px 1px rgba(255,255,255,0.9);
			-webkit-transition: opacity .6s ease-in-out 0s;
			-moz-transition: opacity .6s ease-in-out 0s;
			-o-transition: opacity .6s ease-in-out 0s;
			transition: opacity .6s ease-in-out 0s;
		}

		#form_wrap:hover input[type=submit] {z-index:1;opacity:1;
			-webkit-transition: opacity .5s ease-in-out 1.3s;
			-moz-transition: opacity .5s ease-in-out 1.3s;
			-o-transition: opacity .5s ease-in-out 1.3s;
			transition: opacity .5s ease-in-out 1.3s;}

			#form_wrap:hover input:hover[type=submit] {color:#111;}

/* ==|== print styles ======================================================= */
 
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } 
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } 
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}