carbideui/com.nokia.tools.carbide.ui.themeedition/intro/css/shared.css
author vasuds@2INL03378.NOE.Nokia.com
Wed, 07 Jul 2010 16:18:07 +0530
changeset 0 a44900f0f001
permissions -rw-r--r--
Carbide.ui source under EPL for ver3.0

/* 
 * Set up general fonts, sizes and colors 
 */
 
 body, .page{	
	min-height : 425px;
	height : 80%;
	height : expression(document.body.clientHeight < 425? "425px": "80%" );
}
 
 
 
 
body { font-family : Arial, sans-serif;
	min-width : 600px;
	/* since IE doesn't support min-width, use expression */
	width:expression(document.body.clientWidth < 770? "600px": "600px" );
	background-image : url(graphics/rootpage2/background.jpg);
	background-repeat : no-repeat;
	background-position : top left;
	background-color :#d0d0d0;
	margin-top:50px;
}

/*	Carbide branding mod */
#bottom-area {
	width:250px;  /* wider box here */
	position:absolute;
	bottom:0px;
	left:5px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: xx-small;
	color: #666666;
	font-weight: 500;
	margin:0px; /* replaced margin spacing with padding */
	padding: 5px;
}

/*	Carbide branding mod */
#copyright-footer{
	width:195px;  /* wider box here */
	position:absolute;
	bottom:50px;
	left:12px;	
	margin:0px; /* replaced margin spacing with padding */
	padding: 5px;
}

#copyright-footer .text{
	font-size: xx-small;
	font-family: Arial, Helvetica, sans-serif;
	color: #666666;
	font-weight: 500;
}

#copyright-footer .text#copyright{	
}

#copyright-footer .text#reserved{			
	position:absolute;
	bottom:10px;
}


.intro-header H1 {
	font-size : 16pt;
	font-weight : bolder;
	color : #00A2D6;
}

h2 {
	font-size : 13pt;
	font-weight : normal;
	color : #7B8694;
}
/* For regular div labels */
H4 .div-label {
	font-size : 10pt;
	font-weight : bold;	
}

/* For the main page content's title */
#content-header H4 .div-label {
	font-size : 12pt;
	font-weight : bold;
	color : #666666;
	float : none;
	clear : both;
	margin:10px;
}

.page-description { 
	font-size : 10pt;
	color : #666666;
	float : none;
	clear : both;
}

a {
	font-weight : bold;
	text-decoration : none;
	color : #4D4D4D;
}

a .link-label {
	font-size : 10pt;
	font-weight : normal;
}

/* 
 * Lay out the navigation links 
 * (Root page does something similar for its navigation)
 */
#navigation-links {
	position : absolute;
	right:200px;
	top : 25px;
	height : 60px;
	
}

#navigation-links a {
	padding-left : 5px;
	padding-right : 5px;
	float : left;
	/*text-align : center;	*/
}

#navigation-links a:hover{
	color : #00A2D6;
}



#navigation-links a .link-label { display : block; margin-top : 5px;}

#navigation-links a .text { display : none; }

#navigation-links a:hover, 
#navigation-links a:focus 
#navigation-links a:active { border-right : 0px;}

/* properties for each of the navigation-links  */
/*#navigation-links a#overview img { background-image : url(graphics/icons/etool/overview48.gif); }
#navigation-links a#overview:hover img,
#navigation-links a#overview:focus img,
#navigation-links a#overview:active img { background-image : url(graphics/icons/ctool/overview48.gif); }
/*#navigation-links a#overview:active img { background-image : url(graphics/icons/ctool/overview48sel.gif); }*/

/*#navigation-links a#tutorials img { background-image : url(graphics/icons/etool/tutorials48.gif); }
#navigation-links a#tutorials:hover img,
#navigation-links a#tutorials:active img,
#navigation-links a#tutorials:focus img { background-image : url(graphics/icons/ctool/tutorials48.gif); }
/*#navigation-links a#tutorials:active img { background-image : url(graphics/icons/ctool/tutorials48sel.gif); }*/

/*#navigation-links a#samples img { background-image : url(graphics/icons/etool/samples48.gif); }
#navigation-links a#samples:hover img,
#navigation-links a#samples:active img,
#navigation-links a#samples:focus img { background-image : url(graphics/icons/ctool/samples48.gif); }
/*#navigation-links a#samples:active img { background-image : url(graphics/icons/ctool/samples48sel.gif); }*/

/*#navigation-links a#news img { background-image : url(graphics/icons/etool/whatsnew48.gif); }
#navigation-links a#news:hover img,
#navigation-links a#news:focus img,
#navigation-links a#news:active img { background-image : url(graphics/icons/ctool/whatsnew48.gif); }
/*#navigation-links a#news:active img { background-image : url(graphics/icons/ctool/whatsnew48sel.gif); }*/

/*#navigation-links a#workbench { position : absolute;  right : 0px; top : -35px; text-align : right;}
#navigation-links a#workbench .text { display : none; }
#navigation-links a#workbench img { background-image : url(graphics/icons/etool/wb48.gif); width : 53px; height : 53px;}
#navigation-links a#workbench:hover img,
#navigation-links a#workbench:focus img,
#navigation-links a#workbench:active img { background-image : url(graphics/icons/ctool/wb48.gif); }

/* 
 * Lay out the page title and description 
 */
h1, p { margin-left : 10px; } /* required in mozilla so the page description is properly indented */

/* position the page content so that the page title overlays the bottom
 * of the background image, but make sure the content is always on top 
 * (using z-index) */
#page-content {
	float : none;
	clear : both;
/*	text-align : center;*/
	margin-top : 35px;
}

.page > #page-content { margin-top : 50px; }

#page-content p { 
	padding-bottom : 15px; 
	text-align : left; 
	float : none;
	clear : both;
}

#page-content #content-header H4, .page-description {
	text-align : left;
	margin-right : 10px;
	float : none;
	clear : both;
}


/*
 * Set up the action links
 */
#action-links {
	width :50px;
	position : absolute;
	right : 20px;
	top : 20px;
}	

#action-links a .link-label {
	font-size : 13pt;
	font-weight : 600;
	color : #666666;
}
	
	
#action-links a#workbench {
	position : absolute;
	top : -16px;
	right : 0px;
	text-align : right;
}
#action-links a .background-image,
#action-links a #workbench_img {
	height : 29px;
	width : 47px;
	text-align : center;
	vertical-align : top;
}
/* special case for mozilla */
#action-links a > .background-image,
#action-links a > #workbench_img {	
	vertical-align : middle;
}
	
#action-links .content-img{
	width:47px;
	height:29px;
	position:absolute;
	margin-top:30px;
	margin-right:25px;	
	top:0px;
	right:0px;

	}
	
#action-links a .link-label{	
	display : block;
	width : 16em;
	margin-left : 10px;
	margin-top:70px;	
	color:#666666;
	
	}
	

/* remove the hover image from the flow of the document,
   so it doesn't take up space and change the position
   of the main image */
#action-links a .background-image {
	position : absolute;
}
#action-links a#workbench .background-image {
	margin-top:50px;
	background-image : url(graphics/icons2/workbench.png);
	visibility : hidden;
}/*
#action-links a#workbench:hover .background-image,
#action-links a#workbench:focus .background-image,
#action-links a#workbench:active .background-image {
	visibility : visible;
	position: absolute;
	margin-top:30px;
	margin-right:25px;	
	top: 0px;
	right: 0px;	
}
*/
#action-links a:hover,
#action-links a:focus,
#action-links a:active {
	border : 0px;
}