@charset "UTF-8";



/* CSS Document */







/* Reset */







html, body, div, span, h1, h2, h3, h4, h5, h6, p, ol, ul, li, form, label, legend, caption, aside, details, figcaption, figure, footer,header, hgroup, menu, nav, section, summary {



   margin: 0;



	padding: 0;



	border: 0;



	outline: 0;



	font-weight: inherit;



	font-style: inherit;



	font-size: 100%;



	font-family: inherit;



	vertical-align: baseline;



}







ol, ul {



	list-style: none;



}







a img {



   border: none



}







aside, details, figcaption, figure, 



footer, header, hgroup, menu, nav, section {display: block}







html {



	width: 100%;



	height: 100%;



}







body {



    font-family: Helvetica, Arial, sans-serif;



	font-size: 11.5px;



	color: #656363;



	margin: 0 0 1px; height: 100%; 



	line-height: 1.7;



	font-weight:normal;



	letter-spacing:-0.1px



}







#container {



	background-color:#FFF;



	width:100%;



	height:100%;



	margin:0;



	padding:0;



}



.greystrip{



	width: 100%;



	position: relative;



	display: block;



	height:38px;



	background-color:#f7f7f7;



	border-top:1px solid #FFF;



	



}







nav{



	width:980px;



	display:block;



	margin:0 auto;



	height:26px;



	padding-top:11px;



}







nav ul li {



float:left;



display:block;



font-size:10.5px;



line-height:10px;



text-decoration:none;



color:#ccc;



font-weight:100;



text-transform:uppercase;



text-shadow:0px 1px 0 #FFF;



-webkit-text-shadow:0px 1px 0 #FFF;



-moz-text-shadow:0px 1px 0 #FFF;



border-right:1px solid #78797b;



padding:1px 12px 0 12px;



}















nav ul li a{



text-decoration:none;



color:#78797b;



}







nav ul li a:hover{



text-decoration:underline;



color:#555;



}







.lastone{



padding:1px 0 0 12px;



border-right:none;	



}







.mainnav{



float:right;	



}







.selected{



color:#1f6ebb;



font-weight:bold;



text-transform:uppercase;



text-shadow:0px 1px 0 #FFF;



-webkit-text-shadow:0px 1px 0 #FFF;



-moz-text-shadow:0px 1px 0 #FFF;



border-right:1px solid #78797b;



padding:1px 12px 0 12px;	



display:block;



font-size:10.5px;



line-height:10px;



text-align:right;



text-decoration:none;



}







#maincontainer{



	width:980px;



	margin:auto;



	padding-bottom:60px;



}







header{



height:100px;



width:100%;



display:block;



border-bottom:1px solid #dadada;



padding-bottom:30px;



padding-top:30px;



margin-bottom:30px;



}







h1 a{



  width:196px;



  height:84px;



  display:block;



  text-indent:-9999px;



  background:url(../images/twist-directory-logo.jpg);



  float:left;



  margin:0;



}







.subnav{



float:right;	



margin:68px 0 0 0;



}







header ul li a{



display:block;



font-size:11.5px;



line-height:11px;



text-decoration:none;



color:#545252;



font-weight:bold;



text-transform:uppercase;



padding:1px 0px 0 0px;



}







header ul li a:hover{



text-decoration:underline;



color:#000;



}







header ul li {



float:left;



margin-left:20px;



}







.headline{



font-size:25px;



line-height:35px;



font-family:Futura, Helvetica, Arial, sans-serif;



color:#555656;	



font-weight:400;



margin:0px 0 35px 0;



letter-spacing:-0.9px;



}







.breadcrumb-container{



width:100%;



height:15px;



display:block;	



margin:0 0 55px 0;



text-transform:uppercase;



}







.breadcrumb1 a{



font-weight:normal;



text-transform:uppercase;



padding:1px 0px 0 0px;



font-size:11.5px;



line-height:11px;



text-decoration:none;



}	







.maincontent-container{



width:624px;



display:block;



padding:8px;



margin:0 25px 25px 0;



border:1px solid #dadada;



}







.maincontent-container-fullwidth{



width:960px;



display:block;



padding:8px;



margin:0 0 25px 0;



border:1px solid #dadada;



}







.content-box-fullwidth{



width:888px;



display:block;



}







