/* CSS Document */

/* ---------------------------------------- */
/* A F T E R    B E F O R E    S T Y L E
/* ---------------------------------------- */
.before-after {
    position: relative;
    width: 100%;
    /*height: 100vh;
    min-height: 650px;*/
    z-index: 1;
}

.before-after img {
    max-width: none !important;
}

.view {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.view-before {
    z-index: 100;
	-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}

.view-after {
    z-index: 200;
    background: #EC6367;
	-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}

.dragme {
    position: absolute;
    width: 2px;
    height: 100%;
    top: 0px;
    left: 0px;
    background-color: #000000;
    cursor: pointer;
    z-index: 300;
}

.dragme .icon-drag {
    width: 29px;
    height: 66px;
	cursor: col-resize;
    background:url(../images/handle.png) no-repeat top center;
    display: block;
    position: absolute;
    top: 17%;
    left: -13px;
    margin-top: -30px;
}

.wrapper-after, .wrapper-before {
    position: relative;
   height: 100%;
}

.wrapper-after .img-bird-wrapper, .wrapper-before .img-bird-wrapper {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    margin-top: -250px;
    z-index: 9;
}

.img-bird-wrapper {
    width: 500px;
    height: 385px;
    display: block;
}

.img-bird-wrapper img {
    width: 100%;
    height: auto;
}

.shadown-bird {
    background: url(https://static.enginethemes.com/main/img/shadow.png) no-repeat center center;
    width: 240px;
    height: 25px;
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 25%;
}

.tooltip-item {
    width: 20px;
    height: 20px;
    margin: -15px 0 0 -15px;
    position: absolute;
    border-radius: 50%;
    border: 2px solid;
    -webkit-animation: pulse-item 0.6s infinite alternate;
    animation: pulse-item 0.6s infinite alternate;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}


.tcc_block .et_pb_slide_description h2.et_pb_slide_title{
/* font-size: 32px;	*/
}

.tcc_block .et_pb_slide_content,
.tcc_block .et_pb_slide_content p{
	/* font-size:14px !important; */
}

.tcc_block .et_pb_slide_description{
	padding:0 !important;
}

.tcc_block img{
	max-width:none !important;
}

.et_pb_slider .et_pb_slide.tcc_block{
    display: block;
    float: none;
    position: absolute;
    width: auto;
    margin-right: inherit;
    text-align: inherit;
    list-style: none !important;
}

.tcc_before_after{
	margin-bottom:0 !important;
}

@media (max-width: 1200px){
	.tcc_block{
		/* display:none; */
	}
}


@-webkit-keyframes pulse-item {
    from {
        -webkit-transform: scale3d(0.5, 0.5, 1);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
    }
}

@keyframes pulse-item {
    from {
        -webkit-transform: scale3d(0.5, 0.5, 1);
        transform: scale3d(0.5, 0.5, 1);
    }
    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.wrapper-after .tooltip-item {
    border-color: #fff;
}

.wrapper-after .tooltip-item:hover {
    background: #fff;
}

.wrapper-before .tooltip-item {
    border-color: #EC6367;
}

.wrapper-before .tooltip-item:hover {
    background: #EC6367;
}

.wrapper-after .tooltip-item.tooltip-item-1 {
    left: 55px;
    top: 130px;
}

.wrapper-after .tooltip-item.tooltip-item-2 {
    left: 140px;
    bottom: 10px;
}

.wrapper-after .tooltip-item.tooltip-item-3 {
    right: 155px;
    top: 220px;
}

.wrapper-after .tooltip-item.tooltip-item-4 {
    right: 210px;
    bottom: 70px;
}

.wrapper-before .tooltip-item.tooltip-item-1 {
    left: 55px;
    top: 130px;
}

.wrapper-before .tooltip-item.tooltip-item-2 {
    left: 140px;
    bottom: 10px;
}

.wrapper-before .tooltip-item.tooltip-item-3 {
    right: 155px;
    top: 220px;
}

.wrapper-before .tooltip-item.tooltip-item-4 {
    right: 210px;
    bottom: 70px;
}

.content-before-after {
    width: 1170px;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    margin-top: -70px;
}

.content-before-after .content-right {
    width: 285px;
    float: left;
}

.content-before-after .content-right h3 {
    color: #fefeff;
    font-size: 24px;
    margin: 0 0 40px;
    text-align: center;
}

.content-before-after.left-position .content-right h3 {
    color: #445963;
}

.content-before-after.right-position .btn-header {
    background: none;
    border: 2px solid #fff;
}

.content-before-after.left-position .btn-header {
    background: none;
    border: 2px solid #eb5155;
    color: #eb5155;
}

.content-before-after.left-position .btn-header:hover {
    color: #fff;
}

.content-before-after.right-position .btn-header:hover {
    background: #fff;
}

.content-before-after .content-left {
    width: 300px;
    float: right;
    text-align: center;
}

.content-before-after.right-position .content-detail-wrapper h3 {
    color: #fff;
}

.content-before-after.right-position .content-detail-wrapper h3 span.color-main {
    color: #445963;
}

.content-before-after .content-detail-wrapper .img-position {
    width: 35px;
    height: 35px;
    border: 1px solid #d94d51;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: #fff;
    overflow: hidden;
    display: block;
    margin: 0 auto;
}

.content-before-after.right-position .content-detail-wrapper .img-position {
    border-color: #fff;
}

.content-before-after .content-detail-wrapper .img-position img {
    width: 100%;
    height: auto;
}

.content-before-after .content-left ul li {
    display: none;
    position: absolute;
}

.content-before-after .content-left ul li.active {
    display: block;
}


.tcc_block{
	position: absolute;
}