/* 1. Theme default css */
body {
  font-family: 'Conv_proximanova-regular', Sans-Serif;
  margin: 0 auto;
  background: url("img/bg3.png") repeat-y center top;
  background-size: 100%;
}

@font-face {
  font-family: 'FontAwesome';
  src: url('fonts/fontawesome-webfont.eot?v=4.2.0');
  src: url('fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal
}

.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

@font-face {
  font-family: 'Conv_proximanova-regular';
  src: url('fonts/proximanova-regular.eot');
  src: local('☺'), url('fonts/proximanova-regular.woff') format('woff'), url('fonts/proximanova-regular.ttf') format('truetype'), url('fonts/proximanova-regular.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Conv_proximanova-light';
  src: url('fonts/proximanova-light.eot');
  src: local('☺'), url('fonts/proximanova-light.woff') format('woff'), url('fonts/proximanova-light.ttf') format('truetype'), url('fonts/proximanova-light.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Conv_proximanova-extrabold';
  src: url('fonts/proximanova-extrabold.eot');
  src: local('☺'), url('fonts/proximanova-extrabold.woff') format('woff'), url('fonts/proximanova-extrabold.ttf') format('truetype'), url('fonts/proximanova-extrabold.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Conv_FontsFree-Net-FontsFree-Net-Proxima-Nova-Bold';
  src: url('fonts/FontsFree-Net-FontsFree-Net-Proxima-Nova-Bold.eot');
  src: local('☺'), url('fonts/FontsFree-Net-FontsFree-Net-Proxima-Nova-Bold.woff') format('woff'), url('fonts/FontsFree-Net-FontsFree-Net-Proxima-Nova-Bold.ttf') format('truetype'), url('fonts/FontsFree-Net-FontsFree-Net-Proxima-Nova-Bold.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

strong {
  font-family: 'Conv_FontsFree-Net-FontsFree-Net-Proxima-Nova-Bold', Sans-Serif;
}

.img {
  max-width: 100%;
  min-width: 100%;
  transition: all 0.3s ease-out 0s;
}

.f-left {
  float: left
}

.f-right {
  float: right
}

.fix {
  overflow: hidden;
}

a, .button, button {
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

a:focus, .button:focus {
  text-decoration: none;
  outline: none;
}

button {
  cursor: pointer
}

a:focus, a:hover, a, button {
  color: #FF9010;
  outline: medium none;
}

input:focus, textarea:focus, :focus {
  outline: 0
}

button:focus {
  outline: 0 none;
}

.uppercase {
  text-transform: uppercase;
}

.capitalize {
  text-transform: capitalize;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Conv_FontsFree-Net-FontsFree-Net-Proxima-Nova-Bold', Sans-Serif;
  font-weight: normal;
  color: #333333;
  margin-top: 0px;
  font-style: normal;
  font-weight: 400;
}

h1 {
  margin: 0;
  padding: 0;
}

ul {
  margin: 0px;
  padding: 0px;
}

li {
  list-style: none
}

p {
  font-family: 'Conv_proximanova-regular', Sans-Serif;
  font-size: 17px;
  font-weight: normal;
  line-height: 1.25;
  color: #777777;
  margin-bottom: 15px;
}

hr {
  border-bottom: 1px solid #eceff8;
  border-top: 0 none;
  margin: 30px 0;
  padding: 0;
}

label {
  color: #7e7e7e;
  cursor: pointer;
  font-size: 14px;
  font-weight: 400;
}

*::-moz-selection {
  background: #d6b161;
  color: #fff;
  text-shadow: none;
}

::-moz-selection {
  background: #444;
  color: #fff;
  text-shadow: none;
}

::selection {
  background: #444;
  color: #fff;
  text-shadow: none;
}

*::-moz-placeholder {
  color: #555555;
  font-size: 14px;
  opacity: 1;
}

*::placeholder {
  color: #555555;
  font-size: 14px;
  opacity: 1;
}

.container-fluid {
  margin: 0 auto;
}

#clients-holder ul li .btn.frame_button {
  background: rgb(252, 222, 186);
  background: linear-gradient(90deg, rgba(252, 222, 186, 1) 0%, rgba(252, 191, 11, 1) 50%, rgba(252, 222, 186, 1) 100%);
  color: #062b66;
}

@media screen and (max-width: 420px) {
  .first-page {
    height: 100vh;
  }
}

.frame-tittle h4 {
  color: #fff;
  text-align: center;
  font-size: 60px;
  margin: 0 auto;
  line-height: 60px;
  padding-bottom: 45px;
  font-family: 'Conv_proximanova-extrabold', 'Conv_proximanova-regular', Sans-Serif;
}

.frame-tittle h4 span {
  font-family: 'Conv_proximanova-light', 'Conv_proximanova-regular', Sans-Serif;
}

.frame-tittle {
  padding-top: 70px;
}

#clients-holder .frame-tittle p {
  text-align: center;
  padding-bottom: 75px;
  padding-top: 0;
}

@media screen and (min-width: 1024px) {
  .container-fluid {
    padding: 0 13.965%;
  }
}

#our-customers.last_page {
  display: none !important;
}

.icon-area {
  background: url("img/bg1.png") repeat-y center top;
  background-size: 100%;
}

.icon-wrapper {}

.icon-wrapper .col-lg-3 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  max-width: 20%;
}

.icon1 {
  background-color: #D41A4D;
}

.icon2 {
  background-color: #C12D69;
}

.icon3 {
  background-color: #A53C8D;
}

.icon4 {
  background-color: #7B48B4;
}

.icon5 {
  background-color: #0052DB;
}

.icon-wrapper .col-lg-3 a {
  padding: 10px 0;
  display: block;
}

.icon-wrapper .col-lg-3 img {
  margin: 7px auto 6px auto;
  display: block;
  max-width: 100%;
  max-height: 58px;
}

.my-resume-area {
  background: url("img/bg2.png") repeat-y center top;
  background-size: 100%;
  text-align: center;
  height: 39px;
}

@media screen and (max-width: 800px) {
  .my-resume-area .row {
    margin-left: 0;
    margin-right: 0;
  }
}

.my-resume-area svg {
  zoom: 0.7;
  margin: 14px 0 13px 0;
}

@media screen and (min-width: 420px) {
  .my-resume-area svg {
    zoom: 1.03;
    margin: 9px 0 11px 0;
  }
}

.my-resume-area .col-md-12 {
  background-color: #A51C30;
}

#clients-holder {
  overflow: hidden;
}

#clients-holder .col-md-12 {
  background-image: linear-gradient(#004a66, #007ead);
}

#clients-holder .col-md-12.bluebg {
  background-image: linear-gradient(#004a66, #007ead);
}

.testimonial-area {
  background: url("img/bg3.png") repeat-y center top;
  background-size: 100%;
}

#clients-holder .col-md-12 {
  padding: 0;
}

@media screen and (max-width: 800px) {
  #clients-holder.row {
    margin-left: 0;
    margin-right: 0;
  }
}

