/*------------------------------------*\
    ROWS, COLS, WRAP
\*------------------------------------*/

.section
{
	width:100%;	
}
.section.animated
{
	overflow-x: hidden;	
}

.wrap,
.wrap-xl,
.wrap-sm,
.wrap-full 
{
	padding:0 0;
	margin:0 auto;
	position:relative;
	box-sizing: border-box;
}

.row{
	min-height:20px;
	box-sizing:border-box;
}
@media (min-width: 800px) {
	.row-negative-md
	{
		margin-left: -20px;
		width: calc(100% + 40px);
	}	
	.row-negative-sm
	{
		margin-left: -10px;
		width: calc(100% + 30px);
	}
}
.row:after{
	clear: both;
}
.row:before,
.row:after{
	display: table;
	content: "";
	line-height: 0;
}
.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12,
.col1-1200, .col2-1200, .col3-1200, .col4-1200, .col5-1200, .col6-1200, .col7-1200, .col8-1200, .col9-1200, .col10-1200, .col11-1200, .col12-1200,
.col1-s-900, .col2-s-900, .col3-s-900, .col4-s-900, .col5-s-900, .col6-s-900, .col7-s-900, .col8-s-900, .col9-s-900, .col10-s-900, .col11-s-900, .col12-s-900,
.col1-s-800, .col2-s-800, .col3-s-800, .col4-s-800, .col5-s-800, .col6-s-800, .col7-s-800, .col8-s-800, .col9-s-800, .col10-s-800, .col11-s-800, .col12-s-800,
.col1-768, .col2-768, .col3-768, .col4-768, .col5-768, .col6-768, .col7-768, .col8-768, .col9-768, .col10-768, .col11-768, .col12-768,
.col1-s, .col2-s, .col3-s, .col4-s, .col5-s, .col6-s, .col7-s, .col8-s, .col9-s, .col10-s, .col11-s, .col12-s,
.col1-xs, .col2-xs, .col3-xxs, .col4-s, .col5-xs, .col6-xs, .col7-xs, .col8-xs, .col9-xs, .col10-xs, .col11-xs, .col12x-s,
.col1-xs-480, .col2-xs-480, .col3-xxs, .col4-s, .col5-xs-480, .col6-xs-480, .col7-xs-480, .col8-xs-480, .col9-xs-480, .col10-xs-480, .col11-xs-480, .col12x-s, .col-custom-20 {
    float: left;
	min-height: 1px;
	box-sizing:border-box;
	position:relative;
}
.flexrow,
.flexrow_col12,
.flexrow_col11,
.flexrow_col10,
.flexrow_col9,
.flexrow_col8,
.flexrow_col7,
.flexrow_col6,
.flexrow_col5,
.flexrow_col4,
.flexrow_col3,
.flexrow_col2,
.flexrow_col1
{
    display: flex;
    justify-content: space-between;
	width: 100%;
	gap: var(--gap);
}
.col12,
.flexrow_col12 > div,
.flexrow > div.flexcol12
{
	width: 100%
}
.col11,
.flexrow_col11 > div,
.flexrow > div.flexcol11
{
	width: 91.66666667%
}
.col10,
.flexrow_col10 > div,
.flexrow > div.flexcol10
{
	width: 83.33333333%
}
.col9,
.flexrow_col9 > div,
.flexrow > div.flexcol9
{
	width: 75%
}
.col8,
.flexrow_col8sm > div,
.flexrow > div.flexcol8
{
	width: 66.66666667%
}
.col7,
.flexrow_col7 > div,
.flexrow > div.flexcol7
{
	width: 58.33333333%
}
.col6,
.flexrow_col6 > div,
.flexrow > div.flexcol6
{
	width: 50%
}
	.col5,
	.flexrow_col5 > div,
	.flexrow > div.flexcol5
	{
		width: 41.66666667%
	}
	.col4,
	.flexrow_col4 > div,
	.flexrow > div.flexcol4
	{
		width: 33.33333333%
	}
	.col3,
	.flexrow_col3 > div,
	.flexrow > div.flexcol3
	{
		width: 25%
	}
	.col2,
	.flexrow_col2 > div,
	.flexrow > div.flexcol2
	{
		width: 16.66666667%
	}
	.col1,
	.flexrow_col1 > div,
	.flexrow > div.flexcol1
	{
		width: 8.33333333%
	} 
/*------------------------------------*\
    CONTENT COLS
\*------------------------------------*/
.cols2,
.cols3,
.cols4
{
	list-style: none;
	display: inline-block;
	width: 100%;
}
.cols2 > li,
.cols3 > li,
.cols4 > li
{
	float: left;
	padding-right: 2%l
}
.cols2 > li
{
	width: 50%;	
}
.cols3 > li
{
	width: 33.33%;
}
.cols4 > li
{
	width: 25%;
}

.cols2 img,
.cols3 img,
.cols4 img
{
	max-width: 100%;
	object-fit: cover;
    object-position: center;
	height: inherit;
}
