/* ================================================== GLOBAL STYLES ================================================== */

html, body {
	padding: 0;
	margin: 0;
}

body {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	background: #222;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

iframe {vertical-align: top;}
canvas {position: fixed;}

.clear {clear: both;}

.btn-block + .btn-block {margin-top: 15px;}



/* ------------------------- SEPARATORS ------------------------- */
/* 
 * Usage: 
 *
 * Create a DIV and apply the class 'separator' to it - this will automatically display the smallest, dark separator
 * Additionally you can apply a size class like separator-l - this will then display the large, dark separator
 * Additionally you can apply a style class like separator-light - this will then display the large, light separator
 *
 */

/* General Separator Styling */
.separator {width: 100%; height: 20px; margin: 20px 0; float: left; clear: both; background: url(../img/separators.png) no-repeat center 0;}

/* Various Sizes for Separators */
.separator-s 	{background-position: center 0;}
.separator-m 	{background-position: center -20px;}
.separator-l 	{background-position: center -40px;}
.separator-xl 	{background-position: center -60px;}

/* Light/Dark Combinations for Separators */
.separator-s.separator-dark 	{background-position: center 0;}
.separator-m.separator-dark		{background-position: center -20px;}
.separator-l.separator-dark		{background-position: center -40px;}
.separator-xl.separator-dark	{background-position: center -60px;}

.separator-s.separator-light 	{background-position: center -80px;}
.separator-m.separator-light	{background-position: center -100px;}
.separator-l.separator-light	{background-position: center -120px;}
.separator-xl.separator-light	{background-position: center -140px;}


/* Forcing Standard Separators - can be overwritten by applying a more specific class to the specific element. */
#page-side .separator {background: url(../img/separators.png) no-repeat center 0px;}
#page-main .separator {background: url(../img/separators.png) no-repeat center -100px;}
#page-overlay .separator {background: url(../img/separators.png) no-repeat center -40px;}



/* ================================================== BASIC LAYOUT ================================================== */

/* ------------------------- BASIC LAYOUT >> GLOBAL ------------------------- */

.wrapper {float: left; position: relative;}

.inner {
	max-width: 100%;
	padding: 50px 30px; 
	float: left; 
	position: relative;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

.full .inner 	{width: 100%;}
.boxed .inner 	{background: rgba(0,0,0,0.75);}

#page-side .inner {width: 100%; padding: 0 30px;}

.row-fluid {margin: 0 0 50px 0;}
.row-fluid .row-fluid,
.row-fluid:last-child {margin: 0;}

.ua-ie-7 .inner {padding: 50px 0;}
.ua-ie-7 #page-side .inner {padding: 0;}

/* ------------------------- BASIC LAYOUT >> PAGE LAYOUT ------------------------- */
#page-side {width: 30%; position: fixed; top: 0; bottom: 0; left: 0; background: rgba(255,255,255,.9);}
#page-side .wrapper {position: absolute; top: 0; bottom: 0;}
#page-main {width: 70%; position: absolute; top: 0; bottom: 0; right: 0;}

/* ------------------------- PAGE OVERLAY ------------------------- */
#page-overlay {
	width: 70%; 
	position: fixed; 
	top: 0; 
	bottom: 0; 
	right: -70%; 
	z-index: 99; 
	opacity: 0;
	overflow: auto;
	background: rgba(255,255,255,.90); 
	-webkit-overflow-scrolling: touch;
}

#page-overlay .close {
	width: 40px; 
	height: 40px; 
	position: absolute;
	top: 0;
	right: 0; 
	z-index: 101; 
	color: #333; 
	line-height: 40px; 
	text-align: center; 
	text-shadow: none; 
	opacity: 1;
	 
	background: #822d10;
	background: rgba(138, 186, 86, 1);
	
	-webkit-transition: all .1s linear;
	-moz-transition: all .1s linear;
	-ms-transition: all .1s linear;
	-o-transition: all .1s linear;
	transition: all .1s linear;
}

#page-overlay .close:hover {
	color: #EEE; 
	background: rgba(108, 156, 56, 1);
}

/* Page Overlay >> Content Styles */
#page-overlay .heading,
#page-overlay .subheading {color: #333;}

