body{
	margin:0px;
}
#container {
	position:relative;
	width:1024px;
	height:1250px;
	margin:0 auto;
	background-Color: #FFF;
}
#master {
	position: absolute; top: 20px; left: 0px; right: 0px;
	width:1000px;
	height:942px;
	margin:0 auto;
	background-Color:#FFF
}
#nav {
	position: absolute; 
    left: 0px;
    right: 0px;
	width:1024px;
	height:200px;
	margin:0 auto;
    z-index:1;
}
#nav a:hover{
    color:red;
    font-weight:100;
}

#footer{
	position: absolute; top: 1040px; left: 0px; right: 0px;
	width:1024px;
	height:200px;
	margin:0 auto;
	background-Color: #FFF;
}
#menu {
	width: 568px;
	height: 70px;
	font-family:'Open Sans', sans-serif;;
	text-align: center;
	border-radius: 4px;
	right:10px;
	position:absolute;
	top:20px;
}
#menu a {
	text-decoration: none;
	color: dimgrey;
    font-size:20px;
    
}
#menu ul li:hover {
	background:#FFF;
}
#menu ul li:hover ul {
	display:compact;
}
#line2{
    position: absolute; left: 0px; right: 0px; top:140px;
	width:1015px;
	height:10px;
	margin:0 auto;
	background-color: #3A32B6;
    Border-radius:13px;
    z-index: 1;
 
}
#menu ul{ 
	height: auto;
	padding: 44px 0px;
	margin: 0px;

}
#menu li {
	display: inline;
	padding: 20px;
    border-left: solid #CCC 10px;
}

#logo{
	position:absolute;
	width:383px;
	height:120px;
	left:40px;
	top:0px;
	background-image: url("images/leeco-logo.png");
}

#nav #menu li .b1 {border-left: solid; color: #3A32B6; 10px !important;}	

#Bike{
    Position:absolute;
    background-image:url("images/Bike.png");
    Height:667px;
    Width:942px;
    left:0px;
    right:0px;
    top:100px;  
}

#line1{
   position: absolute; top: 1040px; left: 0px; right: 0px;
	width:1015px;
	height:10px;
	margin:0 auto;
	background-Color: #3A32B6;
    Border-radius:13px;
    
}

#socialmedia{
	position:absolute;
	top:50px;
	right:180px;
	width:200px;
	height:30px;
    background-color:#FFF;
    font-family:'Open Sans', sans-serif;;
}
.fa-facebook-square {
	color:#3D5E96;	
    margin-top:0px;
    left:10px;
    font-size: 50px;
}

.fa-facebook-square:hover {
	color:#9A9EA6;	
}
.fa-twitter-square{
    color:#46ADE9;
    Margin-top:0px;
    left:10px;
    font-size:20px;
}
.fa-twitter-square:hover{
    color:#46ADE9;
}
.fa-tumblr-square {
    color:#3D5873;
    
}
.fa-tumblr-square:hover{
    color:#46ADE9;
}
.fa-pinterest-square {
    Color:#BA3B39;
}
.fa-pinterest-square:hover{
    color:#46ADE9;
}
.fa-google-plus-official: {
    color:#46ADE9;
}

#bodypara{
    position: absolute; 
    top: 720px; 
    Height:160px;
    Width:700px;
    left:130px;
    right:30px;
    background-color:white;
    font-size: 23px;
	font-family:'Open Sans', sans-serif;;
	text-align: center;
    color:#5A6566;  
}
.h1{
    color: black;
    font-size:13px;
    Bottom:40px;
}
#lemall{
    position:absolute;
	width:240px;
	height:135px;
	left:90px;
	top:30px;
	background-image: url("images/lemall.png");
}

#search{
    color:#5A6566;
    position:absolute;
	left:310px;
	top:101px;
    z-index:1;
}
.fa-search hover{
    color:red;
}
.fa-search{
    right:50px;
    bottom:50px;
}
.input[type=text] {
    width: 120px;
    -webkit-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
   
    
}

/* When the input field gets focus, change its width to 100% */
input[type=text]:focus{
    width: 100%;
    border-radius:13px;
}
#search1{
     position:absolute;
	left:355px;
	top:110px;
    border-radius: 13px;
}


#plus1{
    position:absolute;
    width:60px;
    height:60px;
    top:441px;
    left:243px;
    background-image: url("images/Plus%20.png");
    z-index:auto;
}
#plus2{
    position:absolute;
    width:60px;
    height:60px;
    top:308px;
    left:370px;
    background-image: url("images/Plus%20.png");
    z-index:auto;
}

#plus3{
    position:absolute;
    width:60px;
    height:60px;
    top:335px;
    right:335px;
    background-image: url("images/Plus%20.png");
    z-index:auto;
}

/*#popup{
    top:335px;
    right:335px;
  
    z-index:auto;
}*/
/* Popup container - can be anything you want */
/*.popup  {
    position: relative;
    display: inline-block;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}*/

/* The actual popup */
/*.popup .popuptext {
    visibility: hidden;
    width: 160px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px 0;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -80px;
}*/

/* Popup arrow */
/*.popup .popuptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}*/

/* Toggle this class - hide and show the popup */
/*.popup .show {
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s;
}*/

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
    from {opacity: 0;} 
    to {opacity: 1;}
}

@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity:1 ;}
}
.h1 {
  text-align: center;
  font-family: Tahoma, Arial, sans-serif;
  color: #06D85F;
  margin: 80px 0;
}
  .box {
  width: 40%;
  margin: 0 auto;
  background: rgba(255,255,255,0.2);
  padding: 35px;
  border: 2px solid #fff;
  border-radius: 20px/50px;
  background-clip: padding-box;
  text-align: center;
}

.button {
  font-size: 1em;
  padding: 10px;
  color: #fff;
  border: 2px solid #06D85F;
  border-radius: 20px/50px;
  text-decoration: none;
  cursor: pointer;
  transition:0.3s ease-out;
}
.button:hover {
  background: #06D85F;
}

.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
}

.popup {
  margin: 70px auto;
  padding: 20px;
  background: #fff;
  border-radius: 5px;
  width: 30%;
  position: relative;
  transition: all 5s ease-in-out;
   
}

.popup h2 {
  margin-top: 0;
  color: #333;
  font-family: Tahoma, Arial, sans-serif;
}
.popup .close {
  position: absolute;
  top: 20px;
  right: 30px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.popup .close:hover {
  color: #06D85F;
}
.popup .content {
  max-height: 30%;
  overflow: auto;
}

@media screen and (max-width: 700px){
  .box{
    width: 70%;
  }
  .popup{
    width: 70%;
  }
}