
/*********************************************************************************/
/* Basic                                                                         */
/*********************************************************************************/

	body,input,textarea,select
	{
		line-height: 1.65em;
		font-size: 11pt;
	}

	header
	{
	}
	
		header h2
		{
			line-height: 1.4em;
			font-size: 1.5em;
		}

		header .byline
		{
		}

	/* Lists */

		ul.social
		{
			position: absolute;
			right: 0;
		}
	
			ul.social li:last-child
			{
				padding-right: 0;
			}

/*********************************************************************************/
/* Header                                                                        */
/*********************************************************************************/

	#header
	{
	}

		#header .container
		{
			position: relative;
			padding: 3em 0em 3em 0em;
		}

/*********************************************************************************/
/* Logo                                                                          */
/*********************************************************************************/

	#logo
	{
	}

		#logo h1
		{
			position: absolute;
			display: block;
			margin: 0;
			top: 0;
			font-size: 1.8em;
		}
		
			#logo h1 a
			{
				text-decoration: none;
				line-height: 3.5em;
				font-weight: 700;
				color: #FFF;
			}

/*********************************************************************************/
/* Nav                                                                           */
/*********************************************************************************/

	#nav
	{
		position: absolute;
		right: 0;
		top: 2.5em;
	}

		#nav > ul > li
		{
			float: left;
			padding: 0 1.2em 0 1.2em;
		}
		
			#nav > ul > li:last-child
			{
				padding-right: 0;
			}

			#nav > ul > li > a,
			#nav > ul > li > span
			{
				display: block;
				letter-spacing: 0.06em;
				text-decoration: none;
				font-weight: 600;
				font-size: 1.10em;
				outline: 0;
				color: #dadbde;
				color: rgba(255,255,255,0.65);
				-moz-transition: color 0.25s ease-in-out;
				-webkit-transition: color 0.25s ease-in-out;
				-o-transition: color 0.25s ease-in-out;
				-ms-transition: color 0.25s ease-in-out;
				transition: color 0.25s ease-in-out;
			}

			#nav li:hover a,
			#nav li:hover span
			{
				color: #fff;
			}

			#nav li.active a
			{
				padding-bottom: 5px;
				border-bottom: 2px solid #dadbde;
				border-bottom-color: rgba(255,255,255,0.75);
				color: #FFF;
			}

			#nav > ul > li > ul
			{
				display: none;
			}

	.dropotron
	{
		top: 0;
		text-align: left;
		line-height: 2em;
		min-width: 13em;
		background: #292C31;
		line-height: 1em;
		padding: 1em 0 1em 0;
		border-radius: 8px;
	}

		.dropotron a,
		.dropotron span
		{
			display: block;
			padding: 0.9em 1.70em;
			border-bottom: 0;
			font-size: 0.9em;
			text-decoration:  none;
			color: #DADBDE;
		}
		
		.dropotron li:first-child > a,
		.dropotron li:first-child > span
		{
			border-top: 0;
		}
	
		.dropotron li.active > a,
		.dropotron li.active > span,
		.dropotron li:hover > a,
		.dropotron li:hover > span
		{
			color: #FFF;
		}
	
	.dropotron.level-0
	{
		font-size: 1.1em;
		margin-top: 1.7em;
		border-top-left-radius: 0;
		border-top-right-radius: 0;
	}

		body.homepage .dropotron.level-0
		{
			margin-top: 1.5em;
			border-top-left-radius: 8px;
			border-top-right-radius: 8px;
		}

		.dropotron.level-0:before
		{
			content: '';
			position: absolute;
			top: -1.2em;
			left: 5.5em;
			width: 1.3em;
			height: 1.3em;
			border-bottom: solid 0.8em #2c2c2c;
			border-left: solid 0.8em rgba(0,0,0,0);
			border-right: solid 0.8em rgba(0,0,0,0);
		}

/*********************************************************************************/
/* Banner                                                                        */
/*********************************************************************************/

	#banner
	{
		margin-top: 4em;
		padding: 4em 0em 0em 0em;
		border-top: 1px solid rgba(255,255,255,0.15);
	}

		#banner header
		{
		}
		
			#banner header h2
			{
				padding: 0em 2em;
				line-height: 1.2em;
				letter-spacing: 0.03em;
				font-size: 2.8em;
			}

			#banner header span
			{
				padding-top: 1em;
				font-size: 1em;
			}

/*********************************************************************************/
/* Main                                                                          */
/*********************************************************************************/

	#main
	{
		padding: 6em 0em 4em 0em;
	}

