/* --- General */

html { height: 100%; }
html, body { min-height: 100%; }

body {
	font-family: Arial, Helvetica, sans-serif;
	position: relative;
	font-size: 13px;
	line-height: 1.4285;
}

.viewport {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	min-height: 100%;
	height: auto;
}

.wrapper {
	width: 1000px;
	margin: auto;
}

.footer {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
}



/* --- Images */

img {
	max-width: 100%;
	display: inline-block;
}

img.circle { border-radius: 50%;}
img.rounded-sm { border-radius: 5%; }
img.rounded-md { border-radius: 10%; }
img.rounded-lg { border-radius: 15%; }

img.outline { 
	border: 1px solid #CCC; 
	margin: 5px;
}



/* --- Notifications */

.notify {
	padding: 10px;
	margin: 20px 0;
	border: 1px solid #EEE;
	border-left-width: 5px;
	border-radius: 3px;
}

.nn-border { border-color: #337AB7; } /* Note (blue) */
.ns-border { border-color: #5CB85C; } /* Success (green) */
.nw-border { border-color: #F0AD4E; } /* Warning (yellow) */
.ne-border { border-color: #D9534F; } /* Error (red) */

.notify h4 {
	font-size: 16px;
	margin-top: 0;
	margin-bottom: 5px;
}

.nn-border h4 { color: #337AB7 }
.ns-border h4 { color: #5CB85C }
.nw-border h4 { color: #F0AD4E }
.ne-border h4 { color: #D9534F }

.nn-bg { background-color: #D9EDF7; } /* Note (blue) */
.ns-bg { background-color: #DFF0D8; } /* Success (green) */
.nw-bg { background-color: #FCF8E3; } /* Warning (yellow) */
.ne-bg { background-color: #F2DEDE; } /* Error (red) */



/* --- Headings */

/*

h1, .h1 { font-size: 36px; }
h2, .h2 { font-size: 30px; }
h3, .h3 { font-size: 24px; }
h4, .h4 { font-size: 18px; }
h5, .h5 { font-size: 14px; }
h6, .h6 { font-size: 12px; }

*/

h1 small, h1 .small,
.h1 small, .h1 .small,
h2 small, h2 .small,
.h2 small, .h2 .small,
h3 small, h3 .small,
.h3 small, .h3 .small,
h4 small, h4 .small,
.h4 small, .h4 .small,
h5 small, h5 .small,
.h5 small, .h5 .small,
h6 small, h6 .small,
.h6 small, .h6 .small {
	font-size: 65%;
	color: #777;
}



/* --- Alignment */

.l { float: left; }
.r { float: right; }
.c { clear: both; }

.tl { text-align: left; }
.tr { text-align: right; }
.tc { text-align: center; }
.tj { text-align: justify; }
.tnw { white-space: nowrap; }



/* --- Transformation */

.tuc { text-transform: uppercase; }
.tlc { text-transform: lowercase; }
.tcp { text-transform: capitalize; }

.overflow {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}



/* --- Blockquotes */

blockquote, 
.blockquote {
	padding: 10px 20px;
	margin: 0 0 20px;
	font-size: 17.5px;
	border-left: 5px solid #eee;
}

blockquote ol:last-child, 
.blockquote ol:last-child,
blockquote p:last-child, 
.blockquote p:last-child, 
blockquote ul:last-child, 
.blockquote ul:last-child {
	margin-bottom: 0;
}

blockquote .small,
.blockquote .small, 
blockquote footer, 
.blockquote footer,
blockquote small 
.blockquote small {
	display: block;
	font-size: 80%;
	line-height: 1.42857143;
	color: #777;
}

blockquote .small:before,
.blockquote .small:before, 
blockquote footer:before, 
.blockquote footer:before, 
blockquote small:before, 
.blockquote small:before {
	content: '&mdash; ';
}

blockquote.reverse,
.blockquote-reverse {
	padding-right: 15px;
	padding-left: 0;
	text-align: right;
	border-right: 5px solid #eee;
	border-left: 0;
}

blockquote.reverse .small:after, 
.blockquote-reverse .small:after,
blockquote.reverse footer:after,
.blockquote-reverse footer:after,
blockquote.reverse small:after,
.blockquote-reverse small:after {
	content: ' &mdash;';
}



/* --- Width Grid */

.w_10 { width: 10%; }
.w_20 { width: 20%; }
.w_25 { width: 25%; }
.w_30 { width: 30%; }
.w_33 { width: 33.33333333333333%; }
.w_40 { width: 40%; }
.w_50 { width: 50%; }
.w_60 { width: 60%; }
.w_66 { width: 66.66666666666666%; }
.w_70 { width: 70%; }
.w_75 { width: 75%; }
.w_80 { width: 80%; }
.w_90 { width: 90%; }
.w_100 { width: 100%; }



/* --- 12-Point Grid */

.g_1 { width: 8.33333333333333%; }
.g_2 { width: 16.66666666666666%; }
.g_3 { width: 25%; }
.g_4 { width: 33.33333333333333%; }
.g_5 { width: 41.66666666666666%; }
.g_6 { width: 50%; }
.g_7 { width: 58.33333333333333%; }
.g_8 { width: 66.66666666666666%; }
.g_9 { width: 75%; }
.g_10 { width: 83.33333333333333%; }
.g_11 { width: 91.66666666666666%; }
.g_12 { width: 100%; }



/* --- Pin-Grid */

.pin-grid {
	-webkit-column-count: 5;
	-webkit-column-gap: 10px;
	-webkit-column-fill: auto;
	-moz-column-count: 5;
	-moz-column-gap: 10px;
	-moz-column-fill: auto;
	column-count: 5;
	column-gap: 15px;
	column-fill: auto;
}

.pin-grid .pin {
	-webkit-column-break-inside: avoid;
	-moz-column-break-inside: avoid;
	column-break-inside: avoid;
}



/* --- Padding & Margining */

.p_a { padding: 15px; }
.p_l { padding-left: 15px; }
.p_r { padding-right: 15px; }
.p_t { padding-top: 15px; }
.p_b { padding-bottom: 15px; }

.m_a { margin: 15px; }
.m_l { margin-left: 15px; }
.m_r { margin-right: 15px; }
.m_t { margin-top: 15px; }
.m_b { margin-bottom: 15px; }

.ma { margin: auto; }



/* --- Responsive Video */

.resp_video {
	position: relative;
	width: auto;
	height: 0;
	padding-bottom: 56.25%;
	border: 1px solid #000;
}

.resp_video iframe {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	border: 0;
}



/* --- Table */

.table { display: table; }
.table-row { display: table-row; }
.table-cell { display: table-cell; }



/* --- Forms */

form .label,
.form .label {
	font-weight: bold;
	padding-bottom: 5px;
}

form .label i,
.form .label i,
form .label .required,
.form .label .required {
	font-style: normal;
	font-weight: bold;
	color:  #C00;
}

form .field,
.form .field {
	padding-bottom: 10px;
}

form .field input,
.form .field input,
form .field select,
.form .field select,
form .field textarea,
.form .field textarea {
	box-sizing: border-box;
}

form .field input[type="text"],
.form .field input[type="text"],
form .field input[type="password"],
.form .field input[type="password"],
form .field select,
.form .field select,
form .field textarea,
.form .field textarea {
	width: 100%;
	padding: 5px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
}

form .field textarea,
.form .field textarea {
	height: 100px;
}

.form .field input[type="checkbox"],
form .field input[type="checkbox"],
.form .field input[type="radio"],
form .field input[type="radio"] {
	vertical-align: middle;
	margin-top: 0;
}

form .hidden,
.form .hidden {
	display: none;
}

form .label .desc,
.form .label .desc,
form .field .desc,
.form .field .desc {
	font-size: 90%;
	font-weight: normal;
	color: #777;
}

form .field .desc,
.form .field .desc {
	display: block;
	padding-top: 3px;
}

form .field .static,
.form .field .static {
	font-weight: normal;
}

form input::-moz-placeholder,
.form input::-moz-placeholder,
form input:-ms-input-placeholder,
.form input:-ms-input-placeholder,
form input::-webkit-input-placeholder,
.form input::-webkit-input-placeholder {
	color: #999;
}