#page-overlay .post-image  {margin: 0;}
#page-overlay .post-image img {border: 1px solid #CCC;}

#page-overlay p {color: #333;}
#page-overlay h4 {color: #333;}


/* ------------------------- BASIC LAYOUT >> SECTION & WIDGETS ------------------------- */

/* each section and widget consits of 3 parts:
 * -) header - where the title (and subtitle) is
 * -) body - where the main content of this specific section or widget is
 * -) footer - where some additional releated stuff is
 *
 * usually the header and footer aren't necessary, but the body is.
 */

.header,
.body,
.footer {
	width: 100%;
	padding: 0 20px;
	float: left;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

.header {padding: 0 20px 50px 20px;}
.footer {padding: 50px 20px 0 20px;}


.ua-ie-7 .header,
.ua-ie-7 .body,
.ua-ie-7 .footer {
	padding: 0;
}

.ua-ie-7 .header {padding: 0 0 50px 0; float: none;}
.ua-ie-7 .footer {padding: 50px 0 0 0;}

/* ================================================== SECTIONS ================================================== */

/* ------------------------- SECTIONS >> GLOBAL ------------------------- */
#main{width: 100%; margin: 0 auto;}

.section {
	width: 100%;
	padding: 0 50px; 
	float: left;  
	position: relative;
	 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}
.section > img {position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: -9999;}

.slider-wrapper {width: 100%; float: left; margin: 0 0 20px 0; border: none;}


.ua-ie-7 .section {padding: 0;}

/* ------------------------- SECTIONS >> ABOUT ------------------------- */
.milestone {float: left; padding: 0 0 20px 55px; margin: 0 0 0 30px; position: relative; border-left: 2px solid rgba(138, 186, 86, 1);}

.milestone p {color: #CCC;}

.milestone .date {
	width: 60px; 
	height: 60px; 
	position: absolute; 
	top: 0;
	left: -30px; 
	color: rgba(88, 136, 36, 1); 
	font-size: 18px;
	text-shadow: 0 -1px 2px rgba(0,0,0,0.5), 0 1px 2px rgba(255,255,255,0.5);
	text-align: center; 
	line-height: 66px;
	background: rgba(138, 186, 86, 1);
	 
	-webkit-border-radius: 30px; 
	-moz-border-radius: 30px; 
	-ms-border-radius: 30px; 
	-o-border-radius: 30px; 
	border-radius: 30px; 
}

.milestone:last-child {padding: 0 0 0 55px;}



/* ------------------------- SECTIONS >> POSTS ------------------------- */
#blog-section .inner .body {padding: 0;}

.posts {padding: 0; margin: 0; float: left; list-style: none; overflow: visible;}

.posts .post {
	width: 30%;
	padding: 0;
	margin: 35px 20px 25px;
	float: left;
	position: relative;
	
	background: #EEE;
	background: rgba(255,255,255,.9);

	-webkit-border-radius: 4px; 
	-moz-border-radius: 4px; 
	-ms-border-radius: 4px; 
	-o-border-radius: 4px; 
	border-radius: 4px; 
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

.posts .post-header {width: 100%; padding: 50px 0 0 0; float: left; position: relative; text-align: center;}
.posts .post-header h4 {color: #666; font-weight: 300; text-align: center;}

.posts .post-image {
	width: 100%;
	height: 140px;
	margin: 20px 0;
	float: left;
	overflow: hidden;
	
	border-top: 1px solid #DDD;
	border-bottom: 1px solid #DDD;
	
	background: #FFF; 
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

.posts .post-image img {
	width: 100%;
	
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
	
	-webkit-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-ms-transition: all .5s linear;
	-o-transition: all .5s linear;
	transition: all .5s linear;
}

.posts .post-header .date {
	width: 70px; 
	height: 62px;
	margin: 0 0 0 -35px;
	padding: 8px 0 0 0; 
	display: block;
	position: absolute;
	top: -35px;
	left: 50%; 
	z-index: 2;
	text-align: center; 
	
	background: rgba(138, 186, 86, 1);
	 
	-webkit-border-radius: 100px; 
	-moz-border-radius: 100px; 
	-ms-border-radius: 100px; 
	-o-border-radius: 100px; 
	border-radius: 100px; 
	
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,.25);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,.25);
	-ms-box-shadow: 0 0 5px rgba(0,0,0,.25);
	-o-box-shadow: 0 0 5px rgba(0,0,0,.25);
	box-shadow: 0 0 5px rgba(0,0,0,.25);
}

.posts .post-header .date span {
	width: 100%; 
	float: left; 
	margin: 0; 
	display: block; 
	text-align: center; 
	line-height: normal;
	color: rgba(88, 136, 36, 1); 
	text-shadow: 0 -1px 2px rgba(0,0,0,0.5), 0 1px 2px rgba(255,255,255,0.5);
}

.posts .post-header .date .day {font-size: 20px;}
.posts .post-header .date .month {font-size: 12px;}
.posts .post-header .date .year {font-size: 10px;}


.posts .post-body {
	width: 100%; 
	padding: 0 20px 30px; 
	float: left; 
	position: relative;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;

}
.posts .post-body p {float: left; color: #777;}

.posts .post .readmore-button {
	width: 50px; 
	height: 50px;
	margin: 0 0 0 -25px;
	display: block;
	position: absolute;
	bottom: -25px;
	left: 50%;
	z-index: 2;
	color: rgba(108, 156, 56, 1);
	font-size: 20px;
	text-align: center;
	line-height: 50px; 
	text-shadow: 0 -1px 2px rgba(0,0,0,0.5), 0 1px 2px rgba(255,255,255,0.5);
	background: rgba(138, 186, 86, 1); 
	
	-webkit-border-radius: 100px; 
	-moz-border-radius: 100px; 
	-ms-border-radius: 100px; 
	-o-border-radius: 100px; 
	border-radius: 100px; 
	
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,.25);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,.25);
	-ms-box-shadow: 0 0 5px rgba(0,0,0,.25);
	-o-box-shadow: 0 0 5px rgba(0,0,0,.25);
	box-shadow: 0 0 5px rgba(0,0,0,.25);
	
	-webkit-transition: all .1s linear;
	-moz-transition: all .1s linear;
	-ms-transition: all .1s linear;
	-o-transition: all .1s linear;
	transition: all .1s linear;
}

.posts .post:hover .readmore-button {
	color: #EEE; 
	
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,.5);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,.5);
	-ms-box-shadow: 0 0 5px rgba(0,0,0,.5);
	-o-box-shadow: 0 0 5px rgba(0,0,0,.5);
	box-shadow: 0 0 5px rgba(0,0,0,.5);
}

