/* --
Footer
------------------------- */


.site-footer{
	position: relative;

	.footer-nav{

		& > .row { margin: 0; }

		padding: 2rem 0 3.4rem 0;


		@include media-breakpoint-up(lg){
			padding: 14rem 0;
		}
		a{
			@include fontSize(16);
			@include lineHeight(20,16);
		}
		.category-link{
			@include fontFace($meta-regular);
			@include fontSize(18);
			@include lineHeight(20,18);
			letter-spacing: 2px;
		}
		ul {
			display: block !important;
		}

		.more { display: none; }
	}

	.site-info{
		color: $colorWhite;
		padding-top: 6rem;
		padding-bottom: 6rem;
		position: relative;
		z-index: 10;
		@include fontSize(14);
		@include lineHeight(16,14);
		text-align: center;
		// opacity: .8;
		box-shadow:inset 0px 10px 30px 0px rgba(39,120,190,0.8);
		background: -moz-linear-gradient(top, rgba(38,131,205,.6) 0%, rgba(116,199,238,.6) 100%);
		background: -webkit-linear-gradient(top, rgba(38,131,205,.6) 0%,rgba(116,199,238,.6) 100%);
		background: linear-gradient(to bottom, rgba(38,131,205,.6) 0%,rgba(116,199,238,.6) 100%);

		&:before {
			content: ""; display: block; width: 100%; height: 100%;
			position: absolute; left: 0; top: 0; z-index: -1; opacity: 1;
			background: rgb(38,131,205);
			background: -moz-linear-gradient(top, rgba(38,131,205,1) 0%, rgba(116,199,238,1) 100%);
			background: -webkit-linear-gradient(top, rgba(38,131,205,1) 0%,rgba(116,199,238,1) 100%);
			background: linear-gradient(to bottom, rgba(38,131,205,1) 0%,rgba(116,199,238,1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2683cd', endColorstr='#74c7ee',GradientType=0 );

		}

		p{
			@include fontSize(14);
			@include lineHeight(16,14);
			strong {
				@include fontFace($meta-regular);
				color: #fff;
				letter-spacing: 2px;
			}
		}

		.socials{
			ul{
				padding: 0;
				margin: 0;
				list-style-type: none;
				display: flex;

				li{
					// flex-basis: 33.33333%;
					display: inline-block;
					margin: 0;
					padding: 0 1rem;
					//text-align: center;
					margin:0px auto;
				}
				a{
					color: $colorWhite;
					text-decoration: none;
					padding: 5.8rem 0 4rem 0;
					display: block;
					position: relative;
					word-break: break-word;




					&:before{
						content: "";
						position: absolute;
						top: 2.8rem;
						left: 50%;
						transform: translateX(-50%);
						display: block;
						transition: top .1s linear;
					}

					&.fb:before{
						width: 9px;
						height: 18px;
						background: transparent url($theme-url + 'assets/images/svg/faceboook-icon-small.svg') no-repeat center center;
						// @include svg-sprite($faceboook-icon-small-svg);
					}
					&.ig:before{
						width: 18px;
						height: 18px;
						background: transparent url($theme-url + 'assets/images/svg/instagram-icon-small.svg') no-repeat center center;
						// @include svg-sprite($instagram-icon-small-svg);
					}
					&.yt:before{
						width: 18px;
						height: 14px;
						background: transparent url($theme-url + 'assets/images/svg/youtube-icon-small.svg') no-repeat center center;
						// @include svg-sprite($youtube-icon-small-svg);
					}

					@include media-breakpoint-up(md){

						@include fontSize(16);
						@include lineHeight(18,16);
						padding: 9.6rem 0 5.6rem 0;

						&:before{
							top: 4rem;
							transform: translate(-50%, 0rem);
							@include transition(.3s ease-in-out);
						}
						&.fb:before{
							@include svg-sprite($faceboook-icon-svg);
						}
						&.ig:before{
							@include svg-sprite($instagram-icon-svg);
						}
						&.yt:before{
							@include svg-sprite($youtube-icon-svg);
						}

						&:hover{
							&:before{
								// top: 3.5rem;
								transform: translate(-50%, -1.5rem);
							}
						}
					}
				}
			}
		}

		.infos{
			display: flex;
			flex-direction: column-reverse;
			color: $colorWhite;

			> * {
				display: block;
				flex-basis: 100%;
				margin-bottom: 1.8rem;
			}

			a{
				color: $colorWhite;
				@include fontSize(14);
				@include lineHeight(16,14);
				text-decoration: underline;
				&:hover{
					color: $colorDarkBlue;
				}
			}

			@include media-breakpoint-up(md){
				display: block;
				> * {
					display: inline-block;
					margin-bottom: 0;

				}
				a{
					padding: 0 1rem;
				}

			}
		}

		.developer{
			display: block;
			width: 2.3rem; height: 2.8rem;
			margin: 0 auto;
			text-indent: -9999px;
			position: relative;
    		overflow: hidden;
			margin-top: 3rem;
			&:before{
				content: "";
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
				display: block;
				@include svg-sprite($nivas-logo-svg);

			}

			@include media-breakpoint-up(md){
				position: absolute;
			    right: 6.2rem;
			    bottom: 5.7rem;
			}
		}

	}

	.graphics-container{

		z-index: -1;
		top:auto;
		bottom: 0;

		svg{
			top: 100%;
		}
	}

	//mob
	@include media-breakpoint-down(md) {
		overflow: hidden;

		& > .container-fluid {
			padding-right: 0;
			padding-left: 0;
		}

		.row {
			margin-right: 0;
			margin-left: 0;

			> .col,
			> [class*="col-"] {
				padding-right: 0;
				padding-left: 0;
				-webkit-box-flex: 0;
				-ms-flex: 0 0 100%;
				flex: 0 0 100%;
				max-width: 100%;
				margin: 0 !important;
			}
		}

		.footer-nav{

			padding: 2rem 0 3.4rem 0;

			.opened a.category-link { color: #ce1628; }

			.wrap {
				position: relative;
				overflow: hidden;
				height: 0;
			}

			.sub-nav {
				position: absolute;
				top: 0; left: 0;
				width: 100%;
				display: block;
			}

			.more {
				display: block; width: 84px; height: 60px;
				position: absolute;
				right: 0; top: 0;
				text-indent: -9999em;
				&:after, &:before {
					content: ""; display: block;
					position: absolute; top: 50%; left: 50%;
					transform: translate(-50%,-50%) rotate(0deg);
					@include transition(.5s ease-in-out);
				}
				&:before {
					@include svg-sprite($expand-minus-icon-svg);
					opacity: 0;
				}
				&:after {
					@include svg-sprite($expand-icon-svg);
					opacity: 1;
				}

				&.open {
					&:after, &:before {
						transform: translate(-50%,-50%) rotate(360deg);
					}
					&:before { opacity: 1; }
					&:after { opacity: 0; }
				}
			}


			// a{
			// 	@include fontSize(16);
			// 	@include lineHeight(20,16);
			// }
			// .category-link{
			// 	@include fontSize(18);
			// 	@include lineHeight(20,18);
			// }
			// ul {
			// 	display: block !important;
			// }
		}

		.graphics-container{ display: none; }
	}


	//small
	@include media-breakpoint-down(sm) {
		.footer-nav{
			.col {
				// -webkit-box-flex: 0;
				// -ms-flex: 0 0 100%;
				// flex: 0 0 100%;
				// max-width: 100%;
			}
		}
	}

}