Scandic Partners – Affiliate program

CSS
body {
	font: normal 13px/16px "Open Sans" Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
	background: #faf4ee url(../images/bg.jpg) repeat left top;
	color: #4c4c4c;
	}

.layout,
#content,
#promo,
#products,
#other {
	margin: 0 auto;
	width: 960px;
	}
a {color: #0084bc}
a:hover {text-decoration: none}

.header-1 {
	line-height: 36px;
	font-family: Kreon;
	font-size: 30px;
	font-weight: bold;
	color: #000;
	}
.header-2 {
	line-height: 22px;
	font-family: Kreon;
	font-size: 18px;
	font-weight: normal;
	color: #000;
	}
.header-3 {
	font-family: "Open Sans";
	font-size: 14px;
	font-weight: normal;
	color: #000;
	}
.header-4 {
	font-family: Kreon;
	font-size: 14px;
	font-weight: normal;
	color: #000;
	}

.button {
	display: block;
	width: 194px;
	height: 57px;
	line-height: 55px;
	font-size: 22px;
	text-align: center;
	text-decoration: none;
	text-shadow: 0 1px 1px #eed992;
	background: url(../images/button.png) no-repeat left top;
	color: #313131;
	}

select,
textarea,
input {
	font-family: "Open Sans";
	}
input[type="password"] {
	font-family: Arial;
	}

textarea,
input {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	}

input[type="submit"] {
	overflow: visible;
	cursor: pointer;
	}

/* Header */
#header {
	height: 116px;
	margin-bottom: 21px;
	background: url(../images/header-bg.png) repeat-x left top;
	}
	#header .layout {
		height: 116px;
		position: relative;
		}
		#header .logo a {
			float: left;
			margin: 17px 0 0 16px;
			height: 39px;
			width: 181px;
			background: url(../images/logo.png) no-repeat left top;
			}

		#header .login {
			margin-top: 12px;
			float: right;
			font-size: 10px;
			}
			#header .login .top {
				text-align: right;
				padding: 0 70px 1px 0;
				}
				#header .login a {
					color: #fff;
					}
			#header .login input {
				float: left;
				margin-left: 9px;
				width: 123px;
				text-indent: 8px;
				line-height: 25px;
				height: 24px;
				background: url(../images/form-login-fields.png) no-repeat left top;
				}
			#header .login input.password {
				background-position: left -24px;
				}
			#header .login .button {
				margin-top: 1px;
				width: 58px;
				height: 23px;
				line-height: 23px;
				font-size: 12px;
				text-align: center;
				text-indent: 0;
				text-shadow: 0 -1px 1px #1d3344;
				color: #fff;
				background: url(../images/button-login.png) no-repeat left top;
				}

		#header .nav {
			position: absolute;
			bottom: 8px;
			left: 17px;
			line-height: 38px;
			font-size: 16px;
			}
			#header .nav a {
				float: left;
				margin-right: 36px;
				font-family: Kreon;
				color: #0079c2
				}
			#header .nav a.active {
				text-decoration: none;
				color: #323232;
				}

		#header .social-share {
			position: absolute;
			bottom: 17px;
			right: 0;
			}
			#header .social-share .item {
				float: left;
				margin-left: 24px;
				}

/* Content */
#promo .details {
	float: left;
	margin: 0 0 39px -20px;
	padding: 23px 50px 0 280px;
	width: 432px;
	height: 296px;
	background: url(../images/promo-bg.png) no-repeat left top;
	}
	#promo .details .header-1 {
		margin-bottom: 14px;
		color: #fff;
		text-shadow: 0 1px 1px #1c6ea9;
		}
		#promo .details .header-1 strong {
			color: #ffe401;
			}
	#promo .details p {
		margin: 10px 0;
		line-height: 18px;
		font-size: 13px;
		color: #fff;
		}
	#promo .details a {
		color: #ffe401;
		}

#sidebar {
	float: right;
	margin: 19px 0 50px;
	width: 207px;
	}
	#sidebar .list {
		margin: 7px 0 17px;
		}
		#sidebar .list li {
			padding: 6px 0 6px 15px;
			background: url(../images/ico/bullet.png) no-repeat left center;
			}

	#sidebar .button {
		margin-bottom: 18px;
		font-family: Kreon;
		}

	#sidebar .support {
		padding-left: 23px;
		line-height: 16px;
		background: url(../images/ico/support.png) no-repeat left top;
		}

#products {
	overflow: hidden;
	margin-top: 39px;
	margin-bottom: 43px;
	}
	#products .col {
		float: left;
		width: 230px;
		margin-left: 10px;
		}
	#products .col:first-child {
		margin-left: 0;
		}
		#products .col .container {
			position: relative;
			}
			#products .col .container .label {
				position: absolute;
				left: 136px;
				bottom: 16px;
				line-height: 18px;
				font-family: Kreon;
				font-size: 16px;
				text-shadow: 0 1px 1px #ffeebf;
				}
				#products .col .container .label .percent {
					font-size: 24px;
					line-height: 27px;
					}
			#products .col .container img {
				display: block;
				}
		#products .col .header-2 {
			margin: 24px 10px 8px 34px;
			}
		#products .col p {
			margin: 0 10px 0 34px;
			}