.posts .post .readmore-button:hover {
	color: #FFF; 
	
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,.75);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,.75);
	-ms-box-shadow: 0 0 5px rgba(0,0,0,.75);
	-o-box-shadow: 0 0 5px rgba(0,0,0,.75);
	box-shadow: 0 0 5px rgba(0,0,0,.75);
}

.posts .post:hover .post-image img {
	width: 120%;
	
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}

/* More Info Link */
.more-info-link {
	width: 40px; 
	height: 40px;
	margin-left: -20px; 
	margin-bottom: -17px;
	display: block; 
	position: absolute;
	left: 50%;
	bottom: 0;
	text-align: center;
	 
	background: #822d10;
	 
	-webkit-border-radius: 20px; 
	-moz-border-radius: 20px; 
	-ms-border-radius: 20px; 
	-o-border-radius: 20px; 
	border-radius: 20px; 
}

.more-info-link i {
	color: rgba(108, 156, 56, 1); 
	font-size: 20px;
	line-height: 40px;
	text-shadow: 0 -1px 2px rgba(0,0,0,0.5), 0 1px 2px rgba(255,255,255,0.5);
}

/* Pagination */
.pagination,
.flex-control-paging {
	width: 100%;
	float: left;
	padding: 20px 0 0;
	float: left;
	text-align: center;
}

.flex-control-paging li {
	margin: 0 ; 
}

