@import url(http://fonts.googleapis.com/css?family=Dosis:400,700);

@font-face {
    font-family: 'RokkittRegular';
    src: url('fonts/rokkitt-fontfacekit/Rokkitt-webfont.eot');
    src: url('fonts/rokkitt-fontfacekit/Rokkitt-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/rokkitt-fontfacekit/Rokkitt-webfont.woff') format('woff'),
         url('fonts/rokkitt-fontfacekit/Rokkitt-webfont.ttf') format('truetype'),
         url('fonts/rokkitt-fontfacekit/Rokkitt-webfont.svg#RokkittRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
	background-color: #1E1E1E;
	background-image: url(../img/bg.png?V=3);
	background-repeat: repeat;
	background-position: top center;
	background-attachment:fixed;
	font-family: 'Dosis', 'Helvetica Neue', helvetica, sans-serif;
	position: relative;
	line-height: 1.75em;
	font-size:14px;
	text-shadow: 0 1px 1px rgba(0,0,0,0.9);
	color: #fff;
}

a,
a:link,
a:hover,
a:active {
	text-decoration: none;
}

a {
	color: rgb(148,217,29);
}

a:hover {
	color: #ddd;
}

a#lang {
 display:block;
 width:60px;
 background:#222;
 position:fixed;
 top:0;
 right:0;
 padding:10px;
 line-height:12px;
 font-size:12px;
 text-transform:uppercase;

	border:1px solid #2c2c2c;
	box-shadow: 0 1px 5px rgba(0,0,0,0.3);

	border-bottom-left-radius:6px;
}

a#lang:hover {
	background-color:#333;
}

h1,h2,h3,h4,h5,h6 {
	font-family: 'RokkittRegular', 'Helvetica Neue', helvetica, sans-serif;
	line-height:normal;
	font-weight: normal;
	text-shadow: 0 1px 2px rgba(0,0,0,1);
}

hr {
	height:0px;
	padding:0;
	border:0;
	border-top:1px solid rgba(0,0,0,0.15);
	border-bottom:1px solid rgba(255,255,255,0.08);
}

div#rainbowline {
	width: 100%;
	height: 4px;
	position: fixed;
	z-index:4;
	background-image: url(../img/rainbow_bg.png);
	background-repeat: repeat;
}

header {
	height: 130px;
		background-image: linear-gradient(top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 90%);
		background-image: -o-linear-gradient(top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 90%);
		background-image: -moz-linear-gradient(top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 90%);
		background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 90%);
		background-image: -ms-linear-gradient(top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 90%);
}

ul#mainmenu {
	text-align: center;
	z-index: 3;
}

ul#mainmenu li {
	display:inline-block;
}

ul#mainmenu a {
	text-align: center;
	display: inline-block;
	width: 110px;
	background-color: rgba(34,34,34,0.5);
	padding-top:110px;
	padding-bottom:4px;
	text-transform: uppercase;
	color: #fff;


	-webkit-transition-property: background-color, color;
	-webkit-transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-in-out;
	-webkit-transition-delay: 0;

	-moz-transition-property: background-color, color;
	-moz-transition-duration: 0.3s;
	-moz-transition-timing-function: ease-in-out;
	-moz-transition-delay: 0;

	-o-transition-property: background-color, color;
	-o-transition-duration: 0.3s;
	-o-transition-timing-function: ease-in-out;
	-o-transition-delay: 0;

	transition-property: background-color, color;
	transition-duration: 0.3s;
	transition-timing-function: ease-in-out;
	transition-delay: 0;

	position:relative;
	z-index: 3;


	border-radius: 4px;
}

ul#mainmenu a:hover, ul#mainmenu li.active a, ul#mainmenu.affix li.active a {
	background-color: rgb(148,217,29);
}

ul#mainmenu li.active a, ul#mainmenu.affix li.active a {
	box-shadow: 0px 0px 10px rgba(148,217,29, 0.6);
	color:#fff;
}

ul#mainmenu.affix {
	top:10px;
}
ul#mainmenu.affix a {
	background-color: rgba(34,34,34,0.2);
	padding: 4px 0;
	border-radius: 40px;

}

ul#mainmenu.affix a:hover {
	background-color: rgb(148,217,29);
}


div#home_logo_big {
	height: 97px;
	margin-bottom: 10px;
	background-image: url(../img/mooder_logo_big.png);
	background-position: center;
	background-repeat: no-repeat;
}

p#hometagline {
	font-size: 25px;
	color: rgba(0,0,0,0.99);
	font-family: 'Dosis', sans-serif;
		text-shadow: 0 1px 1px rgba(250,250,250,0.2);
		text-transform: uppercase;


}



