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

Есть сайт 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>'
				}
			})

И еще не могу понять почему c iphone/safari, overlay наполовину перекрывает модалки.

Всем привет! Задача сделать галерею с переключателями вперед/назад и кликом по превьюхе на чистом JS. Сделал так: http://codepen.io/osi-v/pen/PPVmPP т.е. пляшу от цвета рамки, что очень не нравится. Как это все сделать наиболее лаконичным и корректным способом? Очень нужно. Приветствуются любые комментарии, ссылки, советы.