/* social-media.css */
@media only screen and (max-width: 380px) {
	#offstageIG, #offstageFB {
		display: none;
	}
    #iconFB {
        display: none;
    }
}

/* @media screen and ( max-height: 600px ) {
	#offstageIG, #offstageFB {
		display: none;
	}
} */

@media only screen and (min-width: 375px) {
    #offstageIG {
        position: fixed;
        right: -330px;
        width: 330px;
        top: 70px;
        z-index: 1000;
        border: none;
        padding: 0;
        background: transparent;
        transition: right 0.8s ease-in-out;
        -o-transition: right 0.8s ease-in-out;
        -ms-transition: right 0.8s ease-in-out;
        -moz-transition: right 0.8s ease-in-out;
        -webkit-transition: right 0.8s ease-in-out;
    }

    #iconIG {
        position: absolute;
        right: 330px;
        width: 25px;
        top: 0;
    }

 #offstageIG:hover {
        right: 0;
    }

    #offstageFB {
        position: fixed;
        width: 330px;
        right: -330px;
        top: 70px;
        z-index: 1000;
        border: none;
        padding: 0;
        background: transparent;
        transition: right 0.8s ease-in-out;
        -o-transition: right 0.8s ease-in-out;
        -ms-transition: right 0.8s ease-in-out;
        -moz-transition: right 0.8s ease-in-out;
        -webkit-transition: right 0.8s ease-in-out;
    }

    #iconFB {
        position: absolute;
        right: 330px;
        width: 25px;
        top: 34px;
    }

        #offstageFB:hover {
        right: 0;
    }


}

@media only screen and (min-width: 768px) {
    #offstageIG {
        position: fixed;
        width: 370px;
        right: -370px;
        top: 70px;
        z-index: 1000;
        border: none;
        padding: 20px;
        background: transparent;
        transition: right 0.8s ease-in-out;
        -o-transition: right 0.8s ease-in-out;
        -ms-transition: right 0.8s ease-in-out;
        -moz-transition: right 0.8s ease-in-out;
        -webkit-transition: right 0.8s ease-in-out;
    }

    #offstageIG:hover {
        right: 0;
    }

    #iconIG {
        position: absolute;
        right: 370px;
        width: 75px;
        top: 75px;
    }

    #offstageFB {
        position: fixed;
        width: 370px;
        right: -370px;
        top: 70px;
        z-index: 1000;
        border: none;
        padding: 20px;
        background: transparent;
        transition: right 0.8s ease-in-out;
        -o-transition: right 0.8s ease-in-out;
        -ms-transition: right 0.8s ease-in-out;
        -moz-transition: right 0.8s ease-in-out;
        -webkit-transition: right 0.8s ease-in-out;
    }

    #offstageFB:hover {
        right: 0;
    }

    #iconFB {
        position: absolute;
        right: 370px;
        width: 75px;
        top: 160px;
    }
}

