body {
  background-image: url(images/bg10.jpg);
  background-position: bottom center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color:#050a0c;
  margin: 0px;
}

a.arrow:link { font-size: 13px; font-weight: 700; font-family: arial, helvetica, sans-serif; background:url("images/arrow.png") no-repeat right; margin:3px 0 0 20px; padding:0 20px 0 0; color: #66cc00; text-decoration: none;}
a.arrow:hover { font-size: 13px; font-weight: 700; font-family: arial, helvetica, sans-serif; background:url("images/arrow.png") no-repeat right; margin:3px 0 0 20px; padding:0 20px 0 0; color: #f8f8f8; text-decoration: none; }

.titlebg {
width: 100%;
padding:5px;
float: right;
height: 100%; 
background:#01a611;
}

h1 {
font-size: 18px;
font-weight: 400;
font-family: 'Segoe UI',Segoe,'Trebuchet MS',Arial,sans-serif;
color: White;
text-align: right;
text-transform: uppercase;
margin-bottom: 5px;
margin-top: 6px;
margin-right:10px;

}

h2 {
font-size: 18px;
font-weight: 400;
font-family: 'Segoe UI',Segoe,'Trebuchet MS',Arial,sans-serif;
color: #f8f8f8;
text-align: center;
text-transform: uppercase;
margin-bottom: 5px;
margin-top: 6px;
margin-right:30px;
border-bottom: thin solid #cccccc;

}

.container {
width: 420px;
padding:5px;
margin-top: 5px;
float: right;
margin-right:5px;
background-color: #050a0c;
opacity: 0.9;
}

.content {
width: 400px;
padding:2px;
}

* {
    box-sizing: border-box;
}


p {
font-size: 15px;
font-weight: 400;
font-family: 'Segoe UI',Segoe,'Trebuchet MS',Arial,sans-serif;
color: #fff;
}

a {
    color: #66cc00;
font-weight: 400;
text-decoration: none;
}

.social-media{
    display: flex;
    justify-content: center;
    padding: 2px;
}

.fblogo {
    padding: 10px;
}


/* PORTFOLIO */

label {
  display: block;
  margin: 20px 0 0;
}
label:hover {
  text-decoration: underline;
}
input {
  position: absolute;
  left: -999em;
}
.hide {
  width: 100%;
  border: 1px solid #000;
  max-height: 99em;
  opacity: 1;
  height: auto;
  overflow: hidden;
  transition: opacity 1.5s linear, max-height 1.5s linear;
}
.hide p {
  padding: 10px;
  margin: 0;
}
.ex1 input[type="checkbox"]:checked + div {
  opacity: 0;
  max-height: 0;
  border: none;
  margin-bottom: 60px;
}
.follow {
  border-top: 1px solid blue;
  margin: 0;
}


/* COLUMN*/
.column {
    float: left;
    width: 25%;
    padding: 10px;
}

.row:after {
    content: "";
    display: table;
    clear: both;
}

@media screen and (max-width: 600px) {
    .column {
        width: 100%;
    }



}





.social-media{
    display: flex;
    justify-content: center;
    padding: 2px;
}

.fblogo {
    padding: 30px;
}

    }



#wrapper {
  max-width: 400px;
  margin: 10px auto 10px auto ;
  background-color: #050a0c
}
#outer {
  display: table;
  width: 100%;
  table-layout: fixed;
}
.itemwrapper {
  display: table-cell;
  vertical-align: top;
  width: 100%;
  padding: 2px;
}
img {
  max-width: 100%;
  height: auto;
}

div#footer div.wrapper div.column {
    display: block;
}