body {
	background-color: #ececec;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #333333;
	/*overflow:hidden;*/
}

.insetText {
        font-family:Impact, Helvetica Neue, Arial, sans-serif sans-serif; 
        background-color:#666;
		font-size:65px;
		text-transform:uppercase;
        -webkit-background-clip: text;
		-moz-background-clip: text;
		background-clip: text;
        color: transparent;
        text-shadow: rgba(255,255,255,0.8) 0px 2px 2px;
}

a:active, a:visited, a:link {
	color: #333333;
}

a:hover {
	text-decoration:none;
}

.header {
	width: 980px;
	height: 47px;
	background-color: #ececec;
	margin: 0 auto; 
}

.container{
	width:980px;
	background-color: #ececec;
	margin: 0 auto; 	
}

.vid {
	width:640px;
}
.comments {
	width:640px;
}

.share{
	background-color:#FFF;
	width:540px;
	height:35px;
	padding:10px;
	-moz-border-radius: 5px;
	border-radius: 5px;
} 
.embedShare{
	background-color:#FFF;
	width:540px;
	height:155px;
	padding:10px;
	-moz-border-radius: 5px;
	border-radius: 5px;
} 

.social{
	float:right;
} 
.embedSocial{
	float:left;
} 
.textArea{
	float:left;
} 

.rightNav {
	float:right;
	width:340px;
	/*height:700px;	*/
	height:100%;
}
.rightNavHolder{
	overflow:hidden;
	widht:310px;
	margin-left:20px;
	padding-left:5px;
	margin-top:10px;
	height:77px;

	
	/*margin-left:10px;*/
}

.rightNavPics{
	float:left; 
	margin-top:5px;	
}

.rightNavNames{
	/*overflow:hidden;*/
	float:left; 
	font-size:13px;
	font-weight:bold;
	padding-top:10px; 
	padding-left:15px;
}
.rightNavNames:hover {
	text-decoration: underline;
}
.rightNavDesc{
	float:left;
	font-size:11px;
	color: #999;
	padding-left:15px;
}



.rightNavHolder:hover {
	background-color:#FFF;
	color:#1c62b9;
	-webkit-box-shadow:  0px 1px 1px 0px #575757;
    -moz-box-shadow:  0px 1px 1px 0px #575757;
    box-shadow:  0px 1px 1px 0px #575757;

}
div.circle {
    margin: 0 auto;
    width:200px;
    height:200px;
}
div.outer-circle {
 
    /* Set the background and position */
 
    background:transparent;
    width:122px;
    height:122px;
 
    /* Set the border and the
    border radius to be exactly
    half the width and height
    so that it looks like a circle */
 
    -webkit-border-radius: 61px;
    -moz-border-radius: 61px;
    border-radius: 61px;
    border:1px solid #aaaaaa;
 
    /* You will need to use
    position:absolute so that
    the circles can appear on top of
    each other.
 
    Additionally, the z-index will
    be used to determine which DIV
    should appear lowest or highest */
 
    position:absolute;
    z-index:800;
 
    /* Finally, we set the transition so
    that the circle grows with an
    animation */
 
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
 
}
div.outer-circle.hover {
    -moz-transform: scale(1.45);
    -webkit-transform: scale(1.45);
    transform: scale(1.45);
}
div.middle-circle {
 
    /* This margin is used to create
    the 1px border between the middle
    and outer circle */
 
    margin:1px;
 
    /* Set the width and height */
 
    width:122px;
    height:122px;
 
    /* Set the border radius to half
    the width and height to make it
    look like a circle */
 
    -webkit-border-radius: 61px;
    -moz-border-radius: 61px;
    border-radius: 61px;
 
    /* Set the background gradient */
 
    background: #ececec; /* Old browsers */
    background: -moz-linear-gradient(top, #ececec 0%, #d8d8d8 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ececec), color-stop(100%,#d8d8d8)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ececec 0%,#d8d8d8 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ececec 0%,#d8d8d8 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, #ececec 0%,#d8d8d8 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ececec', endColorstr='#d8d8d8',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, #ececec 0%,#d8d8d8 100%); /* W3C */
 
    /* You will need to use
    position:absolute so that
    the circles can appear on top of
    each other.
 
    Additionally, the z-index will
    be used to determine which DIV
    should appear lowest or highest */
 
    position:absolute;
    z-index:900;
 
    /* Finally, we set the transition so
    that the circle grows with an
    animation */
 
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
 
}
div.middle-circle.hover {
    -moz-transform: scale(1.4);
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
}
div.inner-circle {
 
    /* This margin is used to position
    the circle in the center */
 
    margin:14px;
 
    /* Specify the background and
    width and height */
 
    background:#3f96d1;
    width:96px;
    height:96px;
 
    /* Since we have text in it,
    we need to specify the text
    styles we want to use */
 
    font-size:11px;
    color:#FFF;
    line-height:96px;
    text-align:center;
    font-family:Arial;
 
    /* Set the border radius to half
    the width and height to make it
    look like a circle */
 
    -webkit-border-radius: 48px;
    -moz-border-radius: 48px;
    border-radius: 48px;
 
    /* For this circle, we will be using
    an inset box shadow to replicate
    the effect used. */
 
    -webkit-box-shadow: inset 0px 1px 1px 0px #575757;
    -moz-box-shadow: inset 0px 1px 1px 0px #575757;
    box-shadow: inset 0px 1px 1px 0px #575757;
 
    /* We can also add a bottom border
    to make it look slightly more 3D */
 
    border-bottom:1px solid #FFF;
 
    /* You will need to use
    position:absolute so that
    the circles can appear on top of
    each other.
 
    Additionally, the z-index will
    be used to determine which DIV
    should appear lowest or highest */
 
    position:absolute;
    z-index:1000;
 
}

.footer {
	width: 980px;
	background-color: #ececec;
	clear:both;
}

.canvasHolder {
	width: 1040px;
	height: 90px;
	background-color:#ececec;
}

#backgroundPopup{
	display:none;
	position:fixed;
	_position:absolute; /* hack for internet explorer 6*/
	height:100%;
	width:100%;
	top:0;
	left:0;
	background:#000000;
	border:1px solid #cecece;
	z-index:3;
}

