﻿/* ----------------------------------------------------------------------------------------------
	Date: March 2007
	Author: Elmer Morales, Avanade
	Description: Cascading style sheet that defines styles for rounded boxes used across TASER.com.
   ---------------------------------------------------------------------------------------------- */



/* 
Generic Styles that Apply to all Table-based Rounded Boxes
-------------------------------------------------------------------------------------------------- */

table.rounded{}
table.rounded .top-border{background-image:none;border-top:solid 1px #8E979D;}
table.rounded .btm-border{background-image:none;border-bottom:solid 1px #8E979D;}
table.rounded .lt-border{ background-image:none;border-left:solid 1px #8E979D;}
table.rounded .rt-border{background-image:none;border-right:solid 1px #8E979D;}
table.rounded td{ padding:0px; background-repeat:no-repeat;}

table.rounded td td {background-image: none;} /* Do not show the background image on nested tables */
table.rounded .inside {	border:none;background-image: none;}


/* 
Color Styles for White, Light Yellow, and Light Gray Rounded Boxes
-------------------------------------------------------------------------------------------------- */

/* Color the every border cell with a BG, do not apply to all TD as this will override */
/* TODO: Use a new style to apply the bg color directory on the cell */
table.white-6px td.lt-border, table.white-6px td.rt-border, table.white-6px td.top-border, table.white-6px td.btm-border,  table.white-6px td.inside,
table.white-8px td.lt-border, table.white-8px td.rt-border, table.white-8px td.top-border, table.white-8px td.btm-border, table.white-8px td.inside,
table.white-10px td.lt-border, table.white-10px td.rt-border, table.white-10px td.top-border, table.white-10px td.btm-border, table.white-10px td.inside,
table.white-12px td.lt-border, table.white-12px td.rt-border, table.white-12px td.top-border, table.white-12px td.btm-border, table.white-12px td.inside { background-color: #fff;}

table.lightyellow-6px td.lt-border, table.lightyellow-6px td.rt-border, table.lightyellow-6px td.top-border, table.lightyellow-6px td.btm-border,  table.lightyellow-6px td.inside,
table.lightyellow-8px td.lt-border, table.lightyellow-8px td.rt-border, table.lightyellow-8px td.top-border, table.lightyellow-8px td.btm-border, table.lightyellow-8px td.inside,
table.lightyellow-10px td.lt-border, table.lightyellow-10px td.rt-border, table.lightyellow-10px td.top-border, table.lightyellow-10px td.btm-border, table.lightyellow-10px td.inside,
table.lightyellow-12px td.lt-border, table.lightyellow-12px td.rt-border, table.lightyellow-12px td.top-border, table.lightyellow-12px td.btm-border, table.lightyellow-12px td.inside { background-color: #fffff0;}

table.lightgray-6px td.lt-border, table.lightgray-6px td.rt-border, table.lightgray-6px td.top-border, table.lightgray-6px td.btm-border,  table.lightgray-6px td.inside,
table.lightgray-8px td.lt-border, table.lightgray-8px td.rt-border, table.lightgray-8px td.top-border, table.lightgray-8px td.btm-border, table.lightgray-8px td.inside,
table.lightgray-10px td.lt-border, table.lightgray-10px td.rt-border, table.lightgray-10px td.top-border, table.lightgray-10px td.btm-border, table.lightgray-10px td.inside,
table.lightgray-12px td.lt-border, table.lightgray-12px td.rt-border, table.lightgray-12px td.top-border, table.lightgray-12px td.btm-border, table.lightgray-12px td.inside { background-color: #F4F5F5;}





table.white-6px td.top-l, table.white-6px td.top-r, table.white-6px td.btm-l, table.white-6px td.btm-r {background-image: url('white_6px_1280x18.gif');}
table.white-8px td.top-l, table.white-8px td.top-r, table.white-8px td.btm-l, table.white-8px td.btm-r 	{background-image: url('white_8px_1280x18.gif');}
table.white-10px td.top-l, table.white-10px td.top-r, table.white-10px td.btm-l, table.white-10px td.btm-r 	{background-image: url('white_10px_1280x24.gif');}
table.white-12px td.top-l, table.white-12px td.top-r, table.white-12px td.btm-l, table.white-12px td.btm-r 	{background-image: url('white_12px_1280x28.gif'); background-color:lime;}


table.lightyellow-6px td.top-l, table.lightyellow-6px td.top-r, table.lightyellow-6px td.btm-l, table.lightyellow-6px td.btm-r {background-image: url('lightyellow_6px_1280x18.gif');}
table.lightyellow-8px td.top-l, table.lightyellow-8px td.top-r, table.lightyellow-8px td.btm-l, table.lightyellow-8px td.btm-r 	{background-image: url('lightyellow_8px_1280x18.gif');}
table.lightyellow-10px td.top-l, table.lightyellow-10px td.top-r, table.lightyellow-10px td.btm-l, table.lightyellow-10px td.btm-r 	{background-image: url('lightyellow_10px_1280x24.gif');}
table.lightyellow-12px td.top-l, table.lightyellow-12px td.top-r, table.lightyellow-12px td.btm-l, table.lightyellow-12px td.btm-r 	{background-image: url('lightyellow_12px_1280x28.gif');}


table.lightgray-6px td.top-l, table.lightgray-6px td.top-r, table.lightgray-6px td.btm-l, table.lightgray-6px td.btm-r {background-image: url('lightgray_6px_1280x18.gif');}
table.lightgray-8px td.top-l, table.lightgray-8px td.top-r, table.lightgray-8px td.btm-l, table.lightgray-8px td.btm-r 	{background-image: url('lightgray_8px_1280x18.gif');}
table.lightgray-10px td.top-l, table.lightgray-10px td.top-r, table.lightgray-10px td.btm-l, table.lightgray-10px td.btm-r 	{background-image: url('lightgray_10px_1280x24.gif');}
table.lightgray-12px td.top-l, table.lightgray-12px td.top-r, table.lightgray-12px td.btm-l, table.lightgray-12px td.btm-r 	{background-image: url('lightgray_12px_1280x28.gif');}


/* 
Corner Radius Specific Styles
-------------------------------------------------------------------------------------------------- */

/* Styles for 6px and 8px Radius Corners ------------------------------- */

table.rounded-6px td.top-r,	table.rounded-8px td.top-r {
	height: 9px; width: 9px;
	margin-left: 9px;margin-top: -9px;
	background-position: 100% 0;
	background-color: transparent;
}
table.rounded-6px td.top-l, table.rounded-8px td.top-l {
	height: 9px; width: 9px;	margin-right: 9px;
	background-color: transparent;
}
table.rounded-6px td.btm-r, table.rounded-8px td.btm-r {
	height: 9px; width: 9px;
	margin-left: 9px;margin-top: -9px;
	background-position: 100% -9px;
	background-color: transparent;
}
table.rounded-6px td.btm-l, table.rounded-8px td.btm-l {
	height: 9px; width: 9px; margin-right: 9px; 
	background-position: 0 -9px;
	background-color: transparent;
}



/* Styles for 10px Radius Corners ------------------------------- */
table.rounded-10px td.top-r {
	height: 12px; width: 12px;
	margin-left: 12px;margin-top: -12px;
	background-position: 100% 0;
	background-color: transparent;
}
table.rounded-10px td.top-l {
	height: 12px; width: 12px;	margin-right: 12px;
	background-color: transparent;
}
table.rounded-10px td.btm-r {
	height: 12px; width: 12px;
	margin-left: 12px;margin-top: -12px;
	background-position: 100% -12px;
	background-color: transparent;
}
table.rounded-10px td.btm-l {
	height: 12px; width: 12px; margin-right: 12px; 
	background-position: 0 -12px;
	background-color: transparent;
}

/* Styles for 12px Radius Corners ------------------------------- */
table.rounded-12px td.top-r {
	height: 14px; width: 14px;
	margin-left: 14px;margin-top: -14px;
	background-position: 100% 0;
	background-color: transparent;	
}
table.rounded-12px td.top-l {
	height: 14px; width: 14px;	margin-right: 14px;
	background-color: transparent;
}
table.rounded-12px td.btm-r {
	height: 14px; width:14px;
	margin-left: 14px;margin-top: -14px;
	background-position: 100% -14px;
	background-color: transparent;
}
table.rounded-12px td.btm-l {
	height: 14px; width: 14px; margin-right: 14px; 
	background-position: 0 -14px;
	background-color: transparent;
}







/*
 CSS/Div Based Approach - Pending Delete As of 03/22/07, Using Table-based Approach Above Instead
 -------------------------------------------------------------------------------------------------- */




.notopgap    { margin-top: 0; margin-bottom: 0; }   
.nobottomgap { margin-bottom: 0; } 


/* White Background: 6px Radius */
.white6px-top-left, .white6px-top-right, .white6px-bottom-left, .white6px-bottom-right { 
	background-image: url('white_6px_1280x18.gif');
	height: 9px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.white6px-top-left, .white6px-bottom-left {margin-right: 9px; }
.white6px-top-right, .white6px-bottom-right {margin-left: 9px;margin-top: -9px;}
.white6px-top-right {background-position: 100% 0; }
.white6px-bottom-left  { background-position: 0 -9px;}
.white6px-bottom-right { background-position: 100% -9px;}
.white6px-inside {
	background: #fff;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}

/* White Background: 8px Radius */
.white8px-top-left, .white8px-top-right, .white8px-bottom-left, .white8px-bottom-right { 
	background-image: url('white_8px_1280x18.gif');
	height: 9px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.white8px-top-left, .white8px-bottom-left {margin-right: 9px; }
.white8px-top-right, .white8px-bottom-right {margin-left: 9px;margin-top: -9px;}
.white8px-top-right {background-position: 100% 0; }
.white8px-bottom-left  { background-position: 0 -9px;}
.white8px-bottom-right { background-position: 100% -9px;}
.white8px-inside {
	background: #fff;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}

	
/* White Background: 10px Radius */
.white10px-top-left, .white10px-top-right, .white10px-bottom-left, .white10px-bottom-right { 
	background-image: url('white_10px_1280x24.gif');
	height: 12px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.white10px-top-left, .white10px-bottom-left {margin-right: 12px; }
.white10px-top-right, .white10px-bottom-right {margin-left: 12px;margin-top: -12px;}
.white10px-top-right {background-position: 100% 0; }
.white10px-bottom-left  { background-position: 0 -12px;}
.white10px-bottom-right { background-position: 100% -12px;}
.white10px-inside {
	background: #fff;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}



/* White Background: 12px Radius */
.white12px-top-left, .white12px-top-right, .white12px-bottom-left, .white12px-bottom-right { 
	background-image: url('white_12px_1280x28.gif');
	height: 14px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.white12px-top-left, .white12px-bottom-left {margin-right: 14px; }
.white12px-top-right, .white12px-bottom-right {margin-left: 14px;margin-top: -14px;}
.white12px-top-right {background-position: 100% 0; }
.white12px-bottom-left  { background-position: 0 -14px;}
.white12px-bottom-right { background-position: 100% -14px;}
.white12px-inside {
	background: #fff;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}


/* ---------------------------------------------------------------------------------------------------------------------*/


/* Light Yellow Background: 6px Radius */
.lightyellow6px-top-left, .lightyellow6px-top-right, .lightyellow6px-bottom-left, .lightyellow6px-bottom-right { 
	background-image: url('lightyellow_6px_1280x18.gif');
	height: 9px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.lightyellow6px-top-left, .lightyellow6px-bottom-left {margin-right: 9px; }
.lightyellow6px-top-right, .lightyellow6px-bottom-right {margin-left: 9px;margin-top: -9px;}
.lightyellow6px-top-right {background-position: 100% 0; }
.lightyellow6px-bottom-left  { background-position: 0 -9px;}
.lightyellow6px-bottom-right { background-position: 100% -9px;}
.lightyellow6px-inside {
	background: #fffff0;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}

/* Light Yellow Background: 8px Radius */
.lightyellow8px-top-left, .lightyellow8px-top-right, .lightyellow8px-bottom-left, .lightyellow8px-bottom-right { 
	background-image: url('lightyellow_8px_1280x18.gif');
	height: 9px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.lightyellow8px-top-left, .lightyellow8px-bottom-left {margin-right: 9px; }
.lightyellow8px-top-right, .lightyellow8px-bottom-right {margin-left: 9px;margin-top: -9px;}
.lightyellow8px-top-right {background-position: 100% 0; }
.lightyellow8px-bottom-left  { background-position: 0 -9px;}
.lightyellow8px-bottom-right { background-position: 100% -9px;}
.lightyellow8px-inside {
	background: #fffff0;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}


.lightyellow10px-top-left, .lightyellow10px-top-right, .lightyellow10px-bottom-left, .lightyellow10px-bottom-right { 
	background-image: url('lightyellow_10px_1280x24.gif');
	height: 12px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
	padding-bottom: 0px;padding-top: 0px;   
}
.lightyellow10px-top-left, .lightyellow10px-bottom-left {margin-right: 12px; padding-bottom: 0px;padding-top: 0px;  }
.lightyellow10px-top-right, .lightyellow10px-bottom-right {margin-left: 12px;margin-top: -12px;

padding-bottom: 0px;padding-top: 0px;  


}
.lightyellow10px-top-right {background-position: 100% 0;padding-bottom: 0px;padding-top: 0px;   }
.lightyellow10px-bottom-left  { background-position: 0 -12px;padding-bottom: 0px;padding-top: 0px;  }
.lightyellow10px-bottom-right { background-position: 100% -12px;padding-bottom: 0px;padding-top: 0px;  }
.lightyellow10px-inside {
	background: #fffff0;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px; 
	padding-bottom: 0px;padding-top: 0px;  
	         
}



/* Background: 12px Radius */
.lightyellow12px-top-left, .lightyellow12px-top-right, .lightyellow12px-bottom-left, .lightyellow12px-bottom-right { 
	background-image: url('lightyellow_12px_1280x28.gif');
	height: 14px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.lightyellow12px-top-left, .lightyellow12px-bottom-left {margin-right: 14px; }
.lightyellow12px-top-right, .lightyellow12px-bottom-right {margin-left: 14px;margin-top: -14px;}
.lightyellow12px-top-right {background-position: 100% 0; }
.lightyellow12px-bottom-left  { background-position: 0 -14px;}
.lightyellow12px-bottom-right { background-position: 100% -14px;}
.lightyellow12px-inside {
	background: #fffff0;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}


/* ---------------------------------------------------------------------------------------------------------------------*/

/* Light Gray Background: 6px Radius */
.lightgray6px-top-left, .lightgray6px-top-right, .lightgray6px-bottom-left, .lightgray6px-bottom-right { 
	background-image: url('lightgray_6px_1280x18.gif');
	height: 9px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.lightgray6px-top-left, .lightgray6px-bottom-left {margin-right: 9px; }
.lightgray6px-top-right, .lightgray6px-bottom-right {margin-left: 9px;margin-top: -9px;}
.lightgray6px-top-right {background-position: 100% 0; }
.lightgray6px-bottom-left  { background-position: 0 -9px;}
.lightgray6px-bottom-right { background-position: 100% -9px;}
.lightgray6px-inside {
	background: #F4F5F5;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}
	
/* Light Gray Background: 8px Radius */
.lightgray8px-top-left, .lightgray8px-top-right, .lightgray8px-bottom-left, .lightgray8px-bottom-right { 
	background-image: url('lightgray_8px_1280x18.gif');
	height: 9px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.lightgray8px-top-left, .lightgray8px-bottom-left {margin-right: 9px; }
.lightgray8px-top-right, .lightgray8px-bottom-right {margin-left: 9px;margin-top: -9px;}
.lightgray8px-top-right {background-position: 100% 0; }
.lightgray8px-bottom-left  { background-position: 0 -9px;}
.lightgray8px-bottom-right { background-position: 100% -9px;}
.lightgray8px-inside {
	background: #F4F5F5;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}

.lightgray10px-top-left, .lightgray10px-top-right, .lightgray10px-bottom-left, .lightgray10px-bottom-right { 
	background-image: url('lightgray_10px_1280x24.gif');
	height: 12px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.lightgray10px-top-left, .lightgray10px-bottom-left {margin-right: 12px; }
.lightgray10px-top-right, .lightgray10px-bottom-right {margin-left: 12px;margin-top: -12px;}
.lightgray10px-top-right {background-position: 100% 0; }
.lightgray10px-bottom-left  { background-position: 0 -12px;}
.lightgray10px-bottom-right { background-position: 100% -12px;}
.lightgray10px-inside {
	background: #F4F5F5;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}



/* White Background: 12px Radius */
.lightgray12px-top-left, .lightgray12px-top-right, .lightgray12px-bottom-left, .lightgray12px-bottom-right { 
	background-image: url('lightgray_12px_1280x28.gif');
	height: 14px;      
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
}
.lightgray12px-top-left, .lightgray12px-bottom-left {margin-right: 14px; }
.lightgray12px-top-right, .lightgray12px-bottom-right {margin-left: 14px;margin-top: -14px;}
.lightgray12px-top-right {background-position: 100% 0; }
.lightgray12px-bottom-left  { background-position: 0 -14px;}
.lightgray12px-bottom-right { background-position: 100% -14px;}
.lightgray12px-inside {
	background: #F4F5F5;
	border: 1px solid #8E979D; 
	border-top:none;
	border-bottom: none;       	
	padding-left: 10px;             
	padding-right:10px;             
}

/* ---------------------------------------------------------------------------------------------------------------------*/
