.grokPlaceholder {
	display: block;
	min-height: 600px;
}

.share,.customize {
	float: right;
	letter-spacing: 0px;
	margin-left: 10px;
	color: #666666;
	border: solid 1px transparent;
	font-size: 14px;
}

.share {
	background: url(../images/grok/share.png) no-repeat 8px center;
	padding: 5px 15px 3px 25px;
}

.customize {
	background: url(../images/grok/customize.png) no-repeat 8px center;
	padding: 5px 10px 3px 32px;
}

.share:hover {
	background: url(../images/grok/share.png) no-repeat 8px center, #f2f4f3;
	background: url(../images/grok/share.png) no-repeat 8px center,
		-webkit-gradient(linear, left top, left bottom, from(#ffffff),
		to(#f2f4f3));
	background: url(../images/grok/share.png) no-repeat 8px center,
		-moz-linear-gradient(top, #ffffff, #f2f4f3);
}

.share:active {
	background: url(../images/grok/share.png) no-repeat 8px center,
		-webkit-gradient(linear, left top, left bottom, from(#f2f4f3),
		to(#ffffff));
	background: url(../images/grok/share.png) no-repeat 8px center,
		-moz-linear-gradient(top, #f2f4f3, #ffffff);
}

.customize:hover {
	background: url(../images/grok/customize.png) no-repeat 8px center,
		#f2f4f3;
	background: url(../images/grok/customize.png) no-repeat 8px center,
		-webkit-gradient(linear, left top, left bottom, from(#ffffff),
		to(#f2f4f3));
	background: url(../images/grok/customize.png) no-repeat 8px center,
		-moz-linear-gradient(top, #ffffff, #f2f4f3);
}

.customize:active {
	background: url(../images/grok/customize.png) no-repeat 8px center,
		-webkit-gradient(linear, left top, left bottom, from(#f2f4f3),
		to(#ffffff));
	background: url(../images/grok/customize.png) no-repeat 8px center,
		-moz-linear-gradient(top, #f2f4f3, #ffffff);
}

.share:hover,.customize:hover {
	border-radius: 3px;
	font-family: "Helvetica", "Arial", sans-serif;
	font-weight: normal;
	outline: none;
	cursor: pointer;
	border: solid 1px #cccccc;
	text-shadow: 1px 1px #ffffff;
	font-size: 14px;
}

/* GRAPH */
.elContent {
	width: 260px;
	/* display: inline-block;
	padding: 0 0 0 10px; */
	padding: 0 0 0 30px;
}

#popup {
	width: 326px;
	height: 300px;
	border: 1px solid transparent;
	border-radius: inherit;
	border-radius: inherit; 
	-moz-border-radius: inherit; 
	/* border-radius: 8px; */
	/* -moz-border-radius: 8px; */
	box-shadow: 2px 2px 6px #aaa;
	-o-box-shadow: 2px 2px 6px #aaa;
	-webkit-box-shadow: 2px 2px 6px #aaa;
	-moz-box-shadow: 2px 2px 6px #aaa;

}
/* Toolbar */
#popup-toolbar {
	display: block;
	text-align: center;
	padding: 0;
	background-color: white;
	border: 0;
	border-bottom: 2px solid #333333;
	border-radius: 8px 8px 0 0;
	margin: 0;
	cursor:move;
}
#popup-toolbar li {
	display: inline-block;
	padding: 6px 7px;
	outline: none;
	background:white;
	width:32px;
	border-radius:0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
}
#popup-toolbar li#popup-keyfacts-nav {
	width:46px;
}
#popup-toolbar li#popup-websites-nav,
#popup-toolbar li#popup-concepts-nav {
	width: 42px;
}
#popup-toolbar li#draggable {
	padding: 3px 3px 3px 1px;
	background: url(../images/grok/drag-img.png) no-repeat center left;
	height: 46px;
	width:8px;
}
#popup-toolbar li a {
	background: url(../images/grok/toolbarSprite.png) no-repeat;
	background-size: 180px 120px;
	padding: 0;
	outline: none;
	display: inline-block;
	overflow: hidden;
	width: 30px;
	height: 30px;
}
.button-text {
	float: left;
	font-size: 10px;
	margin-top: 2px;
}
#popup-toolbar li#popup-keyfacts-nav a {
	background-position: 0px 0px;
	margin-left:8px;
}
#popup-toolbar li#popup-keyfacts-nav a:hover {
	background-position: 0px -30px;
}
#popup-toolbar li.ui-state-active {
	background-color:#333333;
}
#popup-toolbar li.ui-state-active span {
	color:white;
	text-shadow: 1px 1px #000000;
}
#popup-toolbar li#popup-keyfacts-nav.ui-state-active a {
	background-position: 0px -60px;
}
#popup-toolbar li#popup-images-nav a {
	background-position: -30px 0px;
	margin-left: 2px;
}

#popup-toolbar li#popup-images-nav a:hover {
	background-position: -30px -30px;
}

#popup-toolbar li#popup-images-nav.ui-state-active a {
	background-position: -30px -60px;
}
#popup-toolbar li#popup-videos-nav a {
	background-position: -60px 0px;
}

