/* #   Explanation of classes   # */
/* #
	.widget
	is used for the base layout of the widgets, create te basic skeleton of the 
	widget and defines of style
	
	.base
	is used to place the selected style to the widget. Created as seperate class to
	make it possible to style subelements in widget and style widget itself
# */

/* For multiple styles */
.base:not(.air){ background-color: #FFFFFF; }
.air .base { background-color: transparent; }
.overlay:not(.bgColorTransparent) { background: rgba( 255,255,255,0.7); }
.quicksearch  .titlebar { background-color: transparent; padding-left: 0; }


/* Cloud and Rain - Bigger offset for content */
.cloud .content, .rain .content { padding: 10px 15px; }

/* Air and Big Rain - Same size titlebar */
.air .titlebar, .bigrain .titlebar,
.air .titlebar h3, .bigrain .titlebar h3,
.air .titlebar h2, .bigrain .titlebar h2,
.air .titlebar a:not(.button), .bigrain .titlebar a:not(.button)
.air .titlebar > span:not(.button), .bigrain .titlebar > span:not(.button),
.air.titlebar, .bigrain.titlebar
{
font-size: 1.7rem;
}

/* Specifics */

/* AIR */
.air .titlebar, .air .titlebar .button, .air.titlebar { background: transparent; padding-top: 0;}
.air .titlebar .button .label { display: none; }
.air .content { font-size: 1.1rem; }

/* In Air widgets: no padding */
.widget.air { padding: 20px 0px; }
.widget.air .overlay { padding: 10px 0px; }
.widget.air .overlay:not(.bgColorTransparent) { padding: 10px 20px; }


/* CLOUD */
@media screen {
	.cloud .base, .cloud.base 
	{
	border-radius: 7px;
	box-shadow: 0px 3px rgba(0, 0, 0, 0.05);
	}
}

.cloud .overlay { border-radius: 7px; }
.cloud .titlebar { border-radius: 7px 7px 0px 0px; }
.cloud .footer { border-radius: 0px 0px 7px 7px; }

.cloud *:not(.titlebar) > .button,
.cloud.button
{
border-radius: 5px;
box-shadow: 0px -3px 0px rgba(0, 0, 0, 0.2) inset
}


/* RAIN */

/* BIGRAIN */
@font-face { font-family: 'oswald-bold'; src: url('../fonts/oswald-bold/oswald-bold.otf') format('opentype'); }
@font-face {
	font-family: 'oswald-bold';
	src:url('../fonts/oswald-bold/oswald-bold.eot?nkd143');
	src:url('../fonts/oswald-bold/oswald-bold.eot?#iefixnkd143') format('embedded-opentype'),
		url('../fonts/oswald-bold/oswald-bold.woff?nkd143') format('woff'),
		url('../fonts/oswald-bold/oswald-bold.ttf?nkd143') format('truetype'),
		url('../fonts/oswald-bold/oswald-bold.svg?nkd142#oswald-bold') format('svg');
}

@media screen {
	.bigrain .base, .bigrain.base { box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1); }
}

.bigrain .titlebar, .bigrain .titlebar * { background-color: transparent; }

.bigrain .overlay { padding: 15px 10px; }

.bigrain .titlebar h3,
.bigrain .titlebar h2,
.bigrain .titlebar a:not(.button),
.bigrain .titlebar > span:not(.button)
{
font-family: oswald-bold;
margin-bottom: 10px;
}

.bigrain.titlebar { font-family: oswald-bold; }

span.filler {
    display:block;
}

/* Overwrite all for high-contrast */
#page.highcontrast .rain .titlebar, #page.highcontrast .cloud .titlebar { background-color: #000000; color: #FFFFFF; }
#page.highcontrast .rain .titlebar h3, #page.highcontrast .cloud .titlebar h3 { color: #FFFFFF; }
