/* bagit.css */
 
 * {
	 box-sizing: border-box; 
 }
 
 body {
	 margin: 0; padding: 0; text-align: center; font-size: 16px;  font-family: Arial, sans-serif, Verdana: line-height: 1.2; 
 }
 
 header {
	 background-color: #E3EBEE; padding-bottom: 1px; padding-top: 1em; color: white;  background-color: #032034; 
	 background-image: linear-gradient(to right, #CFEEF4, #032034, #032034, #032034, #CFEEF4); 
 }
 
 .logo img { 
   border-radius: 30px; border: 4px solid #AAD2CE; background-color: white; margin-top: -4px;
   
 }   
 
 header h1  {
	 color: #white; margin-top: 0em;  margin-top: -5px; font-size: 300%; 
 }
 
  header p {
	 color: #031E28; margin-top: -1.4em; backgroung-solo: navy; font-size: 20px; font-style: italic; color: white; 
	 background-color: #032034;  background-image: linear-gradient(to right, #CFEEF4, #032034, #032034, #032034, #CFEEF4); 
 }
 
 .navbar {
  overflow: hidden;
  background-color: #261802;
}

.navbar a {
  float: left;
  font-size: 26px;
  color: white;
  text-align: center;
  padding: 10px 12px;
  text-decoration: none;
}

.dropdown {
  float: left;
  overflow: hidden;
}

.dropdown .dropbtn {
  font-size: 26px;  
  border: none;
  outline: none;
  color: white;
  padding: 10px 12px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: #020D41;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 285px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: center; margin-bottom: 5px;
}

.dropdown-content a:hover {
  background-color: #ddd;
}

.dropdown:hover .dropdown-content {
  display: block;
}
/* div container */
 
 div.flex-container {
	 display: flex; flex-direction: row;
 }
 
 div.flex-container > div {
	 margin: 5px;
 }
 
 /* right side */
 .side {
	  min-width: 23%; background-color: #fff;  padding-top: 4em;
 }
 
 .side p {
	 color: black;
 }
 
 .adv {
   margin-top: -4em; font-size: 22px; text-align: left; padding: 10px; background-color: #FAFAF6;
   border-radius: 20px;
 }

.adv  h3 { 
  color: #3F1204;  text-align: left; 
 }

.adv  li {
  text-align: left;  color: #022911;  
 }
 
 .L1a {
   width: 52px; height: 50px; position: relative;  margin: auto; 
    background-color: white; top: -5.5em;
}

 .L1a p {
	  margin-left: -1px;  color: navy;  font-size: 14px; font-weight: bold;
}

.L1b {
   width: 80px; height: 46px; position: relative;  margin: auto; 
    background-image: linear-gradient(to bottom, brown, green); border-radius: 40px; top: -7em;
}

 .L1b p {
	font-size: 18px;  margin-left: 2px; color: white; font-weight: bold; margin-top: 2em; 
}

.L1c {
   width: 80px; height: 50px; position: relative;  margin: auto; 
    background: #261902; background-image: linear-gradient(to bottom, aqua, yellow); top: -7em; border-radius: 100%;
}

 .L1c p {
	font-size: 14px; margin-top: 2em; margin-left: 2px; padding-top: 10px; color: navy;  font-weight: bold;
}

.L1d {
   width: 80px; height: 50px; position: relative;  margin: auto; 
    background: #212742; top: -7em;
}

 .L1d p {
	font-size: 16px; font-weight: bold; margin-top: 2em; margin-left: 2px; color: white; font-weight: bold; padding-top: 6px;
}
 
 .boxL1 {
   width: 230px; height: 680px; float: right;  position: relative; margin: auto; 
 }
 
 .main {
	  min-width: 50%; text-align: center;
 }
 
 .main h2 {
	 margin-top: 1em; color: black; font-size: 30px; padding: 4px; border-radius: 10px; background-color: #E4EEEC;
 }
 
 .main p {
	 font-size: 22px;
 }
 
 .R1f p {
       
   color: black; font-size: 24px;  padding: 4px; background-color: #E4EEEC; border: radius: 20px; border-radius: 20px;
}

.adv h3 { 
  color: #3F1204;  text-align: left; 
 }

.adv li {
  text-align: left;  color: #022911; 
 }

.R1e img {
	 border-radius: 100%; border: 5px solid #F9FA64; margin-top: 1em;
}

.R1e p {
	color: black; font-size: 25px;  background-color: #E4EEEC; padding: 10px; border-radius: 20px; 
}
 
 .dis ul {
	 text-align: left;
 }
 
 .dis li {
	 float: left;
 }
 
 .bag1 {
	  background-color: #F6F6ED; margin-top: 3em; padding: 20px; border-radius: 20px; text-align: left;
 }
 
 .bag1 h2, p {
	 color: black;
 }
 
 .bag1 li {
	 color: white;
 }
 
 .gallery p {
	 font-size: 25px;
 }
 
  .gallery table {
	  border: 1px solid black; width: 300px;
  }
  
  .gallery caption {
	  background-color: green; color: white;
  }
  
  .container {
  position: relative;   height: 1290px; border: 1px solid black; 
}

/* Hide the images by default */
.mySlides {
  display: none;
} 
 

	 
 .R1a {
   width: 140px; height: 130px; position: relative;  margin: auto; 
   border: 1px solid black; background: #10034D; top: -11em; border-radius: 70px;
}

 .R1a p {
	font-size: 32px;  margin-left: 2px; color: green; padding-top: 6px; margin-top:-2px;
}

 .R1b {
   width: 120px; height: 70px; position: relative;  margin: auto; 
   border: 1px solid black; background: black; top: -160px; 
}

 .R1b p {
	font-size: 25px;  margin-left: 2px; 
}

 .R1c {
   width: 120px; height: 70px; position: relative;  margin: auto; 
   border: 1px solid black; background: #EFF5F5; top: -160px;
}

 .R1c p {
	font-size: 25px;  margin-left: 2px; 
}

.R1d {
   width: 120px; height: 70px; position: relative;  margin: auto; 
   border: 1px solid black; background: #EFF5F5; top: -160px;
}

 .R1d p {
	font-size: 25px;  margin-left: 2px; 
}

/* right bags */

 .ra1 {
   width: 70px; height: 60px; position: relative;  margin: auto; 
   background:#01063D; top: -8em; 
}

 .ra1 p {
	font-size: 16px;  margin-left: 3px; color: white; font-weight: bold; padding-top: 5px;
}

.rb1 {
   width: 70px; height: 55px; position: relative;  margin: auto; padding-top: 4px; 
   border: 4px solid #75F6A3; background: #012002; top: -7em; border-radius: 10px 20px 0 20px;
}

 .rb1 p {
	font-size: 18px;  margin-left: 2px; color: white; margin-top: -3px; font-weight: bold;
}

.rc1 {
   width: 80px; height: 60px; position: relative;  margin: auto; margin-right: auto; margin-left: auto;
    background: white;  background-image: linear-gradient(to right, #B2DEF6, #fffff1, #B2DEF6); top: -7em; border-radius: 100%;
}

.rc1 p {
	font-size: 20px;  margin-left: 2px; padding-top: 7px; font-weight: bold; margin-top: -2px;
}

.rd1 {
   width: 80px; height: 53px; position: relative;  margin: auto; margin-right: auto; margin-left: auto;
    background: white; top: -8em; border-radius: 40px;
}

.rd1 p {
	font-size: 18px;  margin-left: 4px; font-weight: bold; padding-top: 6px;
}

 @media screen and (max-width: 600px) {
	 div.flex-container {
		 flex-direction: column;
	 }
 }
 
 .svng {
   font-size: 22px; text-align: left; padding: 10px; background-color: #F6FCFC; margin-top: 1em; border-radius: 20px;
 }

.svng  h3 { 
  color: #3F1204;  text-align: left; 
 }

.svng  li {
  text-align: left;  color: #022911;  
 }
 
 .svng img {
	 width: 140px; height: 300px; text-align: center;
 }
 
 .svng a {
   text-decoration: none; color: #622107;
 }

 .svng a:hover {
   color: #097889;
 } 
 
.tree img {
	 width: 140px; height: 300px; text-align: center;
 }
	
 
 footer {
	 background-color: #37373D; text-align: center; border: 5px solid #37373D;
 }
 
 footer p {
	 color: white; padding-bottom: .0em; margin-top: 4em;
 }
 
.nav2 {
	position: relative: margin: auto;  width: 100%; height: 40px; float: left; 
}
 
.nav2 ul {
	margin-top: .2em; margin-left: -3em; 
}

.nav2 li {
  list-style-type: none; float: left; text-align: center; width: 6em;  margin-left: 10px;
}

.nav2 a {
  color: white; font-size: 18px;  font-weight: bold; text-decoration: none;  list-style-type: none; 
}

.nav2 a:hover {
   color: #CDE8ED; font-family: serif;
}

.zoom {
    margin: .5em; margin-top: 1em; transition: transform .2s; margin: 0 auto;
}

.zoom:hover {
  -ms-transform: scale(1.5); /* IE 9 */
  -webkit-transform: scale(1.5); /* Safari 3-8 */
  transform: scale(1.5); 
}

.zoom img { 
  width: 190px; height: 190px; margin-bottom: 30px; margin-top: 1em;
}

.cont1 p {
   font-size: 20px; color: #043640; font-weight: bold;
 }

 .cont1 a {
    color: green;
 }

 .cont1 a:hover {
   color: orange;
 }
 
 #priv h3 {
   padding: 5px;   font-size: 130%;  color: #00050A; margin-top: 10px; margin-left: 5px;
 }

 #priv h2 {
   background-color: #011841; color: #ffffff; padding: 2px;  margin-top: 1.5em;
 }

 #priv h4 {
  background-color: white; font-size: 110%;  
 }

 #priv p {
  color: #02121A;  text-align: left; 
 }

 #priv li {
  text-align: left; color: brown;  font-size: 18px;
 }

 #priv a {
  float: left;  color: brown; text-decoration: none;  
 }

 #priv a:hover {
  color: green;
 }
 
 #top01 {
   border-radius: 30px; margin-top: 70px; width: 80px; height: 24px; margin-left: 10px;text-align: center;
   background-color: #0C3453;  box-shadow: 2px 2px 4px gray;  
 }

 #top01 a {
   color: white; text-decoration: none; 
 }

 #top01 a:hover {
   color: aqua; 
 }

 #top01 p {
   font-size: 18px; 
 }
 
  .dislc {
      padding: 20px;  background-color: #F6F8F8; margin-top: 1em;
 }

 .dislc h2 {
     background-color: #010517; color: #fff; font-size: 25px;
  }

 .dislc p {
   color: #242B2B; font-size: 20px; text-align: center;  
 }
 
#term h2 {
   background-color: #203451; color: #ffffff; margin-top: 2em;
}

 #term h5 {
   color: black; font-size: 22px; text-align: left;
 }

#term p {
    color: #242b2b; font-size: 100%; text-align: left; 
 }

#term a {
   float: left;  color: brown; text-decoration: underline;  font-size: 100%;
 }

#term a:hover {
   color: green;
 }

#term h3 {
   color: brown
 }
 
 #term li {
  text-align: left; color: brown;  font-size: 18px;
 }

#term a:hover {
  color: green;
 }
 
#abt h2 {
  background-color: #031C11;  background-image: linear-gradient(to right, #031C11, #1e3a76, #031C11);color: white; font-size: 200%; margin-top: 30px; border-radius: 20px;
 }

#abt p {
    font-size: 22px;   
 }

#abt img {
   border: 5px solid #ADD1B6; margin-top: 5px;
 }