.pagination a,
.flex-control-paging li a {
	width: 20px; 
	height: 20px; 
	margin: 0 5px; 
	display: inline-block; 
	text-decoration: none; 
	line-height: 22px;
	font-size: 10px;
	color: #CCC; 
	
	background: rgba(138, 186, 86, .5);
	
	-webkit-border-radius: 15px; 
	-moz-border-radius: 15px; 
	-ms-border-radius: 15px; 
	-o-border-radius: 15px; 
	border-radius: 15px; 
	
	transition: all .1s linear;
}

.flex-control-paging li a:hover {
	color: #FFF; 
	background: rgba(138, 186, 86, .7);
}

.pagination .selected,
.flex-control-paging li a.flex-active {
	color: #FFF; 
	background: rgba(138, 186, 86, .9);
}

/* ------------------------- SECTIONS >> PORTFOLIO ------------------------- */

/* Filters */
#filters {
	position: absolute;
	top: 100px;
	right: 50px;
}

.filter-set {float: left; margin: 0 0 0 20px !important;}

/* Basic Grid */
.grid {
    width: 100%;
    margin: 0;
    padding: 0;
	float: left;
    display: block;
    list-style: none;
    text-align: center;
}
 
.grid:after,
.item:before {
    content: '';
    display: table;
}
 
.grid:after {
    clear: both;
}
 