.content-header{

font-weight:bold;

text-transform:uppercase;	

width:97%;

height:26px;

font-size:14px;

padding:14px 10px 12px 10px;

margin:0 0 15px 0;

text-shadow:1px 1px 0 #3e3e3f;

-webkit-text-shadow:1px 1px 0 #3e3e3f;

-moz-text-shadow:1px 1px 0 #3e3e3f;

}







.content-header-fullwidth{



font-weight:bold;



text-transform:uppercase;	



width:98%;



height:26px;



font-size:14px;



padding:14px 10px 12px 10px;



margin:0 0 15px 0;



text-shadow:1px 1px 0 #3e3e3f;



-webkit-text-shadow:1px 1px 0 #3e3e3f;



-moz-text-shadow:1px 1px 0 #3e3e3f;



}







.content-header a{



text-decoration:none;



}







.content-header a:hover{



text-decoration:underline;



}











.content-header-sidebar{



font-weight:bold;



text-transform:uppercase;	



width:274px;



height:26px;



font-size:14px;



padding:14px 10px 12px 10px;



margin:0 0 15px 0;



text-shadow:1px 1px 0 #3e3e3f;



-webkit-text-shadow:1px 1px 0 #3e3e3f;



-moz-text-shadow:1px 1px 0 #3e3e3f;



}







.content-header-sidebar a{



text-decoration:none;



}







.content-header-sidebar a:hover{



text-decoration:underline;



}







.content-header2{



font-weight:bold;



text-transform:uppercase;



color:#3e3d3d;



font-size:12px;



padding:0;



margin:0 0 3px 0;



line-height:12px;



text-shadow:0px 1px 0 #FFF;



-webkit-text-shadow:0px 1px 0 #FFF;



-moz-text-shadow:0px 1px 0 #FFF;



}







.content-header2 a{



font-weight:bold;



text-transform:uppercase;



color:#3e3d3d;



font-size:12px;



padding:0;



margin:0 0 3px 0;



line-height:12px;



text-decoration:none;



}







.content-header2 a:hover{



text-decoration:underline;



color:#000;



}







.colour-box{



padding:6px 6px 4px 6px;



-moz-border-radius:3px;



-webkit-border-radius:3px;



-khtml-border-radius:3px;



border-radius:3px;



}







.colour-box-nav{



padding:4px 4px 5px 4px;



-moz-border-radius:3px;



-webkit-border-radius:3px;



-khtml-border-radius:3px;



border-radius:3px;



position:relative;



top:-4px;



}







.content-event-image{



margin:0 20px 10px 0;}







.fr{



float:right;	



width:550px;



display:block;



}







.text{



line-height:15px;	



margin:0 0 20px 0;



}







.text2{



line-height:15px;	



margin:0 0 11px 0;



}







.text-entry{



line-height:15px;



display:block;



min-height:30px;



font-weight:bold;



color:#1d6eba;



margin:0 30px 20px 0;



float:left;



}











.text-entry2{



line-height:15px;



display:block;



min-height:30px;



font-weight:bold;



margin:0 30px 20px 0;



float:left;



}







.line{



width:100%;



margin:0;



padding:20px 0 25px 0;



clear:both;



border-bottom:1px solid #dadada; 



display:inline-block;



}







.line0{



width:100%;



margin:0;



padding:0;



clear:both;



border-bottom:1px solid #dadada; 



display:inline-block;



}







.line2{



width:100%;



margin:0;



padding:10px 0 0 0;



clear:both;



display:inline-block;



}







.clear{



clear:both;



}







.bg-color{



background-color:#f6f5f5;	



}







.sidebar-container{



width:295px;



display:block;



padding:8px;



margin:0 0 25px 0;



border:1px solid #dadada;



float:left; clear:both; 



}







.sidebar-container2{



width:295px;



display:block;



padding:8px;



margin:0 20px 25px 0;



border:1px solid #dadada;



}







.sidebar-container3{



width:295px;



display:block;



padding:8px;



margin:0 0 25px 0;



border:1px solid #dadada;



}







.video{



border:0;



frameborder:0;



}







footer{



width:100%;



height:310px;



padding-top:35px;



clear:both;



}







#grey-footer{



height:35px;



width:100%;



padding-top:15px;



background-color:#f7f7f7;	



}







.footer-container{



width:980px;



margin:auto;	



}







