*
{
   /*  box-sizing: border-box;   */
}
/******************************************/  
.body 
{
  /*  Puts the Page in the middle  */
 margin:0 auto;
 max-width: 980px;
 
 font-family: Arial, Helvetica, sans-serif; 
/* background-color: yellow; */
}
/******************************************/  
/* The grid container */
.grid-container
{
  display: grid; 
  grid-template-columns: 200px 580px 200px;
  grid-template-rows: 100px 100px 30px;   /* Row Size   auto; */
  grid-template-areas: 
    'header_L header_M header_R'   
    'content_Left content_Middle content_Right' 
    'footer_1 footer_2 footer_3';
  
  /* Draws black line around page */ 
  /* Page Size */
  min-width: 400px;
  max-width: 980px;   
  Height:1300px;    
  /* border: 2px solid black; 111*/
  border-top: 2px solid black;  
  border-right: 2px solid black;  
  border-left: solid black;  
  border-bottom: solid black;  
  
/*   background-color:rgba(0,255,0,.5);  */

}
/******************************************/ 
/* Style the header */
.header_L 
{
  grid-area: header_L;
   height:  100px;  /*  45px; */     
  
   /*  background-color:rgba(0,255,0,.5);  */
}
/* Style the header */
.header_M 
{
  grid-area: header_M;
  height:  100px;  /*  45px; */      
  
 /*  background-color:rgba(0,255,0,.5);  */
}
/* Style the header */
.header_R 
{
  grid-area: header_R;
 
   height:  100px;  /*  45px; */     
  
 /*  background-color:rgba(0,255,0,.5);  */ 
}
/******************************************/ 
/* Style the left column */
.content_Left 
{
  grid-area: content_Left;
}

/* Style the middle column */
.content_Middle 
{
  grid-area: content_Middle;
}

/* Style the right column */
.content_Right 
{
  grid-area: content_Right;
}

/* Style the footer */
.footer_1 
{
  grid-area: footer_1;
  padding: 10px;
  text-align: center;
}
.footer_2 
{
  grid-area: footer_2;
  padding: 10px;
  text-align: center;  /* keeps the copy right Centered */
  
}
.footer_3 
{
  grid-area: footer_3;
  padding: 10px;
  text-align: center;
  
 /* background-color:rgba(0,255,0,.5);      */
}
/******************************************/ 
/* Page 1 */
.Boddy_MiddlePage_1
{
/*  grid-area: content_Middle;  */
  
  position: relative; 
  top: 0px; 
  /* you need to sub 100 from 800 since we are starting at top: 100px */  
  Height: 600px; /* 800px Height - top 100px*/
  width: 520px; 
  /**/
  /*  background-color:rgba(0,125,0,.5);   */
  background-color:rgb(255,255,255);
  padding: 10px 10px 10px 10px;	               
  /* Round the Edges of buttons*/
  border-radius: 1rem;  
  border: 4px solid black;              
  /**/  
  margin-left:  10px;  
/**/ 
/**/
   padding-bottom:20px; 
   margin:10px;
   //background: -moz-linear-gradient(bottom, #DDDDDD, #F0F0F0 175px);
   //background: -webkit-linear-gradient(bottom, #DDDDDD, #F0F0F0 175px);
   //background: -ms-linear-gradient(bottom, #DDDDDD, #F0F0F0 175px);
   border-radius: 10px;
   box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);

 /* background-color:rgb(255,0,0); */
/**/ 
  }
/********/  
.Boddy_MiddlePage_1B
{
  position: relative; 
  top: 5px; 
  left: 0px;  
  Height: 40px;
  width:  520px; 
 /**/ 
  font-family: "Times New Roman", Times, serif;
  /**/
  /* font-weight: normal; */
  font-weight: bold;
  /* font-style: normal;*/
  font-style: italic;
  /* font-style: oblique; */
  font-size: 24px;  
 
}
/***************************************/
.Boddy_BottomPage_1
{
/*  grid-area: content_Left;    */
  position: relative; 
  top: 710px; /* 710px */
/*  grid-area: content_Middle; */
  /* you need to sub 100 from 800 since we are starting at top: 100px */  
 Height: 380px; /* 800px Height - top 100px*/
 width: 900px;
  /**/
/*  background-color:rgba(0,125,0,.5);  */
 background-color:rgb(255,255,255);
  padding: 10px 10px 10px 10px;	               
  /* Round the Edges of buttons*/
  border-radius: 1rem;  
  border: 4px solid black;              
  /**/  
  /**/  
margin-top: 0px;
/* margin-right: 0px;  */
margin-left: 10px; 
/**/
/**/
/*   padding-bottom:20px; 
   margin:10px;
*/ 
   //background: -moz-linear-gradient(bottom, #DDDDDD, #F0F0F0 175px);
   //background: -webkit-linear-gradient(bottom, #DDDDDD, #F0F0F0 175px);
   //background: -ms-linear-gradient(bottom, #DDDDDD, #F0F0F0 175px);
   border-radius: 10px; box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);

