
/* normalize MG CSS */
.mg_filters_wrap .mgaf_sect span {
	display: inline-block;	
}
.mg_above_grid {
    z-index: 1010 !important;
}
.mgaf_search > i:before {
	font-size: inherit !important;
	line-height: normal !important;	
}
.mg_mobile_mode.mg_right_filters .mgaf_wrap.mg_filters_wrap:not(.mg_dd_mobile_filters) span, 
.mg_mobile_mode.mg_left_filters .mgaf_wrap.mg_filters_wrap:not(.mg_dd_mobile_filters) span {
	opacity: 1;
}




/* range slider */
.mgaf_range_wrap {
	line-height: 0;	
	padding-bottom: 4px;
}
.mgaf_range_wrap input[type="text"] {
	width: 35%;
	height: auto;
	line-height: normal;
	margin-bottom: 12px;
	border: 2px solid #bbb;
	border-radius: 3px;
	text-align: center;
	padding: 2px 3px;
	
	-ms-transition: 	all .2s ease;
	-webkit-transition: all .2s ease;
	transition: 		all .2s ease;
}
.mgaf_range_wrap input[type="text"]:last-of-type {
	float: right;
}
.mgaf_range_inner {
	position: relative;
    text-align: left;
	width: calc(100% - 18px);
	height: 5px;
	background: #ccc none repeat scroll 0 0;
    border-radius: 5px;	
	top: -2px;
	
	display: inline-block;
    padding: 0;
	margin-left: 14px;
	font-size: 0;
}
/* nouislider */
.mgaf_range_wrap .noUi-target,
.mgaf_range_wrap .noUi-target * {
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-user-select: none;
	-ms-touch-action: none;
	
	touch-action: none;
	-ms-user-select: none;
	-moz-user-select: none;
	user-select: none;
	
	box-sizing: border-box;
}
.mgaf_range_wrap .noUi-target {
	position: relative;
	direction: ltr;
}
.mgaf_range_wrap .noUi-base,
.mgaf_range_wrap .noUi-connects {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 1;
}
.mgaf_range_wrap .noUi-connects {
	overflow: hidden;
	z-index: 0;
}
.mgaf_range_wrap .noUi-connect,
.mgaf_range_wrap .noUi-origin {
	will-change: transform;
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	
	-ms-transform-origin: 		0 0;
	-webkit-transform-origin: 	0 0;
	transform-origin: 			0 0;
}
html:not([dir="rtl"]) .mgaf_range_wrap .noUi-origin {
	left: auto;
	right: 0;
}
.mgaf_range_wrap .noUi-origin {
	height: 0;
}
.mgaf_range_wrap .noUi-handle {
	position: absolute;
}
.mgaf_range_wrap .noUi-state-tap .noUi-connect,
.mgaf_range_wrap .noUi-state-tap .noUi-origin {
	-webkit-transition: transform 0.15s;
	transition: transform 0.15s;
}
.mgaf_range_wrap .noUi-state-drag * {
	cursor: inherit !important;
}
.mgaf_range_wrap .noUi-horizontal {
	height: 100%;
}
.mgaf_range_wrap .noUi-handle {
	background: #fff;
    border: 2px solid #b4b4b4;
    border-radius: 100%;
    color: #555;
    cursor: grab;
    font-weight: normal;
    height: 16px;
    margin-left: -12px !important;
    position: absolute;
    top: -5px;
    width: 16px;
    z-index: 2;
}
.mgaf_range_wrap .noUi-handle:before {
	content: "";
	width: 4px;
	height: 4px;
	display: block;
	border-radius: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -2px;
	margin-top: -2px;
	background:	#c4c4c4;
}
.mgaf_range_wrap .noUi-handle:active {
	cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grabbing;
    cursor: -webkit-grabbing;
}
html:not([dir="rtl"]) .mgaf_range_wrap .noUi-handle {
	right: -4px;
	left: auto;
}






