*:after,
*:before {
margin: 0;
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
-webkit-user-select: none;
-ms-user-select: none;
-o-user-select: none;
-moz-user-select: none;
user-select: none;
cursor: default;
}

#testim-rating{
font-size: 18px;
}

.testim {
width: 100%;
position: absolute;
top: 50%;
-webkit-transform: translatey(-50%);
-moz-transform: translatey(-50%);
-ms-transform: translatey(-50%);
-o-transform: translatey(-50%);
transform: translatey(-50%);

}

.testim .wrap {
position: relative;
width: 100%;
max-width: 1200px;
padding: 40px 20px;
margin: auto;
}

.testim .arrow {
display: block;
position: absolute;
color: #333;
cursor: pointer;
font-size: 2em;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
padding: 5px;
z-index: 22222222;
}

.testim .arrow:before {
cursor: pointer;
}

.testim .arrow:hover {
color: #F28705;
}


.testim .arrow.left {
left: 60px;
}

.testim .arrow.right {
right: 60px;
}


.testim .dots {
text-align: center;
position: absolute;
width: 100%;
bottom: 60px;
left: 0;
display: block;
z-index: 3333;
height: 12px;
}

.testim .dots .dot {
list-style-type: none;
display: inline-block;
width: 12px;
height: 12px;
border-radius: 50%;
border: 1px solid #F28705;
margin: 0 10px;
cursor: pointer;
-webkit-transition: all .5s ease-in-out;
-ms-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
position: relative;
}

.testim .dots .dot.active,
.testim .dots .dot:hover {
background: #F28705;
border-color: #F28705;
}

.testim .dots .dot.active {
-webkit-animation: testim-scale .5s ease-in-out forwards;
-moz-animation: testim-scale .5s ease-in-out forwards;
-ms-animation: testim-scale .5s ease-in-out forwards;
-o-animation: testim-scale .5s ease-in-out forwards;
animation: testim-scale .5s ease-in-out forwards;
}

.our_testim {
padding: 160px 0;
min-height: 500px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: center;
background-image: url(../img/bg-lgith.png);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}

.testim .cont {

margin: 0 auto;
position: relative;
overflow: hidden;
}

.testim .cont>div {
text-align: center;
position: absolute;
top: 0;
left: 0;
padding: 0 0 70px 0;
opacity: 0;
}

.testim .cont>div.inactive {
opacity: 1;
}


.testim .cont>div.active {
position: relative;
opacity: 1;
}


.testim .cont div .img img {
display: block;
width: 100px;
height: 100px;
margin: auto;
border-radius: 50%;
}

.testim .cont div h2 {
color: #F28705;
font-size: 1em;
margin: 15px 0;
}

.testim .cont div p {
font-size: 1.15em;
color: #333;
width: 70%;
margin: auto;
}

.testim .cont div.active .img img {
-webkit-animation: testim-show .5s ease-in-out forwards;
-moz-animation: testim-show .5s ease-in-out forwards;
-ms-animation: testim-show .5s ease-in-out forwards;
-o-animation: testim-show .5s ease-in-out forwards;
animation: testim-show .5s ease-in-out forwards;
}

.testim .cont div.active h2 {
-webkit-animation: testim-content-in .4s ease-in-out forwards;
-moz-animation: testim-content-in .4s ease-in-out forwards;
-ms-animation: testim-content-in .4s ease-in-out forwards;
-o-animation: testim-content-in .4s ease-in-out forwards;
animation: testim-content-in .4s ease-in-out forwards;
}

.testim .cont div.active p {
-webkit-animation: testim-content-in .5s ease-in-out forwards;
-moz-animation: testim-content-in .5s ease-in-out forwards;
-ms-animation: testim-content-in .5s ease-in-out forwards;
-o-animation: testim-content-in .5s ease-in-out forwards;
animation: testim-content-in .5s ease-in-out forwards;
}