#clients-holder p {
  font-size: 18px;
  line-height: 48px;
}

#clients-holder .answer-part p {
  font-size: 18px;
  line-height: 27px;
}

@media screen and (min-width: 420px) {
  #clients-holder p {
    font-size: 23px;
    line-height: 28px;
  }
}

@media screen and (min-width: 420px) {
  #clients-holder .answer-part p {
    font-size: 23px !important;
    line-height: 28px !important;
  }
}

#clients-holder p {
  color: #fff;
  padding: 27px 44px 27px 44px;
  margin: 0 auto;
}

#clients-holder .answer-part p {
  text-align: center;
  padding: 9px 0 0 0;
}

#clients-holder .answer-part .next-button p {
  text-align: center;
  padding: 9px 0 20px 0;
}

@media screen and (min-width: 800px) {
  #clients-holder p {
    padding: 27px 44px 0 44px;
  }
}

#clients-holder ul li {
  text-align: center;
}

#clients-holder ul li {
  display: block;
  padding-bottom: 18px;
}

#clients-holder ul li .btn {
  background-color: #E8EBF2;
  color: #000;
  display: block;
  margin: 0 auto;
  font-size: 16px;
  border-radius: 42px;
  font-family: 'Conv_FontsFree-Net-FontsFree-Net-Proxima-Nova-Bold', Sans-Serif;
  padding: 2px 0;
  word-wrap: break-word;
  white-space: normal;
  transition: all .2s ease-in-out;
  width: 352px;
  max-width: 352px;
}