a.nextstep {
	margin:0 auto;

	margin-top:-30px;
	border: 1px solid rgba(255,255,255,0.6);

		text-align: center;

		padding: 15px 30px;
		font-size: 22px;
		z-index: 2;

		border-radius: 40px;
		box-shadow: 0 2px 10px rgba(0,0,0,0.6);

		text-transform: uppercase;


		display:block;
		width:200px;

		position:relative;

		background: #94D91D;
		background-image: linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,222,52) 63%);
		background-image: -o-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,222,52) 63%);
		background-image: -moz-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,222,52) 63%);
		background-image: -webkit-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,222,52) 63%);
		background: -ms-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,222,52) 63%);

		color: rgba(0,0,0,0.8);
		text-shadow: 0 1px 0 rgba(255,255,255,0.6);


		-webkit-transition-property: all;
		-webkit-transition-duration: 0.6s;
		-webkit-transition-timing-function: ease-in-out;
		-webkit-transition-delay: 0;

		-moz-transition-property: all;
		-moz-transition-duration: 0.6s;
		-moz-transition-timing-function: ease-in-out;
		-moz-transition-delay: 0;

		-o-transition-property: all;
		-o-transition-duration: 0.6s;
		-o-transition-timing-function: ease-in-out;
		-o-transition-delay: 0;

		transition-property: all;
		transition-duration: 0.6s;
		transition-timing-function: ease-in-out;
		transition-delay: 0;
	}

	a.nextstep:hover {
		color: rgba(0,0,0,0.6);
		box-shadow: 0 0px 15px rgba(148,217,29,0.5);

		background-image: linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
		background-image: -o-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
		background-image: -moz-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
		background-image: -webkit-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
		background-image: -ms-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
	}


	a.nextstep:after {
	  content: "↓";
	  line-height:0;
	  display:block;
	  font-size:0px;

	  position: absolute;
		width: 22px;
		height:22px;
		left: 50%;
		margin-left: -11px;
		bottom: -12px;
		background-color: rgb(148,217,29);
		z-index: 1;
		border: 1px solid rgba(255,255,255,0.6);
		border-top:0;
		border-left:0;

		transform: rotate(45deg);
		-ms-transform: rotate(45deg); /* IE 9 */
		-webkit-transform: rotate(45deg); /* Safari and Chrome */
		-o-transform: rotate(45deg); /* Opera */
		-moz-transform: rotate(45deg); /* Firefox */
	}


	a.nextstep.top {
		background: #AFF23B;
		background-image: linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
		background-image: -o-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
		background-image: -moz-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
		background-image: -webkit-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
		background: -ms-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
	}

		a.nextstep.top:after {
	  content: "↓";
	  line-height:0;
	  display:block;
	  font-size:0px;

	  position: absolute;
		width: 22px;
		height:22px;
		left: 50%;
		margin-left: -11px;
		top: -12px;
		background: #AFF23B;
		z-index: 1;
		border: 1px solid rgba(255,255,255,0.6);
		border-bottom:0;
		border-right:0;

		transform: rotate(45deg);
		-ms-transform: rotate(45deg); /* IE 9 */
		-webkit-transform: rotate(45deg); /* Safari and Chrome */
		-o-transform: rotate(45deg); /* Opera */
		-moz-transform: rotate(45deg); /* Firefox */
	}

.formerror {
	color: #FF6F6F;
	font-size:14px;
	background:#5E1212;
	padding: 0.3em 1em;
	margin-top:-10px;
}

.formerror:after {
	  content: "↑";
}


/*******SECTIONS*******/
section {
	display:block;
	width: 100%;
	position: relative;

}

section small {
	font-size:13px;
}

section h1 {
	font-size: 4.5em;
}

section h2 {
	font-size: 3em;
}



section.children {
	background-image: radial-gradient(bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 100%);
	background-image: -o-radial-gradient(bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 100%);
	background-image: -moz-radial-gradient(bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 100%);
	background-image: -webkit-radial-gradient(bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 100%);
	background-image: -ms-radial-gradient(bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 100%);

	border-bottom:2px solid rgba(255,255,255,0.15);
	border-top:1px solid rgba(255,255,255,0.1);
}

strong {
}

.bigger {
	font-size: 32px !important;
	line-height:1.1em;
	font-family: 'Dosis', 'Helvetica Neue', helvetica, sans-serif;
}

.big {
	font-size: 24px !important;
	line-height:normal;
	font-family: 'Dosis', 'Helvetica Neue', helvetica, sans-serif;
}

section#home {
	margin-top: 0px;
	border-top:0;
	position:relative;
	z-index: 1;

	/****************/
	/*****************/
}

section#mooder, section#retail, section#display, section#proposals, section#features, section#contacts {
	margin-top: 100px;
	padding-top:90px;
	padding-bottom:50px;

	/**border-top: 40px solid rgba(0,0,0,0.5); /**/

	box-shadow: 0 -20px 100px 40px rgba(0,0,0,0.5);
}

