/**********************************************************************************
	TABS
**********************************************************************************/
.tab-content {
	display:none;
	padding:10px;
}

.tab-content.active {
	display: inherit;
}	

ul.tabs {
	margin:0;
	padding:0;
}

@media (min-width: 768px) { 
	.tabs-wrap .btn-open {
		display:none;
	}

	ul.tabs {
		width:100%;
	}

	ul.tabs:before, ul.tabs:after {
	  display: table;
	  content: " ";
	}

	ul.tabs:after {
	  clear: both;
	}

	ul.tabs li.select {
		display:none;
	}

	ul.tabs li {
		float:left;
		display: inline-block;
		padding:10px 20px;
		text-align:center;
		cursor: pointer;
		background:#fafafa;
	}

	ul.tabs li.active {
		box-shadow: inset 0 3px #0ce0ce;
		background:#fff;
	}
}

@media (max-width: 767px) { 
	.tabs-wrap {
		position:relative;
	}

	.tabs-wrap .btn-open {
		width:100%;
		text-align:left;
		padding:10px;
		border-radius: 5px;
		background: #fafafa;
		cursor: pointer;
		-webkit-transition: all 0.3s ease-out;
		-moz-transition: all 0.3s ease-out;
		-ms-transition: all 0.3s ease-out;
		-o-transition: all 0.3s ease-out;
		transition: all 0.3s ease-out;
	}

	.tabs-wrap .btn-open:after {
		content: "";
		width: 0;
		height: 0;
		position: absolute;
		top: 50%;
		right: 15px;
		margin-top: -3px;
		border-width: 6px 6px 0 6px;
		border-style: solid;
		border-color: #0ce0ce transparent;	
	}

	.tabs-wrap.active .btn-open {
		border-radius: 5px 5px 0 0;
		background: #0ce0ce;
		color:#fff;
	}

	.tabs-wrap.active .btn-open:after {
		border-color: #fff transparent;			
	}

	ul.tabs {
		position:absolute;
		top:100%;
		left:0;
		right:0;
		z-index:1;
		background:#fff;
		display:none;
		border:1px solid #efefef;
		border-top:0;
	}

	.tabs-wrap.active ul.tabs {
		display:inherit;
	}

	ul.tabs li { 
		padding:10px;
		border-bottom:1px solid #efefef;
		cursor:pointer;
		position:relative;
	}

	ul.tabs li.active {
		background: #eee;
		color:#444;		
	}

	/*
	ul.tabs li.active:after {
		content: "";
		width: 0;
		height: 0;
		position: absolute;
		top: 50%;
		right: 15px;
		margin-top: -6px;
		border-width: 6px 10px 6px 0;
		border-style: solid;
		border-color:  transparent #444;			
	}
	*/

	ul.tabs li:last-child {
		border-bottom:0;
	}
}


/**********************************************************************************
	IMAGE HOVER
**********************************************************************************/
@media (max-width: 1199px) { 
	.image-hover {
		width:auto;
		height:auto;
		margin-left:0;
		margin-right:0;
	}
	.image-hover img {
		width:100%;
	}
}
@media (min-width: 1200px) { 
	.image-hover {
		position: relative;
		overflow: hidden;
		cursor: pointer;
		display:inline-block;
	}

	.image-hover img {
		position:relative;
		min-height:100%;
		max-width:100%;
	}

	.image-hover .caption>a {
		backface-visibility:hidden;
		-webkit-backface-visibility:hidden;
	}

	.image-hover .caption>a, .image-hover .caption>a {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
	}

	.image-hover .view {
		font-size:0;
		color:transparent;
	}

	.image-hover.effect-right img {
		max-width:none;
		width:calc(100% + 50px);
		transform:translate3d(-40px,0,0);
		transition:transform .3s;
	}

	.image-hover.effect-right .content {
		width:100%;
		height:50%;
		padding:20px;
		box-sizing:border-box;
		color:#fff;
		position:absolute;
		left:0;
		bottom:0;
		transform:translate3d(0,40px,0);
		transition:transform .3s;
	}

	.image-hover.effect-right .content p {
		opacity:0;
		transition:opacity .3s;
	}

	.image-hover.effect-right:hover img, .image-hover.effect-right:hover .content {
		transform:translate3d(0,0,0);
	}

	.image-hover.effect-right:hover .content p{
		opacity:1;
	}

	.image-hover.effect-square{
		background: -webkit-linear-gradient(45deg, #22682a 0%, #9b4a1b 40%, #3a342a 100%);
		background: linear-gradient(45deg, #22682a 0%,#9b4a1b 40%,#3a342a 100%);
	}
    .image-hover.effect-square img{-webkit-transition:opacity 0.35s;transition:opacity 0.35s;}
    .image-hover.effect-square .caption{background-color:rgba(0,0,0,0.5);}
    .image-hover.effect-square .caption:before{position:absolute;left:30px;right:30px;top:30px;bottom:30px;border:solid 1px #fff;content:'';}
    .image-hover.effect-square .content{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;transition:transform .3s;}
    .image-hover.effect-square .caption:before,figure.effect-square .content p{opacity:0;transition:opacity .3s,transform .3s;transform:scale(0);}
    .image-hover.effect-square:hover .content{transform:translate(-50%,-60%);}
    .image-hover.effect-square:hover .caption:before,figure.effect-square:hover .content p{opacity:1;transform:scale(1);}
    .image-hover.effect-square:hover img{opacity:0.3;}
}




/**********************************************************************************
	GRID SYSTEM
**********************************************************************************/
    .grid_wrap{margin:0 -1% 0;}
    .grid_wrap > *{margin:0 1% 2%;float:left;}
    .grid_wrap:after{display:block;clear:both;content:'';}
    .m12-col-1{width:calc(8.333% - 2%);}
    .m12-col-2{width:calc(16.666% - 2%);}
    .m12-col-3{width:calc(25% - 2%);}
    .m12-col-4{width:calc(33.333% - 2%);}
    .m12-col-5{width:calc(41.665% - 2%);}
    .m12-col-6{width:calc(50% - 2%);}
    .m12-col-7{width:calc(58.331% - 2%);}
    .m12-col-8{width:calc(66.664% - 2%);}
    .m12-col-9{width:calc(74.997% - 2%);}
    .m12-col-10{width:calc(83.33% - 2%);}
    .m12-col-11{width:calc(91.663% - 2%);}
    .m12-col-12{width:calc(100% - 2%);}
    .m10-col-1{width:calc(10% - 2%);}
    .m10-col-2{width:calc(20% - 2%);}
    .m10-col-3{width:calc(30% - 2%);}
    .m10-col-4{width:calc(40% - 2%);}
    .m10-col-5{width:calc(50% - 2%);}
    .m10-col-6{width:calc(60% - 2%);}
    .m10-col-7{width:calc(70% - 2%);}
    .m10-col-8{width:calc(80% - 2%);}
    .m10-col-9{width:calc(90% - 2%);}
    .m10-col-10{width:calc(100% - 2%);}
    @media screen and (max-width:767px){
        .grid_wrap>*{width:calc(100% - 2%);}
    }

/**********************************************************************************
	TEXT
**********************************************************************************/