/* The CSS Class that will be applied to the outer control.*/
.igiv_Control
{
	background-color: Transparent;
	padding-bottom: 60px;
    
    
}
    .igiv_Control > div > table {
        border-width: 1px;
        border-style: solid;
        border-color: #BEBEBE;
    }

/*
	This class should be used for setting any padding that might be 
	needed if the Header is placed above the control.
*/
.igiv_HeaderPadding
{
	padding-top: 60px;
}


/*
	This class should be used for adjusting the padding of the control
	to account for the additional size of the header and footer.
*/
.igiv_FooterPadding
{
	padding-bottom: 60px;
}


/*
	The CSS class that will be applied to the header. 
    The header can be absolutely positoned anywhere in the control, because the WebImageViewerhas an internal DIV that
    wraps the control with a position set to relative. </para>
*/
.igiv_HeaderContentArea
{
	width: 100%;
	position: absolute;
	top: -30px;
	left: -6px;
	color:#333333;
	cursor:default;
	font-family:'Segoe UI',verdana,sans-serif;
	font-size:14px;
	font-weight:normal;
	text-align:left;
}


/*The CSS class that will be applied to the Left Corner of the Header. */
.igiv_HeaderContentLeft
{
}


/*The CSS class that will be applied to the actual content of the Header.*/
.igiv_HeaderContent
{
	padding-top:-5px;
	padding-left:3px;
}


/*The CSS class that will be applied to the Right Corner of the Header. */
.igiv_HeaderContentRight
{
}


/*
	A TR that wraps the TopLeft, TopArea, and TopRight elements. 
    This CSS class is useful in setting the height of the entire row.
*/
.igiv_HeaderArea
{
	height: 6px;
}


/*
	The CSS class that will be applied to the footer. 
    The footer can be absolutely positoned anywhere in the control, because the WebImageViewer has an internal DIV that
    wraps the control with a position set to relative. </para>
*/
.igiv_FooterContentArea
{
	font-size:14px;
	margin-top:20px;
	right: 0px;
	/* width: 100%; */
	position: absolute;
	color:#666666;
	text-align:right;
}


/*The CSS class that will be applied to the Left Corner of the Footer. */
.igiv_FooterContentLeft
{
}


/*The CSS class that will be applied to the actual content of the Footer.*/
.igiv_FooterContent
{
}


/* The CSS class that will be applied to the Right Corner of the Footer. */
.igiv_FooterContentRight
{
}


/*
	 A TR that wraps the BottomLeft, BottomArea, and BottomRight elements. 
     This CSS class is useful in setting the height of the entire row.
*/
.igiv_FooterArea
{
	height: 6px;
}


/*
	A TD that wraps the Header.
    This CSS Class should be used for applying a Background-Image along the top border of the control.
*/
.igiv_EdgeTop
{
	/*background-repeat:repeat-x;
	background-image: none;*/
    background-color:#CCCCCC;
	height: 6px;
}


/*
	A TD on the left side of the ImageArea.
    This CSS Class should be used for applying a Background-Image along the left border of the control.
*/
.igiv_EdgeLeft
{
	/*background-repeat:repeat-y;
	background-image: none;*/
    
    background-color:#CCCCCC;
	width: 14px;
}


/*
	A TD that wraps the Footer.
    This CSS Class should be used for applying a Background-Image along the bottom border of the control.
*/
.igiv_EdgeBottom
{
	/*background-repeat:repeat-x;
	background-position:bottom ;
	background-image: url(./images/igiv_EdgeBottom.gif);*/
    
    background-color:#CCCCCC;
}


/*
	 A TD on the right side of the ImageArea.
     This CSS Class should be used for applying a Background-Image along the right border of the control.
       
*/
.igiv_EdgeRight
{
	/*background-repeat:repeat-y;
	background-image: url(./images/igiv_EdgeRight.gif);*/
    
    background-color:#CCCCCC;
	width: 14px;
}


/*
	 The Top Left corner of the control.
     This CSS Class should be used for rounded corners.
*/
.igiv_CornerTopLeft
{
	/*background-repeat:no-repeat;
	background-image: url(images/igiv_CornerTopLeft.gif);*/
    
    background-color:#CCCCCC;
	width: 14px;
}


/*
	The Top Right corner of the control.
    This CSS Class should be used for rounded corners.
*/
.igiv_CornerTopRight
{
	/*background-repeat:no-repeat;
	background-position:right top ;
	background-image: url(./images/igiv_CornerTopRight.gif);*/
    
    background-color:#CCCCCC;
	width: 14px;
}


/*
	The Bottom Left corner of the control.
    This CSS Class should be used for rounded corners.
*/
.igiv_CornerBottomLeft
{
	/*background-repeat:no-repeat;
	background-position:left bottom ;
	background-image: url(./images/igiv_CornerBottomLeft.gif);*/
    background-color:#CCCCCC;
}


