//Footer allways in dark skin
#footer{
	margin-top: 50px;
	padding: 0;

	@include breakpoint(max_min_md){
		margin-top: 30px;

		.section-wrapper.has-background + &{
			margin-top: 0
		}
	}

	.container-full.has-background + &{
		margin-top: 0;
	}

	.widget-title {
		color: #ffffff;
		border-bottom: none;
	}

	.widget-title:before,
	.widget-title-icon{
		display: none;
	}

	.container-wrapper{
		padding: 15px 0;
		margin: 0;
		background: transparent;
	}

	.widget,
	.widget-content-only{
		margin-bottom: 0;
		border: 0;

		&.buddypress{
			margin-bottom: 30px;
		}
	}

	@include breakpoint(max_min_sm){
		.widget {
			margin-bottom: 20px;
		}
	}

	.widget_nav_menu li{
		list-style: none;
	}

	.footer-widget-area{
		margin-bottom: 10px;

		&:first-child:not(.footer-boxed-widget-area){
			padding-top: 60px;
		}

		&.footer-boxed-widget-area:first-child{
			margin-top: 50px;
		}

		&.footer-boxed-widget-area:last-child{
			margin-bottom: 30px;
		}

		&:last-child{
			margin-bottom: 20px
		}

		@include breakpoint(max_min_sm){
			margin-bottom: 20px;
		}
	}

	.footer-boxed-widget-area{
		padding: 30px 30px 0;
		margin-bottom: 50px;
		border: $base-border-in-white;
		border-radius: $base-border-radius;

		& [class*="tie-col"]{
			padding-right: 10px;
			padding-left: 10px;
		}

		.container-wrapper,
		.widget.widget-content-only{
			padding: 0;
			margin-bottom: 30px;
		}
	}

	.posts-list-counter .posts-list-items li:before{
		border-color: $dark-color;
	}
}

/* Site Info Bar---------------------------------------------------------------*/
#site-info{
	background: $darker-bg-more;
	padding: 20px 0;
	line-height: 32px;
	text-align: center;

	.copyright-text{
		font-size: 13px;
	}

	.footer-menu{
		text-align: center;

		li{
			display: inline-block;
			margin: 0 5px;
		}
	}

	ul.social-icons{
		text-align: center;
		margin-top: 5px;

		li{
			float:none;
			display: inline-block;
			margin: 0;

			a{
				span{
					color: $dark-base-color;
					line-height: 22px;
				}

				&:hover span{
					color: #ffffff;
				}
			}
		}
	}

	@include breakpoint(sm){
		&.site-info-layout-2{
			.copyright-text-first{
				float: left;
			}

			.copyright-text-second,
			ul.social-icons,
			.footer-menu{
				float: right;
				margin: 0;
				margin-left: 10px;
			}
		}
	}

	@include breakpoint(max_min_sm){
		.tie-alignleft,
		.tie-alignright{
			float: none;
		}
	}
}

#go-to-top{
	width: 35px;
	height: 35px;
	line-height: 35px;
	background: $darker-bg-more;
	text-align: center;
	display: block;
	position: fixed;
	bottom: -100px;
	right: 25px;
	z-index: 3;
	color: #999999;
	transition: 0.3s;

	&:hover{
		opacity: 0.85;
	}

	&.show-top-button{
		bottom: 25px;
	}

	@include breakpoint(max_min_sm){
		right: 5px;
		width: 25px;
		height: 25px;
		line-height: 25px;

		&.show-top-button{
			bottom: 5px;

			.has-mobile-share &{
				bottom: 45px;
			}
		}
	}
}


/* Widgets at dark skin--------------------------------------------------------*/
.side-aside.dark-skin,
#footer.dark-skin{
	//tabs
	.tabs-widget .tabs-wrapper{
		.tab-content{
			padding: 0;
		}

		.tabs-menu{
			margin-bottom: 20px;

			li{
				&:after{
					display: none;
				}
			}

			li a{
				border: 0;
				color: #ffffff;
				line-height: 55px;
				background-color: rgba(0,0,0,0.3);
				&:before{
					display: none;
				}
			}

			li a:hover,
			li.is-active a{
				background: $brand-color;
				color: color-contrast($brand-color);
			}
		}
	}

	// Dark button in Latest Tweeets and Drobbble
	.latest-tweets-widget{
		.dark-btn.button{
			display: none;
		}
	}

	.social-statistics-widget ul.white-bg li.social-icons-item a{
		border-color: $base-border-color-in-white !important;
	}
}

#footer.dark-skin .tabs-widget .tabs-wrapper .tabs-menu li a{
	background-color: $darker-bg;
}


/* Instagram above footer --------------------------------------------------------*/
#footer-instagram{
	position: relative;
	text-align: center;
	color: #fff;

	.tieinsta-grid.tie-instagram .tie-instagram-photos-content{
		padding: 0;
	}

	.tie-instagram{
		margin: 0;
	}

	.tie-instagram-photos-content-inner{
		padding: 0;
		font-size: 0;
		white-space: nowrap;
		word-wrap: normal; // IE fix
		overflow-y: hidden;
		overflow-x: auto;
	}

	.tie-instagram-post-outer {
		width: 16.6666666666666% !important;

		a {
			&:hover{
				opacity: 0.7;
			}
		}
	}

	@include breakpoint(lg){
		.mCSB_container{
			width: 100% !important;
			left: auto !important;
		}
	}

	@include breakpoint_max(900px){
		.tie-instagram-photos-content-inner{
			max-height: 150px;
		}

		.tie-instagram-post-outer {
			width: 150px !important;
			display: inline-block;
			float: none;
			font-size: 13px;
		}
	}

	.mCSB_scrollTools.mCSB_scrollTools_horizontal{
		height: 10px;

		.mCSB_dragger .mCSB_dragger_bar{
			background: rgba(0, 0, 0, 0.6);
		}
	}
}

#instagram-link{
	#footer &{
		position: absolute;
		display: block;
		z-index: 1;
		padding: 20px;
		@include center(xy);
		background: rgba(0,0,0,.7);
		display: block;
		@include font-size(16px);
		font-weight: 600;
		text-shadow: 0 0 5px #000000;
		text-align: center;
		white-space: nowrap;
		word-wrap: normal; // IE fix
		color: #ffffff;

		@include breakpoint(max_min_sm){
			font-size: 0;
			right: 10px;
			top: 10px;
			left: auto;
			transform: none;
			width: 30px;
			height: 30px;
			padding: 5px;
			border-radius: $base-border-radius;

			span{
				font-size: 15px;
				vertical-align: middle;
			}

			&:before,
			&:after{
				display: none;
			}
		}
	}

	&:before,
	&:after{
		top: 0;
		left: 0;
		content: '';
		position: absolute;
		width: 20px;
		height: 20px;
		opacity: 1;
		border: 2px solid $brand-color;
		border-width: 2px 0 0 2px;
		transition: 0.5s;
	}

	&:after{
		left: auto;
		top: auto;
		right: 0;
		bottom: 0;
		border-width: 0 2px 2px 0;
	}

	@include breakpoint(sm){
		&:hover{
			color: $brand-color;

			&:before{
				transform: translate3d(10px, 10px, 10px);
			}

			&:after{
				transform: translate3d(-10px, -10px, -10px);
			}
		}
	}
}