#popup-toolbar li#popup-videos-nav a:hover {
	background-position: -60px -30px;
}

#popup-toolbar li#popup-videos-nav.ui-state-active a {
	background-position: -60px -60px;
} 
#popup-toolbar li#popup-websites-nav a {
	background-position: -90px 0px;
	margin-left: 7px;
}

#popup-toolbar li#popup-websites-nav a:hover {
	background-position: -90px -30px;
}

#popup-toolbar li#popup-websites-nav.ui-state-active a {
	background-position: -90px -60px;
} 
#popup-toolbar li#popup-concepts-nav a {
	background-position: -120px 0px;
	margin-left: 6px;
}

#popup-toolbar li#popup-concepts-nav a:hover {
	background-position: -120px -30px;
}

#popup-toolbar li#popup-concepts-nav.ui-state-active a {
	background-position: -120px -60px;
} 
#popup-toolbar li#popup-notes-nav a {
	background-position: -150px 0px;
}

#popup-toolbar li#popup-notes-nav a:hover {
	background-position: -150px -30px;
}

#popup-toolbar li#popup-notes-nav.ui-state-active a {
	background-position: -150px -60px;
} 
/* Tabs content */
.tabContent {
	padding: 0;
	font-size: 13px;
	line-height: 1.4;
}

.tabContent a {
	color: #60a615;
}
.website_link {
	text-overflow: ellipsis;
	display:block;
	overflow: hidden;
	white-space: nowrap;
}
.popup-content-item {
	padding: 9px 0px 9px 6px;
	float:left;
}

.pinIn {
	background: url(../images/grok/tooltipActionsSprite.png) no-repeat;
	background-size: 46px 46px;
	background-position: -23px 0px;
	outline: none;
	width: 23px;
	height: 23px;
	float: left;
	display: inline-table;
}

.source {
/* 	visibility: hidden; */
	text-decoration: none;
}
.source: {
	cursor: pointer;
	
}

.popup-content-item a.pinned {
	background-position: 0px 0px;
}

.popup-content-item a.pinIn:hover {
	background-position: -23px -23px;
}

.popup-content-item a.pinned:hover {
	background-position: 0px -23px;
}

.popup-content-item:hover a.pinIn,.popup-content-item:hover a.delete,.popup-content-item:hover div.elContent a.source
	{
	visibility: visible;
}

.popup-content-item:hover {
	background: #f0f1f0;
}

.popup-content-item p {
	margin: 0;
	padding: 0;
}

.popup-content-item img {
	width: 250px;
}

.popup-content-item img:hover {
	cursor: -webkit-zoom-in;
	cursor: -moz-zoom-in;
}

.popup-content-item h3 {
	font-size: 13px;
	line-height: 1.2;
	margin: 0 0 4px 0;
	color: #333333;
}

h1.popup-content-title {
	/* text-transform: uppercase; */
	color: #333333; /* #60a615; */
	font-size: 14px;
	font-weight: bold;
	margin: 0;
	/* letter-spacing: 1px;
	padding: 12px 12px 6px 12px; */
	padding: 6px 6px 4px 12px;
	border-bottom: 1px solid #cccccc;
	background: #f0f1f0;
}
/* h1.popup-content-title:hover {
	cursor:move;
} */
/* #popup-notes textarea {
	height: 245px;
	background:white;
	background: rgb(252, 248, 184);
	width: 260px;
	height: 180px;
} */

#popup-content-container {
	overflow: auto;
	height: 242px;
}

#add_node_text {
	outline: none;
	height: 195px;
	width: 300px;
	margin: 5px;
	font-size: 14px;
	color: #999999;
	font-family: "Helvetica", "Arial", sans-serif;
	border-color:#f2dd8c;
	background-color:#fcf8b8;
}