#other {
	overflow: hidden;
	}
	#other .col {
		position: relative;
		float: left;
		padding: 0 20px 0 22px;
		width: 432px;
		height: 188px;
		background: url(../images/other-col-bg.png) no-repeat left top;
		}

	#other .col.subaffiliates {
		position: relative;
		margin: 0 10px 0 0;
		padding-left: 263px;
		width: 190px;
		}
		#other .col.subaffiliates img {
			position: absolute;
			top: 8px;
			left: 3px;
			}
		#other .col .header-2 {
			margin-top: 14px;
			margin-bottom: 12px;
			}
		#other .col .list {
			line-height: 25px;
			}
			#other .col .list li {
				padding-left: 14px;
				background: url(../images/ico/bullet2.png) no-repeat left center;
				}


	#other .col.blog {
		background-image: url(../images/other-col-bg2.png);
		}
		#other .col .top-wp {
			position: absolute;
			top: 2px;
			right: -1px;
			height: 56px;
			width: 54px;
			background: url(../images/top-wp.png) no-repeat left top;
			}
		#other .col.blog .author {
			margin: 3px 0 8px;
			font-size: 10px;
			color: #999;
			}
		#other .col.blog p {
			line-height: 18px;
			}

#article {
	float: left;
	margin-left: 44px;
	margin-bottom: 70px;
	width: 669px;
	}
#article.support {
	width: 510px;
	}
	#article .header-1 {
		margin: 9px 0 17px;
		}
	#article .header-2 {
		margin-top: 9px 0 17px;
		}
	#article .header-3 {
		margin-top: 22px;
		}

	#article p {
		line-height: 20px;
		font-size: 14px;
		margin: 17px 0;
		}
	#article p.s {
		font-size: 13px;
		}
	#article p.hint {
		font-size: 13px;
		color: #808080;
		}

	#article .spacer {
		margin: 20px 0 20px -37px;
		width: 710px;
		border-top: 1px solid #d3d3d3;
		}

	#article .list {
		margin-top: 13px;
		padding-left: 7px;
		}
		#article .list li {
			padding: 7px 0 7px 13px;
			background: url(../images/ico/bullet2.png) no-repeat left 11px;
			}

	#article .block {
		margin-top: 10px;
		padding: 10px 20px 10px 9px;
		background: #fff;
		border: 1px solid #e3dfda;
		}
	#article table {
		margin-left: -37px;
		width: 710px;
		}
		#article table th {
			font-weight: bold;
			}
		#article table th,
		#article table td {
			padding: 12px 0;
			border-top: 1px solid #d3d3d3;
			}
		#article table thead th {
			padding-top: 11px;
			padding-bottom: 7px;
			border-top: 1px solid #d3d3d3;
			border-bottom: 3px double #d3d3d3;
			}
		#article table tr th:first-child,
		#article table tr td:first-child {
			padding-left: 38px;
			}
		#article table .p {
			padding-left: 21px;
			}

	#article form {
		margin-top: 28px;
		margin-bottom: 35px;
		width: 680px;
		}
		#article form .spacer {
			margin-top: 6px;
			margin-bottom: 12px;
			}
		#article form .spacer.double {
			margin-top: 40px;
			margin-bottom: 27px;
			}
		#article form fieldset {
			overflow: hidden;
			margin: 8px 0;
			}
			#article form fieldset .hint {
				margin: 5px 0 0 508px;
				font-size: 11px;
				color: #808080;
				}
			#article form fieldset label {
				float: left;
				padding-top: 12px;
				width: 120px;
				line-height: 20px;
				font-size: 14px;
				}
			#article form fieldset .field {
				float: left;
				padding-right: 7px;
				height: 42px;
				width: 375px;
				background: url(../images/form-fields.png) no-repeat right -42px;
				}
				#article form fieldset .field.select .option-title,
				#article form fieldset .field input {
					float: left;
					padding: 0 0 0 10px;
					height: 42px;
					line-height: 42px;
					width: 365px;
					background: url(../images/form-fields.png) no-repeat left 0;
					color: #000;
					}
			#article form fieldset .field.select {
				position: relative;
				float: left;
				padding-right: 7px;
				padding-right: 28px;
				height: 42px;
				width: 351px;
				background: url(../images/form-fields.png) no-repeat right -168px;
				}
				#article form fieldset .field.select .option-title {
					width: 341px;
					}
				#article form fieldset .field.select select {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 42px;
					opacity: 0;
					}

		#article form fieldset.captcha {
			margin: 20px 0 19px;
			}
			#article form fieldset.captcha label {
				padding-top: 0;
				}
			#article form fieldset .field.half {
				width: 157px;
				}
				#article form fieldset .field.half input {
					width: 147px;
					}
				#article form fieldset .field.half .code {
					float: left;
					}
			#article form fieldset.captcha img {
				margin: 9px 0 0 7px;
				}

			#article form fieldset .field.textarea {
				height: 182px;
				background: url(../images/form-fields.png) no-repeat right -392px;
				}
				#article form fieldset .field.textarea textarea {
					padding: 10px;
					width: 355px;
					height: 162px;
					background: url(../images/form-fields.png) no-repeat left -210px;
					}
			#article form fieldset .field.error {background-position: right -126px}
			#article form fieldset .field.error input {background-position: left -84px}
			#article form fieldset .field.textarea.error {background-position: right -756px}
			#article form fieldset .field.textarea.error textarea {background-position: left -574px}

		#article form .terms {
			margin-bottom: 24px;
			}
			#article form .terms label {
				float: none;
				}

		#article form .actions {
			overflow: hidden;
			margin-top: 12px;
			}
		#article form.contact .actions {
			padding-left: 123px;
			}
		#article form.sign-up .actions {
			margin-top: 35px;
			}
			#overlay .modal .button,
			#article form .actions .button {
				float: left;
				padding: 0 4px 0 0;
				width: auto;
				height: 36px;
				background: url(../images/form-button.png) no-repeat right -36px;
				}
				#overlay .modal .button span,
				#article form .actions .button input {
					float: left;
					overflow: visible;
					padding: 0 21px 0 25px;
					height: 36px;
					line-height: 36px;
					font-size: 14px;
					background: url(../images/form-button.png) no-repeat left top;
					}

		#article form.sign-up .header-2 {
			margin-top: 45px;
			}

