@charset "UTF-8";
/* 
Bürogemeinschaft Tedesco & Bruns
 
mike lang
10.2023

Logo:
27,54,75 		dunkel Petrol
95,154,255,.5	hellblau, 50% deckkraft

*/

/*module*/
/* text modul */




/* vollbild text/bild zweispalter */
.vollbild { width:100%; }
.vollbild .txt-img.img { width:100%; }


/* text zweispaltig */
#content .row.txt-img { /*margin-bottom: 20px; */ }

.txt + p { margin: -.4em 0 0 0; }


.col .txt { /*margin: 0 1em 0 1em;*/ } 
/*
.col.one { text-align: right; } 
.col.two { text-align: left; } 
*/

.flexbox-container {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	/*justify-content: space-between;*/
	align-content: flex-start;
}

.flexbox-container.reverse {
	flex-direction: column-reverse;
}

.col.one.flexbox-container {
	/*align-items: flex-end;*/
}

.col.two.flexbox-container {
	/*align-items: flex-start;*/
}


.flexbox-item {
	flex: 0 1 auto;
}

.flex-item:nth-child(1) {
	flex-grow: 0;
	flex-shrink: 1;
	flex-basis: auto; 
}

.flex-item:nth-child(2) {
	flex-grow: 0;
	flex-shrink: 1;
	flex-basis: auto; 
}


/* bild modul */
.txt-img.img { margin: 40px auto 30px auto; }
.txt-img img { width: 100%; /*padding: 0 0 50px 0;*/  }
/*.img_unterschrift { border-top: 4px solid; border-top-color: #cfcfcf; margin-top: 5px; text-align: right; width: 100%; display: inline-block; padding: 8px 0 2px 0;  }*/
.rahmen { border: solid 1px #cacaca; }


/* tabelle*/
#content .txt-img.table { overflow-x: auto; text-align: left; margin-top: 50px; margin-bottom: 30px; /*-webkit-overflow-scrolling: touch; */}

#content .txt-img.table::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 5px;
	height: 5px;
}

#content .txt-img.table::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background-color: rgba(0,0,0,.5);
	-webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}

.table table { border-collapse: collapse; margin-top: 20px; width: 100%; }

.table td,
.table th { padding: .5em 1em .5em .5em; }

.table th { text-align: left; font-weight: 400; font-size: 1.1em; color: rgb(88,129,166);}
.table tr { border-bottom: 1px solid  rgba(213,212,212,1);}
.table tr:nth-child(even) { background-color: rgba(243,242,242,1); }/*blaugrau*/

.table td:last-of-type { text-align: left; }
.table td:first-of-type { text-align: left; }





/*galerie unite_gallery*/
.unite_gallery { margin: 50px 0 50px 0; }
#wrapper > .unite_gallery { margin: 0 auto 50px auto; }


/* im header */
#content .unite_gallery.container-fluid:first-child { margin: -24px 0 50px 0; }

.unite_gallery.container-fluid { width: 100%; }
.unite_gallery.container { width: 50%; margin: 50px auto 50px auto; }



.ug-textpanel-title {  
-webkit-hyphens: none;
 -moz-hyphens: none;
 -ms-hyphens: none;
 hyphens: none;  }

.ug-thumb-overlay { /*background-color: rgba(243,144,9,0.8) !important;*/background-color: rgba(84,54,45,0.7) !important; }

/*slideshow unite_gallery*/
 .ug-theme-slider { max-width: 100% !important; }
 .ug-gallery-wrapper .ug-slider-wrapper{ background-color:rgb(255,255,255); }
#home .ug-gallery-wrapper .ug-slider-wrapper{ background-color:rgb(31,31,31); }


 



/* google map */
.container-fluid { width: 100%; }
.map_canvas { min-height: 300px; margin-bottom: 75px; }

/* video plyr */
.video { margin-top: 50px;  margin-bottom: 80px; }


/* cookie_warning für youtube und google maps */
.cookie_warning_video,
.cookie_warning_map { 
	background-color: rgba(95,154,255,.5);
	margin-top: 50px;
	margin-bottom: 80px;
	padding: 10px 10px 10px 120px;
 	background-position: 20px center;
	background-repeat: no-repeat;
	background-size: 80px 80px;
	border-radius: 8px;
}