/*
	The Bottom Right corner of the control.
    This CSS Class should be used for rounded corners.
*/
.igiv_CornerBottomRight
{
	/*background-repeat:no-repeat;
	background-position:bottom right ;
	background-image: url(./images/igiv_CornerBottomRight.gif);*/
    background-color:#CCCCCC;
}


/*
	The CSS class that will be applied to the Container of the Previous Button. 
    This css Class is the TD in which the Image element is rendered. This style can be used
    to set the vertical-align CSS attribute.
*/
.igiv_PrevButtonArea
{
	vertical-align:middle;
}


/*
	The CSS class that will be applied to the Previous Button. 
    The Previous Button can be absolutely positoned anywhere in the control, because the WebImageViewer has an internal DIV that
    wraps the control with a position set to relative. 
*/
.igiv_PrevButton
{
	padding-left:3px;
	cursor:pointer;
}


/*
	The CSS class that will be applied to the Container of the Next Button. 
    This css Class is the TD in which the Image element is rendered. This style can be used
    to set the vetical-align CSS attribute.
*/
.igiv_NextButtonArea
{
	cursor:pointer;
	vertical-align:middle;
}


/*
	The CSS class that will be applied to the Next Button. 
    The Next Button can be absolutely positoned anywhere in the control, because the WebImageViewer has an internal DIV that
    wraps the control with a position set to relative.
*/
.igiv_NextButton
{
	padding-left:1px;
	cursor:pointer;
}


/*
	A TD that contains the ImageArea.
    If you would like a border around the ImageArea, this is the class to use.
*/
.igiv_ImageAreaContainer
{
	border:solid 1px #BEBEBE;
}


/*
	A DIV that contains all of the Images. 
    In XHTML, to apply a border around the images a padding-bottom must be set to the size of the 
	border-top-width plus the border-bottom-width.
*/
.igiv_ImageArea
{
	background-color:White;
	padding-bottom: 0;
}


/*
	An IMG element that is contained by the ImageAra.
    In XHTML, to apply a border around an image a padding-bottom must be set to the size of the 
	border-top-width plus the border-bottom-width on the ImageArea.
*/
.igiv_Image
{
	padding-right:4px;
}


/*Applied to an IMG when it is selected.*/
.igiv_ImageSelected
{
}


/*Applied to an IMG when the mouse is over it.*/
.igiv_ImageHover
{
}


/*
	When an image is hovered, this style gets applied to all other images.
    A good use of this style is to apply an opacity to all other images that aren't being hovered, 
	so that the hovered image has more focus.
*/
.igiv_OtherImageHover
{
	opacity: .5;
	filter: alpha(opacity=50);
}


/*Applied to an IMG when the image is disabled.*/
.igiv_ImageDisabled
{
	opacity: .25;
	filter: alpha(opacity=25);
}


/**************************** VERTICAL ***************************************/
/*The CSS Class that will be applied to the outer control.*/
.igiv_Control_Vert
{
	background-color:Transparent;
	padding-bottom:70px;
}
    .igiv_Control_Vert > div > table {
        border-width: 1px;
        border-style: solid;
        border-color: #BEBEBE;
    }


/*
	This class should be used for setting any padding that might be 
	needed if the Header is placed above the control.
*/
.igiv_HeaderPadding_Vert
{
	padding-top:70px;
}


/*
	This class should be used for adjusting the padding of the control
	to account for the additional size of the header and footer.
*/
.igiv_FooterPadding_Vert
{
	padding-bottom:70px;
}


/*
	The CSS class that will be applied to the header. 
    The header can be absolutely positoned anywhere in the control, because the WebImageViewer has an internal DIV that
    wraps the control with a position set to relative.
*/
.igiv_HeaderContentArea_Vert
{
    width: 100%;
	position: absolute;
	top: -30px;
	left: -6px;
	color:#333333;
	cursor:default;
	font-family:'Segoe UI',verdana,sans-serif;
	font-size:14px;
	font-weight:normal;
	text-align:left;
}


/*The CSS class that will be applied to the Left Corner of the Header. */
.igiv_HeaderContentLeft_Vert
{
}


/*The CSS class that will be applied to the actual content of the Header.*/
.igiv_HeaderContent_Vert
{
}


/*The CSS class that will be applied to the Right Corner of the Header. */
.igiv_HeaderContentRight_Vert
{
}


/*
	A TR that wraps the TopLeft_Vert, TopArea_Vert, and TopRight_Vert elements. 
    This CSS class is useful in setting the height of the entire row.
*/
.igiv_HeaderArea_Vert
{
	height: 14px;
}


/*
	The CSS class that will be applied to the footer. 
    The footer can be absolutely positoned anywhere in the control, because the WebImageViewer has an internal DIV that
    wraps the control with a position set to relative. 
*/
.igiv_FooterContentArea_Vert
{
	font-size:14px;
	/* width: 100%; */
	position: absolute;
	bottom: -57px;
	right: 0px;
	color:#666666;
	text-align:right;
}


