/* root element for tabs  */
#tabs > ul {
    list-style: none;
    margin: 0 !important;
    padding: 0;
    height: 47px;
    border-bottom: 2px solid #f0f0f0;
}

/* single tab */
    #tabs > ul li {
        float: left;
        text-indent: 0;
       
        /*border: 0px solid #cdcfcf 2px;
        list-style-image: none !important;
        border-radius: 10px 8px 0px 0px;
        margin-right: 5px;
        border-width: 0px;
        border-bottom-color: #FFFFFF;
        background-color: hsl(0, 0%, 81%);
        outline: none;
        outline: transparent;*/

    }

/* link inside the tab. uses a background image */
    #tabs > ul a {
        font-size: 15px;
        font-family: Arial;
        font-weight: bold;
        display: block;
/*        height: 54px;
*/        line-height: 30px;
        width: 134px;
        text-align: center;
        text-decoration: none;
        color: #333;
        padding: 0px;
        margin: 0px;
        position: relative;
        top: 2px;
        outline: none;
        padding-bottom: 65px;
/*        background: hsl(0, 0%, 81%);
*/        margin: 2px;
        border-radius: 10px 10px 0px 0px;
        overflow: hidden;
    }

#tabs > ul a:active {
	outline:none;		
}

/* when mouse enters the tab move the background image */
#tabs > ul a:hover {
	background-position: -420px -31px;	
	color:#000;	
}
    #tabs > ul a {
/*        color: #056380;
*/        cursor: pointer;
        display: inline-block;
        text-decoration: none;
        padding: 8px 2px 12px;
        color: #000;
        margin-right: 4px;
        box-shadow: inset 0 0 0 #009dd6;
        transition: .15s ease-out;
        font-size: 12px;
        padding: 4px 4px 8px;
margin-right: 8px;
    }
/* active tab uses a class name "current". its highlight is also done by moving the background image. */
    #tabs > ul a.current, #tabs > ul a.current:hover, #tabs > ul li.current a {
        /*	background-color:white;
	cursor:default !important; 
	color:#000 !important;
	border-bottom: 0px;*/
        display: inline-block;
        text-decoration: none;
        font-size: 12px;
        color: #0069aa;
        box-shadow: inset 0 -4px 0 #009dd6;
        padding: 4px 4px 8px;
        margin-right: 8px;
    }

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
#tabs > ul a.s 			{ background-position: -553px 0; width:81px; }
#tabs > ul a.s:hover 	{ background-position: -553px -31px; }
#tabs > ul a.s.current  { background-position: -553px -62px; }

/* width 2 */
#tabs > ul a.l 			{ background-position: -248px -0px; width:174px; }
#tabs > ul a.l:hover 	{ background-position: -248px -31px; }
#tabs > ul a.l.current  { background-position: -248px -62px; }


/* width 3 */
#tabs > ul a.xl 			{ background-position: 0 -0px; width:248px; }
#tabs > ul a.xl:hover 	{ background-position: 0 -31px; }
#tabs > ul a.xl.current { background-position: 0 -62px; }


/* initially all panes are hidden */ 
.panes .pane {
	display:none;		
}


 /* tab pane styling */
        .panes div.ca
        {
            display: none;
            padding: 5px 5px;
            border: 1px solid #999;
            border-top: 0;
            height: 260px;
            background-color: #fff;
        }
        #Text1
        {
            width: 190px;
        }
        
        

#tabs > ul2 { 
	list-style:none; 
	margin:0 !important; 
	padding:0;	
	border-bottom:1px solid #666;	
	height:30px;
}

/* single tab */
#tabs > ul2 li { 
	float:right;	 
	text-indent:0;
	padding:0;
	margin:0 !important;
	list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
#tabs > ul2 a
{
    background: url('../images/blue.png') no-repeat -420px 0;
    font-size: 15px;
    font-family:Arial;
    font-weight:bold;
    display: block;
    height: 30px;
    line-height: 30px;
    width: 134px;
    text-align: center;
    text-decoration: none;
    color: #333;
    padding: 0px;
    margin: 0px;
    position: relative;
    top: 1px;
}

#tabs > ul2 a:active {
	outline:none;		
}

/* when mouse enters the tab move the background image */
#tabs > ul2 a:hover {
	background-position: -420px -31px;	
	color:#fff;	
}

/* active tab uses a class name "current". its highlight is also done by moving the background image. */
#tabs > ul2 a.current, #tabs > ul2 a.current:hover, #tabs > ul2 li.current a {
	background-color:white;	
	cursor:default !important; 
	color:#000 !important;
}

/* Different widths for tabs2: use a class name: w1, w2, w3 or w2 */


/* width 1 */
#tabs > ul2 a.s 			{ background-position: -553px 0; width:81px; }
#tabs > ul2 a.s:hover 	{ background-position: -553px -31px; }
#tabs > ul2 a.s.current  { background-position: -553px -62px; }

/* width 2 */
#tabs > ul2 a.l 			{ background-position: -248px -0px; width:174px; }
#tabs > ul2 a.l:hover 	{ background-position: -248px -31px; }
#tabs > ul2 a.l.current  { background-position: -248px -62px; }


/* width 3 */
#tabs > ul2 a.xl 			{ background-position: 0 -0px; width:248px; }
#tabs > ul2 a.xl:hover 	{ background-position: 0 -31px; }
#tabs > ul2 a.xl.current { background-position: 0 -62px; }

.paness div.ca
        {
            display: none;
            padding: 5px 5px;
            border: 1px solid #999;
            border-top: 0;
            height: 260px;
            background-color: #fff;
        }