.cookie_warning_map		{ background-image: url(../images/icon_map_button_min.svg); }
.cookie_warning_video	{ background-image: url(../images/icon_video_play_button_min.svg); }

.cookie_warning_txt { padding: 30px 30px 10px 30px; background-color: rgba(95,154,255,.5); border-radius: 8px; }
.cookie_warning_txt p,
.cookie_warning_txt h2,
.cookie_warning_txt a { font-weight: 600!important; color: white!important; }


/* sitemap */
#sitemap ul li { margin: 0 0 0 0; }
#sitemap ul ul li { margin: 0 0 0 0; }
#sitemap ul li a { margin: 0 0 5px 0; padding: 2px 15px 2px 10px; font-size: 1.3em; text-decoration: none; }
#sitemap ul li a:before { font-family: 'Font Awesome 5 Free'; color: gray; margin: 0 5px 0 0; font-size: 1em; font-weight: 700; content: "\f105"; }
/*#sitemap ul li a:before { display: none; }*/
#sitemap ul li a:hover { color: gray; }
#sitemap ul li a:hover:before { color: black; }


#sitemap ul { padding-left: 20px; list-style-type: none !important; margin: 0; }
#sitemap ul:first-child { padding-top: 10px; }
          
#sitemap ul:last-child { margin-bottom: 10px; }
#sitemap ul:last-child a { color: #000; font-size: 1em; text-decoration: none; }
#sitemap ul:last-child a:before { font-size: 20px; }