/**/ 
  }  
/***************************************/
.CompanyLogo /* logos end up in diferent x positons */
{
  position: relative;          /* relative; absolute */
  top: 20px; 
  left: 0px;
  /**/
  width:  418px; /*  384px; */
  height: 66px;  /*  64px; */      
/*  margin-left: 0px;  */
/*  float: left;  set to left or it will not let Logo scroll from left to right*/
/*  clear: none;  specifies on which sides of an element floating elements are not allowed to float */      
/*  display: block;  */
 background-image: url("../images/MC3Automation.png");  
   transition: transform 3s;        
   /* Round the Edges of buttons*/
   padding: 4px ; 
   border-radius: 1rem;  
   border: 4px solid black;  
   /**/  
   z-index: 1;

/*  background-color:rgba(0,0,255,.5);  */
} 
/******************************************/
/******************************************/ 
.Boddy_Left
{
/*  grid-area: content_Left;  */
  position: relative;  /* relative; */
  top:0px; 
  /* you need to sub 100 from 800 since we are starting at top: 100px */  
  Height: 600px;  /* 800px Height - top 100px*/
  /**/
  /**/
/* background-color:rgba(255,0,0,.5);  */
/* background-color: #F8F8F8; */
}
/******************************************/  
.Boddy_Middle
{
  position: relative; 
  top:100px; 
  grid-area: content_Middle;
  /* you need to sub 100 from 800 since we are starting at top: 100px */  
  Height: 600px; /* 800px Height - top 100px*/
  /**/
/* background-color:rgba(0,255,0,.5);    */
  }
