html, body {
		padding:0px;
		margin:0px;
		height: 100%;
		width:100%;
	}

	header {
		text-align: center;
		padding:10px 0;
		background:#43ac6a;
		color:#fff;
	}
	header h3{ margin: 0; text-align: center; }

	textarea:focus {
		outline:none;
		border:none;
	}
	.codearea {
		width:100%;
		height:100%;
		min-height:300px;
	}
	.ad {
		text-align: center;
	}
	.ad img {
		width:100%;
	}
	.linedwrap {
		border: 1px solid #c0c0c0;
		width:100% !important;
	}

	.linedtextarea {
		padding: 0px;
		margin: 0px;
	}

	.linedtextarea textarea, .linedwrap .codelines .lineno {
		font-size: 10pt;
		font-family: monospace;
		line-height: normal !important;
	}

	.linedtextarea textarea {
		padding-right:0.3em;
		padding-top:0.3em;
		border: 0;
	}

	.linedwrap .lines {
		margin-top: 0px;
		float: left;
		overflow: hidden;
		border-right: 1px solid #c0c0c0;
		margin-right: 5px;
	}

	.linedwrap .codelines {
		padding-top: 5px;
		width:100%;
	}

	.linedwrap .codelines .lineno {
		color:#AAAAAA;
		padding-right: 0.5em;
		padding-top: 0.0em;
		text-align: right;
		white-space: nowrap;
		width:100%;
	}
	.linedwrap .codelines .lineno:nth-child(odd) {
		background:#eee;
	}

	.linedwrap .codelines .lineselect {
		color: red;
	}
	.workspace p {
		text-align: justify;
	}
	.workspace {
		position: relative;
	}
	.copy:hover {
		cursor: pointer;
		background:#ddd;
	}
	.copy {
		color:#008cba;
		position: absolute;
		top:45px;
		right:0px;
		padding:5px;
		background:#eee;
		margin:10px;
		display: none;
	}
	.workspace:hover .copy {
		display: block;
	}

	.how-it-works {
		width:100%;
		height:100%;
		background:#333333;
	}
	.clearfix {
		clear: both;
	}
	footer {
		text-align: center;
		padding:10px;
		background:#999999;
		color:#fff;
	}
	.section-title {
		background:#43ac6a;
		padding:30px 15px 30px 15px;
		width:100%;
		color:#fff;
		text-align: center;
	}
	nav .navbar-brand, nav a {
		font-size:24px;
	}

	.navbar-brand {
		line-height: 33px !important;
		vertical-align: middle  !important; 
	}
	nav {
		transition: all 0.25s ease;
	}
	nav.fixed {
		position: fixed;
		top:0px;
		width:100%;
		display: block;
		z-index: 1000;
	}
	nav.fixed .navbar-brand, nav.fixed a {
		font-size:12px;
	}
	nav .navbar-inverse {
		padding:30px 0px 30px 0px;
		transition: all 0.5s ease;
		margin:0px;
		background-color: #43ac6a;
		border-color: #43ac6a;
	}
	nav.fixed .navbar-inverse {
		padding:0px;
	}
	nav.fixed {
		border-bottom:3px solid #006687;
	}
	.bio {
		text-align: center;
	}

	.bio img {
		max-width:200px;
		max-height: 150px;
		margin:0px auto;
		-webkit-filter: grayscale(100%);
		-moz-filter: grayscale(100%);
		filter: grayscale(100%);
		transition: all 0.25s ease;
	}
	.bio img:hover {
		-webkit-filter: grayscale(0%);
		-moz-filter: grayscale(0%);
		filter: grayscale(0%);
	}
	.fixed .logo{
		max-width:80px;
		margin-top:-10px;
	}
	.logo {
		margin-top:-15px;
		width:100%;
		max-width:130px;
		margin-right: 10px
	}
	.smedia {
		position: fixed;
		bottom:50px;
		right:12px;
		transition: all 0.25s ease;
	}

	.smedia.fixed {
		bottom:150px;
	}
	.smedia ul {
		list-style: none;
		margin:0px;
		padding:0px;
	}
	.smedia ul li {
		margin-bottom:10px;
	}
	.smedia a {
		opacity: .5;
	}
	.smedia a:hover {
		opacity: .75;
	}
	.to-the-top {
		position: fixed;
		bottom:48px;
		right:25px;
		width:39px;
		height:39px;
		transition: all 0.25s ease;
		background:#eee;
		border:1px solid #ddd;
		border-radius: 50%;
	}
	.to-the-top.fixed {
		right:12px;
	}
	.to-the-top a {
		width:100%;
		height:100%;
		display: block;
		text-align: center;
		vertical-align: middle;
		line-height:45px;
		font-size:30px;
		color:rgba(46, 49, 51, 0.6);
	}
	.to-the-top a:hover {
		color:#111;
	}
	.vcenter {
		width:100%;
	}
	section.creators {
		position: relative;
	}
	.pt {
		position: absolute;
		top:50%;
	}
	.pb {
		margin-top:-50%;
		height:100%;
	}
	section.creators > div {
		height:100%;
	}
	html, body {
	}
	section {
		clear:both;
		min-height:500px;
		padding:30px 0px 30px 0px;
	}
	.big-img {
		width:100%;
		height:200px;
		background:#ddd;
		margin-bottom:30px;
	}

	.ad {
		margin-top:10px;
		background:#fff;
		padding:10px;
		text-align: center;
		font-size:30px;
	}
	.settings {
		border-bottom:1px solid #c0c0c0;
		border-left:1px solid #c0c0c0;
		border-right:1px solid #c0c0c0;
		
	}
	.settings_btn {
		text-align: center;
	}
	.settings button.a {
		padding:10px;

		display: inline-block;
		width:100%;
		height:100%;
	}
	.settings {
		padding:20px;
	}
	#settings {
		line-height: 100%;
		vertical-align: middle;
	}
	.settings form {
		height:0px;
		overflow: hidden;
		transition: all 0.25s ease;
	}
	.settings.open form {
		height:auto;
		margin-top:20px;
		padding-top:20px;
		border-top:1px solid #eee;
	}

	.btn-convert {

	}
	.btn-convert {
		font-size:20px !important;
		margin:0px auto !important;
		text-align: center !important;
		margin:15px 0px 15px 0px !important;
		display: inline-block !important;
		line-height: 100% !important;
		vertical-align: middle !important;
	}
	.btn-clear {
		font-size:20px !important;
		display: inline-block !important;
		line-height: 100% !important;
		vertical-align: middle !important;
	}
	.center {
		text-align: center;
	}
	
	.dropdown-delim {
		font-size:20px !important;
		display: inline-block !important;
		line-height: 100% !important;
		vertical-align: middle !important;
	}
	.col-hack-sm  button, .col-hack-sm .btn-group, .col-hack-sm  a {
		width:100% !important;
		display: block;
		margin:0px;
	}
	.push {
		padding:30px;
	}
	.push .btn {
		margin-top:0px !important;
		
	}
	
	.push {
		margin-top:150px !important;
	}

	section.maintext {
		min-height:0px;
		max-height:300px;
		text-align: center;
		padding-bottom: 0;
		padding-top: 0;
		margin-left: auto;
		margin-right: auto;
		max-width: 650px;
	}

	section.wraper {
		padding-top: 0;
		min-height: 630px;
	}

	h2 {
		text-align: center;
	}
	.big-img {
		border:1px solid #eee;
	}

	.big-img.programming {
		background-image:url(../img/php.png);
		background-repeat:no-repeat;
		background-size: cover;
	}
	.big-img.sql {
		background-image:url(../img/sql.png);
		background-repeat:no-repeat;
		background-size: cover;
	}
	.big-img.case {
		background-image:url(../img/css.png);
		background-repeat:no-repeat;
		background-size: cover;
	}
	.img-circle {
		border:1px solid #eee !important;
	}
	.uv-bottom-right {
		transition: all 0.25s ease !important;
		display: none !important;
	}
	.uv-bottom-right.fixed {
		bottom:110px !important;
	}
	.form-group {
		padding:10px;
		margin:0px 0px 0px 0px !important;
		border-bottom:1px solid #eee;
	}
	.settings .form-group:nth-child(odd) {
		background:#F8F8F8;
	}
	.lbl p {
		font-size:12px;
		font-style:italic;
	}
	.row .block {
		display: block;
		width: 100% !important;
	}
	.row .btn-group {
		width:100%;
	}
	.btn-group .col-xs-12 {
		margin:0px;
		padding:0px;
	}
	.options label {
		font-style:italic;
		font-size:10px;
	}
	.options {
		min-height:65px;
	}
	.options button {
		padding-left:0px !important;
		padding-right:0px !important;
	}

	.desktop {
		display: none;
	}

	.mobile {
		display: inherit;
	}

	.desktop img {
		max-width: 768px!important;
	}

	.mobile img {
		max-width: 300px!important;
	}
	@media screen and (max-width: 550px) {
		.text-primary {
			font-size:16px !important;
		}

		.push div {
			padding:0px !important;
			margin:0px  !important;
		}
	}
	@media screen and (max-width: 768px) {


		.text-primary {
			font-size:20px;
		}

		.push .btn {
			margin-top:0px !important;
			padding:10px 25% 10px 25% !important;
		}
		.col-hack-sm .push {
			padding:0px !important;
			padding-top:100px !important;
			margin:0px  !important;
		}
		.push .btn {
			margin-bottom:10px !important;
		}
	}
	@media screen and (min-width: 768px) {
		.col-hack {
			width:45% !important;
		}
		.col-hack-sm {
			width:10% !important;
		}

		.col-hack-sm  div {
			margin:0px;
			padding:0px;
		}
		.col-hack-sm  button, .col-hack-sm .btn-group, .col-hack-sm  a {
			width:100% !important;
			display: block;
			margin-bottom:10px !important;
		}
		.push {
			margin-top:66px !important;
		}
		.push .btn {
			margin-top:0px !important;
			padding:10px 25% 10px 25% !important;
		}

		.desktop {
		display: inherit;
		}

		.mobile {
			display: none;
		}

	}

ul.inline-btn {display: inline-block;padding: 0;width: 100%;}
ul.inline-btn li { display: inline-block; width: 31%; text-align: center; margin: 0; padding: 0;}
ul.inline-btn li a { background: #008cba; padding: 6px; margin: 0 !important;  color: #FFF;  border-radius: 2px;}
ul.inline-btn li a.active, ul.inline-btn li a:hover { background: #006d91; text-decoration: none;}