﻿/* =============================================================================
   TAB PANES WIDGET STYLES
   ========================================================================== */
  /* 
.tabPanes {
    width:65%; 
    margin-left:5px;
    padding: 2px;
    float:left;
}
*/
/* Tabs */
/* root element for tabs  */
ul.tabs {
    list-style:none;
    margin:0 !important;
    padding:0;
    border-bottom:1px solid #ccc;
    height:30px;
}

/* single tab */
ul.tabs > li {
    float:left;
    text-indent:0;
    padding:0;
    margin:0 !important;
    list-style-image:none !important;
}

/* link inside the tab. uses a background image */
ul.tabs > li > a {
    background: url(../images/tabs.png) no-repeat -420px 0;
    font-size:14px;
    display:block;
    height: 30px;
    line-height:30px;
    width: 134px;
    text-align:center;
    text-decoration:none;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
    color:#333;
    padding:0px;
    margin:0px;
    position:relative;
    top:1px;
}

ul.tabs > li > a:active {
    outline:none;
}

/* when mouse enters the tab move the background image */
ul.tabs > li > 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. */
ul.tabs > li > a.current, ul.tabs > li > a.current:hover {
    background-position: -420px -62px;
    cursor:default !important;
    color:#000 !important;
}


/* Tab Panes */
.panes > li > a { 
    background-position: 0% 0%;
    display:none;
    position:relative; 
    padding:10px 10px;
    color: white;
    text-decoration: none;
    border-radius:3px;
    
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#5a0a02', endColorstr='#7c1304',GradientType=0 )";
    background-image: -webkit-gradient(linear, left bottom,  left top,  color-stop(0.11, #5a0a02), color-stop(0.78, #7c1304) );
    background-color: rgb(137,27,10);
    background-repeat: repeat;
    background-attachment: scroll;
}

.panes > li > a .arrow {
    width: 0; height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #fff;
	border-bottom: none;
	position:absolute;
	top:50%; margin-top:-2px;
	right:10px;
}
.panes > li.open > a .arrow {
	border-top:none;
	border-bottom: 5px solid #fff;
}

.panes > li > div {
    display:none;
    padding: 15px 10px 0;
    border:1px solid #ccc;
    border-top:0;
    height:100%;
    font-size:13px;
    background-color:#fff;
}
.news .panes .news div { display:block; }
.events .panes .events div { display:block; }

.panes > li ul { margin:10px 0 0; }
.panes > li ul > li {
    margin-bottom: 20px;
    padding: 2px 5px;
}

.panes > li li a { display:block; }

.panes .news div a {
	text-decoration:none;
	line-height:1.5em;
}
.panes .m-link-btn {
    margin-bottom: 10px;
}
.panes .events div a, .m-link-btn > a{
	color:#333;
	text-decoration:none;
    text-align: right;
}

panes .events div a {
	color:#990000;
	text-decoration:none;
}


.panes .news div a:hover{
	text-decoration:underline;
}

.panes .events div a:hover{
	text-decoration:underline;
}



.panes .news img {
    float: left;
    height: 124px;
    padding-right: 10px;
    width: 131px;
}

.panes .events img {
	max-height:100px;
	float:left;
	border-color:#9900;
	padding-right:10px;
}


/* End Tab Panes */


/* =============================================================================
   MEDIA QUERIES
   ========================================================================== */
	/* Tablet Landscape / Desktop */
	@media screen and (min-width: 0px) and (max-width: 1000px) {
	}
	
	/* Tablets */
	@media screen and (min-width: 0px) and (max-width: 800px) {
	    /*.tabPanes { float: none; margin-right: 5px; width:auto; }*/
        .tabs { display:none; }
        .panes > li > a { display:block; }
        
        .news .panes .news div { display:none; }
        .events .panes .events div { display:none; }
        .panes li.open div { display:block !important; }
        
	    .panes > li { margin:5px 0; }
	    .panes > li > div { height:auto; }
	    .panes > ul > li { padding: 2px 5px 20px; }
	    .news .panes .news img { height: 59px; width: 80px; }
	}
	
	/* Tablets portrait */
	@media screen and (min-width: 0px) and (max-width: 650px) {		
	}
	
	/* Mobile */
	@media screen and (min-width: 0px) and (max-width: 580px) {
	}
	 
	/* Media Queries - Retina Display Devices*/ 
	@media all and (-webkit-min-device-pixel-ratio : 1.5) {
	}