/* Nodes */
.component {
	border: 1px solid #dea908;
	border-radius: 8px;
	cursor: pointer;
	font-weight: normal;
	box-shadow: 2px 2px 6px #aaa;
	-o-box-shadow: 2px 2px 6px #aaa;
	-webkit-box-shadow: 2px 2px 6px #aaa;
	-moz-box-shadow: 2px 2px 6px #aaa;
	-moz-border-radius: 8px;
	position: absolute;
	-webkit-transition: -webkit-box-shadow 0.10s ease-in;
	-moz-transition: -moz-box-shadow 0.10s ease-in;
	-o-transition: -o-box-shadow 0.10s ease-in;
	transition: box-shadow 0.10s ease-in;
	text-align: center;
	z-index: 20;
	padding: 2px 7px;
}

.keyword {
	max-width: 150px;
	position: absolute;
	color: #333333;
	background-color: #ffc000;
	text-align: center;
	text-shadow: 1px 1px #f6d778;
	top: 400px;
	left: 550px;
	font-size: 120%;
}

.node, .note {
	font-size: 12px;
	padding: 5px;
	/* width: 200px; */
	max-width: 170px;
	line-height: 1.4;
	text-align: left;
	/* display: inline-flex; */
}
.note textarea.note_edit {
	line-height: 1.4;
	font-family:"helvetica", "Arial", sans-serif;
	font-size:12px;
}
.node {
	border-color: #cccccc;
	background-color: #f3f3f3;
	color: #666666;
}
.node_website_title {
	font-weight: bold;
	display: inline;
	text-overflow: ellipsis;
}
.node a {
	display: inline;
}
.note {
	background-color:#fcf8b8;
	border-color:#f2dd8c;
	color:black;
}
.node p {
	margin: 0;
}

.node-icon {
	background: url(../images/grok/toolbarSprite.png) no-repeat;
	background-size: 120px 80px;
	height: 20px;
	margin: 2px 5px 0 0;	
	float:left;
	padding: 0 20px 0 0;
}
.node p {
	margin-bottom:0;
	font-size:9pt;
	margin-left:25px;
}
.note-icon {
	background-position: -100px 0px;
}
.fact-icon {
	background-position: 0px 0px;
}
.concept-icon {
	background-position: -80px 0px;
}
.link-icon {
	background-position: -60px 0px;
	margin: 0 5px 0 0;
}
.component.image, .video, .resize-image {
	width: 70px;
	height: 70px;
	padding: 0;
	border-color: #909090;
	background:whitesmoke;
}
.image > img, .video > img, .resize-image {
	border-radius: 7px;
	/* margin-top: -5px; */
	background-color:#131313;
}
.resize-image img {
	height:inherit;
	width: auto;
}
.resize-image {
	overflow:hidden;
}
.video-img {
	background: url(../images/play-button.png) no-repeat 2px 38px;
}
.mask-video:hover {
	background-color: black;
}
.zoom {
	visibility: hidden;
	background: url(../images/grok/zoom.png) no-repeat center center;
}
.mask-video {
	opacity: 0.60;
	position: absolute;
	width: inherit;
	height: inherit;
	border-radius: 7px;
	z-index: 50;
}
.node_x_button, .node_x_big_button {
	z-index: 60; 
	position:absolute; 
	right:-12px;
	margin-top:-12px;
}
.node_x_button {
	visibility: hidden;
	opacity:0.80;
	width:22px;
	height:22px;
}
.node_x_big_button {
	width:25px;
	height:25px;
}
.node_x_button:hover {
	opacity:1;
	width:24px;
	height:24px;
	right:-13px;
	margin-top:-13px;
}
.image:hover .zoom {
	visibility: visible;
}
#share-dropdown,#customize-dropdown {
	display: none;
	margin-top: 0;
	border-top-right-radius: 0;
	border-top-left-radius: 0;
	position: absolute;
	top: 80px;
	left: 10px;
	z-index: 1000;
	width: 345px;
	padding: 5px 0;
	margin: 2px 0 0;
	font-size: 14px;
	list-style: none;
	background-color: #f3f3f3;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 3px;
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
	background-clip: padding-box;
}
#customize-dropdown {
	width: 300px;
}
#share-dropdown li,#customize-dropdown li {
	display: block;
	padding: 3px 20px;
	clear: both;
	line-height: 1.428571429;
	color: #333333;
	white-space: nowrap;
}

