@import url(../font-awesome-4.5.0/raleway.css);
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1;
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


#cssmenu:after,
#cssmenu>ul:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

#cssmenu {
        height:41.31px;
	width: 100vw;
	border-bottom: 3px solid #283c51;
        background-color: #283c51;
	font-family: Raleway, sans-serif;
	line-height: 1;
        z-index:9997;
        position:fixed;
        top:0px;
}

#cssmenu ul {
	background: #283c51;
        z-index: 9998;
}

#cssmenu>ul>li {
	float: left;
}

#cssmenu.align-center>ul {
	font-size: 0;
	text-align: center;
}

#cssmenu.align-center>ul>li {
	display: inline-block;
	float: none;
}

#cssmenu.align-right>ul>li {
	float: right;
}

#cssmenu.align-right>ul>li>a {
	margin-right: 0;
	margin-left: -4px;
}

#cssmenu>ul>li>a {
	z-index: 9999;
	padding: 18px 25px 12px 25px;
	font-size: 15px;
	font-weight: 400;
	text-decoration: none;
	color: #ffffff;
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-ms-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	margin-right: -4px;
}

#cssmenu>ul>li.active>a,
#cssmenu>ul>li:hover>a,
#cssmenu>ul>li>a:hover {
	color: #ffffff;
}

#cssmenu>ul>li>a:after {
	position: absolute;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: -1;
	width: 100%;
	height: 120%;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	content: "";
	-webkit-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	-webkit-transform: perspective(5px) rotateX(2deg);
	-webkit-transform-origin: bottom;
	-moz-transform: perspective(5px) rotateX(2deg);
	-moz-transform-origin: bottom;
	transform: perspective(5px) rotateX(2deg);
	transform-origin: bottom;
}

#cssmenu>ul>li.active>a:after,
#cssmenu>ul>li:hover>a:after,
#cssmenu>ul>li>a:hover:after {
	background: #395673;
}



body {
 background-color: #fff;
 color: #666;
 font-family: "Open sans", Sans-serif;
 padding: 0;
 margin: 0
}

a {
 text-decoration: none
}

h1 {
 margin-top: 0
}

::-webkit-scrollbar {
    width: 5px;
    height: 2px;
}

/* Track */
::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 10px;
	background-color: #F5F5F5;
}

/* Handle */
::-webkit-scrollbar-thumb {
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #555;
}
::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(255,0,0,0.4); 
}






*, *:before, *:after {
  -webkit-tap-highlight-color: transparent;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  padding: 0;
  margin: 0;
}

@media (max-width: 600px) {
#searchbar{
  display:none;
}
body {font-size:0.8rem}
h1 {font-size:2rem}
h2{font-size:1.55rem}
h3{font-size:1.3rem}
h4{font-size:1.05rem}
h5{font-size:1rem}
h6{font-size:0.9rem}
#searchtitle {font-size:1.1rem}
}

@media (min-width: 600px) {
#searchmobile{
 display:none
}
body {font-size:0.8rem}
h1 {font-size:2rem}
h2{font-size:1.55rem}
h3{font-size:1.3rem}
h4{font-size:1.05rem}
h5{font-size:1rem}
h6{font-size:0.9rem}
#searchtitle {font-size:1.1rem}
}

