/*---------------------------------------------------------------
# Package - Joomla Template based on Helix Framework   
# ---------------------------------------------------------------
# Author - JoomShaper http://www.joomshaper.com
# Copyright (C) 2010 - 2012 JoomShaper.com. All Rights Reserved.
# license - PHP files are licensed under  GNU/GPL V2
# license - CSS  - JS - IMAGE files  are Copyrighted material 
# Websites: http://www.joomshaper.com
-----------------------------------------------------------------*/

/* Master Reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;margin:0;padding:0}
body{line-height:1}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
:focus{outline:0}
ins{text-decoration:none}
del{text-decoration:line-through}
table{border-collapse:collapse;border-spacing:0}

article { margin-bottom: 3rem; }
h2, article h2 { font-size:1.3rem; line-height: 1.5rem !important; }
	.introtext, .introtext p { font-size:14px; line-height:20px; } 
	.article-tools { margin:-7px 0 7px; }

img { max-width:100%; }

.pull-left { float:left; }
.pull-right { float:right; }
	img.pull-left { margin-right:10px; margin-bottom:10px; }
	img.pull-right { margin-left:10px; margin-bottom:10px; }
	img.pull-left,
	img.pull-right { max-width: 30%; margin-bottom:10px; }
	img.pull-none { display:block; margin:0 auto 10px; max-height:50vh; }
.text-center { text-align:center; }

.bannergroup1 .banneritem { margin:0 .5rem 1rem; }
.bannergroup1 .banneritem a { display:block; }
.bannergroup1 .banneritem img { max-width:150px; }

#sp-footer .bannergroup { display: flex; flex-wrap: wrap; justify-content: space-between; }
#sp-footer .banneritem { display:inline-block; margin:.5rem; }
#sp-footer .banneritem a { display:inline-block; padding:0; }
#sp-footer .banneritem img { width:88px; }

/* Core */
body{color:#555;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.4}
body.bg{background:#FFF}
.sp-wrap{margin-left:auto;margin-right:auto}
.sp-block{float:left;display:inline}
.mod-block {padding:10px}
div.sp-inner{padding:0 10px}
.sp-block .first {margin-left:-10px}
.sp-block .last {margin-right:-10px}
.sp-block .single {margin-left:-10px;margin-right:-10px}
.gap{clear:both; margin-bottom:10px}

.banneritem { text-align:center; }

/*Header Area*/
#header {position:relative}
a#logo {
	float:left;
	width: 260px;
    height: 100px;
	background: url(../images/styles/style3/logo2.png) no-repeat;
    background-size: contain;
}
#logo-text h1{font-size:200%;font-weight:bold;text-transform:uppercase;border:0!important;margin:10px 0 0!important;padding:0!important}
#logo-text h1 a{}
#logo-text p.site-slogan{margin:0;padding:0;color:#999}

#header .bannergroup { display:flex; justify-content:flex-end; }
#header .banneritem img { max-height:60px; }

		#nav-mobile{ display:none; }

#header-nav ul.menu {
	display:flex;
	border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin-top: 10px;
 }
	#header-nav ul.menu li {
		position:relative;
		list-style:none;
		padding:0;
		margin-right:1px;
	}
	#header-nav ul.menu li a {
		display:block;
		padding: 7px 15px;
		white-space: nowrap;
		color:#222;
	}
	#header-nav ul.menu > li > a {
		min-width:50px;
		text-align:center;/**/
		padding:10px 15px;
	}
		#header-nav ul.menu > li.deeper {
			padding-right:15px;
		}
		#header-nav ul.menu li.deeper::after {
			color:#222;
			font-family: "FontAwesome";
			content: "\f107";
			position: absolute;
			display: inline-block;
			top: calc( 50% - 8px);
			right: 15px;
		}
			#header-nav ul.menu > li.deeper li.deeper::after {
				content: "\f105"; /*angle-right*/
			}

		#header-nav ul.menu > li.deeper ul {
			position:absolute;
			z-index:999;
			height:0;
			overflow-y:hidden;
			transition: all .5s;
			/*margin-top:1px;*/
		}
		#header-nav ul.menu > li.deeper ul li {
			background:#eee;
		}

		#header-nav ul.menu > li.deeper:hover > ul {
			height:auto;
			overflow: visible;
			min-width: calc( 100% + 1px);
		}
		#header-nav ul.menu > li.deeper:hover > ul li {
			/*margin-top:1px;*/
			border-top:1px solid #fff;
		}

			#header-nav ul.menu > li.deeper li.deeper {
				position:relative;
				padding-right:15px;
			}
			#header-nav ul.menu > li.deeper li.deeper ul {
				position:absolute;
				top:5px;
				left: calc( 100% + 1px );
				width:0;
				overflow:hidden;
				background:#eee;
			}
			#header-nav ul.menu > li.deeper li.deeper:hover ul {
				width:auto;
				overflow: visible;
			}


		#header-nav ul.menu li {
			background:#fff;
			transition: background .1s;
		}
		#header-nav ul.menu li:hover {
			background:#eee;
		}

			#header-nav ul.menu > li.deeper li:hover,
			#header-nav ul.menu > li.deeper li.deeper ul li {
				background:#ddd;
			}
			#header-nav ul.menu > li.deeper li.deeper ul li:hover {
				background:#c5c5c5;
			}

		#header-nav ul.menu li.active::after,
		#header-nav ul.menu li.active > a {
			color: rgba(3, 132, 169);
		}
		#header-nav ul.menu > li.active {
			border-bottom: 2px solid rgba(3, 132, 169, .75);
			margin-bottom: -2px;
		}


