/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	font-family: 'Poppins', sans-serif;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


h1 {}
h2 {}
h3 {}
h4 {}
h5 {}
h6 {}


header { height: 100px; width: 100%; background: #000; position: fixed; top: 0; }
	.header-container { width: 1200px; height: 100px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }

/*.sidebar-nav { width: 100%; right: 0; top: 0px; position: fixed; height: 100%; background: rgba(0, 0, 0, 0.9); transform: translateX(100%);
    transition: transform 100ms ease-in-out; box-sizing: border-box;  z-index: 10; }
    .sidebar-nav div { float: right; height: 100%; padding: 30px 40px; border-left: 2px solid #1464f5; background: #0a0a0a; width: 400px; }
    .sidebar-nav p { color: #fff; text-align: center; font-size: 18px; line-height: 22px; margin-top: 100px; }
    .sidebar-nav hr { background: #fff; margin: 30px 0; }
    .sidebar-nav ul { text-align: center; }
    	.sidebar-nav ul li { font-size: 22px; margin-bottom: 20px; }
    		.sidebar-nav ul li a { color: #1b59dc; }
    		.sidebar-nav ul li a:hover { color: #fff; }
    .sidebar-nav div .hamburger { margin: 0 auto; width: 100%; }
.toggle-slide { transform: translateX(0); }

.hamburger-box { }
.hamburger { position: relative; z-index: 20;}*/

.sidebar-nav { width: 100%; right: 0; top: 0px; position: fixed; height: 100%; background: rgba(0, 0, 0, 0.9); display: none;
    transition: transform 100ms ease-in-out; box-sizing: border-box;  z-index: 10; }
    .sidebar-nav div { float: right; height: 100%; padding: 30px 40px; border-left: 1px solid #1464f5; background: #0a0a0a; width: 400px; }
    .sidebar-nav p { color: #fff; text-align: center; font-size: 18px; line-height: 22px; margin-top: 20px; }
    .sidebar-nav hr { background: #fff; margin: 30px 0; }
    .sidebar-nav ul { text-align: center; }
    	.sidebar-nav ul li { font-size: 22px; margin-bottom: 20px; }
    		.sidebar-nav ul li a { color: #1b59dc; }
    		.sidebar-nav ul li a:hover { color: #fff; }
    .sidebar-nav div .hamburger { margin: 0 auto; width: 100%; }
    .sidebar-nav div img { display: block; margin: 20px auto 0; }
.toggle-slide { display: block; }

.hamburger-box { }
.hamburger { position: relative; z-index: 20;}

.content { width: 100%; }
	.content-container { background: url(../images/bg.jpg); background-size: cover; height: 100vh; display: flex; align-items: center; }
		.inside { display: flex; align-items: center; flex-direction: column; margin: 0 auto; }
			.inside h1 { font-size: 42px; font-weight: 600; color: #1464f5; margin-bottom: 25px; }
			.inside p.sub { color: #fff; font-weight: 600; font-size: 32px; margin-bottom: 40px; }
			.inside p { color: #fff; font-size: 22px; font-weight: 500; }
			.middle-form { width: 900px; margin: 0 auto 40px; position: relative;}
				.middle-form input { width: 85%; font-size: 22px; border: none; font-weight: 300; padding: 17px 20px 18px; /*height: 50px;*/ width: 85%; float: left; border-radius: 5px 0 0 5px; }
 				.middle-form input:focus { background-color: #eee;  outline: none;}
 				/*.middle-form a { width: 15%; border: none; font-size: 20px; font-weight: 300; margin: 0; text-transform: initial; letter-spacing: initial; height: 68px; float: left; background-color: #1b59dc; border-radius: 0 5px 5px 0; text-align: center;}
 					.middle-form a i { color: #fff; line-height: 68px;}*/

 				.middle-form button { width: 15%; border: none; font-size: 20px; font-weight: 300; margin: 0; text-transform: initial; letter-spacing: initial; height: 68px; float: left; background-color: #1b59dc; border-radius: 0 5px 5px 0; }
 					.middle-form button i { color: #fff; }
			
			.autocomplete-items { position: absolute; border: 1px solid #d4d4d4; border-bottom: none; border-top: none; z-index: 99; top: 100%; left: 0; right: 0; }
			.autocomplete-items div { padding: 20px; cursor: pointer; background-color: #fff; border-bottom: 1px solid #d4d4d4; }
			.autocomplete-items div:hover { background-color: #eee; }
			.autocomplete-active {
			  /*when navigating through the items using the arrow keys:*/
			  background-color: #eee !important;
			  color: #111;
			}

footer { width: 100%; background: #000; position: fixed; bottom: 0; padding: 40px 0; }
	.footer-container { width: 1200px; margin: 0 auto; }
		.footer-container p { color: #fff; text-align: center;}
		.footer-menu { margin-bottom: 20px; }
			.footer-container p a { color: #1464f5; cursor: pointer; text-decoration: none; }


@media screen and (max-width: 1200px) { 

	.header-container { width: 1000px; }
	.footer-container { width: 1000px; }

}

@media screen and (max-width: 1000px) { 

	.header-container { width: 768px; }
	.footer-container { width: 768px; }
	.inside { width: 768px; }
	.middle-form { width: 100%; }
	.inside p { text-align: center; font-size: 18px; line-height: 24px; }


}

@media screen and (max-width: 768px) { 

	header { height: 80px; }
	.header-container { width: 100%; box-sizing: border-box; padding: 0 20px; height: 80px; }
	.header-container img { width: 100px; }
	.footer-container { width: 100%; box-sizing: border-box; padding: 0 20px; }
	.footer-container p { font-size: 11px; }
	.inside { width: 100%; box-sizing: border-box; padding: 0 20px; }
	.inside h1 { font-size: 32px; margin-bottom: 25px; }
	.inside p.sub { font-size: 22px; margin-bottom: 25px; line-height: 26px; }
	.middle-form { margin-bottom: 25px; }
	.middle-form input { font-size: 16px; width: 80%; }
	.middle-form a { height: 60px; width: 20%; }
	.middle-form a i { line-height: 60px; }
	.middle-form button { height: 60px; width: 20%; }
	.sidebar-nav div { width: 80%; }
	.autocomplete-items div { padding: 10px 20px; }
	footer { padding: 25px 0; }
	.footer-menu { margin-bottom: 15px; }

}