/*	gallery.css
 *	Developed by e4education (www.e4education.co.uk)
 *  Edited on 30th July 2008 */
#photoAlbum                       {width: 90%;}
#albumDescription                 {padding-bottom: 20px;}
#albumImages                      {padding-left: 5%; padding-right: 5%;}	
#albumImages img                  {padding: 5px;}
img                               {margin: 3px!important;}
ul#photoGalleryList               {list-style-type: none;}
ul#photoGalleryList li            {display: inline; float: left; padding: 10px; text-align: center;}
ul#imageList                      {padding-left: 65px; list-style: none; text-align: center;}
ul#imageList li                   {display: inline; float:left; padding:0 20px; text-align: center; margin:0;}
.previousImage                    {float: left; width: 50%; text-align: left;}
.nextImage                        {float: right; width: 50%; text-align: right;}
#mainImage                        {clear: both;}

li.galleryThumbnailSmall          {margin :0 10px 10px!important; height: 175px;}
.galleryThumbnailSmall p          {padding: 0!important; margin:0!important;}
.galleryThumbnailSmall p a        {color: #FFF!important;}
.galleryThumbnailSmall p a:hover  {color: #FF8FCD!important; text-decoration:underline!important;}
.galleryThumbnailSmall img        {padding: 5px!important; border: 1px solid #CCC;}
.galleryThumbnailLargeImg         {padding: 5px !important; border:1px solid #CCC; margin:15px 0!important; height: 217px;}


/* ***************************************        POSSIBLY DEPRECATED CSS - FOR OLD DIV-BASED GALLERY        ********************************* */
/* Gallery Thumbnail Frame */
.imageHeading                     {width: 100%;}
.imageHeading .imageHeadingLeft   {float: left; width: 4px; height: 15px; background: url(../images/gallery/layout/frame/top-left.gif) no-repeat;}
.imageHeading .imageHeadingMiddle {float: left; padding-left: 3px; padding-right: 3px; height: 15px; background: url(../images/gallery/layout/frame/top-middle.gif) repeat-x;}
.imageHeading .imageHeadingRight  {float: left; width: 4px; height: 15px; background: url(../images/gallery/layout/frame/top-right.gif) no-repeat;}
.imageMain                        {clear: left; margin-top: -2px;}
.imageMain .imageMainLeft         {float: left; width: 4px; background: url(../images/gallery/layout/frame/middle-left.gif) repeat-y;}
.imageMain .imageMainMiddle       {float: left; width: auto;}
.imageMain .imageMainRight        {float: left; width: 4px; background: url(../images/gallery/layout/frame/middle-right.gif) repeat-y;}
.imageFooter                      {clear: left;}
.imageFooter .imageFooterLeft     {float: left; width: 4px; height: 100%; background: url(../images/gallery/layout/frame/footer-left.gif) repeat-y;}
.imageFooter .imageFooterMiddle   {float: left; padding-left: 3px; padding-right: 8px; height: 35px; background: url(../images/gallery/layout/frame/footer-right.gif) repeat-y top right; overflow: hidden;}
.imageFooterMiddle                {padding-bottom: 20px; /* Enough room for 4 lines of text */ padding-top: 5px; line-height: 120%; font-size: 90% !important;}
.imageFooter .imageFooterMiddle2  {float: left; padding-left: 3px; padding-right: 11px; background: url(../images/gallery/layout/frame/footer-left.gif) repeat-y top left;}
.imageFooter .imageFooterRight    {float: left; width: 4px; height: 100%; background: url(../images/gallery/layout/frame/footer-right.gif) repeat-y;}
.imageEnd                         {clear: left;}
.imageEnd .imageEndLeft           {float: left; width: 4px; height: 9px; background: url(../images/gallery/layout/frame/end-left.gif) no-repeat;}
.imageEnd .imageEndMiddle         {float: left; padding-left: 3px; padding-right: 3px; height: 9px; background: url(../images/gallery/layout/frame/end-middle.gif) repeat-x;}
.imageEnd .imageEndRight          {float: left; width: 4px; height: 9px; background: url(../images/gallery/layout/frame/end-right.gif) no-repeat;}
.imageEditButtons                 {clear: both; padding-top: 5px; width: 100%;}
/* Gallery Image Thumbnail Frame */
.thumbnailImage .thumbnailHeading {width: 100%;}
.thumbnailImage .thumbnailHeading .thumbnailHeadingLeft{float: left; width: 4px; height: 9px; background: url(../images/gallery/layout/frame/top-left.gif) no-repeat;}
.thumbnailImage .thumbnailHeading .thumbnailHeadingMiddle {float: left; padding-left: 3px; padding-right: 3px; height: 9px; background: url(../images/gallery/layout/frame/top-middle.gif) repeat-x;}
.thumbnailImage .thumbnailHeading .thumbnailHeadingRight {float: left; width: 4px; height: 9px; background: url(../images/gallery/layout/frame/top-right.gif) no-repeat;}
.thumbnailMain                    {clear: left; margin-top: -8px;}
.thumbnailMain .thumbnailMainLeft {float: left; width: 4px; background: url(../images/gallery/layout/frame/middle-left.gif) repeat-y;}
.thumbnailMain .thumbnailMainMiddle{float: left; width: auto;}
.thumbnailMain .thumbnailMainRight{float: left; width: 4px; background: url(../images/gallery/layout/frame/middle-right.gif) repeat-y;}
.thumbnailFooter                  {clear: left;}
.thumbnailFooter .thumbnailFooterLeft{float: left; width: 4px; height: 100%; background: url(../images/gallery/layout/frame/footer-left.gif) repeat-y;}
.thumbnailFooter .thumbnailFooterMiddle{float: left; padding-left: 3px; padding-right: 8px; background: url(../images/gallery/layout/frame/footer-right.gif) repeat-y top right;}
.thumbnailFooter .thumbnailFooterMiddle2{float: left; padding-left: 3px; padding-right: 11px; background: url(../images/gallery/layout/frame/footer-left.gif) repeat-y top left;}
.thumbnailFooter .thumbnailFooterRight {float: left; width: 4px; height: 100%; background: url(../images/gallery/layout/frame/footer-right.gif) repeat-y;}
.thumbnailEnd                     {clear: left;}
.thumbnailEnd .thumbnailEndLeft   {float: left; width: 4px; height: 9px; background: url(../images/gallery/layout/frame/end-left.gif) no-repeat;}
.thumbnailEnd .thumbnailEndMiddle {float: left; padding-left: 3px; padding-right: 3px; height: 9px; background: url(../images/gallery/layout/frame/end-middle.gif) repeat-x;}
.thumbnailEnd .thumbnailEndRight  {float: left; width: 4px; height: 9px; background: url(../images/gallery/layout/frame/end-right.gif) no-repeat;}
.thumbnailEditButtons             {clear: both; padding-top: 5px; width: 100%;}
#galleryFlash                     {padding: 10px; padding-top: 2px;}