/* Tabs */
.tabs.txt-img { margin: 40px auto 50px auto; }
.tabs.txt-img p { color: #797979; }

.txt-img .transformer-tabs ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.transformer-tabs li {
  display: inline-block;
  padding: 0;
  background-color: /*rgb(88,129,166)*/rgb(112,111,111);
  margin: 0 2px 0 0;
  
}

.transformer-tabs li .active {
  background-color: rgb(213,209,204); 
}


.txt-img .transformer-tabs a,
.txt-img .transformer-tabs a:link,
.txt-img .transformer-tabs a:visited {
  display: inline-block;
  color: white;
  text-decoration: none;
  padding: 0.5rem;
  border: 0;
}
.transformer-tabs a.active {
  position: relative;
	color: #797979 !important;
}

@media (max-width: 700px) {
  .txt-img .transformer-tabs ul {
  	margin: 0;
  	list-style-type: none;
    border-bottom: 0;
    overflow: hidden;
    position: relative;
  }
  .transformer-tabs ul::after {
	font-family: "Font Awesome 5 Free";
	content: "\f107";
	position: absolute;
	top: 15px;
	left: 15px;
	z-index: 2;
	pointer-events: none;
	color: white;
  }
  
  .transformer-tabs ul.open::after {
    content: "\f106";
  }
  
  .transformer-tabs ul.open a {
    position: relative;
    display: block;
  }
  .transformer-tabs li {
    display: block;
  }
  .transformer-tabs a {
    position: absolute;
    padding: 0.5rem 0 0.5rem 45px !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(142,125,118); 
  }
  .transformer-tabs a.active {
    border: 0;
    z-index: 1;
    background-color: rgb(88,129,166);
    color: white !important;
    
  }
}

.tabs > div { display: none; padding: 1rem; background-color: rgb(213,209,204); }

.tabs > .active { display: block; }









/* Diagramm / chart modul */
.chart-container { margin: 30px auto 50px auto; position: relative;  }
.chart-container canvas {
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}



/*footer adress modul */
#footer { font-size: 1em; color:white; }





/*parallax modul */
.parallax {
	display: inline-block;
	width: 100%;
	color: #fff;
	position: relative;
	margin: 20px 0 30px 0;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	/*background-size: 100% auto;*/
	text-align: center;
	background-color: rgb(255,255,255);
}


.parallaxcontent {
	position: relative;
	height: 100%;
	padding: 50px 30px 40px 30px;
	margin: 0 auto 0 auto;
	/*background: rgba(65,157,212, 0.85);*/
	background-color: rgba(243,144,9,.85);
}

.parallax_ueberschrift {
	font-size: 1.8em;
	font-weight: 300;
	line-height: 1.2;
}

.parallax_text {
	padding-top: 1.5em;
	display: block;
	font-size: 1.1em;
	font-weight: 300;
	line-height: 1.3;
}

.parallax_text a {
	color: #fff;
	border-bottom: 2px dotted #fff;
}

.parallax_text a:hover {
	border-bottom: 2px solid #fff;
}





/* Counter */
div.counter { display:inline-block; margin: 30px 0 40px 0; padding: 1em; text-align: center; }

.icon_border { display: inline-block; position: relative; height:80px; width:80px; border-radius:50%; border: 3px solid rgba(88,129,166,1); /*background-color: rgba(104,132,29,1);*/ }

div.counter span.icon { position: absolute; top: 50%;left:50%; margin: -.5em 0 0 -.5em; text-align: center; font-size:28px;  }

/* als platzhalter ist die endzahl eingefügt aber hidden damit die breite der endzahl vorab bestimmt wird. */
span.platzhalter { display:block; visibility: hidden; height: 0; overflow:hidden; }
.zahl span { font-size:48px; }

.countnr1,
.countnr2,
.countnr3 { text-align: center; }

.countnr1 .counter { width: 100%; }
.countnr2 .counter { width: 35%; }
.countnr3 .counter { width: 32%; }





/* accordion faq */
.txt-img + .mod-acc { margin-top: 20px; }
.mod-acc + .txt-img { margin-top: 60px; }
.mod-acc + .mod-acc { margin-top: 0; }

.mod-acc .grid-base { border-top: 1px solid #d8d8d8; }
.mod-acc h4 {
 cursor: pointer;
 line-height: 160%; 
 padding: 15px 70px 15px 20px;
 background-image: url(../images/ic-acc--open.svg);
 background-position: calc(100% - 20px) center;
 background-repeat: no-repeat;
 background-size: 32px 32px;
}

.mod-acc .mod-acc-details {
	
	padding: 15px 30px 0 20px;
	opacity: 0; 
	height: 0;
	overflow: hidden;

 }

.mod-acc-open h4 { background-image: url(../images/ic-acc--close.svg); }
.mod-acc.mod-acc-open .mod-acc-details {

	padding: 15px 30px 20px 20px;
	opacity: 1;
	height: auto;
	transition: opacity .3s ease-in;
	overflow: visible;

}



/* teaserbox / teaser / teaser_item */
/* teaser artikelliste rex_linklist Bild Text UNTER_einander */

.unter .teaser {
	width: 100%;
	display: flex;
	margin-bottom: 40px;
}


.unter .teaser_item { 
	flex-grow:1;
	flex-basis:50%;
	border-radius: 10px;
	min-height: 280px;
} 







/* teaser artikelliste rex_linklist Bild Text NEBEN_einander */
.teaserbox.neben {
	display: -ms-flexbox;
	display: flex;
	flex-direction: row; /*  default und damit unnötig, hier nur Verdeutlichung und bei responsive */
	flex-wrap: wrap;
}

.neben .teaser { 
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column; 
	    -ms-flex: 1; 
	        flex: 1;
}


.neben .txt_wrapper {
	border-radius: 10px 10px 0 0;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto; /*nur mit auto funtioniert das auf edge u ie */
}

.neben .img_wrapper { 
	height: 300px; 
	border-radius: 0 0 10px 10px;
	overflow: hidden;
}




/* teaser artikelliste rex_linklist Bild Text UNTER & NEBEN einander */
.teaserbox {
	width: 100%;
	margin: 50px 0 50px 0;
}


.unter .teaser a,
.neben .teaser a {
	text-decoration: none !important; 
	color: white !important;
}

.unter .txt_wrapper,
.neben .txt_wrapper { padding: 40px 40px 20px 40px; /*text-align: center;*/ }
.teaser_h1 { font-size: 2em; }


.teaser_item { overflow: hidden; }

.unter .teaser_img,
.neben .teaser_img { display: block; height: 100%; width: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat; overflow: hidden; }


.more { display: inline-block; line-height: 1em; padding: .4em 1em .6em 1em; border: 1px solid rgba(255,255,255,.4); border-radius: 5px; margin: 10px 0 10px 0; transition: background-color 0.2s, color .2s; }

.more:hover, 
.teaser a:hover .more { background-color: rgba(255,255,255,.1); color: rgb(27,54,75);  }


.bg_color_1 { background-color: rgb(145,80,60); } 		/*braun */
.bg_color_1.border { border: 1px solid rgba(145,80,60,1);}

.bg_color_2 { background-color: rgb(178,152,133); } 	/*hellbraun */
.bg_color_2.border { border: 1px solid rgba(178,152,133,1);}

.bg_color_3 { background-color: rgb(98,61,48); } 		/*dunkelbraun */
.bg_color_3.border { border: 1px solid rgba(98,61,48,1);}

.bg_color_4 { background-color: rgb(161,162,159); } 	/*hellgrau */
.bg_color_4.border { border: 1px solid rgba(161,162,159,1);}

.bg_color_5 { background-color: rgb(88,87,92); } 		/*dunkelgrau */
.bg_color_5.border { border: 1px solid rgba(88,87,92,1);}

.bg_color_6 { background-color: rgb(217,93,37); } 		/*orange: */
.bg_color_6.border { border: 1px solid rgba(217,93,37,1);}

/* anglehnt an alte origional farben, mal schauen */
.bg_color_7 { background-color: rgb(151,166,90); } 	/*Mittelgrün*/
.bg_color_7.border { border: 1px solid rgba(151,166,90,1);}

.bg_color_8 { background-color: rgb(148,173,205); } 	/*Taubenblau*/
.bg_color_8.border { border: 1px solid rgba(148,173,205,1);}



/*1:braun|2:hellbraun|3:dunkelbraun|4:hellgrau|5:dunkelgrau|6:orange|7:mittelgrün|8:taubenblau*/







/* 
animation 
Prefixing nicht vergessen: 
transition "ease" ist default und muss nicht extra genannt werden 
*/

/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.3.6,
* Autoprefixer: v10.3.1
* Browsers: last 4 version
*/

.animate {
	/*width: 100%; height: 100px; text-align: left;*/
	-webkit-transform: translate(-200px, 0px);
	    -ms-transform: translate(-200px, 0px);
	        transform: translate(-200px, 0px);
	opacity: .1;
	-webkit-transition: opacity 1s,-webkit-transform 1s;
	transition: opacity 1s,-webkit-transform 1s;
	-o-transition: opacity 1s,transform 1s;
	transition: opacity 1s,transform 1s;
	transition: opacity 1s,transform 1s,-webkit-transform 1s;
}

.links	{ 
	-webkit-transform: translate(-200px, 0px); 
	    -ms-transform: translate(-200px, 0px); 
	        transform: translate(-200px, 0px);
}
.rechts { 
	-webkit-transform: translate(200px, 0px); 
	    -ms-transform: translate(200px, 0px); 
	        transform: translate(200px, 0px);
}
.unten { 
	-webkit-transform: translate(0px, 150px); 
	    -ms-transform: translate(0px, 150px); 
	        transform: translate(0px, 150px);
}


/* bisschen Abwechslung: jedes zweite ne andere Geschwindigkeit */
.animate:nth-child(odd){ 
	-webkit-transition: opacity .8s,-webkit-transform .8s; 
	transition: opacity .8s,-webkit-transform .8s; 
	-o-transition: opacity .8s,transform .8s; 
	transition: opacity .8s,transform .8s; 
	transition: opacity .8s,transform .8s,-webkit-transform .8s;
}


/* 
1) schon im Viewpoint sichtbar & animiert wenn mann von oben die seite lädt. wenn man unten ist und reload macht sind die oberen bei hochscrollen nicht animiert
2) nach scrollen im Viewpoint sichtbar 
*/
.already-in {
	-webkit-transform: translate(0px, 0px);
	    -ms-transform: translate(0px, 0px);
	        transform: translate(0px, 0px);
	opacity: 1;
}

.come-in {
	-webkit-transform: translate(0px, 0px);
	    -ms-transform: translate(0px, 0px);
	        transform: translate(0px, 0px);
	opacity: 1;
}















/* Smartphones */

@supports (-webkit-overflow-scrolling: touch) {
	.parallax {
		background-attachment: scroll;
		background-size: 200% auto;
	}
}


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

	.table table { min-width: 600px; }
	.unite_gallery.container { width: 100%; }
	.chart-container { width:95vw; height:20vh; min-height: 300px;  }
	.container-fluid .parallaxcontent { width: 100%; }
	.container .parallaxcontent { width: 100%; }
		
	.countnr1 .counter,
	.countnr2 .counter,
	.countnr3 .counter { width: 100%; }
	
	.flexbox-container { display: block; }
	.zweispalter { margin: 0 0 0 0; }
	.row.txt-img { padding: 0 0 0 0; }
	.col { margin-bottom: 20px; } 
	.col.one { text-align: left; } 
	.spalte_50_50 .col.one,
	.spalte_50_50 .col.two { width: 100%; }

	.spalte_40_60 .col.one,
	.spalte_60_40 .col.two { width: 100%; }
	.spalte_40_60 .col.one p { font-weight: 500; padding: 0; }

	.spalte_40_60 .col.two,
	.spalte_60_40 .col.one { width: 100%; }
	
	.unter .teaser { flex-direction: column; -ms-flex-direction: column;}
	
	.unter .teaser_item.img_wrapper { height: 300px; }
	.unter .teaser_item { min-height: auto;} 
	.unter .uneven .txt_wrapper { order: 1; margin: 0 0 10px 0; }
	.unter .uneven .img_wrapper { order: 2; margin: 0 0 10px 0; }
	
	.unter .even .txt_wrapper { order: 1; margin: 0 0 10px 0; }
	.unter .even .img_wrapper { order: 2; margin: 0 0 10px 0; }
	
	.teaserbox.neben { flex-direction: column; -ms-flex-direction: column;}
	
	.neben.count_3 .teaser{ flex-basis: 100%; }
	.neben.count_3 .teaser { margin: 5px 0 5px 0; }
	.neben.count_3 .teaser:nth-child(3n-2) { margin: 5px 0 5px 0; }
	.neben.count_3 .teaser:nth-child(3n+0) { margin: 5px 0 5px 0; }
	
	.neben.count_2 .teaser{ flex-basis: 100%; }
	.neben.count_2 .teaser { margin: 5px 0 5px 0; }	
	.neben.count_2 .teaser:nth-child(2n) { margin: 5px 0 5px 0; }
	.neben.count_2 .teaser:nth-child(2n-1) { margin: 5px 0 5px 0; }
}


/* Smartphones (large z.B iphone 6 od ipad portrait) */
@media only screen and (min-width:667px) {

	.table table { min-width: 600px; }
	.unite_gallery.container { width: 100%; }
	.chart-container { width:95vw; height:20vh; min-height: 300px;  }
	.container-fluid .parallaxcontent { width: 100%; }
	
	.countnr1 .counter,
	.countnr2 .counter,
	.countnr3 .counter { width: 100%; }
	

	
	.flexbox-container { display: block; }
		
	.row { display: block; } 
	.row.txt-img { padding: 0 0 0 0; }
	.col { margin-bottom: 20px; } 
	.col.one { text-align: left; } 
	.zweispalter { margin: 0 0 0 0; }
	.spalte_50_50 .col.one,
	.spalte_50_50 .col.two { width: 100%; }

	.spalte_40_60 .col.one,
	.spalte_60_40 .col.two { width: 100%; }
	.spalte_40_60 .col.one p { font-weight: 500; padding: 0; }

	.spalte_40_60 .col.two,
	.spalte_60_40 .col.one { width: 100%; }
	
	.unter .teaser { flex-direction:column; -ms-flex-direction: column; }
	.unter .teaser_item { min-height: auto;} 
	.unter .teaser_item.img_wrapper { height: 300px; }

	.unter .uneven .txt_wrapper { order: 1; margin: 0 0 10px 0; }
	.unter .uneven .img_wrapper { order: 2; margin: 0 0 10px 0; }
	
	.unter .even .txt_wrapper { order: 1; margin: 0 0 10px 0; }
	.unter .even .img_wrapper { order: 2; margin: 0 0 10px 0; }
	
	.teaserbox.neben { flex-direction: column; }
	
	.neben.count_3 .teaser{ flex-basis: 100%; }
	.neben.count_3 .teaser { margin: 5px 0 5px 0; }
	.neben.count_3 .teaser:nth-child(3n-2) { margin: 5px 0 5px 0; }
	.neben.count_3 .teaser:nth-child(3n+0) { margin: 5px 0 5px 0; }
	
	.neben.count_2 .teaser { flex-basis: 100% }
	.neben.count_2 .teaser { margin: 5px 0 5px 0; }	
	.neben.count_2 .teaser:nth-child(2n) { margin: 5px 0 5px 0; }
	.neben.count_2 .teaser:nth-child(2n-1) { margin: 5px 0 5px 0; }

}
	
	
/*styles for 1024px and up, u.A. ipad landscape */
@media only screen and (min-width: 1024px){

	.map_canvas,
	.map 			{ height: 416px; width: 100%; }
	.table table { min-width: 100%; }
	.unite_gallery.container { width: 100%; }
	
	.chart-container { width:95vw; height:40vh; min-height: 300px;  }
	.container-fluid .parallaxcontent { width: 100%; }

	.countnr1 .counter { width: 100%; }
	.countnr2 .counter { width: 35%; }
	.countnr3 .counter { width: 32%; }
	

	.flexbox-container { display: flex; }
	
	.row {display: flex; /* equal height of the children */}
	.row.txt-img { padding: 0 0 0 0; }
	.zweispalter { margin: 40px 0 40px 0; }
	.col { margin-bottom: 0; } 
	.col.one { margin: 0 15px 0 0; /*text-align: right;*/ }
	.col.two { margin: 0 0 0 15px; }
	
	.spalte_50_50 .col.one,
	.spalte_50_50 .col.two { width: 50%;}

	.spalte_40_60 .col.one,
	.spalte_60_40 .col.two { width: 40%; }
	.spalte_40_60 .col.one p { font-weight: 500; padding: 0; }

	.spalte_40_60 .col.two,
	.spalte_60_40 .col.one { width: 60%; }
	
	
	.unter .teaser { flex-direction:row; -ms-flex-direction: row; }
	.unter .teaser_item { min-height: 280px;} 
	.unter .teaser_item.img_wrapper { height: auto; }

	.unter .uneven .txt_wrapper { order: 1; margin: 0 10px 10px 0; }
	.unter .uneven .img_wrapper { order: 2; margin: 0 0 10px 0; }
	
	.unter .even .txt_wrapper { order: 2; margin: 0 0 10px 0; }
	.unter .even .img_wrapper { order: 1; margin: 0 10px 10px 0; }
	
	
	.teaserbox.neben { flex-direction: row; -ms-flex-direction: row;}
	
	.neben.count_3 .teaser{ flex-basis: calc(33% - 20px); }
	.neben.count_3 .teaser { margin: 5px 5px 5px 5px; }
	.neben.count_3 .teaser:nth-child(3n-2) { margin: 5px 5px 5px 0; }
	.neben.count_3 .teaser:nth-child(3n+0) { margin: 5px 0 5px 5px; }
	
	.neben.count_2 .teaser { flex-basis: calc(50% - 10px); /*legt fest das möglichst 3 in einer reihe sind abzüglich der margins*/ }
	.neben.count_2 .teaser { margin: 5px 5px 5px 5px; }	
	.neben.count_2 .teaser:nth-child(2n) { margin: 5px 0 5px 5px; }
	.neben.count_2 .teaser:nth-child(2n-1) { margin: 5px 5px 5px 0; }

}
	
	
/*styles for 1280px and up */
@media only screen and (min-width: 1200px){

	.table table { min-width: 100%; }	
	.unite_gallery.container { width: 70%; }

	.chart-container { width:70vw; height:40vh; min-height: 400px;  }
	.container-fluid .parallaxcontent { width: 70%; }

}


/*styles for 1600px and up */
@media only screen and (min-width: 1600px){

	.table table { min-width: 100%; }
	.unite_gallery.container { width: 60%; }
	.chart-container { width:60vw; height:40vh; min-height: 400px;  }
	.container-fluid .parallaxcontent { width: 60%; }
	.container .parallaxcontent { width: 100%; }
}



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

	.table table { min-width: 100%; }
	.unite_gallery.container { width: 50%; }
	.chart-container { width:50vw; height:40vh; min-height: 400px;  }
	.container-fluid .parallaxcontent { width: 50%; }
	.container .parallaxcontent { width: 100%; }
}