Проблема с fancybox на мобильных устройствах

[osi-v]

Приветствую! Может кто-нибудь уже сталкивался с такими проблемами.

Есть сайт http://stroymechanika.intelinets.ru/

Модалки fancybox (заказать звонок (http://take.ms/OeqbJ), оставить заявку (http://take.ms/0dCvS)) отображаются некорректно на мобильных устройствах. Выглядят слегка растянуто, примеры: http://take.ms/3YomPG http://take.ms/BktjY

Модалки работают на type: ajax

Инициализируются вот так:

			$.fancybox({
				href: url,
				type: "ajax",
				openSpeed: 0,
				closeSpeed: 400,
				openEffect: 'none',
				padding: 0,
				beforeShow: function(){
					$(".fancybox-overlay").addClass("r741-opened");
					if(typeof callback === "function"){
						callback();
					}
				},
				beforeClose: function(){
					$(".fancybox-overlay").removeClass("r741-opened");
				},
				tpl: {
					wrap: '<div class="fancybox-wrap" tabIndex="-1"><div class="fancybox-skin"><div class="fancybox-outer"><div class="fancybox-inner"></div></div></div><div class="r741-message" ><div class="r741-message-inner" id="r741-message"></div></div></div>'
				}
			})

Что только не делал. В том числе все стили сносил, а все равно растянутая.

Если еще подскажите почему на браузерах safari overlay наполовину перекрывает модалки, то вообще отлично будет.

[klierik]

14 часа назад, osi-v сказал:

Если еще подскажите почему на браузерах safari overlay наполовину перекрывает модалки, то вообще отлично будет.

На это влияет правило:

.fancybox-wrap {
    -webkit-transform: rotateX(40deg);
    transform: rotateX(40deg);
}

А по первому не скажу так как я не смог этого повторить:

Скрытый текст

 

[osi-v]

Все верно, спасибо.