style.css

/*** CSS v.2.0.1.7 ***/

/* Normalize */
@import url(normalize.css);


/* Fonts */
@import url(https://fonts.googleapis.com/css?family=Inconsolata:400,700|Open+Sans:400,700);

/* Common styles */
::-moz-selection { background: #EB4D2F ; color: #fff; text-shadow: none; }
::selection { background: #EB4D2F ; color: #fff; text-shadow: none; }
html {}
html, body { /*-webkit-tap-highlight-color: rgba(0,0,0,0);*/} 
body { min-width:750px; background:#fff; font-family: 'Open Sans', Helvetica, Verdana, Arial, sans-serif; font-size:14px; line-height:25px; color:#333;   }
	body.embedded {background:#fff; min-width:220px; }
	body.raw {background:#fff; min-width:220px; }
	
a, a:visited, a:hover, a:active { color:#EB4D2F ; text-decoration:none; outline: 0 !important }
input:focus, select:focus, textarea:focus, button:focus, a:focus, a:hover, a:active, 
input::-moz-focus-inner, select::-moz-focus-inner { outline: 0;}
code {font-family: 'Consolas', 'Inconsolata', monospace; font-size: 0.9em; line-height: 1;
    padding: 3px 4px 1px 4px;
    border-radius: 2px;
    vertical-align: middle;
    display: inline-block;
	margin-top: -3px;
	margin-left: 2px;
}
sup { font-family:Verdana; font-size:0.5em; vertical-align:middle}
.fl {float:left} .fr {float:right} .n {clear:both} .fix {overflow:hidden}
.prn {display:none} .app {display:none}
.hidden { display: none !important; visibility: hidden; }

img {vertical-align:middle}
	img.fl {margin:0 30px 20px 0}
	img.fr {margin:0 0 20px 30px}

hr { display: block;  height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
textarea { resize: none; -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; }
 pre {margin:0}
.btn {outline:none; border:0; margin:0; vertical-align:middle; -webkit-appearance:none; background:#EB4D2F ; padding:8px 15px; text-align:center; border-radius:5px; -webkit-border-radius:5px; white-space:nowrap } 
    .btn, a.btn, a.btn:visited, a.btn:active {display:inline-block; color:#fff !important; font-size: 14px; line-height:22px; font-weight:700; text-transform:uppercase}
	 a.btn:hover {background:#e7330f }
	.btn.pressed, a.btn.pressed {cursor:default}
	
.smaller {font-size:12px; line-height:20px;}
.placeholder { color:#aaa; }

h3 {font-size:19px; line-height:30px; font-weight:700; text-transform:uppercase; color:#EB4D2F; margin:10px 0 20px 0}

.wrapper {  padding:20px 80px; margin:0 auto;overflow:hidden }
	.raw .wrapper {padding:20px 40px}

.note {padding:10px 0; font-size:12px}

/* Footer */
.rights {text-transform:uppercase; font-size:11px; line-height:18px; color:#999; margin-top: 20px;}


#header {  }
	#header .editorwrapper {max-width:none !important; padding:0 60px 20px 60px}

.beta {margin:5px 0 0 0; font-weight:bold; font-size:15px; line-height:14px; text-align:center; color:#EB4D2F; max-width:142px; letter-spacing:1px}

.options-ctrl {
	float:right; font-weight:700; text-transform:uppercase; font-size:13px; 
}
.options-ctrl div {float: left; padding:10px 20px; }

	.theme img {width:19px; height:19px; vertical-align:middle;}
	.options { border-radius: 0 0 5px 5px; }
	.options img {width:19px; height:19px; vertical-align:middle; margin-right:3px}

.options-panel {
	display: none;
	padding: 30px 60px;
}
.options-panel .options-flex {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	margin: 0 auto;
}
.options-panel .options-flex .panel {
	flex: 0 1 250px;
	margin: 5px 60px 5px 0;
}
.options-panel .options-flex .panel:last-child {
	margin-right: 0;
}
.options-panel .options-flex .panel.theme-panel {
	flex: 0 1 130px;
}
.switch{position:relative;display:inline-block;width:35px;height:20px; vertical-align:middle; margin-right:3px}.switch input{display:none}.switch .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s;border-radius:20px}.switch .slider:before{position:absolute;content:"";height:12px;width:12px;left:4px;bottom:4px;background-color:white;-webkit-transition:.4s;transition:.4s;border-radius:50%}.switch .slider.locked{background-color:#f7b8b8 !important}.switch .slider.unsupported{background-color:#e6e6e6 !important}.switch .slider.unsupported:before{display:none}.switch input:checked+.slider{background-color:#EB4D2F}.switch input:focus+.slider{box-shadow:0 0 1px #EB4D2F}.switch input:checked+.slider:before{-webkit-transform:translateX(14px);-ms-transform:translateX(14px);transform:translateX(14px)}
	.dark .switch .slider {background-color:#444}

	.options-panel select {-webkit-appearance:none; -moz-appearance: none; appearance: none; text-indent: 0.01px;
		text-overflow: ''; width:100%; height:24px; border:0; border-radius:3px; -webkit-border-radius:3px; padding:2px 5px; display:inline-block }
			.options-panel select::-ms-expand { display: none;}

	.options-panel .title {
		display: block;
		text-transform: uppercase;
		font-weight: 700;
		font-size: 13px;
		margin-bottom: 3px;
	}
	.options-panel code {
		float: right;
		margin-top:5px;
	}
	.options-panel .description {
		font-size: 12px;
		line-height: 1.4;
		margin-bottom: 10px;
	}

.logo { float:left; width:20%; max-width:190px; text-align:left; margin:45px 0 0 0;}
	.logo.expanded {max-width:none !important; text-align:center}
	.logo img {width:100% !important; height:auto !important}
.raw .logo {width:200px !important; margin:20px 0; float:none}

.editor pre, .editor textarea, .result { font-family: 'Consolas', 'Inconsolata', monospace; font-size: 22px;  line-height: 26px !important; background:none !important;  }

.editor {float:left; margin:0; width:70%}
	.editor pre, .editor textarea { float:left; width:90%; padding:20px 35px; border:0; margin:25px 0 0 45px; overflow:none !important; white-space:pre-wrap !important; outline: none; font-size: 22px; /*min-height:50px*/  }
	.editor pre hr {  border:0; border-top:1px dashed #EB4D2F; height:1px; background:none; margin: 5px 0;}
	.editor textarea {overflow:hidden;/*white-space: nowrap !important;  overflow-x:auto !important*/ }
	.editor textarea.placeholder {font-size:28px; line-height:34px }
	
	
	.errormarker { position:relative; width: 0px; height: 0px;
border-bottom: 10px solid rgba(0, 0, 0, 0); border-top: 10px solid rgba(0, 0, 0, 0); border-left: 12px solid rgba(234, 77, 47, 0.9); /*width:4px; height: 22px; background: #EB4D2F; */ }
	
.result {display:none; float:left; margin:25px 0 0 0; width:90%; }
	.result .formatted {/*float:left; width:90%; */padding:10px 30px; white-space:nowrap; overflow:auto; }
	.result .lines { float: left; width:50px; overflow: hidden; padding:10px 0 5px 0 }
	.result .lineno {  padding: 0 0.5em 0 0; text-align: right; white-space: nowrap; }

	.result .indent4, .result .indent8 {display:inline-block; /*text-indent:-9999px; font-size:12px; height:26px; vertical-align:middle*/  }
		/*.result .indent4 { margin-left:4em } 
		.result .indent8 { margin-left:7.5em; margin-right:0.5em }*/
		.result .indent8 {margin-right:6px}

.reporting {float:left; padding:34px 0 0 0;  font-weight:700; text-transform:uppercase; font-size:13px;}
		.reporting img {width:20px; height:20px; vertical-align:middle}
		.reporting a {padding-left:3px;}

.topcontrols {text-align:right; margin-top:20px; display:none}

.controls { float:right; text-align:right; padding:30px 0 0 0  }
	.controls .smaller, .controls .smaller a, .controls .smaller a:hover, .controls .smaller a:visited {color:#808080; font-size:11px;}
	
	.copy, .btn.copy, .copyHTML, .btn.copyHTML, .copyRich, .btn.copyRich {background:#7F95A1; margin-right:10px; display:none}
	a.btn.copy:hover, a.btn.copyHTML:hover, a.btn.copyRich:hover {background:#698da0 }
	.reformat, .btn.reformat {display:none; margin-left:10px; }
	.editformula, .btn.editformula {display:none; margin-left:20px;}
	
	#run {font-size:16px !important; padding:10px 20px !important;}
	
#docxfile {display:none !important	 }

.errors {display:none; background:#EA4D2F; padding:10px 40px; color:#fff; font-size:16px; }
	.embedded .errors {display:block !important; padding:0; color:#EA4D2F; background:none; margin-top:25px}
		.embedded .errors .wrapper {padding:10px 30px; width:90% !important; margin:0}

		.errors a {
			color: #fff !important;
			font-weight: bold;
		}
	
/* Dark Theme */
body.dark { background: #1e1e1e; }
.dark header {background:#333; color:#fff;}
.dark code { background: #4d4d4d; color: #fff; }
.dark .editor pre, .dark .editor textarea { color:#fff; border-left: 4px solid #4d4d4d;  }
.dark .editor pre.placeholder, .dark .editor textarea.placeholder { color:#666; }
.dark .editor pre.readonly, .dark .editor textarea.readonly {color:#666}
.dark ::-webkit-input-placeholder { color:#666; }
.dark :-moz-placeholder { color:#666; }
.dark ::-moz-placeholder { color:#666; }
.dark :-ms-input-placeholder { color:#666; }

.dark .theme img { background:url(images/switch.png) no-repeat left top; background-size: 19px 38px;}
.dark .theme, .dark .theme a, .dark .theme a:hover, .dark .theme a:visited {color:#fff;}

.dark .htmlonly img { background:url(images/code.png) no-repeat left top; background-size: 19px 38px;}
.dark .htmlonly, .dark .htmlonly a, .dark .htmlonly a:hover, .dark .htmlonly a:visited {color:#fff;}
.dark .options-panel,
.dark .options.active { background:#222; }

.dark .options img { background:url(images/settings.png) no-repeat left top;background-size: 19px 38px;}
.dark .options, .dark .options a, .dark .options a:hover, .dark .options a:visited {color:#fff;}

.dark .options-panel .description { color: #777; }
.dark .options-panel select {background:#444 url(images/arrow-dark.png) no-repeat 95% center; color:#bbb;}

.dark .lines { border-right: 4px solid #4d4d4d; }
.dark .lineno {color:#4d4d4d; }

.dark .reporting img { background:url(images/bug-dark.png) no-repeat left top; background-size:21px 19px}
.dark .reporting, .dark .reporting a, .dark .reporting a:hover, .dark .reporting a:visited {color:#fff;}

.dark .controls {}
	.dark .controls a, .dark .controls a:active, .dark .controls a:visited, .dark .controls a:hover, .dark .topcontrols a, .dark .topcontrols a:active, .dark .topcontrols a:visited, .dark .topcontrols a:hover  {color:#eee}
	.dark .controls .pressed, .dark .controls a.btn:active, .dark .btn:active, .dark .topcontrols .pressed, .dark .topcontrols a.btn:active {background:#252525 !important}

.dark .result { color: #fff; }
.dark .result .Keyword {color:#0095ff !important; /* #28B4E1 */}
.dark .result .StringLiteral {color:#E44  !important;}
.dark .result .Number {color: #EE7F18 !important;}
.dark .result .Parenthesis {color:#636363 !important; /* #28B4E1 */}
.dark .result .Comment {color:#86C573 !important;}
.dark .result .Variable {color:#44e8e7 !important; /*#49b0af*/}
.dark .result .QueryParameter {color:#decd06 !important;}

.dark .result .indent8 { border-right:1px solid #4d4d4d; }
.dark .svcdesc, .dark .changes h4 { color: #f0f0f0}

/* Light Theme */
body.light { background:#fff;}
.light header {background:#eee; color:#333;}
.light code { background: #ccc; color: #333; }
.light .editor pre, .light .editor textarea { color:#333; border-left: 4px solid #ccc;  }
.light .editor pre.placeholder, .light .editor textarea.placeholder { color:#aaa; }
.light .editor pre.readonly, .light .editor textarea.readonly {color:#aaa}
.light ::-webkit-input-placeholder { color:#aaa; }
.light :-moz-placeholder { color:#aaa; }
.light ::-moz-placeholder { color:#aaa; }
.light :-ms-input-placeholder { color:#aaa; }


.light .theme img { background:url(images/switch.png) no-repeat left bottom; background-size: 19px 38px;}
.light .theme, .light .theme a, .light .theme a:hover, .light .theme a:visited {color:#333;}

.light .htmlonly img { background:url(images/code.png) no-repeat left bottom; background-size: 19px 38px;}
.light .htmlonly, .light .htmlonly a, .light .htmlonly a:hover, .light .htmlonly a:visited {color:#333;}

.light .options img { background:url(images/settings.png) no-repeat left bottom;background-size: 19px 38px;}
.light .options, .light .options a, .light .options a:hover, .light .options a:visited {color:#333;}
.light .options-panel,
.light .options.active {
	background: #e0e0e0
}

.light .options-panel .description { color: #999; }
.light .options-panel select {background:#eee url(images/arrow-light.png) no-repeat 95% center; color:#333;}

.light .linemode, .light .linemode a, .light .linemode a:hover, .light .linemode a:visited {color:#333;}

.light .lines { border-right: 4px solid #ccc; }
.light .lineno {color:#ccc; }

.light .reporting img { background:url(images/bug-light.png) no-repeat left top; background-size:21px 19px}
.light .reporting, .light .reporting a, .light .reporting a:hover, .light .reporting a:visited {color:#333;}

.light .controls {}
	.light .controls a, .light .controls a:active, .light .controls a:visited, .light .controls a:hover, .light .topcontrols a, .light .topcontrols a:active, .light .topcontrols a:visited, .light .topcontrols a:hover  {color:#666}
	.light .controls .pressed, .light .controls a.btn:active, .light .btn:active, .light .topcontrols .pressed, .light .topcontrols a.btn:active {background:#aaa !important}

.light .result .Keyword {color:#035aca !important; /* #0070FF */ }
.light .result .StringLiteral {color: #D93124 !important;}
.light .result .Number {color: #EE7F18 !important;}
.light .result .Parenthesis {color:#808080 !important; /* #969696 */}
.light .result .Comment {color:#39a03b !important; /* #108313 */}
.light .result .Variable {color:#49b0af !important;}
.light .result .QueryParameter {color:#dc419d !important;}

.light .result .indent8 { border-right:1px solid #ccc; }

/* Common network */
.network { background: #404040; color: #666; padding:20px 0; margin-top:10px; text-align: center; }
	.network .sites { padding:0; margin:0 auto; overflow:hidden; list-style: none;  }
		.network .sites li { list-style: none; margin:0; padding: 10px 20px 0 20px; display: inline-block; }
			.network .sites li img { height:38px; width:auto; opacity: 0.3; }
				.network .sites li img.selected, .network .sites li img:hover { opacity: 1; }

/* Home */
.svcdesc { float:left; width:55%; font-size:17px; line-height:30px; color:#777; }
	.svcdesc .smaller {color:#999; font-size:14px; line-height:22px; }
	.svcdesc .ulfl {overflow:hidden}
		.svcdesc .ulfl ul {float:left; width:40%; max-width:200px}

.changes {font-size:13px; line-height:24px; }
	.changes .rss {display:inline-block; margin:-5px 0 0 20px;}
	.changes h4 {margin:5px 0; color:#777; font-size:13px; line-height:21px }
	.change em {display:inline-block; margin-top:12px; font-size:13px}
	.change span {font-size:12px; line-height:17px; display:inline-block; margin:-10px 0 5px 0}
	.changes .expandable {display:none;}


/* Comments */
.comments { width:90%;  }
.comments .disqus-count {  display:none; }
	.comments .disqus-count.expanded { max-height: auto; }
    #disqus_thread { overflow: hidden; max-height:300px; }
		#disqus_thread.expanded { max-height: none; }
    .comments .disqus-alert{ display:none; position:absolute; text-align: center; left: 0; right: 0; margin: 0; padding: 0 30px; margin-top: 68px; font-size: 13px; line-height:20px; font-family: "Helvetica Neue", arial, sans-serif; color:#687a86; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
	.comments .disqus-more { display:none; position:absolute; margin-top: -50px; height: 45px; left:0; width:55%; background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 70%); background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%); background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%); text-align: center; font-size: 30px; padding-top:20px; }
		.dark .comments .disqus-more { background: -moz-linear-gradient(top, rgba(30,30,30,0) 0%, rgba(30,30,30,1) 70%); background: -webkit-linear-gradient(top, rgba(30,30,30,0) 0%,rgba(30,30,30,1) 70%); background: linear-gradient(to bottom, rgba(30,30,30,0) 0%,rgba(30,30,30,1) 70%);  }

	.comments .expand-comments { background: #fff; padding:10px 15px; font-family: "Helvetica Neue", arial, sans-serif; font-size: 12px; font-weight: 700; line-height: 1.2; color:#687a86 /*lighten(@disqus-color, 10%) */; border:2px solid #687a86 /*lighten(@disqus-color, 40%)*/; text-transform: uppercase; text-align: center; letter-spacing: 1px; cursor: pointer; border-radius: 1em; }
		.dark  .comments .expand-comments { background: #1e1e1e; color:#fff; border-color:#fff} 
		.comments .expand-comments:hover { color:#fff; background:#687a86 /*lighten(@disqus-color, 40%)*/;}
			.dark .comments .expand-comments:hover { color: #1e1e1e; background: #fff;}

.newsletter {font-size:14px; line-height:20px;}
	form {margin-top: 10px;}
	.newsletter #df-subscribe {-webkit-appearance:none; border:0; background: #f2f2f2; width: 60%;  margin:0; display:inline-block; vertical-align:middle; padding: 10px; font-size:15px;border-radius:3px; -webkit-border-radius:3px;}
	.newsletter #df-feedback { color:#EB4D2F; font-size:18px; line-height:26px; margin:20px 0 }
	.newsletter #df-subscribe-do {font-size:14px; padding:9px 15px}
	
.side { float:right; width:35%; color:#999; font-size:12px; line-height:19px }
.side .sam { margin:0 0 30px 0; }
.side .sam img { display: inline-block;}
.badge {margin:10px 0}
	
	.badge img {display:inline-block; padding:15px 15px 15px 15px;  -webkit-border-top-right-radius: 3px; -webkit-border-top-left-radius: 3px; -moz-border-radius-topright: 3px; -moz-border-radius-topleft: 3px; border-top-right-radius: 3px; border-top-left-radius: 3px; cursor:pointer}
		.badge img.active {background: #f2f2f2;}

	.badge pre {font-family: 'Inconsolata', 'Consolas', monospace; font-size:12px; line-height:16px;  padding: 15px; word-wrap:break-word;  max-width:90%; background: #f2f2f2; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; display:none }
		.badge pre.active {display:block} 
	

		
.embedded .badge {display:block; margin:5px 0 0 10px}
.embedded .result {display:block; float:none; line-height:1 !important; width:100% !important; margin:0}
	.embedded .result .formatted {padding:10px}

.terms { font-size:15px; line-height:24px ; text-align: left}

#bug-report-form { font-size:19px; line-height:28px; background:#fff url(images/bug-big.png) no-repeat 580px 20px; }

#bug-form input[type=text], #bug-form input[type=email], #bug-form textarea {-webkit-appearance:none; width:70%; height:30px; border:0; background:#f2f2f2; border-radius:3px; -webkit-border-radius:3px; padding:5px 10px; display:inline-block; margin:5px 0; color:#333 }
	#bug-form textarea {height:120px; margin:20px 0}

#bug-form label.error {font-size:14px; line-height:20px; color:#EA4D2F; display: inline-block;
margin: 0 0 0 20px;}

#bug-feedback { display:none; font-size:26px; line-height:38px; color:#EB4D2F; margin:20px 0 }

.dialog {display: none; position: fixed; top: 5%; left: 50%;  margin-left: -300px;  width: 600px;
             color: #333;  background:#fff; padding:30px; overflow:hidden; -webkit-overflow-scrolling: touch;  }		 

.jqmOverlay { background-color: #000; }
.fb-like {display:inline-block; margin-right:20px;}

/* Raw */
.raw .logo { max-width: 100%;}
.raw textarea {width:100%; height:150px; border:1px solid #ccc; font-size:15px; line-height:22px}
.raw select, .raw input[type=text]  {font-size:15px; line-height:22px; width: 200px; max-width: 100%;}
.raw label { display:inline-block; width:80px; }
.raw .terms { font-size:13px; line-height:22px; margin:20px 0 }

/* Cookie bar */
#cookie-bar .button {
	outline:none; border:0; vertical-align:middle; -webkit-appearance:none; background:#EB4D2F ; padding:8px 15px; text-align:center; border-radius:5px; -webkit-border-radius:5px; white-space:nowrap; font-size:12px; margin:15px 0 0 0; display: block;
	color:#fff !important; text-transform: uppercase;
}
#cookie-bar .button, #cookie-bar a.button, #cookie-bar a.button:visited, #cookie-bar a.button:active {display:inline-block; color:#fff !important; font-size: 14px; line-height:22px; font-weight:700; text-transform:uppercase}
 #cookie-bar a.button:hover {background:#e7330f }

/* Privacy */
.page-privacy {}

	.page-privacy p {margin:10px 0}
	.page-privacy h3 {font-size:20px; margin:45px 0 10px 0 }
		.page-privacy h3.title {font-size:30px; margin:10px 0 30px 0; color:#333}
	.page-privacy h4 {font-size:16px;  margin:30px 0 10px 0 }
	.page-privacy h5 {font-size: 16px;line-height: 22px;margin:15px; color:#444; }
	.page-privacy li div {margin-left:20px}
		.page-privacy li div.svc {padding:20px 20px 10px 20px; width:80%; margin-top:20px; border:1px solid #ccc; }
			.page-privacy li div.svc h4 {margin-top:0}
	.page-privacy table {border-collapse: collapse; width:100%; max-width: 700px}
	.page-privacy th, .page-privacy td {border:1px solid #666; padding:5px;}
	.page-privacy th {font-weight: bold; background: #ddd}

/* Logo Animation */
.anilogo { width:240px; margin:30px auto 0 auto; display: none;}
.anilogo .block { display:block; margin:8px 0; }
.anilogo .sublock { display:inline-block; background:#e14e37; height:35px; margin:0 4px; border-radius:2px; animation: 1.2s ease-out 0s infinite alternate; }
.anilogo .b1 { width:108px; animation-name: b1ani; }
.anilogo .b2 { width:44px; animation-name: b2ani; }
.anilogo .b3 { width:90px; animation-name: b3ani; }
.anilogo .b4 { width:28px; animation-name: b4ani;  }
.anilogo .b5 { width:56px; animation-name: b5ani; }

@keyframes b1ani {
  0% { margin-left:0; }
  70% { margin-left:-20px;}
  100% { margin-left:0;}
}
@keyframes b2ani {
  0% { margin-left:-45px; }
  40% { margin-left:10px;}
  80% {margin-left:4px;}
  100% {margin-left:-5px;}
}
@keyframes b3ani {
  0% { margin-left:0; }
 50% { margin-left:48px;}
 100% { margin-left:10px; }
}
@keyframes b4ani {
  0% { margin-left:-10px; }
  30% { margin-left:40px;}
  70% { margin-left:4px; }
  100% {margin-left:-30px; }
}
@keyframes b5ani {
  0% { margin-left:0; }
  70% { margin-left:30px;}
  100% { margin-left:60px; }
}

/* Media queries */
@media only screen and (max-width: 1150px) {
    .app {display:inline-block} .desk {display:none}
	.result {width:85%;  font-size:20px}
	.editor {width:80% !important}
    
}

@media only screen and (max-width : 960px) {
	
	.app {display:inline-block} .desk {display:none}
	.result {width:85%;  font-size:20px}
	.editor {width:80% !important}
	
}

@media only screen and (max-width : 768px) {
	
	.signup {background-image:url(images/signup-blurred.png) ;}
}

@media only screen and (max-width : 480px) {
	
	.signup .promo { max-width:100%; }
}


@media only screen and (max-width : 400px) {
	
}

@media only screen and (max-height : 320px) {

	
}


/* Retina adjustments */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
  
  
	.dark .theme img { background-image:url(images/switch@2x.png);  }
	.dark .htmlonly img { background-image:url(images/code@2x.png); }
	.dark .options img { background-image:url(images/settings@2x.png); }
	.dark .reporting img { background-image:url(images/bug-dark@2x.png); }
	

	.light .theme img { background-image:url(images/switch@2x.png); }
	.light .htmlonly img { background-image:url(images/code@2x.png);  }
	.light .options img { background-image:url(images/settings@2x.png); }
	.light .reporting img { background-image:url(images/bug-light@2x.png); }
	
	#bug-report-form {background-image:url(images/bug-big@2x.png);background-size:131px 124px }
}


/* Print style */
@media print {
 * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } 
  a, a:visited { text-decoration: none; }
 
  .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; }
  .app {display:inline-block} 
  .desk {display:none}
  .scr {display:none} 
  .prn {display:inline-block !important; visibility:visible}

}