@import "https://fonts.googleapis.com/css?family=Sintony";
@import 'https://fonts.googleapis.com/css?family=Ramaraja';
@import 'https://fonts.googleapis.com/css?family=Lora:400,700,700i';
@import 'https://fonts.googleapis.com/css?family=Roboto:300,400,700,900';

* {
  box-sizing: border-box;
}

body {
	background: url("");
	padding: 0;
	margin: 0;
	background-size: cover;
	background-position: center;
	color: #000;
	font-family: 'Roboto', sans-serif;
	}

/* MENU */	
	
*{margin:0px;padding:0px;}

#menu {
	position:fixed;
	padding-top:10px;
	background-size: cover;
	top:0;
	width:100%;
	height:80px;
	background-color: #fff;
	border-bottom:0px solid black;
	z-index:99999;
}

#menu a {
  color:#000;
}

a:hover {
  text-decoration:none;
  color:#000;
}
a.v1:hover {
  text-decoration:underline;
  color:#000;
}

img.logo {
max-width:27%;
}


.title {

position:fixed;
 	width:45%;
	font-family: 'Roboto', sans-serif;
	font-weight:500;
	font-size: 30px;
	padding-left:5%;
	padding-top:28px;
  float: left;
  
}

.nav {


	text-align:right;
	word-spacing: 24px;
	font-family: 'Roboto', sans-serif;
	font-weight:300;
	padding-right:5%;
	padding-top:44px;
	bottom:0;
	font-size: 15px;
	float: right;	
}


.menu-overlay {
position:fixed;
display:none;
  min-height:100vh;
  line-height:250%;
  font-family: 'Roboto', sans-serif;
	font-weight:300;
	font-size:20px;
  width:100vw;
  background-color:#fff;
  margin: 0 auto;
  top:0;
  right:0;
  z-index:99999;
  text-align:center;
  padding-top:37vh;
  
}

a.v1 {
color:#000; 
}

/*----------------------------------------------------------------------------*/









.menu-wrap {
top:0;
position:fixed;
height:80px;
  width: 100px;
  /*change this to resize the box*/
  
  background-color: #fff;
  color:#000;
  z-index:999999;
  /*background box color*/
}

.menu-wrap:hover > span {
  /*icon hover colors*/
  
  color: #000;
  background-color: #000;
}

.one {
  /*distance between bun and pattie*/
  
  -webkit-box-shadow: 0px 8px 0px 0px;
  -moz-box-shadow: 0px 8px 0px 0px;
  -o-box-shadow: 0px 8px 0px 0px;
  -ms-box-shadow: 0px 8px 0px 0px;
  box-shadow: 0px 8px 0px 0px;
}

.two {
  /*distance between bun and pattie*/
  
  -webkit-box-shadow: 0px -8px 0px 0px;
  -moz-box-shadow: 0px -8px 0px 0px;
  -o-box-shadow: 0px -8px 0px 0px;
  -ms-box-shadow: 0px -8px 0px 0px;
  box-shadow: 0px -8px 0px 0px;
}

.one,
.two {
  /*NO % value, as box-shadow doesn't accept*/
  
  width: 24px;
  height: 4px;
  color: #000;
  /*box-shadow color if not defined, takes up "color"; here always needs to be same as background;*/
  
  background: #000;
  /*hamburger and X icon color*/
  
  transition: ease 0.25s;
  -webkit-transition: ease 0.25s;
  -moz-transition: ease 0.25s;
  -o-transition: ease 0.25s;
  -ms-transition: ease 0.25s;
  /*change animation speed here*/
}

.menu-wrap {
  display: block;
  float: right;
  position:fixed;
  right:0;
  cursor: pointer;
  z-index:99999999999;
}

.menu-wrap:before {
  content: "";
  display: block;
  padding-top: 115%;
  z-index:9999999999;
}

.one,
.two {
  pointer-events: none;
  position: absolute;
  top: 0%;
  right: 0%;
  bottom: 0%;
  left: 0%;
  margin: auto;
  display: block;
  transform-origin: center;
  -webkit-transform-origin: center;
  -moz-transform-origin: center;
  -o-transform-origin: center;
  -ms-transform-origin: center;
}

.oneX {
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  -ms-box-shadow: none;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
}

.twoX {
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  -ms-box-shadow: none;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
}








.footer {
	background: #d8dadb;
	background-size: cover;
	background-color:#000;
font-family: 'Roboto', sans-serif;
	font-weight:300;
	padding: 0px;
	min-width:100%;
  	max-height:200px;
 	margin-top:0px;
 	padding:20px 0 20px 0;
 	color: #fff;
  	text-align:center;
  	font-size: 10pt;

}





/*-----RESPONSIVE------------*/

@media (max-width: 768px) {
  .menu {
  height:80px; 
    width:70%;
    background:#fff;
    
  }
  
  .nav {
    display:none
  }
  
  .title {

height:80px;
position:fixed;
 	width:100%;
	font-family: 'Roboto', sans-serif;
	font-weight:500;
	font-size: 30px;
	padding-left:5%;
	padding-top:17px;
	background:#fff;
  float: left;
  margin:0 auto;
  top:0;
  
}
}  

@media (min-width: 769px) {
  .menu-wrap {
    display:none;
  }
  
 .menu-overlay {
 display:none; 
 
}

 
 }
 

    

 