.ap-interactive {
	max-width: 640px;
	background-color: #000000;
}

.swiper-container {
    text-align: center;
}

/*
#yemen .swiper-button-next, #yemen .swiper-button-prev {
    position: absolute;
    top: 80% !important;
 }*/

/* #yemen .swiper-button-next, #yemen .swiper-container-rtl .swiper-button-prev {
    background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%…2L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E);
    right: -10px;
    left: auto;
}*/

.swiper-wrapper {
	margin-bottom: 1.5rem;
}
#yemen .swiper-button-prev {
	left: 30%;
	background-image: none;
	color: #ffffff;
}
#yemen .swiper-button-next {
	right: 30%;
	background-image: none;
	color: #ffffff;
}
#yemen .swiper-button-next, #yemen .swiper-button-prev {
    top: 99.5%;
    width: 60px;
    height: 60px;
    background-size: 30px 30px;
    z-index: 9999;
}

.swiper-container .swiper-slide h2 {
    color: #ffffff;
    display: block;
}

.swiper-pagination-fraction {
	font-family: "GoodWeb-Bold";
    font-size: 1rem;
    bottom: 15px;
    color: #ffffff;
}
.swiper-slide p {
	margin: 1rem auto;
	text-align: left;
}
.portrait img {
	width: 100%;
}


@media (min-width:650px) {

.ap-interactive {
    height: 550px;
	max-width: 640px;
	background-color: #000000;
/* 	border:1px solid blue; */
}
}

@media (min-width:401px) and (max-width:649px) {

.ap-interactive {
    height: 550px;
	max-width: 640px;
	background-color: #000000;

}

.swiper-container {
    margin-top: 10%;
 
}

}


}

@media (max-width:400px) {

.swiper-container {
    margin-top: 10%;
 
}
.swiper-container p{
    width: 90%;
}
.ap-interactive {
    height: 600px;
    border:2px solid turquoise;
}
}