.grid .item {
	width: 240px;
	height: 240px;
    margin: 0 40px 30px 0;
	float: left;
    display: inline-block;
	
	-webkit-border-radius: 300px; 
	-moz-border-radius: 300px; 
	-ms-border-radius: 300px; 
	-o-border-radius: 300px; 
	border-radius: 300px; 

    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.grid .item 		{background-size: 150%;}
.grid .item:hover 	{background-size: 200%;}

.grid .item .item-inner {
    width: 100%;
    height: 100%;
    position: relative;
    cursor: default;
	
	-webkit-border-radius: 300px; 
	-moz-border-radius: 300px; 
	-ms-border-radius: 300px; 
	-o-border-radius: 300px; 
	border-radius: 300px; 
	
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.grid .item .info {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    opacity: 0;
	
	-webkit-border-radius: 300px; 
	-moz-border-radius: 300px; 
	-ms-border-radius: 300px; 
	-o-border-radius: 300px; 
	border-radius: 300px; 
	
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

.grid .item .info h3 {
    padding: 80px 0 10px 0;
    margin: 0 10px;
    color: #FFF;
    text-transform: uppercase;
    letter-spacing: 1px;
	line-height: normal !important;
    font-size: 22px;
    text-shadow: 0 0 1px #FFF, 0 1px 2px rgba(0,0,0,0.3);
}

.grid .item .info p {
    padding: 10px 5px;
    margin: 0 10px;
    color: #FFF;
    font-style: italic;
    font-size: 12px;
    border-top: 1px solid rgba(255,255,255,0.5);
}


.grid .item .info .button {
	width: 50px;
	height: 50px;
	padding: 0;
	margin: 20px 0 20px -25px;
	display: block;
	position: absolute;
	bottom: -100px;
	left: 50%;
	color: #FFF;
	font-size: 26px;
	line-height: 50px;
	text-align: center;
    background: rgba(0, 0, 0, 0.3);
	
	-webkit-border-radius: 25px; 
	-moz-border-radius: 25px; 
	-ms-border-radius: 25px; 
	-o-border-radius: 25px; 
	border-radius: 25px; 
	
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.grid .item:hover .button {
	bottom: 10px;
}

/* Effect Zoom */
.effect-zoom .item .item-inner {
	float: left; 
	overflow: hidden; 
	
	-webkit-box-shadow: inset 0 0 0 16px rgba(0,0,0,0.5), 0 1px 2px rgba(0,0,0,0.1);
	-moz-box-shadow: inset 0 0 0 16px rgba(0,0,0,0.5), 0 1px 2px rgba(0,0,0,0.1);
	-ms-box-shadow: inset 0 0 0 16px rgba(0,0,0,0.5), 0 1px 2px rgba(0,0,0,0.1);
	-o-box-shadow: inset 0 0 0 16px rgba(0,0,0,0.5), 0 1px 2px rgba(0,0,0,0.1);
	box-shadow: inset 0 0 0 16px rgba(0,0,0,0.5), 0 1px 2px rgba(0,0,0,0.1);
}

.effect-zoom .item .info {
	background: rgba(138, 186, 86, 0.8);
}

.effect-zoom .item .info p {
	opacity: 0; 
	
	-webkit-transition: all .5s ease-in-out 0.2s;
	-moz-transition: all .5s ease-in-out 0.2s;
	-ms-transition: all .5s ease-in-out 0.2s;
	-o-transition: all .5s ease-in-out 0.2s;
	transition: all .5s ease-in-out 0.2s;
}

.effect-zoom .item:hover {
	-webkit-box-shadow: inset 0 0 0 1px rgba(255,255,255,0.1), 0 1px 2px rgba(0,0,0,0.1);
	-moz-box-shadow: inset 0 0 0 1px rgba(255,255,255,0.1), 0 1px 2px rgba(0,0,0,0.1);
	-ms-box-shadow: inset 0 0 0 1px rgba(255,255,255,0.1), 0 1px 2px rgba(0,0,0,0.1);
	-o-box-shadow: inset 0 0 0 1px rgba(255,255,255,0.1), 0 1px 2px rgba(0,0,0,0.1);
	box-shadow: inset 0 0 0 1px rgba(255,255,255,0.1), 0 1px 2px rgba(0,0,0,0.1);
}

.effect-zoom .item:hover .info {
	opacity: 1;
	
	-webkit-transform: scale(1); 
	-moz-transform: scale(1); 
	-ms-transform: scale(1); 
	-o-transform: scale(1); 
	transform: scale(1); 
}
.effect-zoom .item:hover .info p {
	opacity: 1;
}

/* Effect Shutter */
.effect-shutter .item .item-inner {
	-webkit-box-shadow: inset 0 0 0 0 rgba(138, 186, 86, 0.8), inset 0 0 0 16px rgba(0,0,0,0.6), 0 1px 2px rgba(0,0,0,0.1);
	-moz-box-shadow: inset 0 0 0 0 rgba(138, 186, 86, 0.8), inset 0 0 0 16px rgba(0,0,0,0.6), 0 1px 2px rgba(0,0,0,0.1);
	-ms-box-shadow: inset 0 0 0 0 rgba(138, 186, 86, 0.8), inset 0 0 0 16px rgba(0,0,0,0.6), 0 1px 2px rgba(0,0,0,0.1);
	-o-box-shadow: inset 0 0 0 0 rgba(138, 186, 86, 0.8), inset 0 0 0 16px rgba(0,0,0,0.6), 0 1px 2px rgba(0,0,0,0.1);
	box-shadow: inset 0 0 0 0 rgba(138, 186, 86, 0.8), inset 0 0 0 16px rgba(0,0,0,0.6), 0 1px 2px rgba(0,0,0,0.1);
} 
.effect-shutter .item .info {
	backface-visibility: hidden;
}

.effect-shutter .item:hover {
	-webkit-box-shadow: inset 0 0 0 200px rgba(138, 186, 86, 0.8), inset 0 0 0 16px rgba(0,0,0,0.8), 0 1px 2px rgba(0,0,0,0.1);
	-moz-box-shadow: inset 0 0 0 200px rgba(138, 186, 86, 0.8), inset 0 0 0 16px rgba(0,0,0,0.8), 0 1px 2px rgba(0,0,0,0.1);
	-ms-box-shadow: inset 0 0 0 200px rgba(138, 186, 86, 0.8), inset 0 0 0 16px rgba(0,0,0,0.8), 0 1px 2px rgba(0,0,0,0.1);
	-o-box-shadow: inset 0 0 0 200px rgba(138, 186, 86, 0.8), inset 0 0 0 16px rgba(0,0,0,0.8), 0 1px 2px rgba(0,0,0,0.1);
	box-shadow: inset 0 0 0 200px rgba(138, 186, 86, 0.8), inset 0 0 0 16px rgba(0,0,0,0.8), 0 1px 2px rgba(0,0,0,0.1);
}

.effect-shutter .item:hover .info {
	opacity: 1; 
	
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}



/* ------------------------- SECTIONS >> CONTACT ------------------------- */
#contact-section {}

/* Google Maps */
#map-wrapper {
	width: 100%; 
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 0;
}

#map-canvas {
	width: 100%;
	height: 100%; 
	position: absolute; 
	top: 0px; 
	left: 0px; 
	overflow: hidden;
}

#map-controls {
	width: 50px;
	position: absolute;
	bottom: 30px;
	left: -28px;
	z-index: 101;
}

#map-controls a {
	width: 50px; 
	height: 50px;
	margin: 0 0 10px 0;
	float: left;
	display: block;
	font-size: 24px;
	text-align: center;
	line-height: 54px;
	color: rgba(108, 156, 56, 1); 
	text-shadow: 0 -1px 2px rgba(0,0,0,0.5), 0 1px 2px rgba(255,255,255,0.5);
	
	background: rgba(138, 186, 86, 1); 

	-webkit-border-radius: 25px; 
	-moz-border-radius: 25px; 
	-ms-border-radius: 25px; 
	-o-border-radius: 25px; 
	border-radius: 25px; 

	transition: all .1s linear;
}