/* options - blocks layout */
.mgaf_blocks_opts_layout .mgaf_opts_wrap:after {
    content: "";
    display: block;
    clear: both;
}
.mgaf_blocks_opts_layout .mgaf_opts_list {
	width: calc(100% + 7px);	
}
.mgaf_blocks_opts_layout .mgaf_opts_list > li {
	display: inline-block;
	position: relative;
	padding: 6px 10px !important;
	background: #eee;
	border-radius: 3px;
	margin: 0 7px 7px 0 !important;
	float: left;
	cursor: pointer;
	font-size: 95% !important;
	line-height: 1.3em;
	
	-ms-transition: 	all .2s ease;
	-webkit-transition: all .2s ease;
	transition: 		all .2s ease;
}
.mg_mobile_mode .mgaf_blocks_opts_layout .mgaf_opts_list {
	width: calc(100% + 5px);		
}
.mg_mobile_mode .mgaf_blocks_opts_layout .mgaf_opts_list > li {
	margin: 0 5px 5px 0 !important;	
}




/* fake dropdown (forced on mobile and top positions) */
.mgaf_opts_wrap {
	position: relative;
	overflow: visible;	
}
.mgaf_fake_dd {
	display: none;
	padding: 5px 25px 1px 5px; /* elems margin is 0 5px 5px 0 */
	border: 2px solid #ccc;
	border-radius: 3px;
	font-size: 15px;
	cursor: pointer;	
	position: relative;
	overflow: hidden;
	line-height: 0;
	
	-ms-transition: 	all .2s ease;
	-webkit-transition: all .2s ease;
	transition: 		all .2s ease;
}
.mgaf_fake_dd:after {
	content: "\f0d7";
	font-family: fontawesome;
	position: absolute;
	right: 10px;
	top: 50%;
	color: #666; 	
	font-size: 16px;
	line-height: normal;
	
	-ms-transform:		translateY(-50%);
	-webkit-transform: 	translateY(-50%);
	transform: 			translateY(-50%);
}
.mgaf_opts_expanded .mgaf_fake_dd:after {
	content: "\f0d8";	
}
.mgaf_all_selected .mgaf_fake_dd {
	padding-right: 5px;	
}
.mgaf_all_selected .mgaf_fake_dd:after {
	content: "";	
}
.mgaf_fake_dd_placeh {
	color: #ccc;	
	display: inline-block;
	margin: 2px 5px 6px 3px;
	width: calc(100% - 5px);
	text-overflow: ellipsis;
	overflow: hidden;  
	white-space: nowrap;
	opacity: .6;
}
.mgaf_fake_dd_placeh,
.mgaf_compact_opts_layout .mgaf_opts_list li, 
.mg_mobile_mode .mgaf_list_opts_layout .mgaf_opts_list li,
.mg_mobile_mode .mgaf_mobile_dd_blocks .mgaf_opts_list li {
	font-size: 0.9em !important;
    line-height: 1.3em;
}
.mgaf_compact_opts_layout .mgaf_fake_dd,
.mg_mobile_mode .mgaf_list_opts_layout .mgaf_fake_dd,
.mg_mobile_mode .mgaf_mobile_dd_blocks .mgaf_fake_dd {
	display: block;	
}
.mgaf_compact_opts_layout .mgaf_opts_list,
.mg_mobile_mode .mgaf_list_opts_layout .mgaf_opts_list,
.mg_mobile_mode .mgaf_mobile_dd_blocks .mgaf_opts_list {
	position: absolute;
	left: 0;
	right: 0;
	z-index: 100;
	top: 100%;
	border-width: 0 2px 2px;
	border-style: solid;
	border-color: #ccc;
	max-height: 214px;
	overflow: auto;
	opacity: 0;
	height: 0;
	
	-ms-transition: 	opacity .15s ease;
	-webkit-transition: opacity .15s ease;
	transition: 		opacity .15s ease;
}
.mgaf_compact_opts_layout .mgaf_opts_expanded .mgaf_opts_list,
.mg_mobile_mode .mgaf_list_opts_layout .mgaf_opts_expanded .mgaf_opts_list,
.mg_mobile_mode .mgaf_mobile_dd_blocks .mgaf_opts_expanded .mgaf_opts_list {
	opacity: 1;	
	box-shadow: 0px 3px 3px rgba(0,0,0,0.2);
	height: auto;
}
.mgaf_compact_opts_layout .mgaf_opts_list li,
.mg_mobile_mode .mgaf_list_opts_layout .mgaf_opts_list li,
.mg_mobile_mode .mgaf_mobile_dd_blocks .mgaf_opts_list li {
	padding: 6px 10px;	
	font-size: 15px;
	border-bottom: 1px #ccc solid; 
	cursor: pointer;
}
.mgaf_compact_opts_layout .mgaf_opts_list li:last-of-type,
.mg_mobile_mode .mgaf_list_opts_layout .mgaf_opts_list li:last-of-type,
.mg_mobile_mode .mgaf_mobile_dd_blocks .mgaf_opts_list li:last-of-type {
	border-bottom: none;
}
.mgaf_fake_dd span:not(.mgaf_fake_dd_placeh) { 
	display: inline-block;
	position: relative;
	padding: 2px 8px 2px 27px;
	border-radius: 3px;
	font-size: 0.9em !important;
	line-height: normal;
}
.mg_mobile_mode.mg_right_filters .mgaf_wrap.mg_filters_wrap:not(.mg_dd_mobile_filters) span, 
.mg_mobile_mode.mg_left_filters .mgaf_wrap.mg_filters_wrap:not(.mg_dd_mobile_filters) span,
.mgaf_fake_dd span:not(.mgaf_fake_dd_placeh) { 
	margin: 0 5px 5px 0;
}
.mgaf_fake_dd span:not(.mgaf_fake_dd_placeh):before {
	content: "×";
	position: absolute;
	display: inline-block;
	left: 8px;
	top: 53%;
	line-height: normal;
	font-size: 14px;
	
	-ms-transition: 	all .2s ease;
	-webkit-transition: all .2s ease;
	transition: 		all .2s ease;
	
	-ms-transform:		translateY(-50%);
	-webkit-transform: 	translateY(-50%);
	transform: 			translateY(-50%);	
}
.mg_mobile_mode .mgaf_mobile_dd_blocks .mgaf_opts_list {
	width: 100%;		
}
.mg_mobile_mode .mgaf_mobile_dd_blocks .mgaf_opts_list li {
	border-width: 0 0 1px 0;
	display: block;
	float: none;
	border-radius: 0;
	margin: 0 !important;
}
.mgaf_compact_opts_layout .mgaf_sel_opt,
.mg_mobile_mode .mgaf_list_opts_layout .mgaf_sel_opt,
.mg_mobile_mode .mgaf_mobile_dd_blocks .mgaf_sel_opt {
	display: none !important;	
}





