
.flip-container {
       // margin: 50px;
        perspective: 1000;
        display: inline-block;
    }
    .flip-container:hover .back {
        transform: rotateY(180deg);
    }
    .flip-container:hover .front {
        transform: rotateY(0deg);
    }
    .flip-container, .front, .back {
        width: 200px;
        height: 200px;
		border-radius:100%;
		
    }
    .card {
        transition: 0.6s;
        transform-style: preserve-3d;
        position: relative;
    }
    .front, .back {
        position: absolute;
        backface-visibility: hidden;
        transition: 0.6s;
        transform-style: preserve-3d;
    }
    .front {
        z-index: 1;
        transform: rotateY(-180deg);
        background: url(novotel_back.jpg) no-repeat;
		border:10px solid #047B75;
		background-size:100% 100%;
    }
    .back {
        z-index: 2;
        transform: rotateY(0deg);
		border:10px solid #047B75;
        background: url("Novotel_Hotel.jpg") no-repeat;
		background-size:100% 100%;
    }
	
	 
//select 2 slide


.main_container {
       // margin: 50px;
        perspective: 1000;
        display: inline-block;
    }
    .main_container:hover .back_side {
        transform: rotateY(180deg);
    }
   .main_container:hover .front_side {
        transform: rotateY(0deg);
    }
   .main_container, .front_side, .back_side {
        width: 200px;
        height: 200px;
		border-radius:100%;
		
    }
    .card2 {
        transition: 0.6s;
        transform-style: preserve-3d;
        position: relative;
    }
    .front_side, .back_side {
        position: absolute;
        backface-visibility: hidden;
        transition: 0.6s;
        transform-style: preserve-3d;
    }
    .front_side {
        z-index: 1;
        transform: rotateY(-180deg);
        background: url("Shelton_back.jpg") no-repeat;
		background-size:100% 100%;
		border:10px solid #047B75;
    }
    .back_side {
        z-index: 2;
        transform: rotateY(0deg);
        background: url("Shelton.jpg") no-repeat;
		background-size:100% 100%;
		border:10px solid #047B75;
    }


//select 3 slide



.left_container {
       // margin: 50px;
        perspective: 1000;
        display: inline-block;
    }
    .left_container:hover .back_left {
        transform: rotateY(180deg);
    }
   .left_container:hover .front_left {
        transform: rotateY(0deg);
    }
   .left_container, .front_left, .back_left {
        width: 200px;
        height: 200px;
		border-radius:100%;
		
    }
    .card3 {
        transition: 0.6s;
        transform-style: preserve-3d;
        position: relative;
    }
    .front_left, .back_left {
        position: absolute;
        backface-visibility: hidden;
        transition: 0.6s;
        transform-style: preserve-3d;
    }
    .front_left {
        z-index: 1;
        transform: rotateY(-180deg);
        background: url("citrine_back.jpg") no-repeat;
		background-size:100% 100%;
		border:10px solid #047B75;
    }
    .back_left {
        z-index: 2;
        transform: rotateY(0deg);
        background: url("citrine_hotel.jpg") no-repeat;
		background-size:100% 100%;
		border:10px solid #047B75;
    }


//select 4 image


.right_container {
       // margin: 50px;
        perspective: 1000;
        display: inline-block;
    }
    .right_container:hover .back_right {
        transform: rotateY(180deg);
    }
   .right_container:hover .front_right {
        transform: rotateY(0deg);
    }
   .right_container, .front_right, .back_right {
        width: 200px;
        height: 200px;
		border-radius:100%;
		
    }
    .card4 {
        transition: 0.6s;
        transform-style: preserve-3d;
        position: relative;
    }
    .front_right, .back_right{
        position: absolute;
        backface-visibility: hidden;
        transition: 0.6s;
        transform-style: preserve-3d;
    }
    .front_right{
        z-index: 1;
        transform: rotateY(-180deg);
        background: url("front_side_b1.jpg") no-repeat;
		background-size:100% 100%;
		border:10px solid #047B75;
    }
    .back_right {
        z-index: 2;
        transform: rotateY(0deg);
        background: url("front_side_b2.jpg") no-repeat;
		background-size:100% 100%;
		border:10px solid #047B75;
    }




	

