/**************************************************************
/* public.css
/* jpl 11/06/09
/*
/*	Front end styles
/*************************************************************/


/*------------------------------------------------------------------------------*/
/* SECTION::Global HTML Resets */

html {
	padding:				0;
	margin:					0;
}



/* End SECTION::Global HTML Resets
/*------------------------------------------------------------------------------*/




/*------------------------------------------------------------------------------*/
/* SECTION::Main window and pages within  */

.mainWindow {
	height:					450px;
	width:					400px;
	background:				#fff;
	padding:				20px;
	-moz-border-radius:		20px;
	-webkit-border-radius:	20px;
	margin:					auto;
	-moz-user-select:		none;
	-webkit-user-select:	none;
}

.mainWindow #viewPort {
	height:					100%;
	width:					100%;
	overflow:				hidden;
	background:				#000;
	-moz-border-radius:		15px;
	-webkit-border-radius:	15px;
}

.mainWindow #viewPort .page {
	position:				relative;
	height:					450px;
	width:					400px;
	background:				#A00;
	background:				-moz-linear-gradient(top, #900, #C00 30%, #400 90%);
	background:				-webkit-gradient(linear, left top, left bottom, color-stop(0, #900000), color-stop(0.3, #c00000), color-stop(0.9, #400000));
	filter:					progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#A00000, endColorstr=#400000);
	-ms-filter:				"progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#A00000, endColorstr=#400000)";
	font-size:				16px;
	float:					left;
	border-radius:			15px;
	text-align:				left;
}

.mainWindow .page .inner {
	padding:			20px 40px;
}

.page .pageContent {
	margin-top:				30px;
	background:				#400;
	background:				-moz-linear-gradient(top, #300, #500 30%, #200 90%);
	background:				-webkit-gradient(linear, left top, left bottom, color-stop(0, #300000), color-stop(0.3, #500000), color-stop(0.9, #200000));
	filter:					progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#600000, endColorstr=#200000);
	-ms-filter:				"progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#600000, endColorstr=#200000)";
	border-radius:			15px;
	padding:				10px 10px 10px 20px;
	height:					300px;
}

/* End SECTION::Main window and pages within
/*------------------------------------------------------------------------------*/
	
/*------------------------------------------------------------------------------*/
/* SECTION::Pop Up Windows  */
.popUpWindow {
	margin-bottom:			0px;
	border:					2px solid #000000;
	border-radius:			10px;
	background:				-moz-linear-gradient(top, #900, #C00 30%, #400 90%);
	background:				-webkit-gradient(linear, left top, left bottom, color-stop(0, #900000), color-stop(0.9, #400000), color-stop(0.3, #c00000));
	box-shadow:				4px 4px 3px #888;
	text-align:				left;
}
.popUpWindow .titleBar {
	position:				relative;
	padding:				1px 10px 7px 10px;
	height:					20px;
	font-size:				20px;
	background:				#000;
	border-radius:			8px 8px 0 0;
}
.popUpWindow .titleBar span.theTitle {
	display:				block;
	margin-left:			7px;
	padding-right:			9px;
	font-weight:			900;
	padding-bottom:			4px;
}

.popUpWindow .titleBar span.closeIcon {
	position:				absolute;
	top:					5px;
	right:					7px;
	background:				url(../images/iconWhiteBigX.png) no-repeat;
	height:					23px;
	width:					23px;
	cursor:					pointer;
}



.popUpWindow div.content {
	padding:				5px 10px;
	position:				relative;
	margin:					0;
	padding:				8px;
	overflow:				auto;
}
	.popUpWindow div.content span.resizeIcon {
		position:				absolute;
		right:					1px;
		bottom:					1px;
		height:					16px;
		width:					16px;
		background:				transparent url(../images/iconResize.png) no-repeat;
		cursor:					se-resize;
	}

/* End SECTION::Pop Up Windows
/*------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------*/
/* SECTION::Zen Pop Up Windows */
.zenPopUpWindow {
	margin-bottom:			0px;
	border:					1px solid #b9b3af;
	background:				#eef8fb url(../images/popUpBodyBG.jpg) no-repeat bottom right;
	box-shadow:				4px 4px 3px rgba(180, 180, 250, 0.7);
	text-align:				left;
}
.zenPopUpWindow .titleBar {
	position:				relative;
	font-size:				16px;
	padding:				5px 0 0 9px;
	cursor:					move;
}
.zenPopUpWindow .titleBar span {
	color:					#3c6b98;
}

.zenPopUpWindow .titleBar span.closeIcon {
	position:				absolute;
	top:					5px;
	right:					7px;
	background:				url(../images/icon18ClosePopUp.gif) no-repeat;
	height:					18px;
	width:					18px;
	cursor:					pointer;
}


.zenPopUpWindow .content {
	position:				relative;
	margin:					0;
	padding:				8px 10px 70px 10px;
	font-size:				12px;
	color:					#278622;
}

/* End SECTION::Pop Up Windows
/*------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------*/
/* SECTION::Buttons  */
a.button, input[type=submit], input[type=button] {
	
}
input[type=submit], input[type=button] {
	
}
a.button:hover, input[type=submit]:hover, input[type=button]:hover {
	
}
a.button:active, input[type=submit]:active, input[type=button]:active {
	
}

/* End SECTION::Buttons
/*------------------------------------------------------------------------------*/


/*------------------------------------------------------------------------------*/
/* SECTION::Universal Utility  */
	
	.left       { float: left; }			td.left			{ text-align: left;  float: none; }
	.right      { float: right;}			td.right		{ text-align: right; float: none; }
	.clear      { clear: both; }
	
	.inline		{ display: inline; }
	.block		{ display: block; }
	.inlineBlock{ display: inline-block; }
	
	.justify	{ text-align: justify; }
	.bold		{ font-weight: 900; }
	.relative	{ position: relative; }
	.absolute	{ position: absolute; }
	.clickable	{ cursor: pointer; }
	
	.center     { text-align: center; }				/* CENTER elements contained by me  */
	.centered   { display: block; margin: 0 auto; } /* make me CENTERED in my container */
	
	.verticalMiddle td, td.verticalMiddle	{ vertical-align: middle; }
	div.verticalMiddle						{ vertical-align: middle; }
	.verticalMiddle>*						{ vertical-align: middle; }
	
	.hidden     	{ display: none; }
	.truncatedText	{ overflow: hidden; }
	.hideOverflow	{ overflow: hidden; }
	
	.nextElement	{ margin-top:  6px; }
	.nextSection	{ margin-top: 16px; }
	
/* End SECTION::Universal Utility
/*------------------------------------------------------------------------------*/


/* Edit Board css
/*------------------------------------------------------------------------------*/


.edit-board{list-style: none; width: 635px;}

.edit-board li:first-child{border-top: 0px solid #fcfbfc;}
.edit-board li{
clear: both;
margin: 0;
padding: 15px 0;
color: #8C7E7E;
text-shadow: 0 1px rgba(255, 255, 255, 0.9);
border-top: 1px solid #fcfbfc;
border-bottom: 1px solid #e0dedf;
float: left;
width: 100%;
display: block;
/*overflow: hidden;*/
}

.edit-board li label{
   text-align: left;
   font-size: 18px;
   float: left;
   width: 175px;
   padding-top: 7px;
   vertical-align: top;
   color: #8C7E7E;
   text-shadow: 0 1px rgba(255, 255, 255, 0.9);
}

.edit-board li .title-edit{
    width: 375px;
    float: left;
    display: inline-block; box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; padding: 6px 12px; font-size: 18px; font-weight: 300; line-height: 1.4; color: #221919; background: #fff; border: 1px solid #a4a2a2; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8); -moz-box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8); -webkit-box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8); -moz-transition: all 0.08s ease-in-out; -webkit-transition: all 0.08s ease-in-out;
}
.edit-board li textarea{
    width: 450px;
    *width: 430px;
    height: 90px;
    float: left;
    display: inline-block; box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; padding: 6px 12px; font-size: 18px; font-weight: 300; line-height: 1.4; color: #221919; background: #fff; border: 1px solid #a4a2a2; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8); -moz-box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8); -webkit-box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8); -moz-transition: all 0.08s ease-in-out; -webkit-transition: all 0.08s ease-in-out;
}
.edit-board li .edit-link{
    width: 450px;
    *width: 430px;
    height:38px;
    float: left;
    display: inline-block; box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; padding: 6px 12px; font-size: 18px; font-weight: 300; line-height: 1.4; color: #221919; background: #fff; border: 1px solid #a4a2a2; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8); -moz-box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8); -webkit-box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8); -moz-transition: all 0.08s ease-in-out; -webkit-transition: all 0.08s ease-in-out;
}
.edit-board li .Just-pin{
    float: left;
    margin-top: 3px;
    margin-right: 5px;
    border: none;
}
.edit-board li .justpin-img{
    float: left;
    height: 19px;
    padding-left: 25px;
    margin-right: 30px;
    font-weight: normal;
    background:	url(../images/collaborative-icons.png) no-repeat;
    font-size: 18px;
}
.edit-board li .mepin-img{
    float: left;
    height: 20px;
    padding-left: 46px;
    font-weight: normal;
    background:	url(../images/collaborative-icons.png) no-repeat;
    font-size: 18px;
    background-position: 0px -19px;
}
.pinability{
    float: left;
    padding-top: 5px;
}
.BoardPicker{
    float: left;
    -webkit-appearance: none;
    background: transparent;
    color: #8C7E7E;
    font-size: 18px;
    width: 337px;
    position: relative;
    display: block;
    margin-bottom: 18px;
    padding: 6px 24px 6px 12px;
    background-color: #f0eded;
    background: -moz-linear-gradient(#fffcfc, #f0eded);
    background: -o-linear-gradient(#fffcfc, #f0eded);
    background: -webkit-linear-gradient(#fffcfc, #f0eded);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcfc', endColorstr='#f0eded');
    cursor: pointer;
    border: 1px solid #cccaca;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    box-shadow: inset 0 1px 1px rgba(34,25,25,0.1), 0 2px 2px white;
    -moz-box-shadow: inset 0 1px 1px rgba(34,25,25,0.1), 0 2px 2px white;
    -webkit-box-shadow: inset 0 1px 1px rgba(34,25,25,0.1), 0 2px 2px white;
}
.customStyleSelectBox .down-arrow{display: none;}
.down-arrow{
    position: relative;
    width: 11px;
    float: left;
    display: block;
    top: 19px;
    left: -25px;
    height: 9px;
    background:	url(../images/downArrow.png) no-repeat;
   
}
.save-editboard{
    background:	url(../images/save-bttn.png) no-repeat;
    padding: 9px 98px;
    cursor: pointer;
    float: left;
    overflow: hidden;
    height:50px;
    border: none;
}



.delete-board{
    background:	url(../images/delete-bttn.png) no-repeat;
    padding: 9px 74px;
    float: left;
    overflow: hidden;
    height: 19px;
}

.PinEditPreview{
    float: right;
position: relative;
overflow: hidden;
margin-top:18px;
width: 202px;
padding: 10px;
font-size: 11px;
background-color: white;
box-shadow: 0 1px 3px rgba(34,25,25,0.4);
-moz-box-shadow: 0 1px 2px rgba(34,25,25,0.4);
-webkit-box-shadow: 0 1px 3px rgba(34,25,25,0.4);
}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus, input[type="text"].error, input[type="password"].error, textarea.error {
border-color: #E25119;
box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8), 0 0 14px rgba(235,82,82,0.35);
-moz-box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8), 0 0 14px rgba(235,82,82,0.35);
-webkit-box-shadow: inset 0 1px rgba(34,25,25,0.15), 0 1px rgba(255,255,255,0.8), 0 0 14px rgba(235,82,82,0.35);
}