.footer-header{



font-size:19px;



line-height:20px;



font-family:Futura, Helvetica, Arial, sans-serif;



font-weight:400;



margin:0 0 10px 0;



letter-spacing:-1px;



text-transform:uppercase;



}







.footer-text{



color:#FFF;



text-decoration:none;	



text-shadow:0px 1px 0 #333;



-webkit-text-shadow:0px 1px 0 #333;



-moz-text-shadow:0px 1px 0 #333;



line-height:20px;



font-size:11.5px;



font-weight:bold;



}

.footer-text a{



color:#FFF;



text-decoration:underline;	






}







.footer-text2{



text-decoration:none;	



line-height:20px;



font-size:11.5px;



font-weight:400;



}







.footer-text3{



text-decoration:none;	



line-height:19.5px;



font-size:11.5px;



font-weight:400;



}







.footer-text3 a{



text-decoration:none;	



line-height:19.5px;



font-size:11.5px;



font-weight:400;



}







.footer-text3 a:hover{



text-decoration:underline;	



}







.footer-text4{



text-decoration:none;



text-transform:uppercase;



line-height:19.5px;



font-size:10px;



font-weight:bold;



}







.lastpoint{



margin:0 0 20px 0;	



}







.footer-bold{



font-weight:bold;	



}







.uppercase {



text-transform:uppercase;	



}







.footer-nav a{



text-transform:uppercase;



text-decoration:none;	



line-height:20px;



font-size:11.5px;



font-weight:400;



}







.footer-nav a:hover{



text-decoration:underline;	



}







.footer-text2 a{



text-transform:uppercase;



text-decoration:none;	



line-height:20px;



font-size:11.5px;



font-weight:400;



}







.footer-text2 a:hover{



text-decoration:underline;	



}







.footer-div1{



width:230px;



float:left;



display:block;	



}







.footer-div2{



width:450px;



float:left;



display:block;	



}







.footer-div3{



width:295px;



float:left;



display:block;	



}







.rss-button{



border: none;



padding: 0;



margin: 0 10px 10px 0;



width: 36px;



height: 35px;



background: url("../images/rss-image.png") top left no-repeat;



text-indent: 10000px;



overflow: hidden;



display: block;



font-size: 0px;



cursor: pointer;



float: left;	



}







.rss-button:hover{



background-position:bottom left;	



}







.facebook-button{



border: none;



padding: 0;



margin: 0 10px 10px 0;



width: 36px;



height: 35px;



background: url("../images/facebook-image.png") top left no-repeat;



text-indent: 10000px;



overflow: hidden;



display: block;



font-size: 0px;



cursor: pointer;



float: left;	



}







.facebook-button:hover{



background-position:bottom left;	



}







.twitter-button{



border: none;



padding: 0;



margin: 0 10px 10px 0;



width: 36px;



height: 35px;



background: url("../images/twitter-image.png") top left no-repeat;



text-indent: 10000px;



overflow: hidden;



display: block;



font-size: 0px;



cursor: pointer;



float: left;	



}







.twitter-button:hover{



background-position:bottom left;	



}







.youtube-button{



border: none;



padding: 0;



margin: 0 10px 10px 0;



width: 36px;



height: 35px;



background: url("../images/youtube-image.png") top left no-repeat;



text-indent: 10000px;



overflow: hidden;



display: block;



font-size: 0px;



cursor: pointer;



float: left;	



}







.youtube-button:hover{



background-position:bottom left;	



}







.flickr-button{



border: none;



padding: 0;



margin: 0 10px 10px 0;



width: 36px;



height: 35px;



background: url("../images/flickr-image.png") top left no-repeat;



text-indent: 10000px;



overflow: hidden;



display: block;



font-size: 0px;



cursor: pointer;



float: left;	



}







.flickr-button:hover{



background-position:bottom left;	



}







.linkedin-button{



border: none;



padding: 0;



margin: 0 10px 10px 0;



width: 36px;



height: 35px;



background: url("../images/linkedin-image.png") top left no-repeat;



text-indent: 10000px;



overflow: hidden;



display: block;



font-size: 0px;



cursor: pointer;



float: left;	



}







.linkedin-button:hover{



background-position:bottom left;	



}







.moreinfo-button{



border: none;



padding: 0;



margin: 0;



width:86px;



height:25px;



background: url("../images/more-info.png") top left no-repeat;



text-indent: 10000px;



overflow: hidden;



display: block;



font-size: 0px;



cursor: pointer;



float: right;	



}







