.sidebar-text-default{
    font-family: "Open Sans Condensed",sans-serif;
    font-size: 55px;
    color: white;
}
.sidebar-text-container{
    display: none;
    margin-top:80px;
    margin-left: 20px;
    position: absolute;
}

@media(max-width:767px){

    .chalk-board-wood{
        background-image: url("../img/animated_btn/wood.jpg");
        background-position: center center;
        background-size: cover;
        width: 100%;
        height: 100%;
        left:0;
        right:0;
        margin:auto;
    }

    .chalk-board{
        display: none;
    }

    .sidebar-text-container{
        display: block;
    }
}

@media(min-width:768px){

    .link-btn-container {
    }
    .chalk-board-wood{
        background-image: url("../img/animated_btn/wood.jpg");
        background-position: center center;
        background-size: cover;
        width: 100%;
        height: 400px;
        left:0;
        right:0;
        margin:auto;
    }

    .chalk-board{
        background-image: url("../img/animated_btn/chalkboard.jpg");
        background-position: center center;
        background-size: cover;
        width: 450px;
        height: 300px;
        left:0;
        right:0;
        margin:auto;

        position: relative;
        top: 50%;
        transform: translateY(-50%);
    }

    .link-btns {

        width: 395px;
        height: 250px;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        margin: auto;

        position: relative;
        top: 50%;
        transform: translateY(-50%);
    }

    .connect-btn-img {
        height: 80px;
        width: 98px;
        object-fit: cover;
        -moz-transition: object-position .4s ease;
        -webkit-transition: object-position .4s ease;
        -o-transition: object-position .4s ease;
    }

    .connect-container {
        width: 210px;
        border: 5px solid white;
        overflow: hidden;
    }

    #connect-male {
        object-position: 75%;
    }

    #connect-female {
        object-position: 15%;
    }

    .connect-container:hover #connect-male {
        object-position: 30%;
    }

    .connect-container:hover #connect-female {
        object-position: 70%;
    }

    .about-container {
        position: relative;
        height: 100px;
        width: 100px;
        border: 5px solid white;
        border-radius: 50% 50%;
    }

    .about-btn{
        padding-right: 10px;
    }

    .about-btn-text {
        bottom: 0;
        height: 60px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center top;
        position: absolute;
        right: 0;
        top: 0;
        width: 65px;
    }

    .about-btn-i {
        bottom: 0;
        height: 60px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center bottom;
        position: absolute;
        right: 0;
        top: 0;
        width: 7.5px;
    }

    .about-btn-img {
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        position: absolute;
        height: 95px;
        width: 60px;
        object-fit: cover;
        object-position: 0% 0%;
        -moz-transition: object-position .4s ease;
        -webkit-transition: object-position .4s ease;
        -o-transition: object-position .4s ease;
    }

    .about-container:hover .about-btn-img {
        object-position: 0% 105%;
    }

    .events-btn-container {
        position: relative;
        height: 125px;
        width: 100px;
        border: 5px solid white;
        overflow: hidden;
    }

    .events-btn-text {
        bottom: 0;
        height: 100px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center top;
        position: absolute;
        right: 0;
        top: 0;
        width:65px;
    }

    .events-btn-calender {
        bottom: 0;
        height: 120px;
        left: 7px;
        margin: auto;
        object-fit: contain;
        object-position: 0 40px;
        position: absolute;
        right: 0;
        top: 0;
        width: 80px;
    }

    .events-btn-pin {
        bottom: 0;
        height: 30px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center center;
        position: absolute;
        right: 33px;
        top: 3px;
        width: 35px;

        transition: All .4s;
        -moz-transition: All .4s;
        -webkit-transition: All .4s;
        -o-transition: All .4s;
    }

    .events-pin-container {
        border-radius: 50%;
        bottom: 21px;
        height: 78px;
        left: -24px;
        margin: auto;
        overflow: hidden;
        position: absolute;
        right: 0;
        top: 0;
        width: 75px;
    }

    .events-btn-container:hover .events-btn-pin {
        right: -25px;
        top: 44px;
    }

    .resources-container {
        position: relative;
        height: 190px;
        width: 125px;
        border: 5px solid white;
        overflow: hidden;
    }

    .resources-btn-text {
        bottom: 0;
        height: 32px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center top;
        position: absolute;
        right: 0;
        top: 150px;
        width: 100px;
    }

    .resources-btn-box {
        bottom: 5px;
        height: 190px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: 0 76px;
        position: absolute;
        right: 0;
        top: 0;
        width: 80px;
    }

    .resources-btn-lid {
        bottom: 12px;
        height: 200px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center center;
        position: absolute;
        right: 0;
        top: 0;
        width: 100px;

        transition: All .4s;
        -moz-transition: All .4s;
        -webkit-transition: All .4s;
        -o-transition: All .4s;
    }

    .resources-btn-sermons {
        bottom: -79px;
        height: auto;;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: 0 0;
        position: absolute;
        right: 0;
        top: 0;
        width: 90px;

        transition: All .6s;
        -moz-transition: All .6s;
        -webkit-transition: All .6s;
        -o-transition: All .6s;
    }

    .resources-btn-links {
        bottom: -79px;
        height: auto;;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: 0 0;
        position: absolute;
        right: 0;
        top: 0;
        width: 90px;

        transition: All .8s;
        -moz-transition: All .8s;
        -webkit-transition: All .8s;
        -o-transition: All .8s;
    }

    .resources-btn-blogs {
        bottom: -79px;
        height: auto;;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: 0 0;
        position: absolute;
        right: 0;
        top: 0;
        width: 90px;

        transition: All .8s;
        -moz-transition: All .8s;
        -webkit-transition: All .8s;
        -o-transition: All .8s;
    }

    .resources-container:hover .resources-btn-lid {
        bottom: 145px;
    }

    .resources-container:hover .resources-btn-sermons {
        bottom: 62px;
    }

    .resources-container:hover .resources-btn-links {
        bottom: 15px;
        right: 30px;
        -ms-transform: rotate(-40deg);
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg);
    }

    .resources-container:hover .resources-btn-blogs {
        bottom: -15px;
        left: 25px;
        -ms-transform: rotate(20deg);
        -webkit-transform: rotate(20deg);
        transform: rotate(20deg);
    }

    .top-btn-container {
        bottom: 0;
        left: 0px;
        margin: auto;
        right: 0;
        top: 0;
    }
}

