@import url(http://fonts.googleapis.com/css?family=Roboto:100,300&subset=latin-ext,cyrillic-ext,greek-ext,vietnamese);
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:300&subset=latin-ext,cyrillic-ext,greek-ext,vietnamese);

/*------------------------------------*\
    $WIDGET'S STYLES
\*------------------------------------*/
	div[id^="cspww-"] table.cspw-sub-title{
		margin: 0px;
		color:red;
	}

	div[id^="cspww-"].cspw-weather {
		font-family: 'Roboto Condensed', sans-serif;
		font-weight: 300;
		padding: 0px;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
		*behavior: url(boxsizing.htc);
		overflow: hidden;
		max-width: 100%;
	}

	div[id^="cspww-"].cspw-alignleft {
		float: left;
	}

	div[id^="cspww-"].cspw-alignright {
		float: right;
	}

	div[id^="cspww-"].cspw-aligncenter {
		margin: 0 auto;
		float: none;		
	}

		div[id^="cspww-"] a,
		div[id^="cspww-"] a:hover {
			text-decoration: none;
			color: #FFF;
		}

		div.cspw-tabs-content{
			position: relative;
		}

		
		div.cspw-container{
			height: 185px;
			position: relative;
		}


		div.cspw-tab {
			display: none;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			*zoom:1;
		}

		div.cspw-tab:before,
		div.cspw-tab:after {
		  display: table;
		  content: "";
		  line-height: 0;
		}

		div[id^="cspww-"] img {
			border:none;
			outline:none;
			box-shadow: none;
		}


		div.cspw-title {
			font-family: 'Roboto', sans-serif;
			text-align: center;
			font-size: 40px;
			line-height: 100%;
			margin-bottom: 10px;
			text-transform: uppercase;
			font-weight: 300;
		}

		table.cspw-sub-title {
			background: transparent\9;
			background: rgba(255,255,255,0.15);
    		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#15FFFFFF,endColorstr=#15FFFFFF);
		    zoom: 1;
			font-size: 0;
			text-transform: uppercase;
			position: relative;
			margin-bottom: 10px;
			border:none;
			border-collapse: collapse;
			width: 100%;
		} 

			table.cspw-sub-title tr {
				border: none;
				padding: 0px;
				margin: 0px;
			}

			table.cspw-sub-title td {
				font-size: 18px;
				line-height: 18px;
				width: 33.33%;
				vertical-align: middle;
				border:none;
				padding: 6px 0;
				border: none;
				margin: 0px;
			}

			table.cspw-sub-title tr td.cspw-location {padding-left: 7px;}

			table.cspw-sub-title tr td.cspw-description {
				padding-right: 7px;
				vertical-align: middle;
			}

			.cspw-sub-title td.cspw-location,
			.cspw-sub-title td.cspw-description {
				vertical-align: top;
			}

			.cspw-sub-title td.cspw-description{text-align: right;}

			.cspw-sub-title td.cspw-date {
				text-align: center;
			}

			.cspw-day-info {
				text-align: right;
				font-size: 18px;
				margin-bottom: 6px;
			}

				.cspw-day-info>span {
					margin-left: 27px;
					display: inline-block;
					zoom: 1;
					*display:inline;
				}

				.cspw-day-info img{
					vertical-align: middle;
					margin-top: -4px;
					max-height: 100px;
				}

			.cspw-ico,
			.cspw-degree {
				height: 158px;
				line-height: 174px;
				text-align: center;
			} 

			.cspw-ico {
				width: 37%;
				float: left;
				text-align: center;
				font-size: 0;
			}

				.cspw-ico img {
					vertical-align: middle;
					display: inline-block;
					zoom: 1;
					*display:inline;
					max-width: 100%;
					max-height: 100%;
				}

			.cspw-degree {
				margin-left: 2%;
				width: 61%;
				font-size: 130px;
				line-height: 150px;
				float: left;
				font-family: 'Roboto', sans-serif;
				font-weight: 100;
				letter-spacing: -10px;
			}

				.cspw-degree>span {
					font-size: 75%;
					margin-left: 23px;
				}

					.cspw-degree>span span {
						font-size: 64%;
						vertical-align: top;
						margin-top: -33px;
						margin-left: -10px;
						display: inline-block;
						zoom: 1;
						margin-right: -10px;
					}

		.cspw-tabs-wrap {
			text-align: center;
			clear: both;
			font-size: 0;
			padding-top: 11px;
		}

			.cspw-tabs-wrap .cspw-tab-label {
				width: 14.285714%;
				*width: 14.175714%;
				display: inline-block;
				zoom: 1;
				*display:inline;
				font-size: 18px;
				text-transform: uppercase;
				cursor: pointer;
			}

				.cspw-tabs-wrap .cspw-tab-label>a {
					display: block;
					
					background: transparent\9;
					background: rgba(255,255,255,0.15);

					filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#15FFFFFF, endColorstr=#15FFFFFF);
					-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#15FFFFFF, endColorstr=#15FFFFFF)";

					text-align: center;
					padding: 14px 0 4px;
					border: 1px solid #8f837f\9; 
					border: 1px solid rgba(255,255,255,0.2);
					border-width: 1px 1px 1px 0;
				
					-webkit-transition: all 0.15s linear;
					   -moz-transition: all 0.15s linear;
					    -ms-transition: all 0.15s linear;
					     -o-transition: all 0.15s linear;
					        transition: all 0.15s linear;
				}

				.cspw-tabs-wrap .cspw-tab-label.first>a {
					border-left-width: 1px;
				}

					.cspw-tab-label .cspw-tab-ico {
						width: 100%;
						text-align: center;
						margin: 0 auto 10px;
						height: 48px;
						line-height: 48px;
					}

						.cspw-tab-label img {
							vertical-align: middle;	
							display: inline-block;
							zoom: 1;
							*display:inline;				
							max-width: 100%;
							max-height: 100%;
							cursor: pointer;
						}

				.cspw-tabs-wrap .cspw-tab-label>a:active,
				.cspw-tabs-wrap .cspw-tab-label.cspw-active>a {
					-webkit-box-shadow: inset rgba(0,0,0,.5) 0px 5px 10px;
					   -moz-box-shadow: inset rgba(0,0,0,.5) 0px 5px 10px;
					  		box-shadow: inset rgba(0,0,0,.5) 0px 5px 10px;
				    background: none;
				    /* For IE 5.5 - 7*/
					filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF);
					/* For IE 8*/
					-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF)";
				    

					border-top-color: rgba(255,255,255,0.1);
				}


	/**** MIDDLE SIZE ****/
			div.cspw-middle div.cspw-container{
				height: 156px;
				position: relative;
			}


			div.cspw-middle div.cspw-title {
				font-size: 30px;
				margin-bottom: 2px;
			}

			div.cspw-middle table.cspw-sub-title {
				margin-bottom: 5px;
			} 

				div.cspw-middle table.cspw-sub-title td {
					font-size: 13px;
					line-height: 13px;
					padding: 4px 0;
				}

				div.cspw-middle table.cspw-sub-title tr td.cspw-location {padding-left: 4px;}

				div.cspw-middle table.cspw-sub-title tr td.cspw-description {padding-right: 4px;}

				div.cspw-middle .cspw-day-info {
					font-size: 13px;
					margin-bottom: 10px;
					
				}

					div.cspw-middle .cspw-day-info>span {
						margin-left: 20px;
					}

					div.cspw-middle .cspw-day-info img{
						margin-top: -2px;
						height: 15px;
					}

				div.cspw-middle .cspw-ico,
				div.cspw-middle .cspw-degree {
					height: 124px;
					line-height: 124px;
				} 


				div.cspw-middle .cspw-degree {
					font-size: 95px;
					line-height: 112px;
					letter-spacing: -8px;
				}

					div.cspw-middle .cspw-degree>span {
						font-size: 75%;
					}

						div.cspw-middle .cspw-degree>span span {
							margin-top: -29px;
							margin-left: -14px;
						}

			div.cspw-middle .cspw-tabs-wrap {
				padding-top: 0px;
			}

				div.cspw-middle .cspw-tabs-wrap .cspw-tab-label {
					font-size: 13px;
				}

					div.cspw-middle .cspw-tabs-wrap .cspw-tab-label>a {
						padding: 7px 0 2px;
					}

					div.cspw-middle .cspw-tabs-wrap .cspw-tab-label.first>a {
						border-left-width: 1px;
					}

					div.cspw-middle .cspw-tab-label .cspw-tab-ico {
							height: 36px;
							line-height: 36px;
						}

						div.cspw-middle .cspw-tab-label .cspw-tab-ico {
							height: 36px;
							line-height: 36px;
							margin-bottom: 10px;

						}

					div.cspw-middle .cspw-tabs-wrap .cspw-tab-label>a:active,
					div.cspw-middle .cspw-tabs-wrap .cspw-tab-label.cspw-active>a {
						-webkit-box-shadow: inset rgba(0,0,0,.5) 0px 3px 5px;
						   -moz-box-shadow: inset rgba(0,0,0,.5) 0px 3px 5px;
						  		box-shadow: inset rgba(0,0,0,.5) 0px 3px 5px;
					}


	/**** SMALL SIZE ****/

			div.cspw-small div.cspw-container{
				height: 102px;
				position: relative;
			}


			div.cspw-small div.cspw-title {
				font-size: 20px;
				margin-bottom: 2px;
			}

			div.cspw-small table.cspw-sub-title {
				margin-bottom: 5px;
			} 

				div.cspw-small table.cspw-sub-title td {
					font-size: 9px;
					line-height: 9px;
					padding: 4px 0;
				}

				div.cspw-small table.cspw-sub-title tr td.cspw-location {padding-left: 4px;}

				div.cspw-small table.cspw-sub-title tr td.cspw-description {
					padding-right: 4px;
					vertical-align: middle;
				}

				div.cspw-small .cspw-day-info {
					font-size: 9px;
					margin-bottom: 2px;
					
				}

					div.cspw-small .cspw-day-info>span {
						margin-left: 15px;
					}

					div.cspw-small .cspw-day-info img{
						margin-top: -2px;
						height: 10px;
					}

				div.cspw-small .cspw-ico,
				div.cspw-small .cspw-degree {
					height: 85px;
					line-height:85px;
				} 


				div.cspw-small .cspw-degree {
					font-size: 60px;
					line-height: 75px;
					letter-spacing: -4px;
				}

					div.cspw-small .cspw-degree>span {
						font-size: 75%;
					}

						div.cspw-small .cspw-degree>span span {
							margin-top: -18px;
							margin-left: -14px;
						}

			div.cspw-small .cspw-tabs-wrap {
				padding-top: 0px;
			}

				div.cspw-small .cspw-tabs-wrap .cspw-tab-label {
					font-size: 9px;
				}

					div.cspw-small .cspw-tabs-wrap .cspw-tab-label>a {
						padding: 5px 0 2px;
					}

					div.cspw-small .cspw-tabs-wrap .cspw-tab-label.first>a {
						border-left-width: 1px;
					}

					div.cspw-small .cspw-tab-label .cspw-tab-ico {
							height: 36px;
							line-height: 36px;
						}

						div.cspw-small .cspw-tab-label .cspw-tab-ico {
							height: 24px;
							line-height: 24px;
							margin-bottom: 6px;

						}

					div.cspw-small .cspw-tabs-wrap .cspw-tab-label>a:active,
					div.cspw-small .cspw-tabs-wrap .cspw-tab-label.cspw-active>a {
						-webkit-box-shadow: inset rgba(0,0,0,.5) 0px 3px 5px;
						   -moz-box-shadow: inset rgba(0,0,0,.5) 0px 3px 5px;
						  		box-shadow: inset rgba(0,0,0,.5) 0px 3px 5px;
					}