@charset "utf-8";
/* CSS Document */

@import url(https://fonts.googleapis.com/earlyaccess/opensanshebrew.css);
@import url('https://fonts.googleapis.com/css?family=Alef:400,700');

html, body {
	font-family: 'Open Sans Hebrew', 'Alef', sans-serif;
	color: #000;
	background: url(../images/bg.png) no-repeat center top;
}
header .container {
	background: url(../images/logo.png) no-repeat left 30px;
	text-align: center;
	padding-top: 35px;
}
h1 {
	font-size: 55px;
	font-weight: 800;
}
h2 {
	font-size: 30px;
	font-weight: 800;
}
h3 {
	font-size: 20px;
	font-weight: 800;
	text-align: center;
}
.sub-header {
	font-size: 20px;
	font-weight: 700;
}
.colored-box {
	margin: 30px auto;
	min-width: 260px;
	height: 300px;
	background: #7db9e8; /* Old browsers */
	background: -moz-linear-gradient(left,  #7db9e8 0%, #0089c1 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #7db9e8 0%,#0089c1 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #7db9e8 0%,#0089c1 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#0089c1',GradientType=1 ); /* IE6-9 */
	border-radius: 25px;
	box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.45);
	color: #fff;
}
.colored-box-content {
	height: 250px;
	padding: 30px;
	text-align: center;
}
.colored-box-content p:first-child span {
	font-size: 50px;
	font-weight: 700;
}
.colored-box-content p:first-child {
	font-size: 30px;
	font-weight: 700;
	line-height: 30px;
}
.colored-box-content p:last-child {
	font-size: 18px;
	font-weight: 800;
	line-height: 20px;
}
.colored-box-footer {
	background: #6cb707;
	height: 54px;
	line-height: 54px;
	font-size: 24px;
	font-weight: 800;
	text-align: center;
	color: #fff;
	border-radius: 0 0 25px 25px;
	position: relative;
}
.burst {
	background: url(../images/star.png) no-repeat center center;
	position: absolute;
	width: 107px;
	height: 107px;
	margin-right: -60px;
	margin-top: -60px;
	line-height: 100px;
	text-align: center;
	color: #fff;
	font-size: 19px;
	font-weight: 800;
}
.img-centered {
	margin: 0 auto;
}
footer {
	background: #0ab2e3;
	padding: 30px 0 0 0;
	text-align: center;
	margin: 5px 0 0 0;
}
footer img {
	margin: 3px 3px 6px 3px;
}
#paypal {
	background: #fff;
	margin: 5px 0;
	padding: 5px 0;
}
/**** Responsive ****/
@media (max-width: 1199px) {
	h1 {
		font-size: 44px;
	}
	h2 {
		margin-bottom: 15px;
	}
}
@media (max-width: 991px) {
	header .container {
		text-align: right;
	}
	h1 {
		font-size: 36px;
		line-height: 40px;
		margin-top: 10px;
	}
	h2 {
		margin-bottom: 0px;
		margin-top: 60px;
		text-align: center;
	}
	.colored-box {
		max-width: 540px;
		height: 260px;
	}
	.colored-box-content {
		height: 200px;
		padding-top: 60px;
	}
	.colored-box-content p:first-child span {
		font-size: 80px;
	}
	.colored-box-content p:first-child {
		font-size: 46px;
		line-height: 50px;
	}
	.colored-box-content p:last-child {
		font-size: 26px;
		line-height: 26px;
	}
	.colored-box-footer {
		height: 60px;
		line-height: 60px;
		font-size: 32px;
	}
}
@media (min-width: 560px) and (max-width: 767px) {
	header .container {
		background: url(../images/logo.png) no-repeat center 30px;
		text-align: center;
		padding-top: 160px;
	}
	h1 {
		font-size: 40px;
		line-height: 55px;
	}
	h2 {
		padding-bottom: 20px;
		display: block;
	}
	.colored-box {
		max-width: 440px;
		height: 240px;
	}
	.colored-box-content {
		height: 180px;
		padding-top: 40px;
	}
	.colored-box-content p:first-child span {
		font-size: 80px;
	}
	.colored-box-content p:first-child {
		font-size: 46px;
		line-height: 50px;
	}
	.colored-box-content p:last-child {
		font-size: 26px;
		line-height: 26px;
	}
	.colored-box-footer {
		height: 60px;
		line-height: 60px;
		font-size: 32px;
	}
}
@media (max-width: 559px) {
	header .container {
		background: url(../images/logo.png) no-repeat center 30px;
		text-align: center;
		padding-top: 160px;
	}
	h1 {
		font-size: 40px;
		line-height: 55px;
	}
	h2 {
		margin-bottom: 40px;
	}
	.colored-box-content {
		padding-top: 65px;
		height: 204px;
	}
	.colored-box-content p:first-child span {
		font-size: 70px;
	}
	.colored-box-content p:first-child {
		font-size: 32px;
		line-height: 40px;
	}
	.colored-box-content p:last-child {
		font-size: 20px;
		line-height: 22px;
	}
	.colored-box-footer {
		height: 56px;
		line-height: 56px;
		font-size: 28px;
	}
	.colored-box {
		margin: 50px;
	}
	.colored-box-wrapper {
		margin: 15px 0;
		display: block;
	}
}
@media (max-width: 419px) {
	.colored-box {
		margin: 45px 15px;
		height: 216px;
	}
	.colored-box-content {
		padding-top: 52px;
		height: 160px
	}
	.burst {
		margin-right: 0;
		right: calc(50% - 64px);
	}
	.colored-box-content p:first-child span {
		font-size: 60px;
	}
	.colored-box-content p:first-child {
		font-size: 26px;
		line-height: 30px;
	}
	.colored-box-content p:last-child {
		font-size: 18px;
		line-height: 22px;
	}
	.colored-box-footer {
		height: 56px;
		line-height: 56px;
		font-size: 28px;
	}
}


@media (min-width: 992px) {
	.colored-box {
		width: 300px;
		height: 170px;
	}
	.colored-box-content {
		height: 116px;
	}
	
}
