@import "variables";
//@import "base/base-reset";
@import "markup-mixins";

//@import "960";
@import "knacss/knacss";

@import "site/frontpage";
@import "site/elements";
@import "site/header";
@import "site/footer";
@import "site/code";

@import "site/docs";
@import "site/codeboard";
@import "site/download_product";
@import "site/custom";
@import "site/eiffel_org_nodes";
@import "site/removed";

body {
	font: 16px/24px "Open Sans", Arial, Helvetica, sans-serif; 
}
	
div#page {
	background: #0AA694 url(../images/bg-head.jpg);
}

.rss-block, #content{
	@include mask;
	padding-top: 20px;
	padding-bottom: 20px;
	&:after,
	&:before{
		position: absolute;
		width: 100%;
		height: 10px;
		content: '';
	}
	&:after{
		top: 1px;
		@include linear-gradient(#d1dae0, #f0f3f5);
	}
	&:before{
		bottom: 1px;
		@include linear-gradient(#f0f3f5, #d1dae0);
	}
}

/* Header */
#header{
	@extend %clearfix;
	@extend .grid;
	//@include grid(2);
	//background-color: black;
	background: url(../images/bg-header.jpg) no-repeat 100% 0;
	border-bottom: solid 1px #000;
	#nav {
		//background-color: green;
	}
	.add-links {
		//background-color: red;
	}
}

/* Jumbotron */

.jumbotron {
	@extend %clearfix;
	//background-color: #0AA694;
	padding: 20px;
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
}

/* Content */

div.container{
	@extend .mw1140p;
	margin-left: auto;
	margin-right: auto;
	@extend %clearfix;
}

#content{
	background-color: #fff;
	//background-color: #f00;
	border: none;
	>.container>.content{
		//@extend .one-half;
	}
//	&.with-first-sidebar, &.with-second-sidebar {
//		@include grid(9);
//	}
//	&.with-first-sidebar.with-second-sidebar {
//		@include grid(6);
//	}
	h1{
		color: $blue;
		margin: 1em 0 35px;
		letter-spacing: 2px;
		font: #{$base-h1-size}/#{$base-h1-lineheight} $museo_slab500;
		.ico{
			margin: 2px 10px 0 0;
			width: 21px;
			height: 21px;
			padding: 5px;
		}
	}

} /* #content */

#sidebar{
	border: none;
	@extend .one-fifth;
	//@include grid(3);
	padding: 0;
	//position: relative;
	//top: -3px;
	margin: 0px 2px 0 2px;
	&.holder{
		padding: 0 5px 5px 5px;
	}
	div.title, h2{
		color: $green-light;
		margin: 0 0 17px;
		padding: 0 0 15px;
		border-bottom: 1px solid #becbd3;
		font: #{$base-h2-size}/#{$base-h2-lineheight} $museo_slab500;
		a{
			color: $green-light;
			&:hover{
				color: $white;
			}
		}
	}
}

/* Footer */

#footer{
	@extend %clearfix;
	@extend .grid;
	background: $footer-bg-color;
	//@include mask;
	font-size: $base-footer-size;
	color: $footer-text-color;
}

a {
	color: #5082D9;
	text-decoration: none;
}