@media screen and (min-width: 420px) {
  #clients-holder ul li .btn {
    font-size: 24px;
  }
}

#clients-holder ul li.big_button .btn {
  background-color: #E8EBF2;
  color: #000;
  display: block;
  margin: 0 auto;
  font-size: 16px;
  border-radius: 42px;
  font-family: 'Conv_FontsFree-Net-FontsFree-Net-Proxima-Nova-Bold', Sans-Serif;
  padding: 2px 0;
  word-wrap: break-word;
  white-space: normal;
  transition: all .2s ease-in-out;
  width: 97vw;
  max-width: 97vw;
  min-width: 352px;
}

@media screen and (min-width: 420px) {
  #clients-holder ul li.big_button .btn {
    font-size: 24px;
    width: 90vw;
    max-width: 90vw;
  }
}

@media screen and (min-width: 800px) {
  #clients-holder ul li.big_button .btn {
    width: 630px;
    max-width: 630px;
  }
}

#clients-holder ul li .btn:hover {
  transform: scale(1.1);
}

#clients-holder ul li.non_hover .btn:hover {
  transform: none !important;
}

#clients-holder ul li .btn.disabled {
  opacity: 1;
  box-shadow: 0px 0px 0px 10px rgba(255, 255, 255, 0.43);
}

#clients-holder ul li .btn.right_button {
  background-color: #01b393;
}

#clients-holder ul li .wrong_button {
  background-color: #9da2b9;
}

#clients-holder ul li.big_button .wrong_button {
  background-color: #9da2b9;
}

#clients-holder .next-button ul li button.btn {
  background-color: #f2a041;
  font-size: 0px;
  width: 54px;
  max-width: initial;
  color: #fff;
}

#clients-holder .next-button ul li button.btn:hover {
  transform: scale(1.5);
}

#our-customers {
  padding: 0;
  overflow: hidden;
  min-height: 110vh;
  zoom: 0.6;
}

@media screen and (min-width: 420px) and (max-width: 800px) {
  #our-customers {
    padding: 0;
    overflow: hidden;
    min-height: calc(100vh - 110px);
    zoom: 1;
  }
}

@media screen and (min-width: 800px) {
  #our-customers {
    padding: 0;
    overflow: hidden;
    min-height: 510px;
    max-height: 510px;
    zoom: 1;
  }
}

.image_sec.row {
  background-image: linear-gradient(#0f7196, #137fa5);
  margin: 0 auto;
  width: calc(100% - 28px);
}

@media screen and (min-width: 630px) and (max-width: 768px) {
.image_sec.row {
  width: calc(100% - 160px);
}
}

.image_sec.row .col-sm-6 {
  padding: 0;
}

.image-con {
  padding: 0;
}

#clients-holder .image-con .ng-binding {
  padding: 25px 18px;
  font-size: 18px;
  line-height: 48px;
  text-align: left;
}

@media screen and (min-width: 420px) {
  #clients-holder .image-con .ng-binding {
    font-size: 23px;
    line-height: 27px;
  }
}

.answer-part {
  padding: 0;
}

#clients-holder .correct_button ul li span {
  width: 27px;
  height: 27px;
  margin: 0 auto;
  display: block;
  -webkit-backface-visibility: visible;
  transition: opacity .2s ease;
  border-radius: 50%;
  position: relative;
}

#clients-holder .correct_button ul li span.currentitem {
  background-color: rgba(255, 255, 255, 0.3);
  border: 1px solid #fff;
  transition: all .5s ease-in-out;
}

.currentitem {
  background-color: rgba(255, 255, 255, 0.3);
  border: 1px solid #fff;
  transition: all .5s ease-in-out;
}

#clients-holder .correct_button ul li {
  width: 27px;
  position: relative;
  display: inline-block;
  padding-bottom: 0;
}

