/*
	Этот файл содержит шаблон блоков вида "картинка-описание".
	Картика слева, описание справа.
	На 320 картинка не показывается.
	На 480 и ниже текст прячется в "расхлоп".
*/
ul.visual-descriptions {
  padding-top: 20px;
}
ul.visual-descriptions > li {
  width: 100%;
  overflow: hidden;
  margin-bottom: 20px;
}
ul.visual-descriptions > li .wrapper {
  display: block;
  position: relative;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  max-width: 960px;
  margin: auto;
  background-position: -5000% -5000%;
}
ul.visual-descriptions > li .wrapper .texts {
  padding: 0 15px 15px 15px;
}
ul.visual-descriptions > li .wrapper .texts .title {
  display: inline;
  font-weight: bold;
  font-size: 18px;
  line-height: 22px;
  color: #9260a9;
  border-bottom: 1px dotted #9260a9;
  cursor: pointer;
}
ul.visual-descriptions > li .wrapper .texts .title a {
  color: #9260a9;
}
ul.visual-descriptions > li .wrapper .texts .subtitle {
  font-weight: normal;
  font-size: 18px;
  line-height: 18px;
  color: #669526;
  text-transform: none;
  padding: 10px 0;
}
ul.visual-descriptions > li .wrapper .texts .details {
  display: none;
  margin: 10px 0;
  font-size: 15px;
}
ul.visual-descriptions > li .wrapper .texts .details ul > li {
  float: none;
  position: relative;
  margin-bottom: 10px;
  padding-left: 20px;
}
ul.visual-descriptions > li .wrapper .texts .details ul > li:before {
  content: "—";
  position: absolute;
  left: 0;
}
ul.visual-descriptions > li .wrapper .texts .details ul > li ul {
  padding-top: 10px;
}
ul.visual-descriptions > li .wrapper .texts .details ul > li ul li:last-child {
  margin-bottom: 0;
}
ul.visual-descriptions > li .wrapper .texts .details strong,
ul.visual-descriptions > li .wrapper .texts .details p {
  display: block;
  margin: 10px 0;
}
ul.visual-descriptions > li .wrapper .texts .details img {
  display: block;
}
ul.visual-descriptions > li .wrapper .texts .details a {
  color: #9260a9;
}
ul.visual-descriptions > li .wrapper .texts .details a:hover {
  text-decoration: underline;
}
ul.visual-descriptions > li .wrapper .texts .details small {
  color: #888888;
}
ul.visual-descriptions > li .wrapper .texts .learn-more,
ul.visual-descriptions > li .wrapper .texts .gear {
  /*display: block;*/
  margin-top: 18px;
}
ul.visual-descriptions > li .wrapper .texts ul.additional-info {
  display: none;
  margin-top: 20px;
}
ul.visual-descriptions > li .wrapper .texts ul.additional-info > li {
  padding: 0 15px;
}
ul.visual-descriptions > li .wrapper .texts ul.additional-info > li:first-child {
  padding-left: 0;
  border-left: 0;
}
ul.visual-descriptions > li .wrapper .texts ul.additional-info > li b {
  display: block;
}
ul.visual-descriptions > li .wrapper .texts .action {
  color: white;
  padding: 10px 20px;
  background: #7bc1e3;
  box-shadow: 0 7px 0 #5a9ec1, 0 14px 0 #d9d9d9;
  margin-bottom: 14px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  border-radius: 16px;
  position: relative;
  behavior: url("//takushevich_yan.svyaznoybank.agimagroup.ru/bitrix/templates/basic/styles/pie2.php");
  background-clip: padding-box;
  display: inline-block;
  vertical-align: middle;
  text-transform: uppercase;
  font-weight: bold;
  text-decoration: none;
}
ul.visual-descriptions > li .wrapper .texts .action:hover {
  color: white;
}
ul.visual-descriptions > li .wrapper .texts .action.pressed {
  box-shadow: 0 -7px 0 #5a9ec1;
}
ul.visual-descriptions.no-hide > li .wrapper {
  background-position: center top;
  padding-top: 200px;
}
ul.visual-descriptions.no-hide > li .wrapper .texts .title {
  color: #434343;
  border: 0;
}
ul.visual-descriptions.no-hide > li .wrapper .texts .details {
  display: block;
}
@media screen and (min-width: 480px) {
	ul.visual-descriptions > li .wrapper .texts .details p {
	  display: block;
	  margin: 10px 0;
	  min-width: 280px;
	}
}
@media screen and (min-width: 768px) {
  ul.visual-descriptions {
    padding-top: 40px;
  }
  
  .world-card ul.visual-descriptions {
    padding-top: 156px !important;
  }

  .credit-card ul.visual-descriptions {
padding-top: 156px !important;
   }
  
  ul.visual-descriptions > li .wrapper {
    background-position: left center !important;
    padding-top: 50px !important;
  }

/*.vis-1{
background-position: 60px 70px !important;
}

.vis-2{
background-position: 75px 70px !important;
}

.vis-3{
background-position: 80px 40px !important;
}
.vis-4{
background-position: 60px 115px !important;
}
.vis-5{
background-position: 75px 5px !important;
}*/
  ul.visual-descriptions > li .wrapper .texts {
    position: relative;
    left: 44%;
    max-width: 50%;
  }
  ul.visual-descriptions > li .wrapper a.clickable-img {
    display: block;
    width: 200px;
    height: 200px;
    position: absolute;
    top: 50%;
    left: 100px;
    margin-top: -100px;
  }
  ul.visual-descriptions > li .wrapper .texts .title {
    cursor: text;
    color: #525254;
    border: 0;
    font-size: 20px;
    line-height: normal;
  }
  ul.visual-descriptions > li .wrapper .texts .title a {
    color: #525254;
  }
  ul.visual-descriptions > li .wrapper .texts .title a:hover {
    color: #9260A9;
  }
  ul.visual-descriptions > li .wrapper .texts .details {
    display: block !important;
    margin: 20px 0;
  }
  ul.visual-descriptions > li .wrapper .texts .learn-more,
  ul.visual-descriptions > li .wrapper .texts .gear {
    margin: 0;
  }

    .paypass.credit-card ul.visual-descriptions > li .wrapper.b-i-1{background-position:150px 60% !important}
    .paypass.credit-card ul.visual-descriptions > li .wrapper.b-i-2{background-position:125px 60% !important}
    .paypass.credit-card ul.visual-descriptions > li .wrapper.b-i-3{background-position:130px 60% !important}
    .paypass.credit-card ul.visual-descriptions > li .wrapper.b-i-4{background-position:150px 60% !important}


}
@media screen and (min-width: 1024px) {
	ul.visual-descriptions > li .wrapper .texts .details p {
	  display: block;
	  margin: 10px 0;
	  min-width: 420px;
	}
}

.paypass ul.visual-descriptions > li .wrapper .texts .details ul.list-1{padding-top:18px}
    .paypass ul.visual-descriptions > li .wrapper .texts .details ul.list-1 > li{padding:0 0 20px 70px;overflow:hidden;zoom:1;line-height:19px}
    .paypass ul.visual-descriptions > li .wrapper .texts .details ul.list-1 > li:before{display:none}
        .paypass ul.visual-descriptions > li .wrapper .texts .details ul.list-1 > li img{display:inline;vertical-align:bottom}
        .paypass ul.visual-descriptions > li .wrapper .texts .details ul.list-1 > li .b-i{margin:0 -100% 0 0;display:block;float:left;position:relative;left:-70px}