$iecap-img-folder: 'icons';
$iecap-browser-list: explorer, chrome, firefox, safari;

/**
 *	IE cap
 */

.iecap {

	display: block;
	width: 600px;
	height: 270px;
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 50;
	margin: -150px 0 0 -300px;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;

	&:after {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: -1;
		background-color: #fff;
		content: '';
	}

	&-title {
		font-size: 2.2em;
		line-height: 2em;
		font-weight: 400;
	}

	&-description {
		margin-top: 2em;
		font-size: 1em;
		line-height: 1.3em;
	}

	&-list {

		width: 560px;
		margin: 3em auto 0 auto;
		list-style: none;

		&:after {
			display: block;
			height: 0;
			clear: both;
			visibility: hidden;
			content: '';
		}

		a {

			display: block;
			font-size: 0.9em;
			text-decoration: underline;

			&:hover {
				text-decoration: none;
			}

		}

		li {
			display: block;
			width: 140px;
			height: 20px;
			float: left;
			padding-top: 5em;
			line-height: 20px;
			background-position: 50% 0;
			background-repeat: no-repeat;
		}

		@each $item in $iecap-browser-list {

			.#{$item} { background-image: url(#{$iecap-img-folder}/#{$item}.png); }

		}

	}

}