.testim .cont div.inactive .img img {
-webkit-animation: testim-hide .5s ease-in-out forwards;
-moz-animation: testim-hide .5s ease-in-out forwards;
-ms-animation: testim-hide .5s ease-in-out forwards;
-o-animation: testim-hide .5s ease-in-out forwards;
animation: testim-hide .5s ease-in-out forwards;
}

.testim .cont div.inactive h2 {
-webkit-animation: testim-content-out .4s ease-in-out forwards;
-moz-animation: testim-content-out .4s ease-in-out forwards;
-ms-animation: testim-content-out .4s ease-in-out forwards;
-o-animation: testim-content-out .4s ease-in-out forwards;
animation: testim-content-out .4s ease-in-out forwards;
}

.testim .cont div.inactive p {
-webkit-animation: testim-content-out .5s ease-in-out forwards;
-moz-animation: testim-content-out .5s ease-in-out forwards;
-ms-animation: testim-content-out .5s ease-in-out forwards;
-o-animation: testim-content-out .5s ease-in-out forwards;
animation: testim-content-out .5s ease-in-out forwards;
}

@-webkit-keyframes testim-scale {
0% {
-webkit-box-shadow: 0px 0px 0px 0px #eee;
box-shadow: 0px 0px 0px 0px #eee;
}

35% {
-webkit-box-shadow: 0px 0px 10px 5px #eee;
box-shadow: 0px 0px 10px 5px #eee;
}

70% {
-webkit-box-shadow: 0px 0px 10px 5px #ea830e;
box-shadow: 0px 0px 10px 5px #ea830e;
}

100% {
-webkit-box-shadow: 0px 0px 0px 0px #ea830e;
box-shadow: 0px 0px 0px 0px #ea830e;
}
}

@-moz-keyframes testim-scale {
0% {
-moz-box-shadow: 0px 0px 0px 0px #eee;
box-shadow: 0px 0px 0px 0px #eee;
}

35% {
-moz-box-shadow: 0px 0px 10px 5px #eee;
box-shadow: 0px 0px 10px 5px #eee;
}

70% {
-moz-box-shadow: 0px 0px 10px 5px #ea830e;
box-shadow: 0px 0px 10px 5px #ea830e;
}

100% {
-moz-box-shadow: 0px 0px 0px 0px #ea830e;
box-shadow: 0px 0px 0px 0px #ea830e;
}
}

@-ms-keyframes testim-scale {
0% {
-ms-box-shadow: 0px 0px 0px 0px #eee;
box-shadow: 0px 0px 0px 0px #eee;
}

35% {
-ms-box-shadow: 0px 0px 10px 5px #eee;
box-shadow: 0px 0px 10px 5px #eee;
}

70% {
-ms-box-shadow: 0px 0px 10px 5px #ea830e;
box-shadow: 0px 0px 10px 5px #ea830e;
}

100% {
-ms-box-shadow: 0px 0px 0px 0px #ea830e;
box-shadow: 0px 0px 0px 0px #ea830e;
}
}

@-o-keyframes testim-scale {
0% {
-o-box-shadow: 0px 0px 0px 0px #eee;
box-shadow: 0px 0px 0px 0px #eee;
}

35% {
-o-box-shadow: 0px 0px 10px 5px #eee;
box-shadow: 0px 0px 10px 5px #eee;
}

70% {
-o-box-shadow: 0px 0px 10px 5px #ea830e;
box-shadow: 0px 0px 10px 5px #ea830e;
}

100% {
-o-box-shadow: 0px 0px 0px 0px #ea830e;
box-shadow: 0px 0px 0px 0px #ea830e;
}
}

@keyframes testim-scale {
0% {
box-shadow: 0px 0px 0px 0px #eee;
}

35% {
box-shadow: 0px 0px 10px 5px #eee;
}

70% {
box-shadow: 0px 0px 10px 5px #ea830e;
}

100% {
box-shadow: 0px 0px 0px 0px #ea830e;
}
}