#map-controls a:hover {
	color: rgba(98, 116, 16, 1); 
	text-shadow: 0 -1px 2px rgba(0,0,0,0.5), 0 1px 2px rgba(255,255,255,0.5);
}



/* ================================================== WIDGETS ================================================== */

/* ------------------------- WIDGETS >> GLOBAL ------------------------- */
.widget {
	width: 100%;
	padding: 0 50px; 
	float: left;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

.ua-ie .widget {padding: 0;}

/* ------------------------- WIDGETS >> LOGO ------------------------- */
#logo-widget {padding: 25px 50px 0 50px; text-align: center;}
#logo-widget a {display: inline-block; text-align: center;}

.ua-ie #logo-widget {padding: 25px 0 0 0;}

/* ------------------------- WIDGETS >> ABOUT ------------------------- */
#about-widget p {font-family: 'Lato'; color: #666; font-size: 40px; font-weight: 300; line-height: 50px; text-align: center;}
#about-widget p + p {margin: 20px 0 0 0; font-family: 'Lato'; color: #999; font-size: 24px; font-weight: 300; line-height: 30px;}



/* ------------------------- WIDGETS >> INFO ------------------------- */
#info-widget {position: absolute; bottom: 0; left: 0; right: 0; text-align: center;}

#info-widget .social-links {
	width: 100%;
	float: left;
	padding: 10px 0;
	margin: 0 auto;
	list-style: none;
	text-align: center;
}

#info-widget .social-links a {
	width: 18px;
	height: 18px;
	padding: 3px;
	margin: 0 5px;
	display: inline-block;
	color: #707070;
	background: #E1E1E1;
	
	-webkit-border-radius: 50px; 
	-moz-border-radius: 50px; 
	-ms-border-radius: 50px; 
	-o-border-radius: 50px; 
	border-radius: 50px; 
	
	-webkit-transition: all .1s linear;
	-moz-transition: all .1s linear;
	-ms-transition: all .1s linear;
	-o-transition: all .1s linear;
	transition: all .1s linear;
}

#info-widget .social-links a:hover {color: #FFF;}

#info-widget .social-links .facebook:hover 		{background: #3B5998; background: rgba(59, 89, 152, 0.5);}
#info-widget .social-links .twitter:hover 		{background: #00ACEE; background: rgba(0, 172, 238, 0.5);}
#info-widget .social-links .googleplus:hover 	{background: #C04D34; background: rgba(192, 77, 52, 0.5);}
#info-widget .social-links .linkedin:hover 		{background: #0465A0; background: rgba(4, 101, 160, 0.5);}
#info-widget .social-links .pinterest:hover 	{background: #D6342E; background: rgba(214, 52, 46, 0.5);}
#info-widget .social-links .github:hover 		{background: #383838; background: rgba(56, 56, 56, 0.5);}
#info-widget .social-links .feed:hover 			{background: #FB9900; background: rgba(251, 153, 0, 0.5);}

#info-widget p {margin: 0; color: #999; font-size: 12px;}