/* ========================= */
/* BODY BACKGROUND */
/* ========================= */

body{

margin:0;

font-family:Arial, Helvetica, sans-serif;

background:url("images/large-bg.jpg") no-repeat center center fixed;

background-size:cover;

}



/* ========================= */
/* HEADER */
/* ========================= */

header{

text-align:center;

padding-top:40px;

}



/* ========================= */
/* LOGO */
/* ========================= */

#logo{

width:220px;

height:220px;

margin:40px auto;

background:url("images/breddot.png") no-repeat center;

background-size:contain;

}


/* hover logo */

#logo:hover{

background:url("images/breddot-roll.png") no-repeat center;

background-size:contain;

}



/* ========================= */
/* NAVIGATION */
/* ========================= */

nav{

background:#222;

padding:8px 0;

text-align:center;

font-size:13px;

}

nav a{

color:white;

text-decoration:none;

margin:0 12px;

}

nav a:hover{

text-decoration:underline;

}



/* ========================= */
/* MAIN WRAPPER */
/* ========================= */

.wrapper{

width:80%;

margin:40px auto;

background-color:rgba(255,255,255,0.85);

padding:30px;

overflow:hidden;

box-shadow:0 0 15px rgba(0,0,0,0.4);

}



/* ========================= */
/* CONTENT */
/* ========================= */

.content{

width:65%;

float:left;

}

.content h1{

margin-top:0;

}

.content p{

line-height:1.6;

}



/* ========================= */
/* SIDEBAR */
/* ========================= */

.sidebar{

width:30%;

float:right;

background-color:rgba(255,255,255,0.6);

padding:20px;

box-shadow:0 0 10px rgba(0,0,0,0.2);

}

.sidebar h3{

margin-top:0;

}



/* ========================= */
/* FOOTER */
/* ========================= */

footer{

background:black;

color:white;

text-align:center;

padding:10px;

margin-top:30px;

font-size:12px;

}

footer a{

color:white;

text-decoration:none;

margin:0 5px;

}

footer a:hover{

text-decoration:underline;

}