:root
{
    --main-background01: url('../img/Main_Page/main_banner_1.png');
    --main-background02: url('../img/Main_Page/aboutus.png');
    --main-background03: url('../img/Main_Page/Blog_banner_main.png');
    --main-background04: url('../img/Main_Page/Bottom_Banner.png');
    --main-background05: url('../img/Main_Page/01_Auto.png');
    --main-ContactUs01: url('../img/Main_Page/ContactUs01.png');
    --main-ContactUs02: url('../img/Main_Page/ContactUs02.png');
    --main-ContactUs03: url('../img/Main_Page/ContactUs03.png');
    --main-Quote01: url('../img/Main_Page/Quote01.png');
    --main-AboutUs01: url('../img/Main_Page/AboutUs01.png');
    --main-color: whitesmoke;
    --secondary-color: green;
    --color-DarkGreen: #006400;
    --color-LightGreen01: #7CFC00;
    --color-LightGreen02: #58c4a7;
    --color-Yellow: #f3f096;
    --color-Navy: #000080;
    --color-DarkNavy: #191970;
    --color-Maroon: #800000;
    --color-Black: #000000;
    --color-White: #FFFFFF;
    --color-Ivory: #FFFFF0;
}

*
{
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

body
{
  /*background-color: var(--main-color); */
  background-color: white;  
  background-size: cover;
  background-position: center;
  box-sizing: border-box;
  font-family: sans-serif;
}

/* ****************************************************** */
.background01 {   
    width: 100%;
    height: 100%;
    background-image: var(--main-background01);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: left;
}

.background02 {
    width: 100%;
    height: 100%;
    background-image: var(--main-background02);
    background-size: cover;
    background-repeat: no-repeat;
}

.background03 {
    width: 100%;
    height: 100%;
    background-image: var(--main-background03);
    background-size: cover;
    background-repeat: no-repeat;
}

.background04 {
    width: 100%;
    height: 100%;
    background-image: var(--main-background04);
    background-size: cover;
    background-repeat: no-repeat;
}

.background05 {
    width: 100%;
    height: 100%;
    background-image: var(--main-background05);
    background-size: cover;
    background-repeat: no-repeat;
}

.ContactUs01 {
    width: 100%;
    height: 100%;
    background-image: var(--main-ContactUs01);
    background-size: cover;
    background-repeat: no-repeat;
}

.ContactUs02 {
    width: 100%;
    height: 100%;
    background-image: var(--main-ContactUs02);
    background-size: cover;
    background-repeat: no-repeat;
}

.ContactUs03 {
    width: 100%;
    height: 100%;
    background-image: var(--main-ContactUs03);
    background-size: cover;
    background-repeat: no-repeat;
}

/* ****************************************************** */

.nav
{
  background: white;
  padding: 0.2rem;
  height: 0rem;
  min-height: 10vh;
  overflow: hidden;
}

/* ################################################################## */

/*.menu-bar
{
    text-align: center;
    font-size: 14px;
}

.menu-bar ul
{
    display: inline-flex;
    list-style: none;
}

.menu-bar ul li
{
  width: 120px;
  margin: 10px;
  padding: 10px;  
  border-radius: 12px;
}

.menu-bar ul li a
{
    text-decoration: none;
    color: var(--color-DarkNavy);
    font-weight: bold;
}

.menu-bar ul li a:hover
{
    text-decoration: none;
    color: var(--color-LightGreen02);
    font-weight: bold;
    cursor: !important;
}

.menu-bar  .sub-menu-1
{
    display: none;
}

.menu-bar ul li:hover  .sub-menu-1
{
  display: block;
  position: absolute;
  background: var(--color-LightGreen02);
  margin-top: 10px;
  margin-left: -10px;
  border-radius: 12px;
  cursor: pointer;
}

.menu-bar ul li:hover  .sub-menu-1 ul
{
  display: block;
  margin: 10px;
}

.menu-bar ul li:hover  .sub-menu-1 ul li
{
  display: block;
  width: 120px;
  padding: 10px;
  border-bottom: 1px dotted #fff;
  background: transparent;
  border-radius: 0;
  text-align: left;
}

.menu-bar ul li:hover  .sub-menu-1 ul li:last-child 
{
  border-bottom: none;
}

.menu-bar ul li:hover .sub-menu-1 ul li:hover
{
  background: #2bab0d;
  border-radius: 3px;
}
*/
/*========================================================*/

/*
.menu-bar ul li .ContactUs
{  
  display: none;
  position: absolute;
  top: 30%;
  left: 62%;
  width: 550px;
  height: 800px;
  padding: 10px;
  border: 10px solid skyblue;
  border-radius: 10px;
  box-shadow: 5px 5px 50px rgba(0,0,0,0.35);
  background-color: lightgray;
  z-index: 1002;
  overflow: auto;
}  

/*========================================================*/

.Quote_Window
{  
  display: block;
  position: absolute;
  top: 800px;
  left: 10%;
  width: 900px;
  height: 400px;
  padding: 10px;
  border: 5px solid skyblue;
  border-radius: 10px;
  box-shadow: 10px 10px 50px rgba(0,0,0,0.35);
  background-color: lightgray;
  z-index: 1002;
  overflow: auto;
}  

.Quote_Window input {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.Quote_Window input:hover {
    background-color: #ddd;
}