/*--- Utilities ---*/
/*-- Layout --*/
.container {
	@media (min-width: 1200px){
        width: 100%;
	    max-width: 1200px;
	}
}
/*-- Spacings --*/
.nxvm { margin-top: 0; margin-bottom: 0; }
.nxmt { margin-top: 0; }
.nxmb { margin-bottom: 0; }
.nxvp { padding-top: 0; padding-bottom: 0; }
.nxpt { padding-top: 0; }
.nxpb { padding-bottom: 0; }

.np10 { padding: 10px; }
.nvp10 { padding-top: 10px; padding-bottom: 10px; }
.nhp10 { padding-left: 10px; padding-right: 10px; }
.np20 { padding: 20px; }
.nvp20 { padding-top: 20px; padding-bottom: 20px; }
.nhp20 { padding-left: 20px; padding-right: 20px; }
.np60 { padding: 60px; }
.nvm60 { margin-top: 60px; margin-bottom: 60px; }
.nhm60 { margin-left: 60px; margin-right: 60px; }
.nvp60 { padding-top: 60px; padding-bottom: 60px; }
.nhp60 { padding-left: 60px; padding-right: 60px; }

.npt60 { padding-top: 60px; }
.npb60 { padding-bottom: 60px; }
.npt45 { padding-top: 45px; }
.npb45 { padding-bottom: 45px; }
.npt30 { padding-top: 30px; }
.npb30 { padding-bottom: 30px; }
.npt20 { padding-top: 20px; }
.npb20 { padding-bottom: 20px; }
.npt15 { padding-top: 15px; }
.npb15 { padding-bottom: 15px; }
.npt10 { padding-top: 10px; }
.npb10 { padding-bottom: 10px; }

.nmt60 { margin-top: 60px; }
.nmb60 { margin-bottom: 60px; }
.nmt45 { margin-top: 45px; }
.nmb45 { margin-bottom: 45px; }
.nmt30 { margin-top: 30px; }
.nmb30 { margin-bottom: 30px; }
.nmt20 { margin-top: 20px; }
.nmb20 { margin-bottom: 20px; }
.nmt15 { margin-top: 15px; }
.nmb15 { margin-bottom: 15px; }
.nmt10 { margin-top: 10px; }
.nmb10 { margin-bottom: 10px; }

/*-- Grid --*/
.grid-container { 
	@include grid;
	> [class*='nflex'] > div { width: 100%; }
}
ul.grid-container { list-style: none; padding-left: 0; }
ul.grid-container > li {  margin-bottom: 0; }
.grid-gap-10 { @include grid-gap(10px); }
.grid-gap-15 { @include grid-gap(15px); }
.grid-gap-20 { @include grid-gap(20px); }
.grid-gap-25 { @include grid-gap(25px); }
.grid-gap-30 { @include grid-gap(30px); }
.grid-col-4 { 
	@include grid; 
	@include grid-repeat-columns(4);
	
	@media (max-width: 1199px){
		@include grid-repeat-columns(3);
	}
	@media (max-width: 991px){
		@include grid-repeat-columns(2);
	}
	@media (max-width: 767px){
		@include grid-template-columns(1fr);
	}
}
.grid-col-3 { 
	@include grid; 
	@include grid-repeat-columns(3);
	
	@media (max-width: 991px){
		@include grid-repeat-columns(2);
	}
	@media (max-width: 767px){
		@include grid-template-columns(1fr);
	}
}
.grid-col-2 { 
	@include grid; 
	@include grid-repeat-columns(2);

	@media (max-width: 767px){
		@include grid-template-columns(1fr);
	}
}

/*-- Flex --*/
.nflex-xs, .nflex-sm, .nflex-md, .nflex-lg { @include flexbox; }
.nflex-top { @include flexbox; @include align-items(flex-start); }
.nflex-bottom { @include flexbox; @include align-items(flex-end); }
.nflex-left { @include flexbox; @include justify-content(flex-start); }
.nflex-right { @include flexbox; @include justify-content(flex-end); }
.nflex-center { @include flexbox; @include justify-content(center); }
.nflex-middle { @include flexbox; @include align-items(center); }
.nflex-row { @include flex-flow(row wrap); }
.nflex-column { @include flex-flow(column wrap); }
.nflex-height { @include flex(1); width: 100%; }
.nflex-lg {
	@media (max-width: 1199px){
		display: block;
	}
}
.nflex-md {
	@media (max-width: 991px){
		display: block;
	}
}
.nflex-sm {
	@media (max-width: 767px){
		display: block;
	}
}

/*-- List --*/
ul, ol, ol ol, ol ul, ul ol, ul ul { margin-bottom: 10px; }
li { margin-bottom: 3px; }
[class*='ninline-col'] { 
	@include column-gap(40px);
	@media (max-width: 1199px){
        &.ninline-md-auto {
        	@include column-count(auto);
        }
	}
	@media (max-width: 991px){
        &.ninline-sm-auto {
        	@include column-count(auto);
        }
	}
	@media (max-width: 767px){
        @include column-count(auto);
	}
}
[class*='ninline-col'] li { @include column-break-avoid; }
ul.menu { list-style: none; padding-left: 0; margin-bottom: 0; }

/*-- Table --*/
table { background-color: #fff; }
.panel>.table-bordered, .panel>.table-responsive>.table-bordered { border: 1px solid #ddd; }
.table-responsive {
	@media (max-width: 768px) {
	    border: 0;

		&:before {
			display: block;
		    padding: 8px 3px;
		    content: unicode("f0a4  Scroll to right to view more");
		    font-family: $font-awesome, $font-stack;
		    font-weight: 400;
		    text-align: left;
		    font-size: 12px;
		}

	    > .table {
		    border: 1px solid #ddd;
		}
	}
}

/*-- Background Colors --*/
.bg-light-grey { background-color: $light-grey-color; }
.bg-dark-grey { background-color: $dark-grey-color; }
.bg-blue { background-color: $secondary-color; color: #fff; }

/*-- Misc --*/
.ninja-coming-soon, .ninja-thank-you {
	i[class*='icon'] {
		background-color: $primary-color;
		border: 0; 
	}
}
@mixin shadow-hover-effect { 
	display: inline-block;
	position: relative;
    z-index: 0;

    &:before {
		pointer-events: none;
		position: absolute;
		z-index: -1;
		content: '';
		top: 85%;
		left: 5%;
		height: 10px;
		width: 90%;
		opacity: 0;
		background: -webkit-radial-gradient(center,ellipse,rgba(0,0,0,.35) 0%,transparent 80%);
		background: radial-gradient(ellipse at center,rgba(0,0,0,.35) 0%,transparent 80%);
		@include transition(all 0.3s ease);
	}
   	img {
   		@include transition(all 0.3s ease);
   		@include transform(perspective(1px) translateZ(0));
   	}
    &:hover {
	    &:before {
    	    opacity: 1;
	    }
	    img {
	    	@include transform(translateY(-5px));
	    }
	}
}
.map-link {
    @include shadow-hover-effect;
}