﻿#gallery        {text-align: center; position: relative;}

.galouter img        {transform: scale(1); transition: transform 0.5s, border-radius 0.5s;}
.galouter img:hover  {transform: scale(1.5); position: relative; z-index: 99; box-shadow: 0 0 10px #000; border-radius: 10px;}

/* Loader for the fullscreen imahes */

#loading        {position: fixed; width: 80px; height: 80px; display: none; border: none; z-index: 1000;}
#loading img    {border: none;}

/* Magnifier Popup */

#magnifier      {display: none; cursor: pointer; position: absolute; left: 0px; top: 0px; box-shadow: 0 0 10px #000;
                 width:   0 ; height:   0 ; border: none; margin: 0; padding: 0; border-radius: 10px;}
#magnifierimg   {width: 100%; height: 100%; border: none; margin: 0; padding: 0; border-radius: 10px;}

/* Black transparent background Div for fullscreen */

.dimmer         {visibility: hidden; display: block; width: 100%; height: 100%;
                 position: fixed; left: 0px; top: 0px; z-index: 249;
                background: rgba(0, 0, 0, 0.95);									  /* RGBa with 0.6 opacity */
                filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#c0000000, endColorstr=#c0000000);	  /* For IE 5.5 - 7*/
                -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#c0000000, endColorstr=#c0000000)";}/* For IE 8*/

/* Fullscreen picture viewr */

#dimmeddiv      {visibility: hidden; position: fixed; border: 2px solid #000; border-radius: 10px;
                 background: #ffffff; padding: 0px 10px 6px 10px; z-index: 250;}
#dimmeddiv p    {font-family: Arial, Helvetica, sans-serif; font-size: 10px; line-height: 10px; color: #ffffff; text-align: center; margin: 0px;}
#dimmeddiv h4   {font-family: Arial, Helvetica, sans-serif; font-size: 10px; line-height: 10px; color: #000000; text-align: center; margin: 0px;}
#dimmeddiv h3   {font-family: Arial, Helvetica, sans-serif; font-size: 11px; line-height: 11px; color: #000000; text-align: center; margin: 0px;}
#dimmeddiv h2   {font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 18px; color: #000000; text-align: center; margin: 0px;}

#dimcatdiv      {margin: auto; display: block; height: 18px; overflow: hidden;}                         /* Total height 18px + 2px border */
#dimcatdiv div  {display: block; margin: auto; width: 100%;}
#dimmedcat      {}

#dimarrows      {position: relative;}
#dimmedimg      {display: block; border: none;}

.dimright, .dimleft
                {position: absolute; width: 41px; height: 57px; top: 50%;}
.dimright       {right: -12px; background: url('images/rightarroww.png') no-repeat;}
.dimleft        {left:  -12px; background: url('images/leftarroww.png') no-repeat;}
.dimclose       {position: absolute; top: 0px; right: 0px;
                 width: 42px; height: 42px; background: url('images/close2w.png') no-repeat;}

#dimdesdiv      {margin: auto; margin-top: 6px; display: block; height: 16px; overflow: hidden;}        /* Total height 22px */
#dimdesdiv div  {display: block; margin: auto; width: 100%;}
#dimmeddesc     {}

#dimimgdiv      {margin: auto; margin-top: 4px; display: block; height: 15px; overflow: hidden;}        /* Total height 19px + 6px padding + 2px border */
#dimimgdiv div  {display: block; margin: auto; width: 100%; text-align: center;}

#dimfooter      {position: relative; margin: auto; display: block;}
#dimfooter div  {position: absolute; top: 12px; display: block; margin: auto; width: 100%;}

/* Various thumbnail codes */

#thumbicon      {float: left; margin: 0px 6px 4px 6px; overflow: hidden;}
#thumbicon div  {overflow: hidden; position: relative;}
#thumbicon img  {border: none; position: absolute; border: 0px solid;}
#thumbicon p    {font-size: 12px; color: #000000; margin-top: 6px;}

#thumbwall      {float: left; margin: 3px 3px 3px 3px; position: relative; overflow: hidden;}
#thumbwall img  {border: none; position: absolute; border: 0px solid;}
#thumbwall p    {font-size: 12px; color: #000000; margin-top: 6px;}
