/* ==========================================================================
  Wide Screen Layout: From 1200px.
========================================================================== */
@media (max-width: 1200px) {
#topheaderinner, #page, #supplementaryinner {
    padding:0 20px;
}

#topheaderinner {
    max-width: 100%;
}
	
	#access ul {
    font-size: 14px;
}
.homesliderinner h2, .homesliderinner h3 {
    font-size: 50px !important;
}
.largertext{
    font-size: 28px;
}
.homefeature h3 {
	font-size: 28px;
}

}
/* ========= end of Wide Screen Layout: From 1200px. ========= */


/* ==========================================================================
  Normal Desktop Layout: From 980px.
========================================================================== */
@media (min-width: 1000px) and (max-width: 1050px) {

.biotopfeaturelogo {
	max-width: 35%;
}


}
/* ========= end of Normal Desktop Layout: From 980px. ========= */


/* ==========================================================================
  Tablet Device Layout: From 768px.
========================================================================== */
@media (min-width: 768px) and (max-width: 999px) {

#topheaderinnerleft img {
    max-width: 70%;
}
#topheaderinnerright {
    width: 75%;
}
.homefeatureouter #pgc-7-3-0, .homefeatureouter #pgc-7-3-1, .homefeatureouter #pgc-7-3-2{
	margin-bottom: 0;
}
.biotopfeaturelogo {
	max-width: 35%;
}
}
/* ========= end of Tablet Device Layout: From 768px. ========= */

@media (min-width: 768px) and (max-width: 850px) {
.homefeatureouter #pgc-7-3-0, .homefeatureouter #pgc-7-3-1, .homefeatureouter #pgc-7-3-2{
	margin-bottom: 0;
}
.aboutpanel{
	background-image: url('../images/banner_curvy_border.svg'), url('../images/about-panel-background-mobile.webp');
}
#supplementary {
	padding: 100px 0;
}
.pagebanner, pagebannerdefault{
	padding: 0px 0 35px 0px;
}
.ctapanel{
	font-size: 25px;
	padding: 50px 0;
}
.ctapanel p{
    text-align: center;
}
.ctapanel .colorbutton{
    text-align: center;
	font-size: 18px;
}
.sidebarcontact {
	display: none;
}
.overlappingpanelleft, .overlappingpanelright {
    margin: 0 0px 0 0;
}
.greypanel ul {
	columns: 1;
	-webkit-columns: 1;
	-moz-columns: 1;
}
.pagebanner, pagebannerdefault {
    margin: 0 auto 15px;
}
}

/* ==========================================================================
  Mobile Layout: From 320px.
========================================================================== */
@media (max-width: 780px) {

	#topheaderinner {
    max-width: 100%;
    display: block;
}
	
	#topheaderinnerleft {
    width: 100%;
    text-align: center;
}
	
	#topheaderinnerleft img {
    max-width: 30%;
}
.largertext{
    font-size: 22px;
}
.bluepanel {
    font-size: 22px;
}
.aboutpanel{
	background-image: url('../images/banner_curvy_border.svg'), url('../images/about-panel-background-mobile.webp');
}
#supplementary {
	padding: 100px 0;
}
.pagebanner, pagebannerdefault{
	padding: 0px 0 35px 0px;
}
}
/* ========= end of Mobile Layout: From 320px. ========= */


/* ==========================================================================
  Wide Mobile Layout: 480px.
========================================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {

.homefeatureouter #pgc-7-3-0, .homefeatureouter #pgc-7-3-1, .homefeatureouter #pgc-7-3-2{
	margin-bottom: 0;
}
.aboutpanel{
	background-image: url('../images/banner_curvy_border.svg'), url('../images/about-panel-background-mobile.webp');
}
#supplementary {
	padding: 100px 0;
}
.pagebanner, pagebannerdefault{
	padding: 0px 0 35px 0px;
}
.pagebannerdefault h1, .pagebanner h1 {
    font-size: 35px;
}
.pagebannerinner {
	padding: 130px 0 40px 0px;
}
.ctapanel{
	font-size: 25px;
	padding: 50px 0;
}
.ctapanel p{
    text-align: center;
}
.ctapanel .colorbutton{
    text-align: center;
	font-size: 18px;
}
.sidebarcontact {
	display: none;
}
.overlappingpanelleft, .overlappingpanelright {
    margin: 0 0px 0 0;
}
.greypanel ul {
	columns: 1;
	-webkit-columns: 1;
	-moz-columns: 1;
}
.pagebanner {
    margin: 0 auto 15px;
}
}
/* ========= end of Wide Mobile Layout: 480px. ========= */



/* ==========================================================================
  Small Mobile Layout
========================================================================== */
@media (max-width: 479px) {

.largertext{
    font-size: 22px;
}
.homesliderinner {
    padding: 15px 0 10px;
    margin: 8vh 0 0 0;
}
.homesliderinner h2, .homesliderinner h3 {
    font-size: 35px !important;
}
#topheaderinnerleft img {
    max-width: 60%;
}
.bluepanel {
    font-size: 18px;
}
.homefeatureouter #pgc-7-3-0, .homefeatureouter #pgc-7-3-1, .homefeatureouter #pgc-7-3-2{
	margin-bottom: 0;
}
.aboutpanel{
	background-image: url('../images/banner_curvy_border.svg'), url('../images/about-panel-background-mobile.webp');
}
#supplementary {
	padding: 100px 0;
}
.pagebanner{
	padding: 0px 0 35px 0px;
}
.pagebannerdefault h1, .pagebanner h1 {
    font-size: 30px;
}
.pagebannerinner {
	padding: 35vw 0 40px 0px;
}
.ctapanel{
	font-size: 25px;
	padding: 50px 0;
}
.ctapanel p{
    text-align: center;
}
.ctapanel .colorbutton{
    text-align: center;
	font-size: 18px;
}
.sidebarcontact {
	display: none;
}
.overlappingpanelleft, .overlappingpanelright {
    margin: 0 0px 0 0;
}
.greypanel ul {
	columns: 1;
	-webkit-columns: 1;
	-moz-columns: 1;
}
.pagebanner {
    margin: 0 auto 15px;
}
}
/* ========= end of small Mobile Layout ========= */