/*Search*/
#search{float:right;margin-top:20px}
#search input#mod-search-searchword,#search input#mod-finder-searchword{padding:4px 10px;background: url(../images/search.png) no-repeat 98% 50%}
.mod-search{margin:0;padding:0}

/*Module positions user1-user4*/
#sp-userpos {margin:10px 0}
#sp-userpos h3 {color:#333}
#sp-bottom{border-top:5px solid #666;color:#555;font-size:90%}

/* Layout */
#sp-leftcol, #sp-rightcol, #sp-maincol ,#inset1, #inset2, #inner_content {float:left}
#sp-leftcol, #sp-rightcol, #sp-maincol {padding:10px 0}

.nspArtPage,.nspLinksWrap { display:none; }
.nspArtPage:first-of-type { display:block; }
.nspArt {
		float: left;
		margin-bottom:2.5rem;
	}

	.nspArt h4.nspHeader {
		font-size: 120%;
		margin: 1rem auto .25rem;
		line-height: 1.15rem;
	}

	.nspArt p.nspInfo {
		font-size: 90%;
		margin-bottom: .5rem;
	}

	.nspArt img, .nspArt p img, .nspText img, .nspText p img {
		display:block;
		margin-bottom:.75rem;
	}
	.nspArt img.pull-left {
		max-width:30%;
		margin-right:.75rem;
	}

	.nspArt ul {
		list-style: disc;
		margin-left: 1rem;
	}	
	.nspArt li {
		border:none;
	}

/*Font Resizer*/
div.font-sizer{width:45px;height:16px;line-height:16px;position:absolute;z-index:1;top:5px;right:10px}
div.font-sizer a.btn_fs_big,div.font-sizer a.btn_fs_reset,div.font-sizer a.btn_fs_small
{background-image:url(../images/font-resizer.png);background-repeat:no-repeat;height:16px;width:15px;border:medium none;cursor:pointer;display:block;float:left;text-indent:-999em;padding:0}
div.font-sizer a.btn_fs_big{background-position:0 0}
div.font-sizer a.btn_fs_reset{background-position:-15px 0}
div.font-sizer a.btn_fs_small{background-position:-30px 0}
div.font-sizer a.btn_fs_big:hover{background-position:0 -16px}
div.font-sizer a.btn_fs_reset:hover{background-position:-15px -16px}
div.font-sizer a.btn_fs_small:hover{background-position:-30px -16px}

/* Breadcrumbs */
#breadcrumbs{overflow:hidden;height:30px;line-height:30px;margin-bottom:10px;}
#breadcrumbs span.showhome {font-weight:bold;margin-right:5px}
#breadcrumbs .padding{padding:5px 8px}
#breadcrumbs a,#breadcrumbs span,#breadcrumbs strong{display:block;float:left}
#breadcrumbs a,#breadcrumbs span.separator{margin-right:10px;padding-right:15px;background:url(../images/breadcrumbs.png) 100% 50% no-repeat}
#breadcrumbs span.current{color:#666}

/* Footer */
#sp-footer{border-top:1px solid #ddd; padding:10px 0}
#sp-footer .cp {float:left;}