/******************************************/  
.Boddy_Right
{
  grid-area: content_Right;
  position: relative; 
  top:0px; 
  left: -30px;  
  /* you need to sub 100 from 800 since we are starting at top: 100px */  
Height: 300px;   /* 800px Height - top 100px*/
/**/
/* Height: 700px;  */
  padding: 10px 0px 10px 10px;	  
/* background-color:rgba(0,0,255,.5);  */
}
/***************************************/
#MyLogInUL
{
  list-style: none; 
}
/***************************************/
.MyLogInLI  
{
  position: relative; /* absolute relative */
  top: 10px;
  left: 20px; 
  /**/
  width: 100px; 
  height: 20px;
  text-align: center;
/*  background-color:rgba(0,0,255,.5); */
}
/***************************************/
/******************************************/
/***************************************/  
.Boddy_MiddlePage
{
  position: relative; 
  top:100px; 
  grid-area: content_Middle;
  Height: 800px; /* 800px Height - top 100px*/
  width: 750px; 
  /**/
  /*  background-color:rgba(0,125,0,.5);  */
  background-color:rgb(255,255,255);
  padding: 10px 10px 10px 10px;	               
  /* Round the Edges of buttons*/
  border-radius: 1rem;  
  border: 4px solid black;              
  /**/  
  margin-left:  10px;  
  /**/
  /**/
  padding-bottom:20px; 
  margin:10px;
  background: -moz-linear-gradient(bottom, #DDDDDD, #F0F0F0 175px);
  background: -webkit-linear-gradient(bottom, #DDDDDD, #F0F0F0 175px);
  background: -ms-linear-gradient(bottom, #DDDDDD, #F0F0F0 175px);
  border-radius: 10px; 
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);

/**/ 
  }
/***************************************/  
.footer_B  
{
  grid-area: .content_Middle;  /*  content_Left content_Middle content_Right footer_2  content_Middle */
  position: relative; 
   top: 470px;  
  /**/
  font-family: "Times New Roman", Times, serif;
  font-weight: bold;
  /* font-style: normal;*/
  /* font-style: oblique; */  
  font-style: italic;
  font-size: 18px;  
  
 /*  background-color:rgba(0,255,0,.5);  */
  
}
/***************************************/  
/**/
.Page_2Image_RR
{
  //position: absolute;  
  //left: 0px;  
  //top: 0px;  
}
/**/
/**/
.BottomLine_1   /* relative; absolute */
{
 /*  grid-area: content_Middle;  */
  position: absolute; 
  top:  730px;  ;  
  left:  auto;    /*  100vw 330px; */
/* background-color: #99CCFF;   */
/color: #FFFFFF; */
   /**/          
}
/**/
.BottomLine_2
{
  position: absolute;
   top:  760px;   
  left:330px;
/* background-color: #99CCFF;   */
   /**/          
}
/**/
/**/
.Font_RightSideHeader  /* font Size biger */
{
/*top: 0px; */
  font-family: "Times New Roman", Times, serif;
  /**/
  /* font-weight: normal; */
  font-weight: bold;
  /* font-style: normal;*/
  font-style: italic;
  /* font-style: oblique; */
  Height: 20px;  
  font-size: 24px;
}
/**/
.Font_RightSideBody  /* font Size biger */
{
/*top: 0px; */

  font-family: "Times New Roman", Times, serif;
  /**/
  /* font-weight: normal; */
  font-weight: bold;
  /* font-style: normal;*/
  font-style: italic;
  /* font-style: oblique; */
  Height: 20px;  
  font-size: 20px;
}
/**/
/**/
/**/  
.Boddy_Left ul 
{
  list-style: none; /* NO bullets or numbers */
}
.Boddy_Left li a:link, .Boddy_Left li a:visited , .MyDownLoadPage 
{
  font-size: 14pt;
  font-weight: bold;
  color: #000000;
  text-decoration: none;
  display: block;
  /**/
  font-weight: bold;
  background-color: #FFFFFF; /* # FFFFFF 00BFFF blueish*/
  color: #000000; /* Text black */	
  /* Round the Edges of buttons*/
  border-radius: 1rem;  
  border: 4px solid black;            
  /* padds the inside of the element */
  padding: 10px 0px 10px 10px;	               
  /**/  
  margin-top:   0px;
  margin-right: 20px;
  margin-bottom: 90px;
  margin-left: -20px;  
}
/**/
.Boddy_Left li a:hover, .Boddy_Left li a:active 
{
  font-size: 14pt;
  font-weight: bold;
  color: #000000;
  text-decoration: none;
  display: block;
  /**/ 
  background-color: #FFFFFF; /* # FFFFFF 00BFFF blueish*/
  color: #0000ff; /* Text blue */	
  /* Round the Edges of buttons*/
  border-radius: 1rem;  
  border: 4px solid black;            
  /* padds the inside of the element */
  padding: 10px 0px 10px 10px;	               
  /**/  
  margin-top:   0px;
  margin-right: 20px;
  margin-bottom: 90px;
  margin-left: -20px;  
}
/**/
.Boddy_Left li a:onmouseover="bigImg(this)", .Boddy_Left li a:active 
{
  font-size: 14pt;
  font-weight: bold;
  color: #000000;
  text-decoration: none;
  display: block;
  /**/ 
  background-color: #FFFFFF; /* # FFFFFF 00BFFF blueish*/
  color: #0000ff; /* Text blue */	
  /* Round the Edges of buttons*/
  border-radius: 1rem;  
  border: 4px solid black;            
  /* padds the inside of the element */
  padding: 10px 0px 10px 10px;	               
  /**/  
  margin-top:   0px;
  margin-right: 20px;
  margin-bottom: 90px;
  margin-left: -20px;  
}
/**/
/**/
/**/
/**/
/**/
/**/
/**/
#MyLogInUL li a:link, #MyLogInUL li a:visited 
{
  font-size: 14pt;
  font-weight: bold;
  color: #000000;
  text-decoration: none;
  display: block;
  /**/
  font-weight: bold;
  background-color: #FFFFFF; /* # FFFFFF 00BFFF blueish*/
  color: #000000; /* Text black */	
  /* Round the Edges of buttons*/
  border-radius: 1rem;  
  border: 4px solid black;            
  /* padds the inside of the element */
  padding: 10px 10px 10px 10px;	               
  /**/  
  margin-top:   0px;
  margin-right: 20px;
  margin-bottom: 90px;
  margin-left: -20px;  
}
/**/
#MyLogInUL li a:hover, #MyLogInUL li a:active 
{
  font-size: 14pt;
  font-weight: bold;
  color: #000000;
  text-decoration: none;
  display: block;
  /**/ 
  background-color: #FFFFFF; /* # FFFFFF 00BFFF blueish*/
  color: #0000ff; /* Text blue */	
  /* Round the Edges of buttons*/
  border-radius: 1rem;  
  border: 4px solid black;            
  /* padds the inside of the element */
  padding: 10px 10px 10px 10px;	               
  /**/  
  margin-top:   0px;
  margin-right: 20px;
  margin-bottom: 90px;
  margin-left: -20px;  
}
/**/
/**/
#WallPaper_1
{
 background-image: url("../images/images_21.jpeg"); /* Pages/images.jpg */
 background-repeat: no-repeat; 
 background-size:  cover;    
  /**/
 }	   
/**/