html,body{
    height:100%;
    padding:0;
    margin:0
}
.page{
    position:relative;
    display:table;
    table-layout:fixed;
    width:100%;
    height:100%;
    line-height:normal;
    text-align:center;
    font-family:Open Sans, sans-serif;
    font-size:1.1em;
    color:#333;
    background-color:#f0f0f0;
    background-size:cover;
    background-position:50% 50%;
    background-repeat:no-repeat;
    background-attachment:fixed
}
h1,h2,h3,h4,h5{
    line-height:1.3;
    font-weight:normal
}
.bg-position-top{
    background-position:50% 0
}
.bg-position-middle{
    background-position:50% 50%
}
.bg-position-bottom{
    background-position:50% 100%
}
.page:before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
    filter:alpha(opacity=40);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    opacity:0.4
}
img{
    max-width:100%;
    width:auto\9;
    height:auto
}
a,a:link{
    color:inherit;
    filter:alpha(opacity=85);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
    opacity:0.85
}
a:hover,a:focus,a:active{
    filter:alpha(opacity=100);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    opacity:1;
    -webkit-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
ul,ol{
    display:inline-block;
    text-align:left;
    max-width:50%
}
.container{
    position:relative;
    display:table-cell;
    width:100%;
    vertical-align:middle;
    padding:1em 2em;
    z-index:1
}
.content{
    max-width:900px;
    margin:0 auto
}
.social-links:empty{
    outline:1px solid yellow
}
.social-links{
    padding:1em 0;
    vertical-align:middle
}
.social-links a{
    padding:0 0.3em;
    line-height:normal
}
.hosting-info{
    position:absolute;
    display:block;
    bottom:0;
    left:0;
    right:0;
    padding:1em;
    font-size:0.8em
}
.hosting-info p{
    margin:0;
    padding:0;
    font-size:12px
}
.overlay-dark{
    background-color:#333
}
.overlay-dark:before{
    background-color:#333
}
.overlay-bright{
    background-color:white
}
.overlay-bright:before{
    background-color:white;
    filter:alpha(opacity=70);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    opacity:0.7
}
@media screen{
    .page[class]{
      background: white;
    }
}
body.debug:after{
    content:"default";
    position:fixed;
    left:0;
    bottom:0;
    background-color:white;
    color:black;
    padding:0.5em;
    font-size:10px;
    text-transform:uppercase
}
@media screen and (max-width: 640px){
    body.debug:after{
        content:"small"
    }
    h1{
        font-size:2em
    }
    ul,ol{
        max-width:none
    }
    .page{
        min-width:300px
    }
    .page .container{
        padding:3em
    }
}
@media screen and (min-width: 641px) and (max-width: 1199px),(min-height:500px) and (max-height: 1199px){
    body.debug:after{
        content:"medium"
    }
}
@media screen and (min-width: 1200px){
    body.debug:after{
        content:"large"
    }
}
.page .fallback-bg{
    display:none
}
.ie8 .page .fallback-bg{
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%;
    max-width:inherit;
    z-index:0
}
 

.btn {
  background: None;
  border: 2pt;
  border-style: solid;
  padding: 3pt 6pt;
  cursor: pointer;
  font-size: 12pt;
}

.btn:hover {
  background-color: darkgrey;
  color: white;
  border: 2pt;
  border-style: solid;
}

.btn:after {}