@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans&family=Roboto&display=swap');

BODY {margin: 0; background: rgba(78,78,78,1.0); font-family: 'Roboto', sans-serif; font-size: 1.0rem; line-height: 1.3vw;}

INPUT {padding: 12px; background: rgba(255,255,255,1.00); border: 0; width: 60%; margin-bottom: 2px;}

TEXTAREA {padding: 12px; background: rgba(255,255,255,1.00); border: 0; width: 60%; height: 10vh; margin-bottom: 2px; font-family: sans-serif;}

INPUT[type="checkbox"] {padding: 6px; background: rgba(0,17,123,1.00); border: 0; width: 4%; margin-bottom: 2px;}
INPUT[type="submit"] {cursor: pointer;}

SELECT {padding: 12px; background: rgba(255,255,255,1.00); border: 0; min-width: 10vw;}

H1 {font-size: 1.5rem; line-height: 2.0rem; color: rgba(250,200,100,1.0);}

#Logo {margin: 2% auto; display: block; width: 30%;}

#Footer {
font-size: 1.6vh;
color: #FFF;
background: rgba(32,32,32,0.6);
text-align: center;
padding: 2vh 0;
line-height: normal;
}

#PhotoBlock {display: block; width: 100%; padding-top: 0.25%; margin: 2% auto; text-align: center;}
#PhotoBlock IMG {width: 24%; display: inline; margin: 0.25%; border: 1px solid #999;}

#ContactForm {background: rgba(200,200,200,0.5); padding: 0.5vw 2vw 0.5vw 4vw; margin: 1vh 0;}

#FormSubmit {width:16vw; text-align: center; font-weight: bold;}

#Footer A,#Footer A:visited,#Footer A:hover {color: #FFF; text-decoration: none; border-bottom: dotted 1px #FFF;}

#Footer .smallprint {font-size: 0.7rem;}
.smallprint {font-size: 0.9rem;}

.button {border: 0; background: rgba(145,175,65,1.0); color: #FFF; padding: 12px; font-size: 0.85rem; cursor: pointer;}
.button2 {border: 0; background: rgba(145,175,65,1.0); color: #FFF; padding: 12px; font-size: 0.85rem; cursor: pointer; text-align: center; width: 25%; margin: 12px auto;}
.button3 {border: 0; background: rgba(250,200,100,1.0); color: #000; padding: 12px; font-size: 0.85rem; cursor: pointer; text-align: center; width: 25%; margin: 12px auto;}
.button3top {border: 0; background: rgba(250,200,100,1.0); color: #000; padding: 12px; font-size: 0.85rem; cursor: pointer; text-align: center; width: 15%; margin: 12px 1rem 0 0; float: right; font-weight: 700;}
.LIbutton LI {border: 0; background: rgba(145,175,65,1.0); color: #FFF; padding: 12px; font-size: 0.85rem; cursor: pointer; text-align: center; width: 60%; margin: 12px 0; list-style: none;}

.redtext {color: rgba(145,175,65,1.0);}
.ambertext {color: rgba(250,200,100,1.0);}

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (max-device-width : 768px) {

BODY {font-size: 0.8rem; margin: 0;}

INPUT {padding: 3px; background: rgba(255,255,255,1.00); border: 0; width: 90%; margin-bottom: 2px;}

TABLE {font-size: 0.8rem;}

H1 {font-size: 1.0rem; line-height: 1.3rem;}

#Container {width: 100%;}

#PhotoBlock IMG {width: 48%; display: inline; margin: 0.25%;}

.smallprint {font-size: 0.7rem;}

.button2, .button3 {width: 90%; font-size: 0.75rem; padding: 6px; margin: 6px;}
.button3top {width: 25%; font-size: 0.75rem; padding: 6px; margin: 6px;}
.LIbutton LI {width: 90%; padding: 6px; font-size: 0.75rem; margin: 9px 0;}
}


/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 769px)
and (max-device-width: 1023px) {

#Container {width: 100%;}

.button2, .button3 {width: 90%; font-size: 0.8rem; padding: 9px; margin: 9px auto;}
.button3top {width: 20%; font-size: 0.8rem; padding: 6px; margin: 6px;}

}


/* Desktops and laptops ----------- */
@media only screen 
and (min-width: 1024px)
and (max-width : 1279px) {

#Container {font-size: 1.2rem; line-height: 1.5rem;}
	
.button2, .button3 {width: 64%; font-size: 0.8rem; padding: 9px; margin: 9px auto;}
	
.LIbutton LI {width: 90%; padding: 6px; font-size: 0.75rem; margin: 9px 0;}
}