@media (max-width: 1199px)
{
#wrapper {
	background-color: #fff;
	width: 675px;
	height: 354px;
	
	overflow: hidden;
	position: absolute;
	
	left: 0;
	border:solid 0px red;
}
#carousel img {
	display: block;
	float: left;
	
}
#prev, #next {
	background-color: rgba(255, 255, 255, 0.5);
	display: block;
	height: 354px;
	width: 50%;
	top: 0;
	position: absolute;
}
#prev:hover, #next:hover {
	background-color: #fff;
	
	background-color: rgba(255, 255, 255, 0.6);
}
#prev {
	left: -249px;
	background-position:right;
	
}
#next {
	right: -250px;
}
#pager {
	margin-left: -180px;
	position: absolute;
	left: 50%;
	
	bottom: 10px;
}
#pager a {
	border: 2px solid #fff;
	border-radius: 10px;
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 5px 0 0;
}
#pager a:hover {
	background-color: rgba(255, 255, 255, 0.5);
}
#pager a span {
	display: none;
}
#pager a.selected {
	background-color: #fff;
}



/*XXXXXXXXXXXXXXXXXXXXXXXX*/
#Position
{
margin-top:7.5%;
}

.width
{
width:500px;
height:354px;
}

#LeftArrow
{
margin-top:40%;
margin-left:270px;
}

#RightArrow
{
margin-top:40%;margin-right:270px;
}
}


@media (min-width:1200px) and (max-width: 1300px)
{
#wrapper {
	background-color: #fff;
	width: 650px;
	height: 354px;
	
	overflow: hidden;
	position: absolute;
	top: 10%;
	left:0%;
	border:solid 0px red;
}
#carousel img {
	display: block;
	float: left;
	
}
#prev, #next {
	background-color: rgba(255, 255, 255, 0.5);
	display: block;
	height: 354px;
	width: 50%;
	top: 0;
	position: absolute;
}
#prev:hover, #next:hover {
	background-color: #fff;
	
	background-color: rgba(255, 255, 255, 0.6);
}
#prev {
	left: -249px;
	background-position:right;
	
}
#next {
	right: -250px;
}
#pager {
	margin-left: -180px;
	position: absolute;
	left: 50%;
	
	bottom: 10px;
}
#pager a {
	border: 2px solid #fff;
	border-radius: 10px;
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 5px 0 0;
}
#pager a:hover {
	background-color: rgba(255, 255, 255, 0.5);
}
#pager a span {
	display: none;
}
#pager a.selected {
	background-color: #fff;
}



/*XXXXXXXXXXXXXXXXXXXXXXXX*/
#Position
{
margin-top:7.5%;
}

.width
{
width:500px;
height:354px;
}

#LeftArrow
{
margin-top:40%;
margin-left:270px;
}

#RightArrow
{
margin-top:40%;margin-right:270px;
}
}
@media (min-width: 1301px) and (max-width: 1400px)
{

#wrapper {
	background-color: #fff;
	width: 840px;
	height: 500px;
	overflow: hidden;
	position: absolute;
	top: 10%;
	left: 1.5%;
	border:solid 0px red;
}
#carousel img {
	display: block;
	float: left;
	
}
#prev, #next {
	background-color: rgba(0, 0, 0, 0.7);
	display: block;
	height: 500px;
	width: 36.2%;
	top: 0;
	position: absolute;
}
#prev:hover, #next:hover {
	background-color: #fff;
	
	background-color: rgba(0, 0, 0, 0.6);
}
#prev {
	left: -200px;
	background-position:right;
	
}
#next {
	right: -200px;
}
#pager {
	margin-left: -180px;
	position: absolute;
	left: 50%;
	
	bottom: 10px;
}
#pager a {
	border: 2px solid #fff;
	border-radius: 10px;
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 5px 0 0;
}
#pager a:hover {
	background-color: rgba(255, 255, 255, 0.4);
}
#pager a span {
	display: none;
}
#pager a.selected {
	background-color: #fff;
}



/*XXXXXXXXXXXXXXXXXXXXXXXX*/
#Position
{
margin-top:12%;
}

.width
{
width:631px;
height:500px;
}

#LeftArrow
{
margin-top:55%;
margin-left:210px;
}

#RightArrow
{
margin-top:55%;margin-right:210px;
}
}

@media (min-width: 1401px) and (max-width: 1799px)
{

#wrapper {
	background-color: #fff;
	width: 880px;
	height: 500px;
	
	overflow: hidden;
	position: absolute;
	top:6%;
	left: 2%;
	border:solid 0px red;
}
#carousel img {
	display: block;
	float: left;
	
}
#prev, #next {
	background-color: rgba(0, 0, 0, 0.7);
	display: block;
	height: 500px;
	width: 36.2%;
	top: 0;
	position: absolute;
}
#prev:hover, #next:hover {
	background-color: #fff;
	
	background-color: rgba(0, 0, 0, 0.6);
}
#prev {
	left: -200px;
	background-position:right;
	
}
#next {
	right: -200px;
}
#pager {
	margin-left: -180px;
	position: absolute;
	left: 50%;
	
	bottom: 10px;
}
#pager a {
	border: 2px solid #fff;
	border-radius: 10px;
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 5px 0 0;
}
#pager a:hover {
	background-color: rgba(255, 255, 255, 0.4);
}
#pager a span {
	display: none;
}
#pager a.selected {
	background-color: #fff;
}



/*XXXXXXXXXXXXXXXXXXXXXXXX*/
#Position
{
margin-top:12%;
}

.width
{
width:644px;
height:500px;
}

#LeftArrow
{
margin-top:55%;
margin-left:240px;
}

#RightArrow
{
margin-top:55%;margin-right:240px;
}
}

@media (min-width: 1800px)
{


#wrapper {
	background-color: #fff;
	width: 1100px;
	height: 500px;
	
	overflow: hidden;
	position: absolute;
	top:14%;
	left: 15px;
	border:solid 0px red;
}
#carousel img {
	display: block;
	float: left;
	
}
#prev, #next {
	background-color: rgba(0, 0, 0, 0.7);
	display: block;
	height: 500px;
	width: 36.2%;
	top: 0;
	position: absolute;
}
#prev:hover, #next:hover {
	background-color: #fff;
	
	background-color: rgba(0, 0, 0, 0.6);
}
#prev {
	left: -200px;
	background-position:right;
	
}
#next {
	right: -200px;
}
#pager {
	margin-left: -180px;
	position: absolute;
	left: 50%;
	
	bottom: 10px;
}
#pager a {
	border: 2px solid #fff;
	border-radius: 10px;
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 5px 0 0;
}
#pager a:hover {
	background-color: rgba(255, 255, 255, 0.4);
}
#pager a span {
	display: none;
}
#pager a.selected {
	background-color: #fff;
}



/*XXXXXXXXXXXXXXXXXXXXXXXX*/
#Position
{
margin-top:12%;
}

.width
{
width:700px;
height:500px;
}

#LeftArrow
{
margin-top:55%;
margin-left:270px;
}

#RightArrow
{
margin-top:55%;margin-right:270px;
}
}