@charset "utf-8";
/* CSS Document */
@media all and (max-width: 4000px) and (min-width: 851px) {
    html {
        scroll-behavior: smooth;
    }
	body{
	    background-color:#ffffff;	
	    font-family: 'Alkatra', cursive;
        font-family: 'Handlee', cursive;
        font-family: 'Roboto', sans-serif;
	    font-size:24px;
	}
	.header{
	    background-color:#c08c8c;
	    margin: 0 auto;
	    width:100%;
	    color:#FFFFFF;
	    z-index: 1;
	}
    .topwave{
        overflow: hidden;
        z-index: -1;
        position: relative;
    }
    .svg1{
        height:100%;
        width:100%;
        z-index: -1;
        position: relative;
    }
	.maincontent{
	    margin: 0 auto;   
	    background-color:#f6efef;
	    width:100%;
	    text-align: center;
	    border-bottom: 2px solid #c08c8c;
	    z-index: 1;
	}
	.maincontent2{
	    margin: -14% 0% 0% 0%;   
	    background-color:#ffffff;
	    width:99%;
	    text-align: center;
	    z-index: 1;
	}
	.maincontent3{
	    margin: 0 auto;   
	    background-color:#f6efef;
	    width:100%;
	    text-align: center;
	}
	.maincontent4{
	    margin: -14% 0% 0% 0%;   
	    background-color:#f6efef;
	    width:100%;
	    text-align: center;
	}
	.middletext{
	    margin: 0 auto;  
	    text-align: center;
	    width:48%;
	    float:left;
	    z-index: 100;
	    position: relative;
	}
	.middletext2{
	    margin: 0 auto;  
	    text-align: center;
	    width:48%;
	    float:left;
	    z-index: 100;
	    position: relative;
	    border-left: 2px solid #f6efef;
	}
	.infoboxes{
	    margin: 0 auto;   
	    background-color:#FFFFFF;
	    width:75%;    
	    box-shadow: 20px 20px 10px grey;
	    padding:5%;
	    font-size:18px;
	}
	.infopoints{
	    margin: 0 auto;   
	    background-color:#FFFFF;
	    width:100%;    
	    text-align:left;
	    border-bottom:2px solid #000000;
	}
	.infotopbox{
	    margin: 0 auto;
	    background-color:#c08c8c;
	    padding:5%;
	}
	a:link{
	    color:#000000;
	    text-decoration: none;
	}
	a:visited{
	    color:#000000;
	    text-decoration: none;
	}
	a:hover{
	    color:#c08c8c;
	    text-decoration: underline;    
	}
	li{
	    display:inline;    
	}
	.clear{
	    clear:both;	
	}
	.responsive {
        width: 75%;
        height: auto;
    }
    .responsive2 {
        width: 40%;
        height: auto;
    }
}
@media all and (max-width: 850px){
    html {
        scroll-behavior: smooth;
    }
	body{
	    background-color:#ffffff;	
	    font-family: 'Alkatra', cursive;
        font-family: 'Handlee', cursive;
        font-family: 'Roboto', sans-serif;
	    font-size:24px;
	}
	.header{
	    background-color:#c08c8c;
	    margin: 0 auto;
	    width:100%;
	    color:#FFFFFF;
	    z-index: 1;
	}
    .topwave{
        overflow: hidden;
        z-index: -1;
        position: relative;
    }
    .svg1{
        height:100%;
        width:100%;
        z-index: -1;
        position: relative;
    }
	.maincontent{
	    margin: 0 auto;   
	    background-color:#f6efef;
	    width:100%;
	    text-align: center;
	    border-bottom: 2px solid #c08c8c;
	    z-index: 1;
	    padding-left:1%;
	}
	.maincontent2{
	    margin: -14% 0% 0% 0%;   
	    background-color:#ffffff;
	    width:99%;
	    text-align: center;
	    z-index: 1;
	    padding-left:1%;
	}
	.maincontent3{
	    margin: 0 auto;   
	    background-color:#f6efef;
	    width:100%;
	    text-align: center;
	    padding-left:1%;
	}
	.maincontent4{
	    margin: -14% 0% 0% 0%;   
	    background-color:#f6efef;
	    width:100%;
	    text-align: center;
	    padding-left:1%;
	}
	.middletext{
	    margin: 0 auto;  
	    text-align: center;
	    width:90%;
	    float:left;
	    z-index: 100;
	    position: relative;
	}
	.infoboxes{
	    margin: 0 auto;   
	    background-color:#FFFFFF;
	    width:95%;    
	    box-shadow: 20px 20px 10px grey;
	    padding:5%;
	    font-size:18px;
	}
	.infopoints{
	    margin: 0 auto;   
	    background-color:#FFFFF;
	    width:100%;    
	    text-align:left;
	    border-bottom:2px solid #000000;
	}
	.infotopbox{
	    margin: 0 auto;
	    background-color:#c08c8c;
	    padding:5%;
	}
	a:link{
	    color:#000000;
	    text-decoration: none;
	    width:100%;
	}
	a:visited{
	    color:#000000;
	    text-decoration: none;
	}
	a:hover{
	    color:#c08c8c;
	    text-decoration: underline;    
	}
	li{
	    display:block;
	    list-style-type: none;
    }
    a[href^=tel] { color: inherit; text-decoration: none; }
    .clear{
	    clear:both;	
	}
	.responsive {
        width: 85%;
        height: auto;
    }
    .responsive2 {
        width: 45%;
        height: auto;
    }
}