Fancybox lightbox adjustment on page

Hello,

Here is my site and the page I need help on : https://ellawoolner.com/drawings

Previously the light box on that page was centered under the title and WordPress updated and now it has moved left, please can someone tell me where to edit the code to change the padding or margins to adjust the light box on this page.

Many thanks in advance ??

Here is my code from the CSS of fancybox… (should I be adjusting something in here?)

div#fancy_overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: none;
z-index: 30;
}

div#fancy_loading {
position: absolute;
height: 40px;
width: 40px;
cursor: pointer;
display: none;
overflow: hidden;
background: transparent;
z-index: 100;
}

div#fancy_loading div {
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 480px;
background: transparent url(‘fancy_progress.png’) no-repeat;
}

div#fancy_outer {
position: absolute;
top: 0;
left: 0;
z-index: 90;
padding: 20px 20px 40px 20px;
margin: 0;
background: transparent;
display: none;
}

div#fancy_inner {
position: relative;
width:100%;
height:100%;
background: #FFF;
}

div#fancy_content {
margin: 0;
z-index: 100;
position: absolute;
}

div#fancy_div {
background: #000;
color: #FFF;
height: 100%;
width: 100%;
z-index: 100;
}

img#fancy_img {
position: absolute;
top: 0;
left: 0;
border:0;
padding: 0;
margin: 0;
z-index: 100;
width: 100%;
height: 100%;
}

div#fancy_close {
position: absolute;
top: -12px;
right: -15px;
height: 30px;
width: 30px;
background: url(‘fancy_closebox.png’) top left no-repeat;
cursor: pointer;
z-index: 181;
display: none;
}

#fancy_frame {
position: relative;
width: 100%;
height: 100%;
display: none;
}

#fancy_ajax {
width: 100%;
height: 100%;
overflow: auto;
}

a#fancy_left, a#fancy_right {
position: absolute;
bottom: 0px;
height: 100%;
width: 35%;
cursor: pointer;
z-index: 111;
display: none;
background-image: url(“data:image/gif;base64,AAAA”);
outline: none;
overflow: hidden;
}

a#fancy_left {
left: 0px;
}

a#fancy_right {
right: 0px;
}

span.fancy_ico {
position: absolute;
top: 50%;
margin-top: -115px;
width: 30px;
height: 30px;
z-index: 12;
cursor: pointer;
display: block;
}

span#fancy_left_ico {
left: -9999px;
background: transparent url(‘fancy_left.png’) no-repeat;
}

span#fancy_right_ico {
right: -9999px;
background: transparent url(‘fancy_right.png’) no-repeat;
}

a#fancy_left:hover, a#fancy_right:hover {
visibility: visible;
background-color: transparent;
}

a#fancy_left:hover span {
left: 20px;
}

a#fancy_right:hover span {
right: 20px;
}

#fancy_bigIframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: transparent;
}

div#fancy_bg {
position: absolute;
top: 0; left: 0;
width: 100%;
height: 100%;
z-index: 70;
border: 0;
padding: 0;
margin: 0;
}

div.fancy_bg {
position: absolute;
display: block;
z-index: 70;
border: 0;
padding: 0;
margin: 0;
}

div#fancy_bg_n {
top: -20px;
left: 0;
width: 100%;
height: 20px;
background: transparent url(‘fancy_shadow_n.png’) repeat-x;
}

div#fancy_bg_ne {
top: -20px;
right: -20px;
width: 20px;
height: 20px;
background: transparent url(‘fancy_shadow_ne.png’) no-repeat;
}

div#fancy_bg_e {
right: -20px;
height: 100%;
width: 20px;
background: transparent url(‘fancy_shadow_e.png’) repeat-y;
}

div#fancy_bg_se {
bottom: -20px;
right: -20px;
width: 20px;
height: 20px;
background: transparent url(‘fancy_shadow_se.png’) no-repeat;
}

div#fancy_bg_s {
bottom: -20px;
left: 0;
width: 100%;
height: 20px;
background: transparent url(‘fancy_shadow_s.png’) repeat-x;
}

div#fancy_bg_sw {
bottom: -20px;
left: -20px;
width: 20px;
height: 20px;
background: transparent url(‘fancy_shadow_sw.png’) no-repeat;
}

div#fancy_bg_w {
left: -20px;
height: 100%;
width: 20px;
background: transparent url(‘fancy_shadow_w.png’) repeat-y;
}
div#fancy_bg_nw {
top: -20px;
left: -20px;
width: 20px;
height: 20px;
background: transparent url(‘fancy_shadow_nw.png’) no-repeat;
}