
body {
    background-image: linear-gradient(to bottom, #BBDCEA, #FFF , #BBDCEA);
}

.header {
     background-image: linear-gradient(to bottom, #FFF , #FFF, #FFF, #BBDCEA);
     margin-top:5px;
}

.maincontainer {
    margin-top:10px;
    margin-left: 5px;
    margin-right:5px;
    border:3px solid#B3C589;
    border-radius: 10px;
    background-color:#FFF;
    font-family:Palatino;
    color:#4C4837;
    text-align:center;
}

.headerbox1 {
flex-basis:43%;
}

.headerbox2 {
    flex-basis: 40%;  
    padding:10px;
}

.navbar {
padding:10px;
padding-top:15px;
background-image: linear-gradient(to bottom, #FFF , #B3C589);
}

.image {
    width:100%;
}

.image1 {
    padding:10px;
}

.image2 {
    padding:10px;
}
.image3 {
    padding:10px;
}
.image4 {
    padding:10px;
    
}

iframe {
    width:100%;
    height:320px;
}

.maintext {
    padding:10px;
}

.bottomtext {
padding:10px;
}

.massagebox {
    border-bottom: 2px solid#B3C589;
    padding:10px;
}

.massageboxcolumn {
    border-bottom: 2px solid#B3C589;
    padding:10px;
}

.box {
} 

.contactbox {
    border-bottom: 2px solid#B3C589;
    padding:10px;
}
div.box label span {
padding:30px;
}
div.box .input_text {
	width:200px;
	height:25px;
	font-size:18px;
}

div.box .message {
	width:80%;
	height:100px;
    font-size:18px;
}

div.box .button {

	width:100px;
	background-color:#B3C589;
	border-left:1px double #4C4837;
	border-right:1px double #4C4837;
	border-top:1px double #4C4837;
	border-bottom:1px double #660000;
	margin:0px 0px 10px 0px;
	padding:4px 7px 4px 7px;
	
}


H1 {
    font-size:22px;
}

H2 {
    font-size:20px;
}

p {
    font-size:18px;
}

li {
font-size:20px;
font-weight:bold;
text-align:center;
list-style:none;
line-height:25px;
}

a {
    color:#4C4837;
}

.accordion>input {
  position: absolute;
  left: -100vw;
}

.accordion .content {
  overflow-y: hidden;
  height: 0;
  transition: height 0.3s ease;
}

.accordion>input:checked~.content {
  height: auto;
  overflow: visible;
}

.accordion label {
  display: block;
}

.accordion {
    border-bottom: 2px solid#B3C589;
    padding:10px;
}








.accordion p:last-child {
  margin-bottom: 0;
}

.accordion label {
  cursor: pointer;
}

.accordion label:hover,
.accordion label:focus {
  color:#BBDCEA;
}

.content {
    padding-left:10px;
    padding-right:10px;
}

@media (min-width: 835px) {
.maincontainer {
    margin-top: 15px;
    margin-left:7%;
    margin-right:7%;
}

.main {
display:flex;
padding-top:20px;
padding-right:20px;
padding-left:20px;
}

.navbar {
display:flex;
justify-content:space-between;
padding-right:40px;
padding-left:40px;
}

.image1{
flex:1;
order:2;
padding-top:40px;
}
  
  .maintext{
    flex:3;
    order:1;
}

.header {
    display:flex;
     justify-content:center;
} 
.main2 {
    display:flex;
    justify-content:space-around;
}
.headerbox2 {
padding-top:30px;
padding-left:40px;
}
.bottomtext {
    display:flex;
    justify-content:space-between;
    padding-left:30px;
    padding-right:30px;
}

.content {
    padding-left:30px;
    padding-right:30px;
}

.image2 {
    flex-basis:25%;
}
.image3 {
    flex-basis:35%;
}
.image4 {
    flex-basis:25%;
}
.massagebox {
     display:flex;
    justify-content:space-around;
    align-items:center;
    padding-right:20px;
    padding-left:20px;
}
.massagetext1 {
    flex:3;
    padding:10px;
}
.massageimage1 {
    flex:1;
    margin:10px;
}
.massagetext2 {
    flex:3;
     order:1;
    padding:10px;
}
.massageimage2 {
    flex:1;
     order:2;
    margin:10px;
}
.massagetext3 {
    flex:3;
    padding:10px;
}
.massageimage3 {
    flex:1;
    margin:10px;
    margin-top:30px;
}
.massagetext4 {
    flex:3;
     order:1;
    padding:10px;
}
.massageimage4 {
    flex:1;
     order:3;
    margin:10px;
}
.massagetext5 {
    flex:3;
    padding:10px;
}
.massageimage5 {
    flex:1;
    order:2;
    margin:10px;
}
.massagetext6 {
    flex:2;
     order:1;
    padding:10px;
}
.massageimage6 {
    flex:1;
     order:2;
    margin:10px;
}
}