/*this is the wrapper for the whole gallery. It is better than adjust the padding on this

rather than adjusting the padding on the inner elements*/



div.main_gallery_wrapper{

padding: 0px 0px 0px 0px;

}





/*if the show category menu in gallery is enabled these divs will hold the thumb/ gallery name

their width is set inline as it depends on what the menu image width is*/

div.gallery_menu_top{

padding: 10px;

float: left

}



/*all the headings in the component are h3s with a class of igallery. If your templates h3 is not what

you want, you can style the gallery h3s it here*/

h3.igallery{

/*color: #000000;

font-family: arial, helvetica, sans-serif;

font-size: 16px;

font-weight: bold;

padding: 0px;*/

}



/*all links inside headings in the component are a's (links) with a class of igallery. 

If your templates a is not what you want, you can style the gallery a's it here*/

a.igallery{

/*color: #000000;

font-family: arial, helvetica, sans-serif;

font-size: 16px;

font-weight: bold;

padding: 0px;*/

}



/*this div holds the gallery description (that can be set to top or bottom position)*/ 

div.gallery_description{

margin: 10px 0px;

}







/*each thumbnail is in one of these divs. The padding is set inline, and can be changed in the backend*/

div.thumbs_div{

float: left;

}



/*these divs hold the left and right arrows*/

div.main_left_right_arrows_div, div.lbox_left_right_arrows_div{

float:left;

margin: 4px 0px;

}



div.main_thumbs_arrows_wrapper, div.lbox_thumbs_arrows_wrapper{

float:left;

}



img.thumbs_left_arrow{

cursor: pointer;

float: left;

}



img.thumbs_right_arrow{

cursor: pointer;

float: right;

}



div.main_up_arrow, div.lbox_up_arrow{

float: left;

}



div.main_down_arrow, div.lbox_down_arrow{

float: left;

}



img.thumbs_down_arrow{

cursor: pointer;

display: block;

margin-left: auto;

margin-right: auto;

margin-top: 4px;

margin-bottom: 4px;

}



img.thumbs_up_arrow{

cursor: pointer;

display: block;

margin-left: auto;

margin-right: auto;

margin-top: 4px;

margin-bottom: 4px;

}



/*the div that holds all the descrition divs*/

div.main_des_container, div.lbox_des_container{

float: left;

overflow: auto;

}



/*each description is wrapped in one of these*/

div.des_div{

float: left;

}

/*this div houses the main image div, and any thumb/description containers that 

are set to left/right position*/

div.main_middle_div, div.lbox_middle_div{

float: left;

padding: 0px 0px 8px 0px;

}



div.main_thumb_container, div.lbox_thumb_container{

float: left;

}



div.main_thumb_div, div.lbox_thumb_div{

float: left;

}





div.large_image_slideshow_wrapper, div.lbox_image_slideshow_wrapper{

float: left;

}





/*this is the div that houses the main image*/

div.main_large_image, div.lbox_large_image{

float: left;

}



div.main_slideshow_buttons, div.lbox_slideshow_buttons{

padding: 10px 0px;

float: left;

}



div.main_slideshow_buttons img, div.lbox_slideshow_buttons img{

cursor: pointer;

}



div.main_ratings_info, div.lbox_ratings_info{

margin: 10px 0px;

}



form.main_rating_form, form.main_rating_form{

display: inline;

}



div._ratings_message_container, div._ratings_message_container{

display: inline;

}

/*each comment is housed by one of these divs */

div.main_comments_container div, div.lbox_comments_container div{

padding: 8px 0px;

border-bottom: 1px solid #cccccc;

}

lbox_comments_container

span.italics_text{

font-style: italic;

}



div.main_comments_message, div.lbox_comments_message{

margin: 5px 0px;

}



div.lbox_dark{

position: absolute;

background-color: #000000;

z-index: 1000;

}



div.lbox_white{

position: absolute;

background-color: #ffffff;

padding: 5px;

z-index: 1010;

}



img.closeImage{

display: block;

float: right;

margin-top: 8px;

}







div.igallery_clear{

clear: both;

}