#popupContact{
	display:none;
	position:fixed;
	_position:absolute; /* hack for internet explorer 6*/
	height:350px;
	width:400px;
	background:#FFFFFF;
	z-index:2;
	padding:10px;
	font-size:13px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}


#popupContact2{
	margin:0 auto;
	height:350px;
	width:400px;
	background:#FFFFFF;
	z-index:2;
	padding:10px;
	font-size:13px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}



#button{
	text-align:center;
	margin:10px;
	
	
}

#introPic{
	position:absolute;
	left:0px;
	top:0px;
	height:700px;
	width:300px;
	z-index:11;

}
#introText{
	text-align:center;
}
.fbButtons:hover{
	background-color:#e0e4ee;
}
.fbButtons{
	width:100%;
	height:28px;
	float:left;
	padding-left:10px;
	padding-top:2px;
	padding-bottom:2px;
	font-size:11px;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
}

#fbSideBar{
	border-left-style:solid;
	border-left:solid;
	border-left-width: thin;
	border-left-color:#8a8d91;
	/*display:none;*/
	position:fixed;
	bottom:20px;
	right:-300px;
	width:206px;
	height:100%;
	background-color:#f2f4f8;
	font-size:12px;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	z-index:3;
	-moz-box-shadow: inset 0 0 2px #888;
	-webkit-box-shadow: inset 0 0 2px #888;
	box-shadow: inset 0 0 2px #888;
}
.description {
	background:#FFF;
	box-shadow:inset 0 0 5px #999; 
	padding:10px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	resize:none;
	border:none;
}
.embedDescription {
	background:#FFF;
	box-shadow:inset 0 0 5px #999; 
	padding:10px;
	width:300px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	resize:none;
	border:none;
	overflow:hidden;
}
img{
	outline:none;
}


#shoutItOutPopup{
	display:none;
	position:fixed;
	_position:absolute; /* hack for internet explorer 6*/
	height:207px;
	width:79px;
	background:none;
	z-index:5;
}

#beebsPopup{
	display:none;
	position:fixed;
	padding:2px;
	_position:absolute; /* hack for internet explorer 6*/
	height:524px;
	width:404px;
	background:#FFF;
	z-index:4;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.twtr-widget {
	/**clear : both;**/
	width: 404px;
	height : 148px;	
}
.twtr-hd {
	background-color: transparent;
	background-color: rgba(255,255,255,0.3);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#30ffffff,endColorstr=#30ffffff);
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#30ffffff,endColorstr=#30ffffff)";
}
.twtr-bd {}
.twtr-widget .twtr-bd .twtr-tweet {
	margin: 5px 0 0;
	padding: 0 0 5px;
	border-bottom: 1px solid #cecece;
}
.twtr-tweet:before {
	display: block;
	float: left;
	margin: -5px 0 0 5px;
	font-size: 50px; /* let's make it a big quote! */
	content: "";
	color: #bababa;
	text-shadow: 0 1px 1px #909090;
	font-family: "times new roman", serif;
}
.twtr-ft { display: none; }