/*   ----------   Main Settings   ----------   */
		* {
			margin: 0px;
			padding: 0px;
			border: 0px;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;   
			box-sizing: border-box;
			-webkit-transition: all 0.25s ease; 
			-moz-transition: all 0.25s ease; 
			-ms-transition: all 0.25s ease; 
			-o-transition: all 0.25s ease;	
			transition: all 0.25s ease;
		}
		
		@font-face {
		  font-family: 'SourceSansPro_Regular';
		  src: url('../../media/SourceSansPro_Regular.woff') format('woff');
		}
		
		body {
			background: url(../../media/body-bg.png) #FBFBFA fixed;
			font-family: SourceSansPro_Regular, Calibri, Arial;
			font-size: 12pt;
		}
			
		h1	{
			font-size: 35pt;
			margin-top: 10px;
		}
		
		h2	{
			font-size: 19pt;
			margin-bottom: 0px;
			margin-top: 31px;
		}
		
		h3	{
			font-size: 15pt;
			margin-bottom: 0px;
			margin-top: 20px;
		}
		
		h4	{
			font-size: 13pt;
			margin-bottom: 10px;
			margin-top: 3px;
			color: #777;
		}
		
		@media all and (max-width: 679px) {
			body {
				font-size: 11pt !important;
			}
				
			h1	{
				font-size: 25pt !important;
			}
			
			h2	{
				font-size: 17pt !important;
			}
			
			h3	{
				font-size: 15pt !important;
			}
			
			h4	{
				font-size: 14pt !important;
			}
			
			input	{
				font-size: 11pt !important;
			}
		}
		
		p	{
			margin-top: 5px;
		}
		
		a	{
			color: inherit;
		}
		
		hr	{
			background-color: silver;
			width: 100%; height: 1px;
			position: relative;
			float: left;
		}
		
		input	{
			padding: 5px;
			height: 40px;
			font-size: 13pt;
			font-weight: bold;
			font-family: SourceSansPro_Regular, Calibri, Arial;
			border-radius: 4px;
			letter-spacing: 0.2pt;
		}
	
		
		.button {
			text-align: center;
			font-weight: bold;
			letter-spacing: 0pt;
			background: transparent;
			text-decoration: none;
		}
			.button:focus , button:focus {
				opacity: 0.75;
			}
			
		a.button, div.button {
			border-radius: 4px;
			padding: 10px;
			float: left;
			position: relative;
		}
		
		/* ------------ Amateur Grid System ------------ */
		
		.grid-3, .grid-2, .grid-1 {
			float: left;
			position: relative;
		}
	
		.grid-3 .button, .grid-2 .button, .grid-1 .button {
			margin: 8px 0px 0px 15px;
		}
		
		.grid-3 {
			width: 33.33333%;		
		}
		
		.grid-2 {
			width: 50%;		
		}
		
		.grid-1 {
			width: 100%;		
		}
		
	
		/*   ----------   Element Settings   ----------   */
		#loadingbar {
			width: 0%;
			height: 2px;
		}
		
		#wrapper {
			width: 680px;
			margin: 0px auto;
		}
		
		@media all and (max-width: 679px) {
			#wrapper {
				width: 450px;
			}
		}
		
		#main-box {
			width: 100%;
			box-shadow: 0px 0px 3px 0px #aaa;
			background: white;
			margin-top: 100px;
			padding: 12px;
			position: relative;
			float: left;
			border-radius: 3px;
		}
		
		
		
		#logo {
			width: 180px;
			height: 65px;
			margin: -38px auto 10px auto;
			padding: 0px;
			background: #f9f9f9 url('../../media/CT-Logo210.png') no-repeat;
			background-position: center;
			background-size: auto 50px;
			box-shadow: 0px 0px 3px 0px #aaa;
			border-radius: 3px;
		}		
			#logo a{
				width: 100%;
				height: 75px;
				display: block;
			}
		
		#url-input, #url-output {
			width: 100%;
			margin: 25px 0px 5px 0px;
		}
		
		#big-button {
			width: 50%;
			float: right;
			margin-top: 5px;
		}
		
		.big-button {
			width: 260px;
			float: right !important;
			margin: 25px 0px 5px 0px;
			height: 40px;
		}
		
		#miscellaneous {
			display: none;
		}
	
		footer {
			position: absolute;
			z-index: -1;
			bottom: 0px;
			width: 100%;
		}
			footer div {
				margin: 0px auto;
				padding: 15px;
				width: 100%;
				text-align: center;
				font-size: 10pt;
			}
			
		@media all and (max-width: 679px) {
			footer {
				display: none !important;
			}
		}
		
		/*   ----------   Color Styles   ----------   */		
		/* BLUE */
		.button.blue-style{
			border: 1px solid #6B87EE;
			color: #6B87EE;
		}
			.button.blue-style:hover	{
				background: #6B87EE;
				color: white;
				cursor: pointer;
			}
		
		input.blue-style {
				border: 1px solid #6B87EE;
			}	

			input.blue-style::selection {
				background: #6B87EE;
				color:white;
			}
			input.blue-style::-moz-selection {
				background: #6B87EE;
				color: white;
			}
			
		#loadingbar.blue-style{
			background: #6B87EE;
		}
		
		
		/* RED */
		.button.red-style	{
			border: 1px solid #D64541;
			color: #D64541;
		}
			.button.red-style:hover	{
				background: #D64541;
				color: white;
				cursor: pointer;
			}
		
		input.red-style {
				border: 1px solid #D64541;
			}	

			input.red-style::selection {
				background: #D64541;
				color:white;
			}
			input.red-style::-moz-selection {
				background: #D64541;
				color: white;
			}
		
		#loadingbar.red-style{
			background: #D64541;
		}
		
		
		/* GREEN */
		.button.green-style	{
			border: 1px solid #87D37C;
			color: #87D37C;
		}
			.button.green-style:hover	{
				background: #87D37C;
				color: white;
				cursor: pointer;
			}
		
		input.green-style {
				border: 1px solid #87D37C;
			}	

			input.green-style::selection {
				background: #87D37C;
				color:white;
			}
			input.green-style::-moz-selection {
				background: #87D37C;
				color: white;
			}	

	/* GRAY */
		.button.gray-style	{
			border: 1px solid #95A5A6;
			color: #95A5A6;
		}
			.button.gray-style:hover	{
				background: #95A5A6;
				color: white;
				cursor: pointer;
			}
		
		span.gray-style	{
			color: #999;
		}