@media(min-width:1326px) and (min-height: 720px) {
    .link-btn-container {
    }

    .chalk-board-wood{
        background-image: url("../img/animated_btn/wood.jpg");
        background-position: center center;
        background-size: cover;
        width: 100%;
        height: 800px;
        left:0;
        right:0;
        margin:auto;
    }
    .chalk-board{
        background-image: url("../img/animated_btn/chalkboard.jpg");
        background-position: center center;
        background-size: cover;
        width: 900px;
        height: 600px;
        left:0;
        right:0;
        margin:auto;
    }

    .link-btns {
        width: 730px;
        height: 500px;
        right: 0;
        left: 0;
        margin: auto;
        position: relative;
        top: 50%;
        transform: translateY(-50%);

    }

    .connect-btn-img {
        height: 159px;
        width: 193px;
        object-fit: cover;
        -moz-transition: object-position .4s ease;
        -webkit-transition: object-position .4s ease;
        -o-transition: object-position .4s ease;
    }

    .connect-container {
        width: 420px;
        border: 5px solid white;
        overflow: hidden;
    }

    #connect-male {
        object-position: 75%;
    }

    #connect-female {
        object-position: 15%;
    }

    .connect-container:hover #connect-male {
        object-position: 30%;
    }

    .connect-container:hover #connect-female {
        object-position: 70%;
    }

    .about-container {
        position: relative;
        height: 200px;
        width: 200px;
        border: 5px solid white;
        border-radius: 50% 50%;
    }

    .about-btn{
        padding-right: 20px;
    }

    .about-btn-text {
        bottom: 0;
        height: 120px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center top;
        position: absolute;
        right: 0;
        top: 0;
        width: 130px;
    }

    .about-btn-i {
        bottom: 0;
        height: 120px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center bottom;
        position: absolute;
        right: 0;
        top: 0;
        width: 15px;
    }

    .about-btn-img {
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        position: absolute;
        height: 190px;
        width: 120px;
        object-fit: cover;
        object-position: 0% 0%;
        -moz-transition: object-position .4s ease;
        -webkit-transition: object-position .4s ease;
        -o-transition: object-position .4s ease;
    }

    .about-container:hover .about-btn-img {
        object-position: 0% 105%;
    }

    .events-btn-container {
        position: relative;
        height: 250px;
        width: 200px;
        border: 5px solid white;
        overflow: hidden;
    }

    .events-btn-text {
        bottom: 0;
        height: 200px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center top;
        position: absolute;
        right: 0;
        top: 0;
        width: 130px;
    }

    .events-btn-calender {
        bottom: 0;
        height: 239px;
        left: 15px;
        margin: auto;
        object-fit: contain;
        object-position: 0 80px;
        position: absolute;
        right: 0;
        top: 0;
        width: 161px;
    }

    .events-btn-pin {
        bottom: 0;
        height: 60px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center center;
        position: absolute;
        right: 66px;
        top: 7px;
        width: 70px;

        transition: All .4s;
        -moz-transition: All .4s;
        -webkit-transition: All .4s;
        -o-transition: All .4s;
    }

    .events-pin-container {
        border-radius: 50%;
        bottom: 42px;
        height: 157px;
        left: -54px;
        margin: auto;
        overflow: hidden;
        position: absolute;
        right: 0;
        top: 0;
        width: 154px;
    }

    .events-btn-container:hover .events-btn-pin {
        right: -50px;
        top: 88px;
    }

    .resources-container {
        position: relative;
        height: 380px;
        width: 250px;
        border: 5px solid white;
        overflow: hidden;
    }

    .resources-btn-text {
        bottom: 0;
        height: 64px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center top;
        position: absolute;
        right: 0;
        top: 300px;
        width: 200px;
    }

    .resources-btn-box {
        bottom: 5px;
        height: 239px;
        left: 0px;
        margin: auto;
        object-fit: contain;
        object-position: 0 80px;
        position: absolute;
        right: 0;
        top: 0;
        width: 161px;
    }

    .resources-btn-lid {
        bottom: 25px;
        height: 407px;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: center center;
        position: absolute;
        right: 0;
        top: 0;
        width: 200px;

        transition: All .4s;
        -moz-transition: All .4s;
        -webkit-transition: All .4s;
        -o-transition: All .4s;
    }

    .resources-btn-sermons {
        bottom: -158px;
        height: auto;;
        left: 0;
        margin: auto;
        object-fit: contain;
        object-position: 0 0;
        position: absolute;
        right: 0;
        top: 0;
        width: 180px;

        transition: All .6s;
        -moz-transition: All .6s;
        -webkit-transition: All .6s;
        -o-transition: All .6s;
    }

    .resources-btn-links {
        bottom: -158px;
        height: auto;;
        left: 0px;
        margin: auto;
        object-fit: contain;
        object-position: 0 0;
        position: absolute;
        right: 0;
        top: 0;
        width: 180px;

        transition: All .8s;
        -moz-transition: All .8s;
        -webkit-transition: All .8s;
        -o-transition: All .8s;
    }

    .resources-btn-blogs {
        bottom: -158px;
        height: auto;;
        left: 0px;
        margin: auto;
        object-fit: contain;
        object-position: 0 0;
        position: absolute;
        right: 0;
        top: 0;
        width: 180px;

        transition: All .8s;
        -moz-transition: All .8s;
        -webkit-transition: All .8s;
        -o-transition: All .8s;
    }

    .resources-container:hover .resources-btn-lid {
        bottom: 290px;
    }

    .resources-container:hover .resources-btn-sermons {
        bottom: 125px;
    }

    .resources-container:hover .resources-btn-links {
        bottom: 30px;
        right: 60px;
        -ms-transform: rotate(-40deg);
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg);
    }

    .resources-container:hover .resources-btn-blogs {
        bottom: -30px;
        left: 50px;
        -ms-transform: rotate(20deg);
        -webkit-transform: rotate(20deg);
        transform: rotate(20deg);
    }

    .top-btn-container {
        bottom: 0;
        left: 0;
        margin: auto;
        right: 0;
        top: 0;
    }
}

.connect-btn{
    cursor: pointer;
}
.events-btn{
    cursor: pointer;
}
.resources-btn{
    cursor: pointer;
}
.about-btn{
    cursor: pointer;
}