.search-box {
  position: relative;
  width: 100%;
  max-width: 360px;
  height: 60px;
  border-radius: 120px;
  margin: 0 auto;
}
.search-icon, .go-icon {
    position: absolute;
    top: 21px;
    height: 60px;
    width: 38px;
    text-align: center;
}
.search-icon {
  left: 0;
  pointer-events: none;
  font-size: 1.22em;
  will-change: transform;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform-origin: center center;
  -webkit-transform-origin: center center;
  -moz-transform-origin: center center;
  -o-transform-origin: center center;
  transition: transform 400ms 220ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -webkit-transition: transform 400ms 220ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -moz-transition: transform 400ms 220ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -o-transition: transform 400ms 220ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
}
.si-rotate {
  transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
}
.go-icon {
  right: 0;
  pointer-events: none;
  font-size: 1.38em;
  will-change: opacity;
  cursor: default;
  opacity: 0;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transition: opacity 190ms ease-out, transform 260ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -webkit-transition: opacity 190ms ease-out, transform 260ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -moz-transition: opacity 190ms ease-out, transform 260ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -o-transition: opacity 190ms ease-out, transform 260ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
}
.go-in {
  opacity: 1;
  pointer-events: all;
  cursor: pointer;
  transform: rotate(0);
  -webkit-transform: rotate(0);
  -moz-transform: rotate(0);
  -o-transform: rotate(0);
  transition: opacity 190ms ease-out, transform 260ms 20ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -webkit-transition: opacity 190ms ease-out, transform 260ms 20ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -moz-transition: opacity 190ms ease-out, transform 260ms 20ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -o-transition: opacity 190ms ease-out, transform 260ms 20ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
}
.search-border {
  display: block;
  width: 100%;
  max-width: 360px;
  height: 60px;
}
.border {
  fill: none;
  stroke: #FFFFFF;
  stroke-width: 5;
  stroke-miterlimit: 10;
}
.border {
  stroke-dasharray: 740;
  stroke-dashoffset: 0;
  transition: stroke-dashoffset 400ms cubic-bezier(0.600, 0.040, 0.735, 0.990);
  -webkit-transition: stroke-dashoffset 400ms cubic-bezier(0.600, 0.040, 0.735, 0.990);
  -moz-transition: stroke-dashoffset 400ms cubic-bezier(0.600, 0.040, 0.735, 0.990);
  -o-transition: stroke-dashoffset 400ms cubic-bezier(0.600, 0.040, 0.735, 0.990);
}
.border-searching .border {
  stroke-dasharray: 740;
  stroke-dashoffset: 459;
  transition: stroke-dashoffset 650ms cubic-bezier(0.755, 0.150, 0.205, 1.000);
  -webkit-transition: stroke-dashoffset 650ms cubic-bezier(0.755, 0.150, 0.205, 1.000);
  -moz-transition: stroke-dashoffset 650ms cubic-bezier(0.755, 0.150, 0.205, 1.000);
  -o-transition: stroke-dashoffset 650ms cubic-bezier(0.755, 0.150, 0.205, 1.000);
}
#search1 {
    position: absolute;
    top: 0;
    left: 14px;
    width: 100%;
    height: 103%;
    border-radius: 120px;
    border: none;
    background: rgba(255,255,255,0);
    color: #FFFFFF;
    font-size: 13px;
    letter-spacing: -0.015em;
    outline: none;
}
#search1::-webkit-input-placeholder {color: #FFFFFF;}
#search1::-moz-placeholder {color: #FFFFFF;}
#search1:-ms-input-placeholder {color: #FFFFFF;}
#search1:-moz-placeholder {color: #FFFFFF;}
#search1::-moz-selection {color: #FFFFFF; background: rgba(0,0,0,0.25);}
#search1::selection {color: #FFFFFF; background: rgba(0,0,0,0.25);}


.msearch {
     display: inline-block;
    position: fixed;
    left: 26px;
    height: 25px;
    top: 8px;
    width: 25px;
  box-sizing: border-box;
  margin: 0px 8px 7px 0px;
  padding: 7px 9px 0px 9px;
  border: 3px solid #FFFFFF;
  border-radius: 25px;
  transition: all 200ms ease;
  cursor: text;
}
.msearchhandle {
     content: "";
    position: absolute;
    width: 3px;
    height: 12px;
    right: -4px;
    top: 16px;
  background: #FFFFFF;
  border-radius: 3px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  transition: all 200ms ease;
}

.msearch input {
  width: 100%;
  border: none;
  box-sizing: border-box;
  font-family: font-family: Raleway, sans-serif;
  font-size: 15px;
  color: white;
  background: transparent;
  outline-width: 0px;
      position: fixed;
    top: 12.3px;

}