#share-dropdown li.divider,#customize-dropdown li.divider {
	height: 1px;
	margin: 9px 0;
	padding: 0;
	overflow: hidden;
	background-color: #e5e5e5;
}
.styleImg {
	margin-right: 10px;
}
#share-dropdown li.dropdown-header,#customize-dropdown li.dropdown-header
	{
	display: block;
	padding: 3px 20px;
	font-size: 12px;
	line-height: 1.428571429;
	color: #999999;
}
#customize-dropdown li {
	padding-left: 45px;
}
#customize-dropdown li:hover {
	background-color: white;
}
#customize-dropdown li.dropdown-header:hover {
	background-color: transparent;
}
.embed {
	border-color: #cccccc;
}
#social-links {
	margin-bottom: 8px;
}
#social-links li {
	display: inline-block;
	margin: 5px 10px 0 0;
	color: red;
	padding: 0;
}
#social-links li a, #social-links li span {
	background: url(../images/social.png) no-repeat;
	background-size: 264px 64px;
	padding: 7px 16px;
}
li#twitter-share a {
	background-position: -33px 0px;
}
li#twitter-share a:hover {
	background-position: -33px -32px;
}
li#facebook-share span {
	background-position: -66px 0px;
}
li#facebook-share span:hover {
	background-position: -66px -32px;
}
li#pinterest-share a {
	background-position: -99px 0px;
}
li#pinterest-share a:hover {
	background-position: -99px -32px;
}
li#email-share a {
	background-position: -132px 0px;
}
li#email-share a:hover {
	background-position: -132px -32px;
}
li#linkedin-share a {
	background-position: -232px 0px;
}
li#linkedin-share a:hover {
	background-position: -232px -32px;
}
li#tumblr-share a {
	background-position: -198px 0px;
}
li#tumblr-share a:hover {
	background-position: -198px -32px;
}
li#stumbleupon-share a {
	background-position: -166px 0px;
}
li#stumbleupon-share a:hover {
	background-position: -166px -32px;
}
.selected {
	background: url(../images/grok/selected.png) no-repeat 24px 6px;
}

.ui-widget-header,.ui-state-default,.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,.ui-state-active,
.ui-widget-content .ui-state-active,.ui-widget-header .ui-state-active {
	background: #f0f1f0;
	border: 0;
	margin: 0;
	padding: 0;
}

button.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default {
	margin-top: -10px;
	outline: none;
}
button.edit_assignment_button.ui-button.ui-widget.ui-state-default,
button.delete_assignment_button.ui-button.ui-widget.ui-state-default {
	background:none;
}
.ui-tabs,.ui-tabs .ui-tabs-panel {
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
}

.pinnedItemConcept {
	background-color: #eeeeee;
	/*padding-left: 10px;*/
	width: 100%;
	font-weight: normal;
	font-size: 90%;
	display: inline-block;
	margin-bottom: 2px;
}

