/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/


/* Table of Contents:
 1. Base 1200 Grid
 2. Clearing
*/



/*==========================================================================
1. Base 1200 Grid
===========================================================================*/

.container-12 {
	position: relative;
	width: 1200px;
	margin: 0 auto;
	padding: 0;
}

.grid-1,
.grid-2,
.grid-3,
.grid-4,
.grid-5,
.grid-6,
.grid-7,
.grid-8,
.grid-9,
.grid-10,
.grid-11,
.grid-12 {
	float: left;
	display: inline;
	margin-left: 15px;
	margin-right: 15px;
}

.grid-13 {
	float: right;
	display: inline;
	margin-left: 15px;
	margin-right: 15px;

}


.dropdown {
  display: inline-block;
  position: relative;
}

.dd-button {
  display: inline-block;
  border: 1px solid gray;
  border-radius: 4px;
  padding: 10px 28px 10px 20px;
  background-color: #ffffff;
  cursor: pointer;
  white-space: nowrap;
}

.dd-button:after {
  content: '';
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  width: 0; 
  height: 0; 
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid black;
}

.dd-button:hover {
  background-color: #eeeeee;
}


.dd-input {
  display: none;
}

.dd-menu {
  position: absolute;
  top: 100%;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 0;
  margin: 2px 0 0 0;
  box-shadow: 0 0 6px 0 rgba(0,0,0,0.1);
  background-color: #ffffff;
  list-style-type: none;
  z-index:999;
 padding-left:10px;
}

.dd-input + .dd-menu {
  display: none;
} 

.dd-input:checked + .dd-menu {
  display: block;
} 

.dd-menu li {
  padding: 10px 20px;
  cursor: pointer;
  white-space: nowrap;
}

.dd-menu li:hover {
  background-color: #f6f6f6;
}

.dd-menu li a {
  display: block;
  margin: -10px -20px;
  padding: 10px 20px;
}

.dd-menu li.divider{
  padding: 0;
  border-bottom: 1px solid #cccccc;
}
/* Nested Column Classes
===========================================================================*/

.container-12 .alpha {
	margin-left: 0;
}

.container-12 .omega {
	margin-right: 0;
}

.container-12 .grid-1 {
	width: 70px;
}

.container-12 .grid-2 {
	width: 170px;
}

.container-12 .grid-3 {
	width: 270px;
}

.container-12 .grid-4 {
	width: 370px;
}

.container-12 .grid-5 {
	width: 470px;
}

.container-12 .grid-6 {
	width: 570px;
}

.container-12 .grid-7 {
	width: 670px;
}

.container-12 .grid-8 {
	width: 770px;
}

.container-12 .grid-9 {
	width: 870px;
}

.container-12 .grid-10 {
	width: 970px;
}

.container-12 .grid-11 {
	width: 1070px;
}

.container-12 .grid-12 {
	width: 1170px;
}

.container-12 .grid-13 {
	width: 500px;
}


/* Prefix Styles
===========================================================================*/

.container-12 .prefix-1 {
	padding-left: 100px;
}

.container-12 .prefix-2 {
	padding-left: 200px;
}

.container-12 .prefix-3 {
	padding-left: 300px;
}

.container-12 .prefix-4 {
	padding-left: 400px;
}

.container-12 .prefix-5 {
	padding-left: 500px;
}

.container-12 .prefix-6 {
	padding-left: 600px;
}

.container-12 .prefix-7 {
	padding-left: 700px;
}

.container-12 .prefix-8 {
	padding-left: 800px;
}

.container-12 .prefix-9 {
	padding-left: 900px;
}

.container-12 .prefix-10 {
	padding-left: 1000px;
}

.container-12 .prefix-11 {
	padding-left: 1100px;
}


/* Suffix Styles
===========================================================================*/

.container-12 .suffix-1 {
	padding-right: 100px;
}

.container-12 .suffix-2 {
	padding-right: 200px;
}

.container-12 .suffix-3 {
	padding-right: 300px;
}

.container-12 .suffix-4 {
	padding-right: 400px;
}

.container-12 .suffix-5 {
	padding-right: 500px;
}

.container-12 .suffix-6 {
	padding-right: 600px;
}

.container-12 .suffix-7 {
	padding-right: 700px;
}

.container-12 .suffix-8 {
	padding-right: 800px;
}

.container-12 .suffix-9 {
	padding-right: 900px;
}

.container-12 .suffix-10 {
	padding-right: 1000px;
}

.container-12 .suffix-11 {
	padding-right: 1100px;
}



/*==========================================================================
2. Clearing
===========================================================================*/

/* Self Clearing Goodness */
.container-12:after {
	clear: both;
	content: "\0020";
	display: block;
	height: 0;
	visibility: hidden;
}

/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
	content: '\0020';
	display: block;
	height: 0;
	overflow: hidden;
	visibility: hidden;
	width: 0;
}

.row:after,
.clearfix:after {
	clear: both;
}

/* You can also use a <br class="clear"> to clear columns */
.clear {
	clear: both;
	display: block;
	height: 0;
	overflow: hidden;
	visibility: hidden;
	width: 0;
}

.view-content:after {
	clear: both;
	content: '';
	display: block;
	width: 100%;
}