body{background: url(img/mrback.png) repeat;}
#wrapper{
	width: 100%;
	height:100%;
	margin-top: -2px;
  text-align: center;
  position: absolute;
}

#logo{

  position: relative; height: 100% width:100%;
    top: 41%;
    transform: translateY(-59%);

}

 @-moz-document url-prefix() {
                        #logo{
                        top:40%;
                        transform: none;
                    }
                    }

#cal{

  position: relative; height: 100% width:100%;}


#logo_mob{display: none;}

#content{
  position: absolute;
    bottom:50px;
    height: 150px;
    width:100%;
    text-align: center;
    margin-bottom:10px;
}

#one{background: url(img/mr_3.png) no-repeat; background-size: 300px; height:100px; width:300px; display:inline-block}
#one:hover{background: url(img/mr_hover_3.png) no-repeat; background-size: 300px; height:100px; width:300px; display:inline-block}

#two{background: url(img/mr_2.png) no-repeat; background-size: 300px; height:100px; width:300px; display:inline-block;}
#two:hover{background: url(img/mr_hover_2.png) no-repeat; background-size: 300px; height:100px; width:300px; display:inline-block; }


#three{background: url(img/mr_1.png) no-repeat; background-size: 300px; height:100px; width:300px; display:inline-block}
#three:hover{background: url(img/mr_hover_1.png) no-repeat; background-size: 300px; height:100px; width:300px; display:inline-block}

#divide{background: url(img/mr_divide.png) no-repeat center; background-size: 3px; height:100px; width:20px; display:inline-block}


#social{position:absolute; bottom:5px; width:100%;}
#facebook{background: url(img/mr_social-1.png) no-repeat center; background-size: 33px; margin: 6px 3px 8px 8px; height:34px; width:34px; display:inline-block}
#facebook:hover{background: url(img/mr_socialhover-1.png) no-repeat center; background-size: 34px; height:34px; width:34px; display:inline-block}

#instagram{background: url(img/mr_social-2.png) no-repeat center; background-size: 34px; margin: 8px; height:34px; width:34px; display:inline-block}
#instagram:hover{background: url(img/mr_socialhover-2.png) no-repeat center; background-size: 34px; height:34px; width:34px; display:inline-block}

#twitter{background: url(img/mr_social-3.png) no-repeat center; background-size: 34px; margin: 8px; height:34px; width:34px; display:inline-block}
#twitter:hover{background: url(img/mr_socialhover-3.png) no-repeat center; background-size: 34px; height:34px; width:34px; display:inline-block}

#menu{background: url(img/mr_menu1.png) no-repeat center; background-size: 80px; margin:7px; height:34px; width:80px; display:inline-block}
#menu:hover{background: url(img/mr_menu1hover.png) no-repeat center; background-size: 80px; margin:7px; height:34px; width:80px; display:inline-block}

#calendar{background: url(img/calendar.png) no-repeat center; background-size: 105px; margin:8px; height:34px; width:105px; display:inline-block}

#calendar:hover{background: url(img/calendar_hover.png) no-repeat center; background-size: 105px; margin:8px; height:34px; width:105px; display:inline-block}

@media (max-width: 900px) {
#logo{display:none;}

#logo_mob{display: block; position:relative; margin-top: 20px; height: 160px; width:100%;}

#content{position:relative; height: 240px}

#divide{display:none}
#one{display:block; margin:auto;}
#one:hover{display:block}

#two{display:block; margin:auto;}
#two:hover{display:block; margin:auto;}

#three{display:block; margin:auto;}
#three:hover{display:block; margin:auto;}

#social{position:relative; margin-top: 10px; width:100%;}

}