/*** Page Layout ***/
/*** Tree Top ***/

/*** Page Layout ***/
.node-type-rapidresponse h1.page-header { display: none; }
#tree {
	background: url("./images/tree_combined_1c_taller___rapid_response.png") no-repeat 170px center;
	background-size: 792px; /* background-size: cover; ??? */
	width: 992px;
	min-height: 1200px; /* just till content? */
	position: relative;
}



#tree-title .active {
	border-bottom: 1px solid blue;
	padding: 2px 0;
}
#tree-title .fwd {
	position: absolute;
	top: 2.6em;
	right: -15px;
}
#tree-title {
	padding: .6rem 1rem .4rem .3rem;
	color: purple;
	font-weight: 800;
	font-size: 1.2em;
	background: rgba(255,255,255,.9); 
	border: 1rem solid rgba(255,255,255,.7);
	margin-top: 0;
	margin-bottom: 0;
	line-height: 22px;
}

#tree #hello {
  background: rgba(260,260,260,.95);
 	font-size: .9em;
	margin-right: 1rem;
	color: #666;
	border: 1px solid #fcfcfc;
	/*width: 340px;  bootstrapped 
  position: absolute; 
	top: 2px;
	right: 2px;
	 */
	padding: 6px;
}
#branches {
  height: 470px;
}

#trunk {
  height: 200px; /* ??? */
}


/*** Tree Top ***/
.fruitBase {
  border-radius: 35%;
  overflow: hidden;
	border: 3px solid;
	text-align: center; /* and hand-maneuver around corners */
  line-height: 1.25;
	padding-bottom: 5px;
}
.t-red {
	background: blue;
	border-color: red;
	border-width: 4px;
}
.t-red h4 { color: white; font-weight: bold; }
.t-easy {
  background: rgb(234, 250, 241);
  border-color: rgb(52, 152, 219);
}
.t-onecommunity {
	background: #e6ccff;
	border-color: purple;
}
.t-rcc {
	border-color: blue; /* rgb(88, 24, 69); */
	background: 	rgba(242,208,208,.7); /* #f2d0d0; /* rgb(241, 231, 229); */
}
.t-rcc a {
	color: #0e8229; /* green; */
}
.type1 {
    width: 100px;
    height: 100px;
    background: yellow;
    border: 3px solid red;
}
.type2 {
  border: 3px solid blue;
  width: 90px;
  height: 90px;
  background: #BADA55;
}
.type3 {
    width: 500px;
    height: 500px;
    background: aqua;
    border: 30px solid blue;
}
#tree .notready {border-style: dotted;}

/*** Tree Trunk ***/
.trunkBase {
  border-radius: 15%;
  overflow: hidden;
	border: 3px solid;
	text-align: center; /* and hand-maneuver around corners */
  line-height: 1.25;
	margin: 1em;
	background: #ffe6ff;
	padding: 3px 10px;
}
.rootBase {
	color: #331a00; 
	border-color: #331a00;
	background: #ffe6cc;
  border-radius: 15%;
  overflow: hidden;
	border: 3px solid;
	text-align: center; /* and hand-maneuver around corners */
  line-height: 1.25;
	padding: 3px 10px;
}



/*** General ***/
#tree h4 {
	margin-bottom: .05rem;
	font-size: 1.2rem;
	text-transform: uppercase;
}
#tree #roots h4 {
	font-size: 1.3em;
	width: 100%;
	margin-top: -2px;
	margin-bottom: 4px;
	background: rgba(51,26,0, 0.1)
}
/*** Clipboards ***/
.clipboards { padding-top: 1em;}
.clipboard textarea { display: none; }
.clipboard {
	/* border: 2px solid blue; */
	margin-bottom: 10px;
}
.clipboard span {
	vertical-align: middle; 
	position: relative; top: -.8em; 
	line-height: 20px; 
	font-size: 1.2em;
	height: 20px;
	background: white;
	padding: 10px 20px 10px 3px;
	text-decoration: underline yellow;
	background: url("./images/RR_pieces_yellow_arrow_50.png") center right;
}
.clipboard span:hover {
	background: url("./images/RR_pieces_yellow_arrow.png") center right;
}
.clipboard-in {  /* not used yet */
	margin-left: 1em;
}
.clipboard:before {
	margin-top: 1em;
	padding-top: 2em;
	content: url("./images/Clipboard-Icon-40-pur.png");

}


/*** Page Layout Landing ***/
#tree h3 {
	clear: left;
}
#tree #trunk, #tree #roots {
	clear: both;
}
#tree .hello-landing,
#tree #hello-landing {
  font-size: .9em;
  color: #666;
  border: 1px solid #666;
  background: yellow;
  /*width: 340px;  bootstrapped 
  position: absolute; 
  top: 2px;
  right: 2px;
   */
  padding: 6px;
}	

#screencast_messenger {
	padding: 6px 2px 3px 2px;
	color: black;
	/*
	 * background: url("./images/specific/screencast_messenger.png");
  background-size:	cover;
	*/
}
#screencast_messenger img {
	width: 110px;
}

#screencast_messenger div {
	position: relative;
	top: -4px;
}
#screencast_messenger span {
	position: relative;
	top: 8px;
}

.active {
	color: green;
	font-weight: bold;
}