
* {
    box-sizing: border-box;
}

body{
     	font-family: 'proxima-nova', sans-serif;

}

#header{
	    width: 100%;
	    height: 300px;
	    background-image: url("/portfolio/images/banner.jpg");
	    background-size: cover;
	    
}

footer{
	width:100%;
	height:30;
	display: block;
	background-color: #2ECCFA;
    	font-size: 12px;
    	float: left;
	padding: 15px 15px;
	border: 2px;
}

#logo{
	background:url("/portfolio/images/Kuulstuff_logo1.jpg");
	background-repeat: no-repeat;
	width: 75px;
	height: 75px;
	float: left;
	border-radius: 60%;
}


#header nav{
	float: right;
	padding: 25px 25px;
}

#header nav ul{
	list-style-type: none;
    	padding: 0px;
   	 margin: 0px;

}

#header nav ul li {
    	display: inline;
    	padding-left: 15px; 
}







h2 {
 	color: #A4A4A4;

}


h1{
	color: #A4A4A4;
}


input[type=text] {
	padding:5px; border:2px solid #ccc; 
	-webkit-border-radius: 15px;
	border-radius: 5px;
}

input[type=email] {
	width: 25%;

}

input[type=text]:focus {
	border-color:#333; 
}

input[type=submit] {
	padding:5px 15px; background:#ccc; border:0 none;
	cursor:pointer;
	-webkit-border-radius: 5px;
	border-radius: 5px; 
}


textarea { 
	    width:50%;
	    height:10em; 
}

legend { 
    display: block;
    font-weight: bold;
    padding-left: 2px;
    padding-right: 2px;
    border: none;
}

span{
	color:red;
	position: relative;

}


/*
Footer
*/
.footer img{
	padding: 0;
}

.footer{
	position: relative;
	width: 100%;
	border-top: solid #DDDDDD 1px;
	margin-top: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-family: "proxima-nova";
	font-weight:  300;
	font-style: normal;
	font-size: 12px;
	color: #989DA1;	
	width: 100%;
	padding-bottom: 50px;
}

.footer a{
	font-family: "proxima-nova";
	font-weight:  300;
	font-style: normal;
	font-size: 12px;
	color: #989DA1;	
	text-decoration: none;
}

.footer-copyright{
	margin-right: 10px;
	float: left;
}

.footer-nav{

}

.footer-menu{
	position: relative;
	background-color: red;
}

.footer-nav li:first-child{
	list-style: none;
}

.footer-nav li{
	float: left;
	margin-right: 24px;
	list-style: disc;
}

.footer-nav a:hover{
	color: #3a4348;
}

.footer-nav ul{
	
}


.footer-social{
	display: inline-block;
	position: absolute;
	right: 20px;

}

.footer-social li{
	display: block;
	float: left;
	margin-left: 5px;
}

.footer-social i{
	background-color: #989DA1;
	border-radius: 50%;
	height: 20px;
	width: 20px;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}


.footer .fa-facebook:hover{
	background-color: #3F5C9A;
}

.footer .fa-twitter:hover{
	background-color: #55ACEE;
}

.footer .fa-instagram:hover{
	background-color: #8F5446;
}

.footer .footer-social a{
	color: #fff;
	text-decoration: none;
}

.footer-partners{
	line-height: 13px;
	clear: both;
	padding-top: 10px;
}


.footer-partners img{
	position: relative;
	height: 24px;
	width: auto;
	display: block;
}

.footer-partners li{
	display: block;
	float: left;
	margin-right: 5px;
}

.footer .development{
	margin-top: 10px;
	border-top: solid #DDDDDD 1px;
	padding-top: 10px;
}
.footer .development img{
	height: 13px;
}

.main-partners{
	float: right;
}



.header{position:fixed;top:0;background-color:white;width:100%;height:60px;border-bottom:#EDEDED solid 1px;-webkit-box-shadow:0px 2px 2px 0px rgba(245,245,245,1);-moz-box-shadow:0px 2px 2px 0px rgba(245,245,245,1);box-shadow:0px 2px 2px 0px rgba(245,245,245,1);font-family:"proxima-nova";font-weight:300;font-style:normal;font-size:14px;z-index:1000;}.header .logo img{height:60px;width:auto;display:block;padding:0;}.header .logo{display:inline-block;border-left:solid #F5F5F5 1px;border-right:solid #F5F5F5 1px;margin-right:20px;padding:0;}
.menu-header{display:inline-block;}
.header .menu a{color:#989DA1;text-decoration:none;text-transform:uppercase;}
.header .menu a:hover{color:#3d454c;}
.header .menu .current_page_item a,.header .menu .current-page-ancestor a{color:#3d454c;}
.header .menu li{display:block;float:left;line-height:60px;padding:0 20px;}
.mobile-nav{display:none;}
.container{position:relative;max-width:1000px;margin:auto;padding:0 0 0 0;}
.banner{position:relative;width:100%;margin:auto;padding:0 0 0 0;}

@media (max-width: 56em){
   .mobile-nav{display:block;z-index:1000;}
   .menu-header{display:none;}
   .banner{position:relative;width:100%;margin:auto;padding:0 0 0 0;}
}
.menu-btn{position:absolute;display:inline-block;right:20px;top:20px;cursor:pointer;}
.menu-btn div{position:absolute;left:100%;top:64%;padding-right:8px;margin-top:-0.50em;line-height:1.2;font-size:18px;font-weight:200;vertical-align:middle;z-index:99;}
.menu-btn span{display:block;width:20px;height:2px;margin:4px 0;background:#989da1;z-index:99;}
.responsive-menu{display:none;position:absolute;right:0;top:60px;font-size:22px;border-bottom:#EDEDED solid 1px;border-left:#EDEDED solid 1px;-webkit-box-shadow:0px 2px 2px 0px rgba(245,245,245,1);-moz-box-shadow:0px 2px 2px 0px rgba(245,245,245,1);box-shadow:0px 2px 2px 0px rgba(245,245,245,1);border-top:#EDEDED solid 1px;width:320px;box-sizing:border-box;background:#fff;}
.responsive-menu .menu-header{display:block;}
.responsive-menu .menu-header ul{background:#fff;position:relative;display:block;}
.responsive-menu .menu-header li{background:#fff;float:none;line-height:55px;width:100%;text-align:center;border-bottom:#EDEDED solid 1px;position:relative;padding:0;}
.responsive-menu .menu-header li:last-child{border-bottom:none;}.expand{display:block!important;}
.responsive-menu .menu-header li .sub-menu{display:none;font-size:16px;}
.responsive-menu .menu-header li .sub-menu li{border-bottom:none;line-height:35px;}
.open-menu-link{display:none;position:absolute;right:15px;top:0;line-height:55px;color:#989DA1;font-size:30px;cursor:pointer;}
.responsive-menu .menu-header li .visible{display:block;}


@media(max-width: 40em){
	.responsive-menu, .responsive-menu .menu-header, .responsive-menu .menu-header .menu{
		width: 100%;
	}
	.responsive-menu .menu-header li{
		text-align: center;
	}
       .banner{position:relative;width:100%;margin:auto;padding:0 0 0 0;} 
}