/*Footer Navigation*/
#footer-nav{float:right}
#footer-nav ul{list-style-type:none;padding:0;margin:0 0 5px 0}
#footer-nav li{background:none;padding:0;display:inline}
#footer-nav a{font-size:11px;font-weight:normal;text-decoration:none;display:inline;margin:0;padding:0 8px}
a#topofpage{float:right;font-size:11px;margin:0 0 0 8px}

div.pagination ul li { background: none; }

.copyright { font-size: 11px; font-style: italic; color: #aaa; border-top: 1px solid #ddd; padding-top: 1.5rem; margin: 1.5rem auto; }

/* Clearfix */
.clr{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}
.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}
* html .clearfix,:first-child+html .clearfix{zoom:1}

	.mod_ts_events_section { margin-bottom:1.5rem; }
	.mod_ts_events_item { padding-bottom:.5rem; margin-bottom:.5rem; border-bottom:1px solid #ddd; }
	.mod_ts_events_section .mod_ts_events_item:last-of-type { border-bottom:none; }
	.mod_ts_events_iteminfo { font-size:90%; }
	#sp-leftcol .mod_ts_events_posters { display:none; }
	.mod_ts_events_posters a { display:block; margin:0 .5rem .5rem; }

@media only screen and (max-width: 1024px) {


		#sp-content {
			display:flex;
			flex-wrap:wrap;
		}
		
		.sp-wrap { width:100%; }

		#sp-leftcol{ width:33%; margin:1rem auto; order:1; }
		#sp-maincol { width:66%; margin:1rem auto; order:2; }
		#sp-rightcol{ width:95%; margin:1rem auto; order:3; display: flex; }

		#sp-rightcol .mod_ts_events_posters {
			display: flex; 
			flex-wrap:wrap;
			justify-content: space-around;
			align-items: center;
			max-width:55%;
			margin:30px;
		}
		#sp-rightcol .mod_ts_events_posters img {
			max-height:200px;
			max-width:200px;
		}


		#header { margin-top:10px; /*display:flex;*/ }
		
		a#logo { width:200px; height:80px; }
		
		#search { float:none; width:100%; margin:0; }
		#header .bannergroup { flex-wrap:wrap; justify-content:space-around; }
		#header .banneritem img { max-height:unset; max-width:75%; }

		#header-nav ul.menu { display:none; } 

		#nav-mobile{
			display:block;
			border:1px solid #ddd;
		}
		#nav-mobile,
		#nav-mobile select {
			float:right;
			height:32px;
			width:32px;
			position: relative;
		}
		#nav-mobile select {
			opacity:0;
		}
		#nav-mobile::before {
			font-family: "FontAwesome";
			content: "\f0c9"; /* fa-bars */
			position: absolute;
			font-size: 22px;
			text-align: center;
			width: 32px;
			line-height: 32px;
		}





}

@media only screen and (max-width: 576px) {


		#sp-leftcol,
		#sp-rightcol,
		#sp-maincol { width:95%; margin:1rem auto; order:2; display:block; }

		#sp-maincol { order:1; }

		#sp-rightcol .mod_ts_events_posters { display:block; max-width:unset; }


	.bannergroup1,
	#sp-footer .bannergroup,
	.mod_ts_events_posters,
	.mod_ts_events { 
		display:block;
		overflow:scroll;
		white-space:nowrap;
		margin:0 auto 15px;
	}
	.mod_ts_events_posters a,
	#sp-footer .bannergroup .banneritem,
	.bannergroup1 .banneritem {
		display:inline-block;
		vertical-align: middle;
		margin:0 15px;

	}
	.mod_ts_events_posters a {
		width:90%;
		margin:0 5%;
		text-align: center;
	}
	#sp-rightcol .mod_ts_events_posters img {
		max-height:250px;
		max-width:80%;
	}
	.mod_ts_events_section {
		display:inline-block;
		vertical-align: top;
		width:90%;
		margin:0 5%;
	}
	.mod_ts_events_section a {
		white-space:normal;
	}

	div.pagination ul {
		display: flex;
		flex-wrap: wrap;
		line-height: 40px;
	}
}

@media only screen and (max-width: 540px) {

	img.pull-left,  .nspArt img.pull-left,
	img.pull-right, .nspArt img.pull-right { 
		float:none; 
		display:block; 
		margin:0 auto 10px; 
		max-height:50vh; 
		max-width:unset;  
	}
}
