Fixes QR Codes.

[rbdr/grita] / views / style.less

@text_color: #666;
@background_color: #fff;
@emphasis_color: #222;
@light_color: #999;
@lighter_color: #ccc;
@border_color: #eee;
@error_color: #ffebe8;
@success_color: #f0fff0;

@font_stack: "Helvetica Neue", Helvetica, Arial, sans-serif;

*{
	margin: 0;
	padding: 0;
}

img{
	border: 0;
}

body{
	color: @text_color;
	background-color: @background_color;
	text-align: center;
	font-size: .625em;
	font-family: @font_stack;
}

#wrapper{
	margin: 0 auto;
	width: 960px;
	text-align: left;
}

#header #logo{
	background-image: url(/images/logo.png);
	background-repeat: no-repeat;
	width: 460px;
	height: 212px;
	display: block;
	margin: 10px 250px;
}

#header #logomini{
	background-image: url(/images/logomini.png);
	background-repeat: no-repeat;
	width: 140px;
	height: 65px;
	display: block;
	margin: 10px 410px;
}

#header #logo span, #header #logomini span{
	display: none;
}

#header #description p{
	font-size: 1.4em;
	line-height: 1.8em;
	margin: 10px 170px;
	width: 620px;
	color: @light_color;
}

#body h1{
	margin: 20px 90px;
	font-size: 2.4em;
	color: @emphasis_color;
}

#body h2{
	margin: 20px 90px;
	font-size: 1.8em;
	color: @emphasis_color;
}

#body h3{
	margin: 20px 90px;
	font-size: 1.6em;
	color: @emphasis_color;
}

#body p{
	margin: 20px 90px;
	font-size: 1.6em;
	line-height: 2.4em;
	text-indent: 3em;
	text-align: justify;
}

#body ul, #body ol{
	margin: 20px 90px;
	font-size: 1.4em;
	line-height: 1.8em;
}

#body ul li p, #body ol li p{
	font-size: 1em;
	margin: 0;
	line-height: 1em;
	text-indent: 0;
}

#body ul li, #body ol li{
	margin-left: 80px;
}

#body blockquote{
	margin: 20px 170px;
	text-align: justify;
	border-left: 2px solid @border_color;
	padding-left: 5px;
}

#body blockquote blockquote{
	margin: 10px;
}

#body pre{
	margin: 20px 170px;
	border: 1px solid @lighter_color;
	background-color: @border_color;
	padding: 10px;
}

#body pre code{
	font-size: 1.6em;
	line-height: 1.8em;
}

#body blockquote p{
	margin: 5px 0;
	text-indent: 0;
	font-size: 1.4em;
	line-height: 1.8em;
}

hr{
	margin: 10px;
	border: 0;
	border-bottom: 1px solid @border_color;
}

#body #sharing{
	text-align: center;
}

#body input.title, #body input.url{
	border: 1px solid @lighter_color;
	font-size: 1.6em;
	padding: 5px;
	margin: 0 90px;
	width: 770px;
}

#body #sharing input.url{
	width: 290px;
	margin-bottom: 10px;
	margin-top: 10px;
}

#body textarea.text{
	border: 1px solid @lighter_color;
	font-size: 1.6em;
	padding: 5px;
	margin: 0 90px;
	resize: vertical;
}

#body input.submit{
	width: 150px;
	font-size: 4.8em;
	margin: 10px 410px;
	padding: 20px;
}

#body #errors{
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	padding: 10px;
	font-size: 1.4em;
	margin: 0 90px;
	width: 760px;
	background-color: @error_color;
}

#body #success{
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	padding: 10px;
	font-size: 1.4em;
	margin: 0 90px;
	width: 760px;
	background-color: @success_color;
}

.tooltip{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	display: none;
}

#footer{
	height: 100px;
}