#clients-holder .correct_button ul li span:before {
  content: "";
  display: block;
  background-color: #fff;
  position: absolute;
  left: 0;
  right: 0;
  top: 5px;
  bottom: 0;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  margin: 0 auto;
}

.correct_button {
  text-align: center;
  display: block;
  margin: 60px auto 0 auto;
  position: relative;
  width: 100%;
}

@media screen and (min-width: 768px) {
  .correct_button {
    text-align: center;
    display: block;
    margin: 0 auto;
    position: absolute;
    bottom: 18px;
    width: 100%;
  }
}

.correct_button ul {
  text-align: center;
}

#clients-holder .col-md-12.bluebg .image_sec.row {
  background-image: linear-gradient(#2e6688, #3d80a4);
}

/* #clients-holder .correct_button ul li.wrong_button span::before {
  background-color: #f15a24;
  border: 1px solid #004A66;
}

#clients-holder .correct_button ul li.right_button span::before {
  background-color: #01B393;
  border: 1px solid #004A66;
} */

#clients-holder .correct_button ul li.wrong_button span::before {
  background: url("img/incorrect.svg");
  border: none;
  border-radius: 0;
}

#clients-holder .correct_button ul li.right_button span::before {
  background: url("img/correct.svg");
  border: none;
  border-radius: 0;
  width: 20px;
  left: -1px;
}

#clients-holder h3 {
  color: #fff;
  padding-bottom: 11px;
  margin: 0 auto;
  font-size: 23px;
  text-align: center;
}

@media screen and (max-width: 420px) {
  .answer-part button {
    transform: scale(1.5);
  }

  .answer-part button:before {
    font-size: 20px !important;
  }
}

#clients-holder ul li .btn.right_ans_button {
  background-color: #fcbf0b;
}

#clients-holder ul li .wrong_ans_button {
  background-color: #9da2b9;
}

.answer-part button {
  background-color: #f2a041;
  color: #fff;
  border: none;
  width: 54px;
  height: 54px;
  display: block;
  border-radius: 50%;
  margin: 20px auto;
  font-size: 0;
  text-align: center;
  line-height: 54px;
  transition: all .2s ease-in-out;
}

.answer-part button:hover {
  transform: scale(1.5);
}

.answer-part button::before {
  content: "\f105";
  font-family: 'FontAwesome';
  font-size: 40px;
  font-weight: bold;
  line-height: 50px;
  position: relative;
  left: 2px;
}

.answer-part h4 {
  color: #fcbf0b;
  font-size: 140px;
  text-align: center;
  font-family: 'Conv_proximanova-light', 'Conv_proximanova-regular', Sans-Serif;
  line-height: 140px;
  margin: -20px auto -5px auto;
}

.answer-part h5 {
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  font-family: 'Conv_proximanova-regular', Sans-Serif;
  margin: 10px auto 0 auto;
}

@media screen and (min-width: 420px) {
  .answer-part h5 {
    text-align: center;
    color: #fff;
    text-transform: uppercase;
    font-family: 'Conv_proximanova-regular', Sans-Serif;
    margin: 89px auto 12px auto;
  }
}

#clients-holder .next-button ul li button.btn.start-over {
  background-color: #50a4ce;
  color: #fff;
  border: none;
  width: 54px;
  height: 54px;
  display: block;
  border-radius: 50%;
  margin: 30px auto 50px;
  font-size: 0;
  text-align: center;
  line-height: 54px;
}

#clients-holder .next-button ul li button.btn.start-over::before {
  content: "\f104";
  font-family: 'FontAwesome';
  font-size: 40px;
  font-weight: bold;
  line-height: 52px;
  position: relative;
  left: -2px;
  top: 1px;
}

#clients-holder .next-button ul li button.btn.start-over:hover {
  transform: scale(1.5);
}

.btn.disabled, .btn:disabled {
  opacity: 1 !important;
}

#clients-holder ul li .btn:focus {
  opacity: 1;
  box-shadow: 0px 0px 0px 7px rgba(255, 255, 255, 0.43);
}

#clients-holder ul li .btn.grey_button {
  background-color: #9da2b9;
}

#clients-holder .col-md-12.bluebg h3 {
  padding-top: 0;
}