/* Footer */
#footer {
	clear: both;
	overflow: hidden;
	margin-top: 40px;
	padding: 21px 0 116px;
	background: #24394b url(../images/footer-bg.png) repeat-x left top;
	}
	#footer .l,
	#footer .m,
	#footer .r {
		float: left;
		padding-top: 5px;
		padding-bottom: 7px;
		width: 195px;
		}
	#footer .l {
		padding-left: 5px;
		}
		#footer .l .list {
			width: 161px;
			}

	#footer .m,
	#footer .r {
		background: url(../images/footer-col-spacer.png) repeat-y left top;
		}
	#footer .m {
		overflow: hidden;
		padding-left: 45px;
		width: 473px;
		}
	#footer .r {
		padding: 39px 0 73px 36px;
		width: 200px;
		}

	#footer .header-4 {
		color: #fff;
		}
	#footer .list {
		float: left;
		margin-left: -5px;
		margin-top: 13px;
		}
		#footer .list li:first-child {
			border-top: none;
			}
		#footer .list li {
			padding-left: 5px;
			height: 36px;
			line-height: 35px;
			border-top: 1px solid #3d4d5b;
			color: #71d2ff;
			}
			#footer .list li a {
				color: #71d2ff;
				}
	#footer .list.l1 {
		width: 156px;
		}
	#footer .list.l2 {
		width: 130px;
		}
	#footer .list.l3 {
		width: 118px;
		}

	#footer .info {
		line-height: 12px;
		font-size: 10px;
		color: #cbcbcb;
		}
	#footer .button {
		margin-bottom: 20px;
		width: 174px;
		font-family: Kreon;
		background-image: url(../images/button2.png);
		color: #313131;
		}
#overlay {
	position: fixed;
	top: 0;
	left: 0;
	display: none;
	width: 100%;
	height: 100%;
	background: url(../images/overlay-bg.png) repeat left top;
	}
#overlay.opened {
	display: table;
	}
	#overlay .wrap {
		display: table-cell;
		width: 100%;
		height: 100%;
		vertical-align: middle;
		}
		#overlay .modal {
			vertical-align: middle;
			position: relative;
			margin: 0 auto;
			padding: 0 16px 18px 16px;
			display: none;
			width: 630px;
			background: #fff;
			border: 1px solid #c4c4c4;
			}
		#overlay .modal.opened {
			display: block;
			}
			#overlay .modal .close {
				text-decoration: none;
				border-bottom: 1px dashed #0088bf;
				}
			#overlay .modal .close:hover {
				border-bottom: none;
				}
			#overlay .modal .header {
				margin-left: -16px;
				padding-right: 32px;
				width: 100%;
				height: 28px;
				background: url(../images/modal-header-bg.png) repeat-x left top;
				}
				#overlay .modal .header .logo {
					margin-left: 5px;
					height: 28px;
					width: 91px;
					background: url(../images/logo-s.png) no-repeat left center;
					}
				#overlay .modal .header .close {
					position: absolute;
					top: 46px;
					right: 31px;
					padding-top: 20px;
					background: url(../images/ico/close.png) no-repeat center top;
					}

			#overlay .modal .header-1 {
				padding: 21px 55px 15px 15px;
				}

			#overlay .modal .block {
				overflow: auto;
				height: 372px;
				border: 1px solid #e0e0e0;
				}
				#overlay .modal .block .text {
					margin: 0 15px;
					}
					#overlay .modal .block .text ol,
					#overlay .modal .block .text ul,
					#overlay .modal .block .text p {
						margin: 15px 0;
						}
					#overlay .modal .block .text li {
						margin: 8px 0;
						}

			#overlay .modal .actions {
				overflow: hidden;
				margin: 14px 0 0 15px;
				line-height: 36px;
				}
				#overlay .modal .actions .close {
					margin-left: 20px;
					}