/*The CSS class that will be applied to the Left Corner of the Footer. */
.igiv_FooterContentLeft_Vert
{
}


/*The CSS class that will be applied to the actual content of the Footer.*/
.igiv_FooterContent_Vert
{
}


/*The CSS class that will be applied to the Right Corner of the Footer. */
.igiv_FooterContentRight_Vert
{
}


/*
	A TR that wraps the BottomLeft_Vert, BottomArea_Vert, and BottomRight_Vert elements. 
    This CSS class is useful in setting the height of the entire row.
*/
.igiv_FooterArea_Vert
{
	height: 14px;
}


/*
	A TD that wraps the Header_Vert.
    This CSS Class should be used for applying a Background-Image along the top border of the control.
*/
.igiv_EdgeTop_Vert
{
    background-color:#CCCCCC;
	height: 14px;
}


/*
	A TD on the left side of the ImageArea_Vert.
    This CSS Class should be used for applying a Background-Image along the left border of the control.
*/
.igiv_EdgeLeft_Vert
{
    background-color:#CCCCCC;
	width: 6px;
}


/*
	A TD that wraps the Footer_Vert.
    This CSS Class should be used for applying a Background-Image along the bottom border of the control.
*/
.igiv_EdgeBottom_Vert
{
    background-color:#CCCCCC;
}


/*
	A TD on the right side of the ImageArea_Vert.
    This CSS Class should be used for applying a Background-Image along the right border of the control.
*/
.igiv_EdgeRight_Vert
{
    background-color:#CCCCCC;
	width: 6px;
}


/*
	The Top Left corner of the control.
    This CSS Class should be used for rounded corners.
*/
.igiv_CornerTopLeft_Vert
{
    background-color:#CCCCCC;
	width: 6px;
}


/*
	The Top Right corner of the control.
    This CSS Class should be used for rounded corners.
*/
.igiv_CornerTopRight_Vert
{
    background-color:#CCCCCC;
	width: 6px;
}


/*
	The Bottom Left corner of the control.
    This CSS Class should be used for rounded corners.
*/
.igiv_CornerBottomLeft_Vert
{
    background-color:#CCCCCC;
	height: 6px;
}


/*
	The Bottom Right corner of the control.
    This CSS Class should be used for rounded corners.
*/
.igiv_CornerBottomRight_Vert
{
    background-color:#CCCCCC;
}


/*
	The CSS class that will be applied to the Container of the PreviousButton. 
    This css Class is the TD in which the Image element is rendered. This style can be used
    to set the text-align CSS attribute.
*/
.igiv_PrevButtonArea_Vert
{
	position: relative;
	width: 100%;
	text-align:center;
}


/*
	The CSS class that will be applied to the Previous Button. 
    The Previous Button can be absolutely positoned anywhere in the control, because the WebImageViewer has an internal DIV that
    wraps the control with a position set to relative. 
*/
.igiv_PrevButton_Vert
{
	padding-top:2px;
}


/*
	The CSS class that will be applied to the Container of the Next Button. 
    This css Class is the TD in which the Image element is rendered. This style can be used
    to set the text-align CSS attribute.
*/
.igiv_NextButtonArea_Vert
{
	margin-top:2px;
	position: relative;
	width: 100%;
	text-align:center;
}


/*
	The CSS class that will be applied to the Next Button. 
    The Next Button can be absolutely positoned anywhere in the control, because the WebImageViewer has an internal DIV that
    wraps the control with a position set to relative. 
*/
.igiv_NextButton_Vert
{
	padding-top:2px;
}


/*
	A TD that contains the ImageArea.
    If you would like a border around the ImageArea, this is the class to use.
*/
.igiv_ImageAreaContainer_Vert
{
	border: 1px solid #BEBEBE;
}


/*
	A DIV that contains all of the Images. 
    In XHTML, to apply a border around the images a padding-right must be set to the size of the 
	border-left-width plus the border-right-width.
*/
.igiv_ImageArea_Vert
{
	padding-right: 2px;
}


/*
	An IMG element that is contained by the ImageAra.
    In XHTML, to apply a border around an image a padding-right must be set to the size of the 
	border-left-width plus the border-right-width on the ImageArea_Vert.
*/
.igiv_Image_Vert
{
	background-color:White;
	padding-bottom:4px;
}


/*Applied to an IMG when it is selected.*/
.igiv_ImageSelected_Vert
{
}


/*Applied to an IMG when the mouse is over it.*/
.igiv_ImageHover_Vert
{
}


/*
	When an image is hovered, this style gets applied to all other images.
    A good use of this style is to apply an opacity to all other images that aren't being hovered, 
	so that the hovered image has more focus.
*/
.igiv_OtherImageHover_Vert
{
	opacity: .5;
	filter: alpha(opacity=50);
}


/*Applied to an IMG when the image is disabled.*/
.igiv_ImageDisabled_Vert
{
	opacity: .25;
	filter: alpha(opacity=25);
}