.box {
	padding:0.8em;
	color: rgba(0,0,0,0.7);
	text-shadow:0 1px 1px rgba(255,255,255,0.8);
	font-family: 'RokkittRegular', 'Helvetica Neue', helvetica, sans-serif;
	font-size:126%;
	background-color:rgba(242,243,246,0.8);
	border-top:5px solid #777;
	line-height:1.2em;
}

#about_main_img {
	height:383px;
	width:940px;
}

/*****/
#mooder a#gallery {
	display:inline-block;
	background:rgba(0,0,0,0.3);
	font-family: 'Dosis', 'Helvetica Neue', helvetica, sans-serif;
	box-shadow:0 1px 20px rgba(0,0,0,0.5), 0 0 0px 5px rgba(255,255,255,0.2) inset;
	width:220px;
	height:220px;
	border-radius:50%;

	background:url(../img/bg_icon_gallery.jpg);


	-webkit-transition-property: color, background;
	-webkit-transition-duration: 0.6s;
	-webkit-transition-timing-function: ease-in-out;
	-webkit-transition-delay: 0;

	-moz-transition-property: color, background;
	-moz-transition-duration: 0.6s;
	-moz-transition-timing-function: ease-in-out;
	-moz-transition-delay: 0;

	-o-transition-property: color, background;
	-o-transition-duration: 0.6s;
	-o-transition-timing-function: ease-in-out;
	-o-transition-delay: 0;

	transition-property: color, background;
	transition-duration: 0.6s;
	transition-timing-function: ease-in-out;
	transition-delay: 0;
}

#mooder a#gallery:hover {
	color: #fff;
	background: #94D91D;
}

#mooder a#gallery p {
	display:block;
	padding-top:90px;
	font-size:40px;
	text-transform:uppercase;
	line-height:40px;
}
/****/

.videostrip {
	background:#0a0a0a;
	padding:10px 0 5px;
	border-radius: 5px;
}

#iconscontainer {
}

#retail_features .box {
	min-height:5em;
}

#display_features .box {
	min-height:13em;
}

#proposals_features .box {
	min-height:9em;

	padding-bottom:80px;
}

#proposals_features .btn {
	background: #aaa;
	color:#333;
	margin-top: -110px;
	padding:10px 20px;

	-webkit-border-radius:110px;
	-moz-border-radius:110px;
	border-radius:110px;

	-webkit-box-shadow: 0 0px 10px rgba(101,255,209,1);
	-box-box-shadow: 0 0px 10px rgba(101,255,209,1);
	box-shadow: 0 0px 10px rgba(255,255,255,1);

	font-weight:bold;
}

#proposals_features .btn:hover {
	background: #97F3D8;
	color:#0B8560;
	-webkit-box-shadow: 0 0px 20px #47FFC9;	
	-moz-box-shadow: 0 0px 20px #47FFC9;	
	box-shadow: 0 0px 20px #47FFC9;	
}


#contactformmessages {
	display:block;
	margin: 1em 0;
}



/***/
#omicron_contact img, #consonant_contact img {
	margin-bottom: 30px;
}
#omicron_contact a, #consonant_contact a {
	text-shadow: 0 1px 2px rgba(0,0,0,0.4);
}

#omicron_contact a {color: #ff57bc}
#consonant_contact a {color: #ffb93d}
/***/

.center {
	text-align: center !important;
}

.sectionseparator {
	position: absolute;
	height: 30px;
	bottom:0;
	width: 100%;
	z-index: 2 !important;
	margin-bottom: 0;

	background-image: linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
	background-image: -o-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
	background-image: -moz-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
	background-image: -webkit-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
	background-image: -ms-linear-gradient(bottom, rgb(148,217,29) 25%, rgb(175,242,59) 63%);
}

footer {
	display:block;
	width: 100%;
	height: 300px;
	margin-top: 100px;

	background-image: radial-gradient(bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 60%);
	background-image: -o-radial-gradient(bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 60%);
	background-image: -moz-radial-gradient(bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 60%);
	background-image: -webkit-radial-gradient(bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 60%);
	background-image: -ms-radial-gradient(bottom, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0) 60%);
}
	footer .container {
		background-image: url(../img/footerlogo.png);
		background-position: center bottom;
		background-repeat: no-repeat;
		height: 145px;
		height: 145px;
	}
	footer #rainbowline {
		position: absolute;
		bottom: 0;
	}


/*******END SECTIONS*******/

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1;}

.draggable { width:55px; height:55px; padding: 0.5em; float: left; margin: 2px; }
.droppable { border:3px solid #eee; width: 80px; height: 150px; padding: 0.5em; float: left; margin: 2px; }
.projector { width: 130px; height: 300px; padding: 0; float: left; margin-right: 30px; }

.active {
	border-color:#ccc;
}

.hover {
	border-color: green;
}


/****************************/
.uppercase {
	text-transform: uppercase;
}

.dosis {
	font-family: 'Dosis', sans-serif;
}