.pinnedItemQuery {
	background-color: #dddddd;
	margin-bottom: 10px;
	padding: 2px;
	width: 100%;
	font-weight: bold;
	display: inline-block;
	text-align: center;
}
/* .websites-title {
	float: left;
} */
.add-url {
	margin-top:10px;
}
#insert-link-data {
	display:none;
	float: left;
	padding: 5px 0px 5px 12px;
	border-bottom: 1px solid #cccccc;
	margin-bottom: 10px;
}
#cancel-insert-link {
	display:none;
}
#url-input {
	width:230px;
	margin-top:-1px;
}
.ui-widget input[id^="input-overlay-"] {
	max-width:140px;
	border:none;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:no-wrap;
	height:16px;
	padding: 1px 3px;
	text-align:center;
	background:transparent;
	font-size:10px;
}
input[id^="input-overlay-"]:hover {
	border:1px solid #cccccc;
	background:white;
	/*text-align:left;*/
}
input[id^="input-overlay-"]:focus {
	border:1px solid #669900;
	/*text-align:left;*/
	background:white;
}
.toolbar-icon {
	padding:16px;
	float:left;
}
.toolbar-text {
	float:left;
	padding: 8px;
	color:#999999;
}
.toolbar-text:hover {
	color:#666666;
}
#zoom-in-icon, #zoom-out-icon {
	background: url(../images/grok/toolbar-icons.png) no-repeat 0 0;
	background-size: 60px 44px;
	padding: 10px;
	margin:5px;
} 
#zoom-in-icon {
	background-position: 0px 0px;
} 
#zoom-out-icon {
	background-position: -20px 0px;
} 
#zoom-in-icon:hover {
	background-position: 0px -24px;
} 
#zoom-out-icon:hover {
	background-position: -20px -24px;
}
#share-icon {
	background: url(../images/grok/toolbar-icons.png) no-repeat 0 0;
	background-size: 60px 44px;
	background-position: -40px 0px;
	padding: 2px 10px 2px 20px;
	color:#999999;
}
#share-icon:hover, #rating-icon {
	color:#333333;
	background-position:-40px -24px;
}
#rating-icon {
	background: url(../images/grok/star-rating.png) no-repeat 0 0;
	background-size: 23px 74px;
	background-position: 0px 0px;
	padding: 3px 10px 3px 28px;
	color:#999999;
}
#grok-toolbar {
	background:white;
	border-bottom:1px solid #cccccc;
	height:32px;
	width:100%;
}
.toolbar-section {	
	border-right:1px solid #cccccc;
	float:left;
	height:32px;
	padding: 0px 10px;
}
.toolbar-section label {
	font-size:12px;
	color:#555555;
	padding:0px 10px 0px 0px;
	float:left;
	line-height:1;
}
button#share_btn.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only {
	margin-top:3px;
	padding:6px 2px 2px;
	background:white;
}
button#star_btn.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only,
button#star_btn.ui-button.ui-widget.ui-corner-all.ui-button-text-only {
	margin-top:3px;
	padding:6px 2px 2px;
	background:white;
	border:0;
}
button#star_btn.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only:hover #rating-icon {
	background-position:0px -26px;
}
button#star_btn.ui-button.ui-widget.ui-corner-all.ui-button-text-only #rating-icon {
	background-position:0px -52px;
}
button#star_btn.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only #rating-icon {
	background-position:0px 0px;
}
#top_difficulty_slider { 
	visibility: hidden;
	/* padding-top:15px; */
	width:110px;
	float:left;
}
#top_difficulty_slider #slider {
	width:100px;
	height:3px;
}
.sp-replacer {
	float:left;
}
#color_picker_div {
	visibility: hidden;
}
#sidebar-tabs {
	border:none;
}
#arrow-img {
	background:url(../images/grok/arrow-up.png) no-repeat center center;
	padding:6px;
}
.ui-state-active #arrow-img {
	padding:0;
}
#sidebar-tabs ul#sidebar-tabs-nav {
	float:right;
	height:32px;
	width:234px;	
	background:#f3f3f3;
	border:none;
	border: 0;
	border-radius:0px;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	border-left:1px solid #ccc;
	padding:0;
}
#sidebar-tabs-nav li.ui-state-active {
	border-radius:0px;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	text-shadow: 1px 1px #000000;
	background-color:#484747;
	/* IE10 Consumer Preview */ 
	background-image: -ms-linear-gradient(top, #484747 0%, #373535 100%);	
	/* Mozilla Firefox */ 
	background-image: -moz-linear-gradient(top, #484747 0%, #373535 100%);	
	/* Opera */ 
	background-image: -o-linear-gradient(top, #484747 0%, #373535 100%);	
	/* Webkit (Safari/Chrome 10) */ 
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #484747), color-stop(1, #373535));	
	/* Webkit (Chrome 11+) */ 
	background-image: -webkit-linear-gradient(top, #484747 0%, #373535 100%);	
	/* W3C Markup, IE10 Release Preview */ 
	background-image: linear-gradient(to bottom, #484747 0%, #373535 100%);
}
#sidebar-tabs-nav li#empty-arrow.ui-state-active a {
	padding:0;
}
#sidebar-tabs-nav li.ui-state-active a {
	color:white;
}
ul#sidebar-tabs-nav li {
	display:inline;
}
ul#sidebar-tabs-nav li a {
	color:#666666;
	padding:8px 10px 6px 10px;
	float:left;
}
#grok-table tr td#related-tab, #grok-table tr td#comments-tab {
	width:220px;
	background:white;
	border-left:1px solid #cccccc;
}
div#related-tab, div#comments-tab {
	display: block;
	background:#f3f3f3;
	border-left:1px solid #cccccc;
	min-height:700px;
	position:absolute;
	right:0;
	width:218px;
	top:33px;
	z-index:100;
	padding:8px;
	border-radius:0px;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	overflow: scroll;
	height: 700px;/* this should be defined in javascript */
}
.commented-by {
	font-size:12px;
	float:left;
	font-weight:bold;
}
.date-commented {
	float:right;
	font-size:12px;
	color:#666666;
}
.user-comment {
	padding:8px 5px;
}
.user-comment p {
	float:left;
	/* margin-bottom:8px; */
	width:100%;
}
#comment-input {
	width:200px;
}
#share-buttons a img {
	width:30px;
	height:30px;
	margin-top:10px;
}