/* side options - list */
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_list_opts_layout .mgaf_opts_list {
	max-height: 152px;	
	overflow: auto;
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_list_opts_layout .mgaf_opts_list li {
	display: block;
	position: relative;
	padding: 4px 8px 4px 25px; /** 20 == 8 + 20 */
	margin: 5px 0;
	cursor: pointer;
	font-size: 93%;
	line-height: 96%;
	
	-ms-transition: 	all .15s ease;
	-webkit-transition: all .15s ease;
	transition: 		all .15s ease;
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_list_opts_layout .mgaf_opts_wrap li:before {
	content: "";
	display: inline-block;
	line-height: normal;
	position: absolute;
	left: 0;
	height: 9px;
	width: 9px;
	border-radius: 50%;
	border: 2px solid #777;
	top: 50%;
	margin-top: -6px;
	box-sizing: content-box;	
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_list_opts_layout .mgaf_multi_opt_opts li:before {
	border-radius: 2px;
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_list_opts_layout .mgaf_opts_wrap li:after {
    content: "●";
    display: inline-block;
	font-size: 12px;
	line-height: normal;
	position: absolute;
	left: 3px;
	top: 50%;
	margin-top: -9px;
	opacity: 0;
	color: #666;
	box-sizing: content-box;	
	
	-webkit-transform: 	scale(0.6);
	-ms-transform: 		scale(0.6);
	transform: 			scale(0.6);
	
	-ms-transition: 	all .2s ease;
	-webkit-transition: all .2s ease;
	transition: 		all .2s ease;
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_list_opts_layout .mgaf_multi_opt_opts li:after {
	content: "✓";
	font-size: 10px;
	left: 3px;
	margin-top: -7px;
	font-weight: bold;
	box-sizing: content-box;	
}

.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_list_opts_layout li.mgaf_sel_opt:after {
	opacity: 1;
	
	-webkit-transform: 	none;
	-ms-transform: 		none;
	transform: 			none;
}


/* foldable icon in side layouts */
.mgaf_fold {
	padding: 0 !important;
	opacity: 0.3;
	cursor: pointer;
	display: none;	
	position: absolute;
	right: 0;
	top: 50%;
	font-size: 90%;
	line-height: 90%;
	
	-webkit-transform:	translateY(-50%);
	-ms-transform: 		translateY(-50%);
	transform: 			translateY(-50%);
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_foldable_sect > label {
	padding-right: 20px;	
	position: relative;
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_foldable_sect .mgaf_fold {
	display: inline-block;	
}
.mg_mobile_mode .mgaf_foldable_sect .mgaf_opts_wrap {
	display: block !important;	
}







/* global rules */
.mgaf_wrap {
	opacity: 0;	
}
.mgaf_sect {
	text-align: left;
	min-width: 20px !important;
}
.mgaf_search input  {
	font-size: 0.9em !important;
	line-height: 1.25em;	
	height: auto;
}
.mgaf_search > i {
	font-size: 0.95em !important;
	line-height: 2em;
	top: auto !important;
	bottom: 2px;
	text-align: center !important;
	
	-ms-transform:		none !important;
	-webkit-transform: 	none !important;
	transform: 			none !important;
}
.mgaf_sect > label {
	display: block;
	margin-bottom: 8px;
	line-height: normal;
}
.mgaf_sect > label i {
	padding-right: 2px;	
	padding-left: 1px;
}
.mgaf_wrap .mgf_inner * {
	text-align: left;	
}
.mg_rtl_mode .mgaf_sumbar, 
.mg_rtl_mode .mgaf_wrap .mgf_inner * {
    text-align: right;
    direction: RTL;
}
.mgaf_opts_list {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;	
}
.mgaf_opts_list li {
	font-size: 15px;
	line-height: normal;
}
.mgaf_opts_list li i,
.mgaf_fake_dd span i,
.mgaf_sumbar span i {
	padding-right: 2px;	
	font-size: 90% !important;
	line-height: 95%;
}
.mgaf_opts_list li i,
.mgaf_fake_dd span i {
	padding-right: 3px;	
}


/* summary bar */
.mgaf_sumbar {
	display: inline-block;
	text-align: left;
	width: 100%;	
	margin-bottom: 15px;
	position: relative;
}
.mgaf_sumbar *:not(i) {
	vertical-align: top;	
}
.mgaf_sumbar strong {
	display: inline-block;
	margin-right: 10px;
	margin-bottom: 7px;	
	font-weight: 600;
	line-height: 1.7em;
}
.mgaf_sumbar div {
	display: inline-block;
}
.mgaf_sumbar span { 
	display: inline-block !important;
	position: relative;
	padding: 4px 10px 4px 27px;
	line-height: normal;
	background: #e3e3e3;
	border-radius: 3px;
	float: left;
	cursor: pointer;
}
.mg_mobile_mode.mg_right_filters .mgaf_wrap.mg_filters_wrap:not(.mg_dd_mobile_filters) span, 
.mg_mobile_mode.mg_left_filters .mgaf_wrap.mg_filters_wrap:not(.mg_dd_mobile_filters) span,
.mgaf_sumbar span { 
	margin: 0 8px 7px 0;
}
.mgaf_sumbar span:before {
	content: "×";
	position: absolute;
	display: inline-block;
	left: 8px;
	top: 50%;
	line-height: normal;
	font-size: 14px;
	
	-ms-transform:		translateY(-50%);
	-webkit-transform: 	translateY(-50%);
	transform: 			translateY(-50%);	
}
.mg_mobile_mode > .mgaf_sumbar,
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_wrap:not(.mgaf_top_blocks):not(.mgaf_top_btn_to_blocks) .mgaf_sumbar {
	display: none !important;	
}
.mg_ag_align_center .mgaf_sumbar {
	text-align: center;	
}
.mg_ag_align_right .mgaf_sumbar {
	text-align: right;	
}

.mgaf_top_blocks .mgaf_sumbar,
.mg_mobile_mode .mgaf_lside_blocks .mgaf_sumbar,
.mg_mobile_mode .mgaf_rside_blocks .mgaf_sumbar {
	padding-top: 17px;	
}
.mgaf_top_blocks .mgaf_sumbar:before,
.mg_mobile_mode .mgaf_lside_blocks .mgaf_sumbar:before,
.mg_mobile_mode .mgaf_rside_blocks .mgaf_sumbar:before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    border-top: 1px solid #dfdfdf;
    top: -7px;
}

.mgaf_top_btn_to_blocks .mgaf_sumbar {
	padding-bottom: 17px;	
	margin-bottom: 17px;
}
.mgaf_top_btn_to_blocks .mgaf_sumbar:before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    border-top: 1px solid #dfdfdf;
    bottom: 0;
}

.mg_grid_wrap.mgaf_sumbar_shown:not(.mg_mobile_mode) .mgaf_lside_blocks .mgf_inner:before, 
.mg_grid_wrap.mgaf_sumbar_shown:not(.mg_mobile_mode) .mgaf_rside_blocks .mgf_inner:before {
    content: "";
    width: 100%;
    display: block;
    position: relative;
    border-top: 1px solid #eee;
    height: 11px;
}




/* top position and mobile */
.mgaf_wrap {
	overflow: visible;
}
.mgf_inner {
	font-size: 0 !important;
}
.mgaf_sect {
	vertical-align: top;	
}
.mgaf_top_blocks .mgf_inner {
	margin-bottom: 12px;	
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_top_blocks .mgf_inner,
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_top_btn_to_blocks .mgf_inner,
.mg_mobile_mode .mgaf_top_blocks .mgf_inner {
	width: calc(100% + 33px);
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_top_blocks .mgaf_sect,
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_top_btn_to_blocks .mgaf_sect,
.mg_mobile_mode .mgaf_sect {
	display: inline-block;
	width: calc(33.3% - 30px);
	margin-right: 30px;
	position: relative;	
	margin-bottom: 17px;
}



/* top w/ button */
.mgaf_top_btn_to_blocks .mgf_inner {
	display: none;
}
.mgaf_filters_btn {
	padding: 4px 12px;
	background: #f4f4f4;
	border: 2px solid #eee;
	border-radius: 3px;
	cursor: pointer;
	display: inline-block;	
	margin-bottom: 17px;
}
.mgaf_filters_btn i {
	padding-right: 2px;	
}



/* right / left position */
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_lside_blocks .mgf_inner,
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_rside_blocks .mgf_inner {
	width: 100% !important;
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_lside_blocks .mgaf_sect,
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_rside_blocks .mgaf_sect {
	width: 100% !important;
	max-width: none !important;	
	margin-bottom: 20px;
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_lside_blocks .mgaf_sect:last-of-type,
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_rside_blocks .mgaf_sect:last-of-type {
	margin-bottom: 0;
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_lside_blocks .mgaf_sect > label,
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_rside_blocks .mgaf_sect > label {
	margin-bottom: 8px;
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_lside_blocks {
	padding-right: 10px; 	
}
.mg_grid_wrap:not(.mg_mobile_mode) .mgaf_rside_blocks {
	padding-left: 10px; 	
}
.mg_mobile_mode .mgaf_lside_blocks .mgf_inner,
.mg_mobile_mode .mgaf_rside_blocks .mgf_inner {
	margin-bottom: 18px;
}