.moreinfo-button:hover{



background-position:bottom left;	



}




.submit-button{
border: none;
padding: 0;
margin: 0;
width:108px;
height:25px;
background: url("../images/submit-button.jpg") top left no-repeat;
text-indent: 10000px;
overflow: hidden;
display: block;
font-size: 0px;
cursor: pointer;

}

.submit-button:hover{
background-position:bottom left;	
}

.login-button{
border: none;
padding: 0;
margin: 0;
width:108px;
height:25px;
background: url("../images/login-button.jpg") top left no-repeat;
text-indent: 10000px;
overflow: hidden;
display: block;
font-size: 0px;
cursor: pointer;

}

.login-button:hover{
background-position:bottom left;	
}








.displace{



position: absolute;



left: -5000px;	



}







.f-left{



float:left;	



}







.f-right{



float:right;	



}











/* Style the thumbnails */



.pika-thumbs{



	padding: 0px;}



.pika-thumbs li{width:55px; height:55px; margin:5px 0 0 0; padding: 0; overflow: hidden;



float: left; list-style-type: none;padding: 2px; margin:0 0 2px 0; background: #fafafa;cursor: pointer;}



.pika-thumbs li:last {margin: 0;}



.pika-thumbs li .clip {position:relative;height:100%;text-align: center; vertical-align: center; overflow: hidden;}



	



/* The stage is the wrapper. The image fills 100% the height of the stage */



.pika-stage, .pika-textnav {



	width: 284px;



	margin-bottom:30px;



}



.pika-stage {



	position: relative; 



	background: #fafafa; 



	padding:0px; 



	text-align:center; 



	height:204px;



}







.pika-stage img{height:100%;}







.pika-stage .caption {



	position: absolute; 



	background-color:#7c53b4; 



	background: rgba(0,0,0,0.75);  



	border: 1px solid #141414; 



	font-size: 9px; 



	color: #fafafa; 



	padding: 2px; 



	text-align: right; 



	bottom: 12px; 



	right: -10px;



}







.pika-stage .caption p {



	padding: 0; 



	margin: 0; 



	line-height: 12px;



}







/* Ths play, pause, prev and next buttons */



.pika-imgnav a {position: absolute; text-indent: -5000px; display: block;z-index:3;}







.pika-imgnav a.previous {height: 100%; width: 50px; top: 10px; left: 10px;cursor:pointer;}



.pika-imgnav a.next {height: 100%; width: 50px; top: 10px; right: 10px;cursor:pointer;}



.pika-imgnav a.play {height: 100px; width: 44px;top:0;left:50%;display: none;cursor:pointer;}



.pika-imgnav a.pause { height: 100px; width: 44px;top:0;left:50%;display:none;cursor:pointer;}







/* The previous and next textual buttons */



.pika-textnav {overflow: hidden; margin: 10px 0 0 0;bottom:10px; position:absolute;}



.pika-textnav a {font-size: 0px; text-decoration: none; color: #333; padding: 0px;}



.pika-textnav a.previous {float: left; width: auto; display: block;}



.pika-textnav a.next {float: right; width: auto; display: block;}







/*for the tool tips*/



.pika-tooltip{font-size:12px;position:absolute;color:white;padding:3px; background-color: rgba(0,0,0,0.7);border:3px solid black;}



.pika-counter{



	position: absolute;



	bottom: 12px;left:15px;color:7c53b4;background:rgba(0,0,0,0.7);font-size:9px;padding:3px;-moz-border-radius: 2px;border-radius:2px;}







/* If using user thumbnails there's a pause well the new large image loads. This is the loader for that */		



.pika-loader{ background:url(../images/loading.gif) 3px 3px no-repeat #000; background-color:rgba(0,0,0,0.9); color:white; width:60px; font-size:11px; padding:5px 3px; 



	text-align:right; position:absolute; top:15px; right:15px; }







a.transImageLink img {



filter:Alpha(opacity=50);



-moz-opacity:0.50;



opacity:0.50; 



border:none;



}



a.transImageLink:hover img {



filter:Alpha(opacity=100);



-moz-opacity:1.0;



opacity:1.0; 



border:none;



}







.marge1{



margin:0 10px 0 10px;	



}







.marge2{



margin:0 0 0 7px;	



}

.littleicon {
margin:0 10px;	
}