/*********************************************************************************/
/* Content                                                                       */
/*********************************************************************************/

	#content
	{
	}
		
		#content header
		{
			margin-bottom: 2em;
		}
	
		#content header h2
		{
			font-size: 2em;
		}
		
		#content header .byline
		{
			font-size: 1.4em;
			font-weight: 300;
		}

		#content h3
		{
			padding: 2em 0em 1.5em 0em;
			font-size: 1.2em;
		}

/*********************************************************************************/
/* Sidebar                                                                       */
/*********************************************************************************/

	#sidebar
	{
	}
	
		#sidebar header 
		{
			margin-bottom: 2em;
		}

		#sidebar header h2
		{
			font-size: 1.4em;
		}
	
		#sidebar .button
		{
		}

/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/
	
	#footer
	{
		margin-top: 4em;
		padding-top: 6em;
	}
	
		#footer header
		{
			margin-bottom: 2.5em;
		}
		
		#footer .container
		{
		}
	
		#footer .image img
		{
		}

		#footer .image.featured
		{
			margin-top: 0.50em;
			margin-bottom: 2.5em !important;
		}
	
/*********************************************************************************/
/* Copyright                                                                     */
/*********************************************************************************/

	#copyright 
	{
		padding: 4em 0em;
	}
	
		#copyright .container
		{
			padding: 0.70em 0em 1.1em 0em;
		}
	
		#copyright span
		{
			font-size: 1em;
		}

/*********************************************************************************/
/* Featured                                                                      */
/*********************************************************************************/
	
	#featured
	{
		padding: 6em 0em;
	}
	
		#featured h3
		{
			margin-bottom: 1em;
			font-size: 1.5em;
		}
	
		#featured .pennant
		{
			/*margin-bottom: 1em;*/
			font-size: 6.5em;  /*3.kem*/
		}
		
		#featured .button
		{
			margin-top: 1em;
		}

/*********************************************************************************/
/* Device Image                                                                  */
/*********************************************************************************/

	#box1
	{
		height: 422px;
		margin-bottom: 4em;
	}		

	#box2
	{
		bottom: 0;
		left: 0;
		z-index: 2;
		margin-left: 26%;
		width: 417px;
		height: 422px;
		padding: 36px 35px 35px 35px;
		background: url(images/tablet-img.png) no-repeat center bottom;
	}
	
		#box2:after
		{
			content: '';
			position: absolute;
			display: block;
			width: 100%;
			height: 100%;
			top: 0;
			background: url(images/tablet-shadow.png) no-repeat center bottom;
		}
	
	#box3
	{
		position: absolute;
		right: 0;
		bottom: 0;
		z-index: 11;
		width: 282px;
		height: 272px;
		padding: 62px 28px 0px 28px;
		margin-right: 26%;
		background: url(images/mobile-img.png) no-repeat center bottom;
	}
	
		#box3:after
		{
			content: '';
			position: absolute;
			display: block;
			width: 100%;
			height: 100%;
			top: 0;
			background: url(images/mobile-shadow.png) no-repeat center bottom;
		}

		#box3:before
		{
			content: '';
			position: absolute;
			display: block;
			width: 100%;
			height: 100%;
			top: 0;
			left: -77px;
			background: url(images/shadow-bg02.png) no-repeat;
		}

/*********************************************************************************/
/* Slidertron                                                                    */
/*********************************************************************************/		
		
	#slider
	{
		width: 850px;
		height: 530px;
		margin: 3em auto 2em auto;
	}
	
		#slider .previous-button,
		#slider .next-button
		{
			position: absolute;
			top: 200px;
			width: 41px;
			height: 41px;
			background: #fff;
			background: rgba(255,255,255,0.3);
			border-radius: 100%;
			-moz-transition: background-color 0.25s ease-in-out;
			-webkit-transition: background-color 0.25s ease-in-out;
			-o-transition: background-color 0.25s ease-in-out;
			-ms-transition: background-color 0.25s ease-in-out;
			transition: background-color 0.25s ease-in-out;
		}

			#slider .previous-button:before,
			#slider .next-button:before
			{
				line-height: 43px;
			}

			#slider .previous-button:hover,
			#slider .next-button:hover
			{
				background: rgba(255,255,255,0.75);
			}

		#slider .previous-button
		{
			left: 30px;
		}
		
		#slider .next-button
		{
			right: 30px;
		}

		#slider .icon
		{
			display: inline-block;
			text-align: center;
			line-height: 41px;
			font-weight: 900;
			color: #25A7DB;
		}

		#slider .viewer
		{
			position: relative;
			top: 18px;
			width: 593px;
			height: 359px;
			margin: 0 auto;
		}
	
			#slider .viewer .reel
			{
			}

				#slider .viewer .reel .slide
				{
				}

					#slider .viewer .reel .slide img
					{
						display: block;
						width: 100%;
					}