html , body, main{
    min-height: 100% !important;
	height: 100%;
	margin: 0px;
}
.sticky {  
    position: fixed;  
    width: 100%;  
    left: 0;  
    top: 0;  
    z-index: 100;  
    border-top: 0;  
}  

div.main {
	width: 100%;
}
span.div-alert-count, span.div-alert-desc  {
    position: relative;
	vertical-align: middle;
	margin-top: 0px;
	margin-right: -3px;
	padding: 5px;
}

span.div-alert-desc {
	float: right;
	text-align: right;
}
span.div-alert-count {
	font-weight: bold;
	padding-right: 5px;
	float: right;
	text-align: right;
}

@media all and (max-width: 640px) {
    div.pb1 {
		height: 100%;
		width: 100%;
		
		-webkit-transform-origin: 0px 35px;
		-moz-transform-origin: 0px 35px;
		-ms-transform-origin: 0px 35px;
		transform-origin: 0px 35px;
		
		-webkit-transform: rotate(90deg) translate(-35px);
		-moz-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);		
	}
	div.progressValue{
		-webkit-transform-origin: 50% 50%;
		-moz-transform-origin: 50% 50%;
		-ms-transform-origin: 50% 50%;
		transform-origin: 50% 50%;
		
		-webkit-transform: rotate(180deg);
		-moz-transform: rotate(180deg);
		-o-transform: rotate(180deg);
		-ms-transform: rotate(180deg);
		transform: rotate(180deg);
		
		position: relative;		
		height: 100%;
		margin-top: -35px;
		line-height: 35px;
		text-align: center;
		vertical-align: middle;
		font-weight: bold;
		z-index: 1000;
	}	
	div.content {
		margin-left: 35px;
		margin-top: -35px;
	}
	
	#column1-wrap{
		height: 100%;
		width: 100%;
		-webkit-transform-origin: 0% 0%;
		-moz-transform-origin: 0% 0%;
		-ms-transform-origin: 0% 0%;
		transform-origin: 0% 0%;
		
		-webkit-transform: rotate(-90deg) translate(-770px);
		-moz-transform: rotate(-90deg);
		-o-transform: rotate(-90deg);
		-ms-transform: rotate(-90deg);
		transform: rotate(-90deg);
	}
	
	#column2{
		margin-left: 35px;
		margin-top: -35px;
	}
}

.hidden {
  position: absolute !important;
  top: -20em;
  left: -200em;
}

.focus {
  background-color: #eee !important;
}

button {
  background-color: #428bca
}

div.progressBase, div.progressIndicator {
	height: 100%;
	width: 100%;
}
div.progressValue{	
	position: relative;		
	height: 100%;
	line-height: 35px;
	margin-top: -35px;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	z-index: 1000;
}
div.progressBase  {
	position: relative;
	background-color: red;
	text-align: center;
	z-index: 100;
}
div.progressIndicator {
	position: relative;
	margin-top: -35px;
	background-color: green;
	z-index: 10;
}
div.pb1 {
	height: 35px;
	background-color: yellow;
	z-index: 1;
}

div.panel {
	margin-bottom: 0px;
}

#div-container-notes,  #div-panel-default,  #div-panel-danger,  #div-panel-warning,  #div-panel-info,  #div-panel-success{
	width: 100%;
	padding: 0px;
}
#div-panel-default {
	display: none;
}

.alert {
	padding: 0px;
}

.panel {
	border: 0px;
}

.btn-danger, .btn-warning, .btn-info, .btn-success {
	width: 100%;
}

#column2{
    background-color: cyan;
	height: 100%;
}
#column1, #column1-wrap{
	height: 35px;
	width: 100%;
}
#column1 {
	background-color: red;
	text-align: center;
}
#column1-wrap{
	position: relative;
    background-color: lime;
}
#clear{
    clear: both;
}