.background-image {
	position: fixed;
	left: 0;
	right: 0;
	z-index: -1;			
	display: block;
	background-image: url('../images/bg.jpg');
	background-size : 100%;	
	width: 100%;
	height: 100%;
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-o-filter: blur(5px);
	-ms-filter: blur(5px);
	filter: blur(5px);
}	
 
.soc{
			z-index :99;
			width : 200px;
			height : 100px;			
			position : fixed;			
			float : right;
			right : 0px;
			top : 0px;			
			}
			
.menubar{
	margin: 20px auto  300px  10%;
	width: 80%;	
	height : 100px;
	position : absolute;			
	border-bottom: 2px solid #fff;
	text-decoration:none;	
}

#logo{			
	margin : auto;
	width : 300px;
	height : 100px;
	float : left;
	display : inline-block;
	background:transparent url("../images/logo.PNG");
	background-repeat:no-repeat;
	background-size : 100%;
}

.container{
	padding-top : 150px;
}		

a .ul.topnav {
	color : white;
}

ul.topnav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  margin-top : 30px;
  padding-left : 30px;
  font-weight : bold;
  vertical-align : top;
}

ul.topnav li {float: left;}

ul.topnav li a {
  display: inline-block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  transition: 0.3s;
  font-size: 2em;
}

ul.topnav li a:hover {background-color: #111;
	background-color : rgba(0, 0, 0, 0.3);		
	}

ul.topnav li.icon {display: none;}

.begin{
	margin : auto;
	width : 60%;
	height :auto;
	font-size : 25px;
	color : white;
	padding : 10px;
	text-align : center;
	background-color : rgba(0, 0, 0, 0.5);		
}
.brand{
	margin-top : 30px;			
	width : 100%;			
	text-align : center;					
}
.brnlogo
{
	height : 30px;
	width :100px;
}
.footer
{
	padding-top : 50px;
	padding-bottom : 20px;
	text-align :center;
	font-size : 20px;
	color : white;
	
}

@media screen and (device-aspect-ratio: 40/71) {

ul.topnav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  margin-top : 0px;
  padding-left : 0px;
  font-weight : bold;
  vertical-align : top;
  line-height : 4px;
  height :170px;
  width : 170px;
 float : right;
}
#map{
	width : 260px;
	height : 260px;
	padding-bottom : 0px;
}

ul.topnav li {float: right;}

ul.topnav li a {
  display: inline-block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  transition: 0.3s;
  font-size: 1.4em;
  height : 5px;
  border-bottom: 0.5px solid #fff; 
}

ul.topnav li a:hover {background-color: #111;
	background-color : rgba(0, 0, 0, 0.3);		
	}

	
.menubar{
	margin: 0;	
	width :100%;
	height : 130px;
}

#logo{			
	margin : auto;
	width : 150px;
	height :100px;
	float : left;
	margin-top : 30px;
	display : inline-block;
	background:transparent url("../images/logo.PNG");
	background-repeat:no-repeat;
	background-size : 100%;
	z-index : -5;
}

.container{
	padding-top : 150px;
}		

#menu{	
	vertical-align : middle;
	position : absolute;
	display : inline-block;
}

a{
	color : white;
}

.begin{
	margin : 5px 5px 5px 0px;
	width : 100%;
	height :auto;
	font-size :1.8em;
	color : white;
	text-align : center;
	background-color : rgba(0, 0, 0, 0.5);		
}

.brand{
	margin-top : 30px;			
	width : 100%;			
	text-align : center;					
}
.brnlogo
{
	height : 30px;
	width :80px;
	margin-bottom : 15px;
}
.footer
{
	padding-top : 50px;
	padding-bottom : 20px;
	text-align :center;
	font-size : 1.3em;
	color : white;
	
}
}

@media screen and (device-aspect-ratio: 375/667) {
	
ul.topnav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  margin-top : 0px;
  padding-left : 0px;
  font-weight : bold;
  vertical-align : top;
  line-height : 4px;
  height :170px;
  width : 160px;
  text-align : right;
  float: right;  
  
}

#map{
	width : 300px;
	height : 300px;
	padding-bottom : 0px;
}

ul.topnav li {float: right;margin-right : 0px;}

ul.topnav li a {
  display: inline-block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  transition: 0.3s;
  font-size: 1.4em;
  height : 5px;
  border-bottom: 0.5px solid #fff; 
  float: right;
}

ul.topnav li a:hover {background-color: #111;
	background-color : rgba(0, 0, 0, 0.3);		
	}

	
.menubar{
	margin: 0;	
	width :100%;
	height : 130px;
}

#logo{			
	margin : auto;
	width : 150px;
	height :100px;
	float : left;
	margin-top : 30px;
	display : inline-block;
	background:transparent url("../images/logo.PNG");
	background-repeat:no-repeat;
	background-size : 100%;
	z-index : -5;
	margin-right : 65px;
}

.container{
	padding-top : 150px;
}		

#menu{	
	vertical-align : middle;
	position : absolute;
	display : inline-block;
}

a{
	color : white;
}

.begin{
	margin : 5px 5px 5px 0px;
	width : 100%;
	height :auto;
	font-size :1.8em;
	color : white;
	text-align : center;
	background-color : rgba(0, 0, 0, 0.5);		
}

.brand{
	margin-top : 30px;			
	width : 100%;			
	text-align : center;					
}
.brnlogo
{
	height : 30px;
	width :80px;
	margin-bottom : 15px;
}
.footer
{
	padding-top : 50px;
	padding-bottom : 20px;
	text-align :center;
	font-size : 1.3em;
	color : white;
	
}	
}

@media screen and (device-aspect-ratio: 3/4) {
		
ul.topnav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  margin-top : 40px;
  padding-left : 0px;
  font-weight : bold;
  vertical-align : top;
  line-height : 4px;
  height :120px;  
  
}

#map{
	width : 600px;
	height : 500px;
	padding-bottom : 0px;
}

ul.topnav li {float: left;}

ul.topnav li a {
  display: inline-block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  transition: 0.3s;
  font-size: 1.9em;
  height : 5px;

}

ul.topnav li a:hover {background-color: #111;
	background-color : rgba(0, 0, 0, 0.3);		
	}

	
.menubar{
	margin: 0;	
	width :100%;
	height : 100px;
}

#logo{			
	margin-left : 20px;
	width : 150px;
	height :100px;
	float : left;
	margin-top : 30px;
	display : inline-block;
	background:transparent url("../images/logo.PNG");
	background-repeat:no-repeat;
	background-size : 100%;
	z-index : -5;
	margin-right : 65px;
	margin-right : 20px;
}

.container{
	padding-top : 100px;
}		

#menu{	
	vertical-align : middle;
	position : absolute;
	display : inline-block;
}

a{
	color : white;
}

.begin{
	margin : 5px 5px 5px 0px;
	width : 100%;
	height :auto;
	font-size :1.8em;
	color : white;
	text-align : center;
	background-color : rgba(0, 0, 0, 0.5);		
}

.brand{
	margin-top : 30px;			
	width : 100%;			
	text-align : center;					
}
.brnlogo
{
	height : 30px;
	width :60px;
	margin-bottom : 15px;
}
.footer
{
	padding-top : 50px;
	padding-bottom : 20px;
	text-align :center;
	font-size : 1.3em;
	color : white;
	
}
}