﻿body a{color:#09F;}
#demopage {width:100%;  margin:0 auto;}
ul.rtabs{font-size:0; margin:0;padding:0;list-style-type:none; text-align:left;}        
ul.rtabs li{ padding:0; display:inline; margin:0; /*gap between tabs. Set it to -1px for no gap.*/ }
        
ul.rtabs li a{
    padding:5px 41px; /* It determines tab width */
    display:inline-block;    
    font-weight:normal;
	text-transform:uppercase;
    font-size:16px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height:32px;/* height of tabs */
    text-decoration: none;
    color:#fff;
    /*background:#839438;*/
	background: #ddd;
	/*background: -moz-linear-gradient(top,  #fcfcfc 0%, #e4e4e4 100%); 
	background: -webkit-linear-gradient(top,  #fcfcfc 0%,#e4e4e4 100%); 
	background: linear-gradient(to bottom,  #fcfcfc 0%,#e4e4e4 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#e4e4e4',GradientType=0 ); */ 	
} 
    
       
ul.rtabs li a:hover{background:#e5e5e5; /*color #2*/ color:#222;}  
/*selected tab style */
ul.rtabs li.selected a{/*color:#222;background:#e5e5e5;*/ /*color #2*/ /*z-index:3;*/}         
/* container of content panels */
div.panel-container{position:relative; padding:0px; margin:0px;}
/* content panel */       
div.panel-container > div{display:block; margin:0px; padding:0px 0px;/*update it to: padding:30px; if you want the content to have a left and padding within the content panel.*/} 
div.panel-container div.inactive{display: none;}  
/* loading image before ajax content is retrieved. Only applicable when Ajax is used.*/
div.ajaxLoading {background:transparent url(loading.gif) no-repeat center center; height:150px; width:20px; font-size:0;padding:0; margin:0 auto; }

ul.inerrtabs{font-size:0; margin:0;padding:0;list-style-type:none; text-align:left;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fcfcfc+0,e4e4e4+100 */
/*
border:1px solid #d4d4d4;
background: #fcfcfc;
background: -moz-linear-gradient(top,  #fcfcfc 0%, #e4e4e4 100%); 
background: -webkit-linear-gradient(top,  #fcfcfc 0%,#e4e4e4 100%); 
background: linear-gradient(to bottom,  #fcfcfc 0%,#e4e4e4 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#e4e4e4',GradientType=0 );
*/  
}

        
ul.inerrtabs li{ padding:0; display:inline; margin:0 8px 0 0;  /*gap between tabs. Set it to -1px for no gap.*/ }        
ul.inerrtabs li a{
    padding:5px 20px; /* It determines tab width */
    display:inline-block;    
    font-weight:normal;
    font-size:17px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height:24px;/* height of tabs */
    text-decoration: none;
    color:#444;
    position:relative; 	
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fcfcfc+0,e4e4e4+100 */
/*
border-right:1px solid #d4d4d4;
background: #fcfcfc; 
background: -moz-linear-gradient(top,  #fcfcfc 0%, #e4e4e4 100%);
background: -webkit-linear-gradient(top,  #fcfcfc 0%,#e4e4e4 100%); 
background: linear-gradient(to bottom,  #fcfcfc 0%,#e4e4e4 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#e4e4e4',GradientType=0 ); */
}              
ul.inerrtabs li a:hover{background:#009ace; /*color #2*/ color:#fff;



} 

/*ul.inerrtabs li a:hover::after {
    content: "Arrow";
    position: relative;
    display: block;
    width: 0;
    border-left: 11px solid rgba(0,0,0,0);
    border-right: 11px solid rgba(0,0,0,0);
    border-top: 11px solid #1C9EEF;
    text-indent: -9999px;
    margin: 0 auto;
	background:transparent !important;
	}*/
ul.inerrtabs li a:hover::after a{
	padding:0px;
	background:transparent !important;}

ul.inerrtabs li.selected a{/*color:#fff;background:#009ace;*/ /*color #2*/ /*z-index:3;*/} 
.bdrnoneright:link{border:0px !important; padding:5px 31px !important;}







/* For mobiles */
@media only screen and (max-width:560px){
    ul.rtabs{
        padding-left:0;
        box-sizing:border-box;
        border-left:2px solid #ccc;
        border-top:2px solid #ccc;
        min-width:260px;
    }

    ul.rtabs li{
        display:inline-block;
        box-sizing:border-box;
        margin-right:0;
        width:50%; /* set it to 100% for one column, 33.33% for three-column */
    }

    ul.rtabs li:last-child:nth-child(odd){
        width:100%;
    }

    ul.rtabs li a {
        background-color:#eee;
        border-top:none;
        border-left:none;
        border-right:2px solid #ccc;
        border-bottom:2px solid #ccc;
        display:block;
        padding:0;
        text-align:center;
        border-radius:0;
		color:#222;
    }

    ul.rtabs li a:hover {
        border-color: #ccc;
        background-color:#f6f6f6;
    }

    ul.rtabs li.selected a {
        background-color:#fff;
		color:#222;
    }

    div.panel-container {
        border-radius:0;
        min-width:260px;
        box-sizing:border-box;
        border:2px solid #ccc;
        padding:14px;
        width:auto;
    }
}