@-webkit-keyframes testim-content-in {
from {
opacity: 0;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}

to {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}

@-moz-keyframes testim-content-in {
from {
opacity: 0;
-moz-transform: translateY(100%);
transform: translateY(100%);
}

to {
opacity: 1;
-moz-transform: translateY(0);
transform: translateY(0);
}
}

@-ms-keyframes testim-content-in {
from {
opacity: 0;
-ms-transform: translateY(100%);
transform: translateY(100%);
}

to {
opacity: 1;
-ms-transform: translateY(0);
transform: translateY(0);
}
}

@-o-keyframes testim-content-in {
from {
opacity: 0;
-o-transform: translateY(100%);
transform: translateY(100%);
}

to {
opacity: 1;
-o-transform: translateY(0);
transform: translateY(0);
}
}

@keyframes testim-content-in {
from {
opacity: 0;
transform: translateY(100%);
}

to {
opacity: 1;
transform: translateY(0);
}
}

@-webkit-keyframes testim-content-out {
from {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}

to {
opacity: 0;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}

@-moz-keyframes testim-content-out {
from {
opacity: 1;
-moz-transform: translateY(0);
transform: translateY(0);
}

to {
opacity: 0;
-moz-transform: translateY(-100%);
transform: translateY(-100%);
}
}

@-ms-keyframes testim-content-out {
from {
opacity: 1;
-ms-transform: translateY(0);
transform: translateY(0);
}

to {
opacity: 0;
-ms-transform: translateY(-100%);
transform: translateY(-100%);
}
}

@-o-keyframes testim-content-out {
from {
opacity: 1;
-o-transform: translateY(0);
transform: translateY(0);
}

to {
opacity: 0;
transform: translateY(-100%);
transform: translateY(-100%);
}
}

@keyframes testim-content-out {
from {
opacity: 1;
transform: translateY(0);
}

to {
opacity: 0;
transform: translateY(-100%);
}
}

@-webkit-keyframes testim-show {
from {
opacity: 0;
-webkit-transform: scale(0);
transform: scale(0);
}

to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}

@-moz-keyframes testim-show {
from {
opacity: 0;
-moz-transform: scale(0);
transform: scale(0);
}

to {
opacity: 1;
-moz-transform: scale(1);
transform: scale(1);
}
}

@-ms-keyframes testim-show {
from {
opacity: 0;
-ms-transform: scale(0);
transform: scale(0);
}

to {
opacity: 1;
-ms-transform: scale(1);
transform: scale(1);
}
}

@-o-keyframes testim-show {
from {
opacity: 0;
-o-transform: scale(0);
transform: scale(0);
}

to {
opacity: 1;
-o-transform: scale(1);
transform: scale(1);
}
}

@keyframes testim-show {
from {
opacity: 0;
transform: scale(0);
}

to {
opacity: 1;
transform: scale(1);
}
}

@-webkit-keyframes testim-hide {
from {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}

to {
opacity: 0;
-webkit-transform: scale(0);
transform: scale(0);
}
}

@-moz-keyframes testim-hide {
from {
opacity: 1;
-moz-transform: scale(1);
transform: scale(1);
}

to {
opacity: 0;
-moz-transform: scale(0);
transform: scale(0);
}
}

@-ms-keyframes testim-hide {
from {
opacity: 1;
-ms-transform: scale(1);
transform: scale(1);
}

to {
opacity: 0;
-ms-transform: scale(0);
transform: scale(0);
}
}

@-o-keyframes testim-hide {
from {
opacity: 1;
-o-transform: scale(1);
transform: scale(1);
}

to {
opacity: 0;
-o-transform: scale(0);
transform: scale(0);
}
}

@keyframes testim-hide {
from {
opacity: 1;
transform: scale(1);
}

to {
opacity: 0;
transform: scale(0);
}
}

@media all and (max-width: 300px) {
body {
font-size: 14px;
}
}

@media all and (max-width: 500px) {
.testim .arrow {
font-size: 1.5em;
}

.testim .cont div p {
line-height: 25px;
}

}
