.steps h1{font-family: Open Sans,sans-serif !important; font-size: 22px; font-weight:400; line-height:22px;}

.why h1{font-family: Open Sans,sans-serif !important; font-size: 38px; font-weight:300; line-height:100px; text-align:center; }

.how h1{font-family: Open Sans,sans-serif !important; font-size: 38px; font-weight:300; padding-top:20px; text-align:center; }

.why h2{font-family: Open Sans,sans-serif !important; font-size: 20px; font-weight:300; line-height:30px; color:#4697c5; margin-left:15px;}

.why h3{font-family: Open Sans,sans-serif !important; font-size: 22px; font-weight:300; padding-bottom:20px; text-align:center;}

.why h4{font-family: Open Sans,sans-serif !important; font-size: 18px; font-weight:200; line-height:30px; text-align:center; margin-top:-20px;}

.category h1{font-family: Open Sans,sans-serif !important; font-size: 38px; font-weight:300; line-height:100px; text-align:center;}

.why .col{border-left:1px solid #cccccc; border:1px solid #e2e1e1; width:300px; float:left; height:400px;}

.why .gap{float:left; width:20px;}

.why p{font-family: Open Sans,sans-serif !important; font-size: 14px; margin-left:15px; margin-right:15px;}

.why a.more{
 display: inline-block;
   text-decoration: none;
   padding: 7px 20px;
   background: #d73838;
   color: #fff;
   text-transform: uppercase;
   border-radius:23px;
   margin: 10px 0 0 95px;}

.why a.morerates{
 display: inline-block;
   text-decoration: none;
   padding: 10px 25px;
   background: #d73838;
   color: #fff;
   text-transform: uppercase;
   border-radius:23px;
margin-left: 36%;}

.merchants-title{font-family: Open Sans,sans-serif !important; font-size: 18px; font-weight:400; line-height:50px; color:#4697c5; clear:both; }

.shopsite{
  float: none; 
  clear: both;
  width: 960px;
  margin-bottom:30px;
}

.country{
  float: none; 
  clear: both;
  width: 960px;
  margin-bottom:30px;
}

.country h1{font-family: Open Sans,sans-serif !important; font-size: 38px; font-weight:300; line-height:100px; text-align:center; }

.shopsite ul {
  list-style: none;
  margin: 0px;
  padding: 0px;
  width: 960px; 
}

.shopsite li{
float: left; 
width: 310px;
background:#f6f6f6;
font-family: Open Sans,sans-serif !important; font-size: 14px; 
font-weight:400;
margin-bottom:20px;
}

.shopsite li a{
  display: block; 
  width: 310px; 
  padding: 20px; 
  border-left: 10px solid; 
  position: relative; 
  z-index: 2;
  text-decoration: none;
  color: #444;
  box-sizing: border-box;  
  -moz-box-sizing: border-box;  
  -webkit-box-sizing: border-box; 
}
	
.shopsite li a:hover{ border-bottom: 0px; color: #fff;}
.shopsite li:first-child a{ border-left: 10px solid #df649b; }
.shopsite li:nth-child(2) a{ border-left: 10px solid #de3027; }
.shopsite li:nth-child(3) a{ border-left: 10px solid #9e4f9e; }
.shopsite li:nth-child(4) a{ border-left: 10px solid #293490; }
.shopsite li:nth-child(5) a{ border-left: 10px solid #40a8dd; }
.shopsite li:last-child a{ border-left: 10px solid #a5cb38; }

.shopsite li a:after { 
  content: "";
  height: 100%; 
  left: 0; 
  top: 0; 
  width: 0px;  
  position: absolute; 
  transition: all 0.3s ease 0s; 
  -webkit-transition: all 0.3s ease 0s; 
  z-index: -1;
}

.shopsite li a:hover:after{ width: 100%; }
.shopsite li:first-child a:after{ background: #df649b; }
.shopsite li:nth-child(2) a:after{ background: #de3027; }
.shopsite li:nth-child(3) a:after{ background: #9e4f9e; }
.shopsite li:nth-child(4) a:after{ background: #293490; }
.shopsite li:nth-child(5) a:after{ background: #40a8dd; }
.shopsite li:last-child a:after{ background: #a5cb38; }

.hi-icon-wrap {
	text-align: center;
	margin: 0 auto;
	padding: 2em 0 0;
}

.fa {
	display: inline-block;
	font-size: 0px;
	cursor: pointer;
	margin: 0px 70px 10px 70px;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	text-align: center;
	position: relative;
	z-index: 1;
	color: #4697c5;
}

.fa:after {
	pointer-events: none;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	content: '';
	-webkit-box-sizing: content-box; 
	-moz-box-sizing: content-box; 
	box-sizing: content-box;

}

.fa:before {
	speak: none;
	font-size: 50px;
	line-height: 100px;
	font-style: normal;
	font-weight: 100;
	font-variant: normal;
	text-transform: none;
	display: block;
	-webkit-font-smoothing: antialiased;
}

.fa-credit-card:before {
	content: "\f011";
}

.fa-shopping-basket :before {
	content: "\f00f";
}

.fa-truck:before {
	content: "\f010";
}

.fa-user:before {
	content: "\f002";
}
/* Effect 1 */
.hi-icon-effect-1 .fa {
	box-shadow: 0 0 0 2px #e64d3d;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.hi-icon-effect-1 .fa:after {
	top: -2px;
	left: -2px;
	padding: 2px;
	z-index: -1;
	background: #e64d3d;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
	-moz-transition: -moz-transform 0.2s, opacity 0.3s;
	transition: transform 0.2s, opacity 0.3s;
}

/* Effect 1a */
.hi-icon-effect-1a .fa {
	color: #fff;
	text-decoration:none;
}

.hi-icon-effect-1a .fa:hover {
	color: #e64d3d;
}

.hi-icon-effect-1a .fa:hover:after {
	-webkit-transform: scale(1.3);
	-moz-transform: scale(1.3);
	-ms-transform: scale(1.3);
	transform: scale(1.3);
	opacity: 0;
}
/* Effect 2 */
.hi-icon-effect-2 .fa {
	box-shadow: 0 0 0 2px #ffcc09;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.hi-icon-effect-2 .fa:after {
	top: -2px;
	left: -2px;
	padding: 2px;
	z-index: -1;
	background: #ffcc09;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
	-moz-transition: -moz-transform 0.2s, opacity 0.3s;
	transition: transform 0.2s, opacity 0.3s;
}

/* Effect 2a */
.hi-icon-effect-2a .fa {
	color: #fff;
	text-decoration:none;
}

.hi-icon-effect-2a .fa:hover {
	color: #ffcc09;
}

.hi-icon-effect-2a .fa:hover:after {
	-webkit-transform: scale(1.3);
	-moz-transform: scale(1.3);
	-ms-transform: scale(1.3);
	transform: scale(1.3);
	opacity: 0;
}
/* Effect 3 */
.hi-icon-effect-3 .fa {
	box-shadow: 0 0 0 2px #33c5c5;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.hi-icon-effect-3 .fa:after {
	top: -2px;
	left: -2px;
	padding: 2px;
	z-index: -1;
	background: #33c5c5;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
	-moz-transition: -moz-transform 0.2s, opacity 0.3s;
	transition: transform 0.2s, opacity 0.3s;
}

/* Effect 3a */
.hi-icon-effect-3a .fa {
	color: #fff;
	text-decoration:none;
}

.hi-icon-effect-3a .fa:hover {
	color: #33c5c5;
}

.hi-icon-effect-3a .fa:hover:after {
	-webkit-transform: scale(1.3);
	-moz-transform: scale(1.3);
	-ms-transform: scale(1.3);
	transform: scale(1.3);
	opacity: 0;
}
/* Effect 4 */
.hi-icon-effect-4 .fa {
	box-shadow: 0 0 0 2px #9494f0;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.hi-icon-effect-4 .fa:after {
	top: -2px;
	left: -2px;
	padding: 2px;
	z-index: -1;
	background: #9494f0;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
	-moz-transition: -moz-transform 0.2s, opacity 0.3s;
	transition: transform 0.2s, opacity 0.3s;
}

/* Effect 4a */
.hi-icon-effect-4a .fa {
	color: #fff;
	text-decoration:none;
}

.hi-icon-effect-4a .fa:hover {
	color: #9494f0;
}

.hi-icon-effect-4a .fa:hover:after {
	-webkit-transform: scale(1.3);
	-moz-transform: scale(1.3);
	-ms-transform: scale(1.3);
	transform: scale(1.3);
	opacity: 0;
}
}
@-moz-keyframes spinAround {
	from {
		-moz-transform: rotate(0deg)
	}
	to {
		-moz-transform: rotate(360deg);
	}
}
@keyframes spinAround {
	from {
		transform: rotate(0deg)
	}
	to {
		transform: rotate(360deg);
	}
}



@-webkit-keyframes toRightFromLeft {
	49% {
		-webkit-transform: translate(100%);
	}
	50% {
		opacity: 0;
		-webkit-transform: translate(-100%);
	}
	51% {

		opacity: 1;
	}
}
@-moz-keyframes toRightFromLeft {
	49% {
		-moz-transform: translate(100%);
	}
	50% {
		opacity: 0;
		-moz-transform: translate(-100%);
	}
	51% {
		opacity: 1;
	}
}
@keyframes toRightFromLeft {
	49% {
		transform: translate(100%);
	}
	50% {
		opacity: 0;
		transform: translate(-100%);
	}
	51% {
		opacity: 1;
	}
}
.row_why{ float:left; width:960px;}

  .col-lg-0, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
    float: left;
  }
  .col-lg-0 {
    width: 36px;
  }
  .col-lg-1 {
    width: 79px;
  }
  .col-lg-2 {
    width: 159px;
  }
  .col-lg-3 {
    width: 240px;
  }
  .col-lg-4 {
    width: 319px;
  }
  .col-lg-5 {
    width: 444px;
  }
  .col-lg-6 {
    width: 480px;
  }
  .col-lg-7 {
    width: 559px;
  }
  .col-lg-8 {
    width: 639px;
  }
  .col-lg-9 {
    width: 720px;
  }
  .col-lg-10 {
    width: 799px;
  }
  .col-lg-11 {
    width: 879px;
  }
  .col-lg-12 {
    width: 960px;
  }
  
  .row_overseas{
  width:750px;
  float:left; 
}
	  .col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9{float:left}
	  .col-md-1{width:62px}
	  .col-md-2{width:124px}
	  .col-md-3{width:187px}
	  .col-md-4{width:249px}
	  .col-md-5{width:312px}
	  .col-md-6{width:375px}
	  .col-md-7{width:437px}
	  .col-md-8{width:499px}
	  .col-md-9{width:562px}
	  .col-md-10{width:624px}
	  .col-md-11{width:687px}
	  .col-md-12{width:750px}
.btn_LP {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 15px;
  font-weight:200;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 6px;
}
.btn_LP:focus,
.btn_LP:active:focus,
.btn_LP.active:focus,
.btn_LP.focus,
.btn_LP:active.focus,
.btn_LP.active.focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.btn_LP:hover,
.btn_LP:focus,
.btn_LP.focus {
  color: #333;
  text-decoration: none;
}
.btn_LP:active,
.btn_LP.active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
          box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}
.btn_LP.disabled,
.btn_LP[disabled],
fieldset[disabled] .btn_LP {
  cursor: not-allowed;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
          box-shadow: none;
  opacity: .65;
}
a.btn_LP.disabled,
fieldset[disabled] a.btn_LP {
  pointer-events: none;
}
.btn_LP-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}
.btn_LP-default:focus,
.btn_LP-default.focus {
  color: #333;
  background-color: #e6e6e6;
  border-color: #8c8c8c;
}
.btn_LP-default:hover {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.btn_LP-default:active,
.btn_LP-default.active,
.open > .dropdown-toggle.btn_LP-default {
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}
.btn_LP-default:active:hover,
.btn_LP-default.active:hover,
.open > .dropdown-toggle.btn_LP-default:hover,
.btn_LP-default:active:focus,
.btn_LP-default.active:focus,
.open > .dropdown-toggle.btn_LP-default:focus,
.btn_LP-default:active.focus,
.btn_LP-default.active.focus,
.open > .dropdown-toggle.btn_LP-default.focus {
  color: #333;
  background-color: #d4d4d4;
  border-color: #8c8c8c;
}
.btn_LP-default:active,
.btn_LP-default.active,
.open > .dropdown-toggle.btn_LP-default {
  background-image: none;
}
.btn_LP-default.disabled,
.btn_LP-default[disabled],
fieldset[disabled] .btn_LP-default,
.btn_LP-default.disabled:hover,
.btn_LP-default[disabled]:hover,
fieldset[disabled] .btn_LP-default:hover,
.btn_LP-default.disabled:focus,
.btn_LP-default[disabled]:focus,
fieldset[disabled] .btn_LP-default:focus,
.btn_LP-default.disabled.focus,
.btn_LP-default[disabled].focus,
fieldset[disabled] .btn_LP-default.focus,
.btn_LP-default.disabled:active,
.btn_LP-default[disabled]:active,
fieldset[disabled] .btn_LP-default:active,
.btn_LP-default.disabled.active,
.btn_LP-default[disabled].active,
fieldset[disabled] .btn_LP-default.active {
  background-color: #fff;
  border-color: #ccc;
}
.btn_LP-default .badge {
  color: #fff;
  background-color: #333;
}
.btn_LP-link {
  font-weight: bold;
  color: #4EC1E0;
  border-radius: 0;
  margin-left:100px;
  margin-bottom:20px;
  font-style:italic;
}
.btn_LP-link {
  font-weight: bold;
  color: #0098CE;
  border-radius: 0;
}
.btn_LP-link,
.btn_LP-link:active,
.btn_LP-link.active,
.btn_LP-link[disabled],
fieldset[disabled] .btn_LP-link {
  background-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.btn_LP-link,
.btn_LP-link:hover,
.btn_LP-link:focus,
.btn_LP-link:active {
  border-color: transparent;
}
.btn_LP-link:hover,
.btn_LP-link:focus {
  color: #ffffff;
  text-decoration: underline;
  background-color: transparent;
}
.btn_LP-link[disabled]:hover,
fieldset[disabled] .btn_LP-link:hover,
.btn_LP-link[disabled]:focus,
fieldset[disabled] .btn_LP-link:focus {
  color: #777;
  text-decoration: none;
}
.btn_LP-primary {
  color: #ffffff;
  background-color: #f0524c;
  border-color: #f0524c;
 
}
.btn_LP-primary:focus,
.btn_LP-primary.focus {
  color: #ffffff;
  background-color: #c13a33;
  border-color: #c13a33;
}
.btn_LP-primary:hover {
  color: #ffffff;
  background-color: #c13a33;
  border-color: #c13a33;
}
.btn_LP-primary:active,
.btn_LP-primary.active,
.open > .dropdown-toggle.btn_LP-primary {
  color: #ffffff;
  background-color: #c13a33;
  border-color: #c13a33;
}
.btn_LP-primary:active:hover,
.btn_LP-primary.active:hover,
.open > .dropdown-toggle.btn_LP-primary:hover,
.btn_LP-primary:active:focus,
.btn_LP-primary.active:focus,
.open > .dropdown-toggle.btn_LP-primary:focus,
.btn_LP-primary:active.focus,
.btn_LP-primary.active.focus,
.open > 
.btn_LP-primary:active,
.btn_LP-primary.active,
.open > .dropdown-toggle.btn_LP-primary {
  background-image: none;
}
.btn_LP-primary.disabled,
.btn_LP-primary[disabled],
fieldset[disabled] .btn_LP-primary,
.btn_LP-primary.disabled:hover,
.btn_LP-primary[disabled]:hover,
fieldset[disabled] .btn_LP-primary:hover,
.btn_LP-primary.disabled:focus,
.btn_LP-primary[disabled]:focus,
fieldset[disabled] .btn_LP-primary:focus,
.btn_LP-primary.disabled.focus,
.btn_LP-primary[disabled].focus,
fieldset[disabled] .btn_LP-primary.focus,
.btn_LP-primary.disabled:active,
.btn_LP-primary[disabled]:active,
fieldset[disabled] .btn_LP-primary:active,
.btn_LP-primary.disabled.active,
.btn_LP-primary[disabled].active,
fieldset[disabled] .btn_LP-primary.active {
  background-color: #337ab7;
  border-color: #4EC1E0;
}
.btn_LP-primary .badge {
  color: #337ab7;
  background-color: #fff;
}

img{border:none}
#pop{background:#fff;width:300px; height:282px;font-size:12px;position:fixed;right:0;bottom:0;}
#popHead{line-height:32px;background:#f6f0f3;border-bottom:1px solid #e0e0e0;font-size:12px;padding:0 0 0 10px;}
#popHead h2{font-size:14px;color:#666;line-height:32px;height:32px;}
#popHead #popClose{position:absolute;right:10px;top:1px;}
#popHead a#popClose:hover{color:#f00;cursor:pointer;}

.view {
   width: 470px;
   height: 211px;
   float: left;
   overflow: hidden;
   position: relative;
   text-align: center;
   cursor: default;
}
.view .maskus,.view .maskuk,.view .maskjp,.view .maskcn,.view .content {
	width: 470px;
	height: 211px;
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 1px;
}
.view img {
   display: block;
   position: relative;
}
.view h2 {
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 22px;
   font-family:Open Sans,sans-serif;
   margin: 30px 0 0 0;
   font-weight:300;
   line-height:50px;
}
.view p {
   font-family:Open Sans,sans-serif;
   font-size: 14px;
   position: relative;
   color: #fff;
   padding: 0 10px;
   text-align: center;
}
.view a.info {
   display: inline-block;
   text-decoration: none;
   padding: 7px 20px;
   background: #d73838;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #d73838;
   -moz-box-shadow: 0 0 1px #d73838;
   box-shadow: 0 0 1px #d73838;
   border-radius:23px;
}
.view a.info: hover {
   -webkit-box-shadow: 0 0 5px #d73838;
   -moz-box-shadow: 0 0 5px #d73838;
   box-shadow: 0 0 5px #d73838;
}
.view-fifth img {
   -webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
   -ms-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out;
}
.view-fifth .maskus {
  background-color:#50d0ce;
   -webkit-transform: translateX(-470px);
   -moz-transform: translateX(-470px);
   -o-transform: translateX(-470px);
   -ms-transform: translateX(-470px);
   transform: translateX(-470px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
   -ms-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out;
}
.view-fifth .maskuk {
  background-color:#ffca44;
   -webkit-transform: translateX(-470px);
   -moz-transform: translateX(-470px);
   -o-transform: translateX(-470px);
   -ms-transform: translateX(-470px);
   transform: translateX(-470px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
   -ms-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out;
}
.view-fifth .maskjp {
  background-color:#56c2e6;
   -webkit-transform: translateX(-471px);
   -moz-transform: translateX(-471px);
   -o-transform: translateX(-471px);
   -ms-transform: translateX(-471px);
   transform: translateX(-471px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
   -ms-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out;
}
.view-fifth .maskcn {
  background-color:#9fa3f4;
   -webkit-transform: translateX(-471px);
   -moz-transform: translateX(-471px);
   -o-transform: translateX(-471px);
   -ms-transform: translateX(-471px);
   transform: translateX(-471px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
   -o-transition: all 0.3s ease-in-out;
   -ms-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out;
}
.view-fifth h2 {
  font-weight:300px;
}
.view-fifth p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-fifth:hover .maskus,.view-fifth:hover .maskuk,.view-fifth:hover .maskjp,.view-fifth:hover .maskcn{
   -webkit-transform: translateX(0px);
   -moz-transform: translateX(0px);
   -o-transform: translateX(0px);
   -ms-transform: translateX(0px);
   transform: translateX(0px);
}

.view-fifth:hover img {
   -webkit-transform: translateX(470px);
   -moz-transform: translateX(470px);
   -o-transform: translateX(470px);
   -ms-transform: translateX(470px);
   transform: translateX(470px);
}
.view-fifth:hover p {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
/**
 * Styles for offbeatSlider
 * Version 0.9.1
 *
 * @author Dominik Grzelak
 * @since 2017-03-26
 */

.ofp-slider {
    max-width: 100%;
    margin: auto;
    padding: 0;
    display: block;
    position: relative;
}

.ofp-slides {
    width: 100%;
    height: 100%;
}

.ofp-slides > * {
    max-width: 100%;
}

.ofp-slides-text {
    padding: 20px 12px 20px;
}

.ofp-slides.slide-visible {
    display: block;
    opacity: 1;
}

.ofp-slides.slide-invisible {
    display: none;
    opacity: 0;
}

/**
 *   Navigation
 */

.ofp-slider-navigation {
    /*padding: 8px 4px;*/
    position: absolute;
    color: #4697c5;
    margin: 0;
    /*margin-top: 12px;*/
    /*margin-bottom: 0.25em;*/
}

/**
* no additional margin if navigation elements are positioned at the middle
 */
.ofp-slider-navigation.ofp-middle {
    margin-top: 0;
    margin-bottom: 0;
}

.ofp-slider-dots-active {
    color: #4697c5;
    background-color: #4697c5 !important;
}

.ofp-slider-dots {
    display: inline-block;
    height: 13px;
    width: 13px;
    padding: 0;
    color: #4697c5;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
    text-align: center;
    border: 1px solid #ccc !important;
}

.ofp-arrow-left, .ofp-arrow-right {
    cursor: pointer;
    margin: 0 6px;
    font-size: 1.8em;
}

@media all and (max-width: 520px) {
    .ofp-slider-dots {
        height: 16px;
        width: 16px;
    }

    .ofp-arrow-left, .ofp-arrow-right {
        font-size: 1.8em;
    }
}

.ofp-arrow-left {
    float: left;
}

.ofp-arrow-right {
    float: right;
}

.ofp-top-left > .ofp-arrow-left {
    margin-left: 0;
}

.ofp-top-right > .ofp-arrow-right {
    margin-right: 0;
}

/**
 * Alignment for navigation elements
 */
.ofp-center {
    display: inline-block;
    width: 100%;
    text-align: center;
}

.ofp-top-left {
    position: absolute;
    left: 2%;
    top: 12px;
}

.ofp-top-right {
    position: absolute;
    right: 2%;
    top: 12px
}

.ofp-bottom-left {
    position: absolute;
    left: 0;
    bottom: 12px;
}

.ofp-bottom-right {
    position: absolute;
    right: 0;
    bottom: 12px;
}

.ofp-middle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%)
}

.ofp-left {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0%, -50%);
    -ms-transform: translate(-0%, -50%)
}

.ofp-right {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%)
}

.ofp-top-middle {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%)
}

.ofp-bottom-middle {
    position: absolute;
    left: 50%;
    top: -3%;
    transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%)
}