/*Mobile Scaling*/
@-ms-viewport{
  width: device-width;
}


@font-face {
    font-family: rockwell;
    src: url(fonts/ROCK.TTF);
}


html {
	background-color: #FFFFFF;
	overflow-y: scroll; 
	margin: 0;
	padding: 0;
	color: #000000; 
}

body {
	font-family: Georgia, Courier, monospace;
	font-size: 100%;
	color: #000000;
}

Small {
	font-size: 75%;
	color: #9d7e94;
}


header {
  /*margin: 0 0 0 0;*/
	text-align: center;
}


.header-box {
	margin: 30px auto 30px 0px;
	width: 700px;
}



h1 {
  margin: 0;
  padding: 0;
	font-size: 6vw;
	font-weight: bold;
	color: #000000; 
	font-family: 'rockwell', sans-serif;
	/*text-align: center;*/
}



h2 {
  margin: 0;
  Padding: 0;
  font-size: 4vw;
	color: #000000;
  font-family: 'rockwell', sans-serif;
  
	/*text-align: center;*/
	/*Centering*/
}


h3 {
  margin: 20px 0 0 0;
  text-decoration: underline;
	font-size: 24px;
	font-weight: 1000;
	font-family: 'rockwell', sans-serif;

}


h4 {
  text-decoration: underline;
	font-size: 14px;
	font-weight: 1000;
	font-family: 'rockwell', sans-serif;

}

h5 {

}




b  {

	font-size: 110%;
	font-weight: 1000;
	
}





/* unvisited link */
a:link {
    color: #d3044d;
}

/* visited link */
a:visited {
    color: #d3044d;
}

/* mouse over link */
a:hover {
    color: #fa055b;
}

/* selected link */
a:active {
    color: black;
}




/* ====================== TOP MENU BAR =================== */


.menu-bar-layout {

  display: flex;
  width: 100%;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
  align-items: center;
  
}


.menu-item{
  display: flex;
  justify-content: center;
  align-items: center;
	height: 50px;
	width: 200px;
	
	margin: 10px;
	padding: 10px;
	
	background-color: #eaeaea; /* grey light*/
	
	color: red;
}



.menu-item:hover {background: #b4c6c6; /* grey subtle blue */}



/* ====================== City BAR =================== */


.city-list {

  display: flex;
  width: 100%;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
  align-items: center;
  
}


.city-box{
  display: flex;
  justify-content: center;
  align-items: center;
	width: 100px;
	height:100px
	
	
	margin: 10px;
	padding: 10px;
	
	/*background-color: #eaeaea;  grey light*/
}



.menu-item:hover {background: #b4c6c6; /* grey subtle blue */}




/* ====================== Larger Layout =================== */


.parent-grid-layout {
  
  margin: auto;
  grid-template-columns: 1fr;
  /*border: 1px solid blue;*/
  display:grid;
  gap: 20px;
  grid-template-areas:
  "about-us-text"
  "about-us-images"
  "about-shimada-text"
  "about-shimada-images"
  "application-text"
  "application-images"
  "event-calendar-full"
  "buffer-3-images"
  "contact-us-form"
  "buffer-1-images"
  "buffer-2-images"
  "buffer-shimada-images"
  "buffer-4-images"
  "footer"
  }






@media (min-width: 928px) {

.parent-grid-layout {
  

  max-width: 910px;
  margin: auto;
  /*border: 1px solid red;*/
  display:grid;
  gap: 20px;
  grid-template-columns: 2fr 1fr;
  grid-template-areas:
  "about-us-text          about-us-images"
  "buffer-1-images        buffer-1-images"
  
  "about-shimada-text     about-shimada-images"
  "buffer-shimada-images  buffer-shimada-images"
  
  "application-text       application-images"
  "buffer-2-images        buffer-2-images"
  "event-calendar-full    event-calendar-full"
  "buffer-3-images        buffer-3-images"
  "contact-us-form        contact-us-form"
  "buffer-4-images        buffer-4-images"
  "footer                 footer"
  }


}




.about-us-text{
  
   grid-area: about-us-text;
  
}


.about-us-images{

   grid-area: about-us-images;
  
}

.buffer-1-images{
   grid-area: buffer-1-images;
  }


.about-shimada-text{
  
   grid-area: about-shimada-text;
  
}


.about-shimada-images{

   grid-area: about-shimada-images;
  
}


.buffer-shimada-images{
   grid-area: buffer-shimada-images;
  }




.application-text{
   grid-area: application-text;
  }

.application-images{
   grid-area: application-images;
  }


.buffer-2-images{
   grid-area: buffer-2-images;
}


.event-calendar-full{
   grid-area: event-calendar-full;
  }

.buffer-3-images{
   grid-area: buffer-3-images;
  }

.contact-us-form{
   grid-area: contact-us-form;
  }

.buffer-4-images{
   grid-area: buffer-4-images;
  }

.footer{
   grid-area: footer;
  }