html, body {
	font-family: 'Open Sans', sans-serif;
	height:100%;
}
/* charts */
.charts {float:left;width:100%;text-align:center;margin-top:10px;}
.chart {position:relative;display:inline-block;margin:0 20px 25px 20px;}
.chart span {color:#fff;display:inline-block;font-size:40px;font-weight:800;position:absolute;top:29px;left:35px;}
.chart:first-child {margin-left:0;}
.chart:last-child {margin-right:0;}

#header {
	background-image: url(../img/headerbg.jpg);
	background-position: top center;
	background-attachment: fixed;
	color: white;
	min-height:100%;
	vertical-align: middle;
	width:100%;
	display:table;
	overflow:hidden;
}

.header-block {
	width:300px;
	vertical-align: middle;
	display:table-cell;
	overflow:hidden;
}
.container {
	max-width: 980px;
}

.text-right {
	text-align: right;
}
.move-down {
	position:absolute;
	bottom:-40px;
	text-align:center;
	color:#AAA;
	width:100%;
	height:80px;
}
.move-down i {
	background-color:white;
	width: 80px;
	border-radius: 80px;
	height: 80px;
	line-height: 50px;
}

.transparent {
	opacity: 0.5;
}

#info, #contact, #piecharts {
	padding-top: 75px;
	padding-bottom: 75px;
}

#credits {
	padding-top: 25px;
	padding-bottom: 25px;
	background-color:rgba(0, 0, 0, 0.1);
}

#piecharts {
	background-image:url(../img/pattern.png), url(../img/piebg.jpg);
	background-position: top -20px center;
	text-shadow: 1px 1px 2px #000;
}

#info h1, #piecharts h1, #contact h1 {
	text-align:center;
	margin:0;
	margin-bottom: 40px;
}
#info h1 small, #piecharts h1 small, #contact h1 small {
	font-size:14px;
	text-transform: uppercase;
}

.fa-custom {
	width: 100px;
	height: 100px;
	border-radius: 100px;
	border: solid 1px #AAA;
	color: #AAA;
	line-height: 50px;
}
.navbar {
	border-radius: 0;
	margin-bottom: 0;
	position:fixed;
	width:100%;
	z-index: 1000;
	transition: all .2s ease-in-out;
}

.navbar-default {
	border: none;
	background-color: transparent;
}

.navbar-default .navbar-nav > li > a {
	color: #AAA;
}
.navbar-default .navbar-nav > li > a:hover {
	color: #CCC;
}
.navbar-default .navbar-brand {
	color: white;
}
.navbar-default .navbar-brand:hover {
	color: #aaa;
}
.icon {
	width: 100px;
	height: 100px;
	border-radius: 100px;
	border: solid 2px #AAA;
	color: #AAA;
	line-height: 115px;
	margin:auto;
	transition: all .6s ease-in-out;
}
.icon:hover {
	color: #00AAFF;
	border: solid 2px #00AAFF;
	-webkit-transform: rotate(360deg);
}

.divider {
	width:50px;
	height: 2px;
	border-bottom: solid 1px #AAA;
	margin:auto;
	margin-bottom: 10px;
}

.back-to-top {
	cursor: pointer;
	position: fixed;
	bottom: 20px;
	right: 20px;
	display:none;
}
.table>tbody>tr>td, .table>tfoot>tr>td{
    vertical-align: middle;
}
@media screen and (max-width: 600px) {
    table#cart tbody td .form-control{
		width:20%;
		display: inline !important;
	}
	.actions .btn{
		width:36%;
		margin:1.5em 0;
	}
	
	.actions .btn-info{
		float:left;
	}
	.actions .btn-danger{
		float:right;
	}
	
	table#cart thead { display: none; }
	table#cart tbody td { display: block; padding: .6rem; min-width:320px;}
	table#cart tbody tr td:first-child { background: #333; color: #fff; }
	table#cart tbody td:before {
		content: attr(data-th); font-weight: bold;
		display: inline-block; width: 8rem;
	}
	
	
	
	table#cart tfoot td{display:block; }
	table#cart tfoot td .btn{display:block;}
	
}