/* Layout STYLES reffer to layout_refference.css
--------------------------------------------------------------------*/
@media screen {
	#wrapper {
		margin: 0 auto;    
	}

	.container,
	body.layout2col #container {
		margin-right: auto;
		margin-left: auto;
		position : relative;
		box-sizing: border-box;
	}

	.container:before,
	.container:after {
		display: table;
		content: " ";
	}

	.container:after {
		clear: both;
	}


	.inside_ce {
		margin: auto;
	}

	#main,#left,#right {
		position: relative;
	}

	#left {
		display: none;
	}

	#header,
	#footer {
		clear: both;
	}

	#footer {
		position: relative;
	}

	#header .container,
	#footer > .container,
	body.layout2col #container,
	.art_fullWidth > .container,
	.art_normalWidth > .container,
	.art_narrowWidth > .container {
		width: 100%;
	}

	.block
	{
		padding-left: calc(var(--block-padding) * 1rem);
		padding-right: calc(var(--block-padding) * 1rem);
		box-sizing: border-box;
	}

    .block .block {
        padding: 0;
    }

	.art_fullWidth .mod_bsslider,
	.art_fullWidth .container,
	.full-width {
		padding-left: 0;
		padding-right: 0;
	}


	/* included articles */
	.mod_article:not(.art_fullWidth) .container .mod_article .container,
	.mod_article.art_fullWidth > .container  {	
		width: 100%;
	}


	body.layout2col #container  .container {
		width: auto !important;
	}


	#main .mod_article {
        padding: 2rem 0 1rem;		
	}

	.art_fullWidth .con_mediumWidth .inside_ce {
		box-sizing: border-box;
		padding-left:  1rem ;
		padding-right:  1rem;
	}



}
/*@media ends*/


/* display with min width 414 iphone plus */
@media only screen and (min-width: 414px) {
}


/* display with min width 480 iphone landscape */
@media only screen and (min-width: 480px) {
}

/* min-width:768px ipad portrait*/
@media only screen and (min-width: 768px) {
	/* 2 Column Layout */
	body.layout2col {}

	body.layout2col #right{
		width: 30%;
		float: right;
	}
	body.layout2col #main{
		width: 70%;
		float: left;
	}
	/* 2 Column Layout ends */

	.art_fullWidth > .container,
	.art_normalWidth > .container,
	.art_fullWidth .con_mediumWidth .inside_ce {
		width: 100%;
	}

	.art_narrowWidth > .container,
	.art_fullWidth .con_narrowWidth .inside_ce,
	.art_normalWidth .con_mediumWidth .inside_ce,
	.art_narrowWidth .con_normalWidth .inside_ce {
		width: 750px;
	}

	.art_normalWidth .con_narrowWidth .inside_ce,
	.art_narrowWidth .con_mediumWidth .inside_ce{
		width: 550px;
	}

	.art_narrowWidth .con_narrowWidth .inside_ce {
		width: 450px;
	}

	.art_fullWidth .con_mediumWidth .inside_ce {
		box-sizing: border-box;
		padding-left: calc((var(--block-padding) + 1) * 1rem);
		padding-right: calc((var(--block-padding) + 1) * 1rem);
	}

	#main .mod_article {
        padding: 3rem 0 1rem;		
	}

}

/* min-width:1024 ipad landscape*/
@media only screen and (min-width: 1024px) {
	#header .container,
	#footer > .container,
	body.layout2col #container,
	.art_normalWidth > .container,
	.art_fullWidth .con_mediumWidth .inside_ce {
		width: 1000px;
	}

	.art_fullWidth > .container {
		width: 100%;
	}

	.art_narrowWidth > .container,
	.art_fullWidth .con_narrowWidth .inside_ce,
	.art_normalWidth .con_mediumWidth .inside_ce,
	.art_narrowWidth .con_normalWidth .inside_ce
	{
		width: 900px;
		padding: 0 1rem;
	}

	.art_normalWidth .con_narrowWidth .inside_ce,
	.art_narrowWidth .con_mediumWidth .inside_ce {
		width: 700px;
	}

	.art_narrowWidth .con_narrowWidth .inside_ce {
		width: 500px;
	}

}

/* min-width:1200 Laptops (and larger) for width 1200px */
@media only screen and (min-width:1200px) {

	body.layout2col #container,
	#header .container,
	#footer > .container,
	.art_normalWidth > .container,
	.art_fullWidth .con_mediumWidth .inside_ce {
		width: 1130px;
		/* background: yellow; */
	}

	.art_narrowWidth > .container,
	.art_fullWidth .con_narrowWidth .inside_ce,
	.art_normalWidth .con_mediumWidth .inside_ce,
	.art_narrowWidth .con_normalWidth .inside_ce
	{
		width: 940px;
	}

	.art_normalWidth .con_narrowWidth .inside_ce,
	.art_narrowWidth .con_mediumWidth .inside_ce {
		width: 870px;
	}

	.art_narrowWidth .con_narrowWidth .inside_ce {
		width: 680px;
	}

}

@media only screen and (min-width: 1300px) {


}

@media only screen and (min-width: 1400px) {

}