#clients-holder.cresult .answer-part {
  padding: 22px 0 0 0;
  max-width: 408px;
  margin: 0 auto;
  height: 100%;
  overflow: hidden;
}

@media screen and (min-width: 800px) {
  #clients-holder.cresult .answer-part {
    height: 509px;
    max-height: 509px;
    overflow: hidden;
  }
}

@media screen and (max-width: 800px) {
  .container-fluid {
    padding-left: 0;
    padding-right: 0;
    margin: 0 auto;
  }

  #clients-holder .correct_button ul li {
    width: 20px;
  }

  #clients-holder .correct_button ul li span {
    width: 25px;
    height: 25px;
  }

  #clients-holder .correct_button ul li span::before {
    width: 15px;
    height: 15px;
    top: 4px;
  }

  .container {
    max-width: inherit;
  }

  .frame-tittle h4 {
    font-size: 40px;
    line-height: 56px;
  }
}

@media screen and (max-width: 420px) {
  #clients-holder.cresult .answer-part {
    padding: 30px 5px 0;
  }

}

@media screen and (max-width: 800px) {

  #clients-holder.cresult .answer-part {
    padding: 30px 20px 0;
    height: calc(104vh - 111px);
  }

  #clients-holder h3 {
    padding-left: 7px !important;
  }

  #clients-holder ul li .btn:focus {
    opacity: 1;
    box-shadow: 0px 0px 0px 3px rgba(255, 255, 255, 0.43);
  }
}

.answer-part .anim ul:first-of-type li {
  max-width: 408px;
  display: block;
  margin: 0 auto;
}

.answer-part .anim ul:first-of-type li.big_button {
  max-width: 690px;
  display: block;
  margin: 0 auto;
}

.quize1 ul,
.quize2 ul,
.quize3 ul,
.quize4 ul,
.quize5 ul,
.quize6 ul,
.quize7 ul,
.quize8 ul,
.quize9 ul,
.quize10 ul,
.quize11 ul,
.quize12 ul,
.quize13 ul,
.quize14 ul,
.quize15 ul {
  margin: 0 auto;
}

@media screen and (min-width: 800px) {

  .quize1 ul,
  .quize2 ul,
  .quize3 ul,
  .quize4 ul,
  .quize5 ul,
  .quize6 ul,
  .quize7 ul,
  .quize8 ul,
  .quize9 ul,
  .quize10 ul,
  .quize11 ul,
  .quize12 ul,
  .quize13 ul,
  .quize14 ul,
  .quize15 ul {
    position: absolute;
    top: 143px;
    width: 100%;
  }
}

.quize1 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize2 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize3 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize4 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize5 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize6 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize7 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize8 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize9 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize10 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize11 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize12 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize13 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize14 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.quize15 {
  position: relative;
  animation: myfirst 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.answer-part {
  position: relative;
  animation: secondPart 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

.next-button {
  animation: nextButtonanim 2s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

#cresult {
  position: relative;
  animation: thirdPart 1s 1;
  animation-direction: normal;
  animation-timing-function: ease;
}

@keyframes myfirst {
  0% {
    left: 600px;
    top: 0px;
    opacity: 0;
  }

  100% {
    left: 0px;
    top: 0px;
    opacity: 1;
  }
}

@keyframes secondPart {
  0% {
    right: 0px;
    top: 600px;
    opacity: 0
  }

  100% {
    left: 0px;
    top: 0px;
    opacity: 1
  }
}

@keyframes thirdPart {
  0% {
    right: 600px;
    top: 0px;
    opacity: 0
  }

  100% {
    right: 0px;
    top: 0px;
    opacity: 1
  }
}

@keyframes fourthPart {
  0% {
    right: 0px;
    top: 600px;
    opacity: 0
  }

  100% {
    left: 0px;
    top: 0px;
    opacity: 1
  }
}

@keyframes nextButtonanim {
  0% {
    opacity: 0
  }

  25% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

.col-sm-6, .col-md-6, .col-md-12 {
  padding: 0 !important;
}

#preloader {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    overflow: visible;
    background: #006d95;
}