.introBlocks {
    margin-top: 70px !important;
}
.introBlocks span {
    font-size: 60px;
    float: right;
}
.nomarginBlocks {
	margin-top: 0px !important;
}
.introBlocks .block1 span {
	color: #7ca6cc;
}
.introBlocks .block1 h2,
.introBlocks .block1 h3 {
	color: #507aa1;
	font-weight: 300;
}
.introBlocks .block {
    display: flex;
    align-items: center;
}
.introBlocks .block1 .btn-primary {
	background: #7ca6cc;
	color: #fff;
	border-color: #7ca6cc;
}
.introBlocks .block2 span {
	color: #be9071;
}
.introBlocks .block2 h2,
.introBlocks .block2 h3 {
	color: #be9071;
	font-weight: 300;
}
.introBlocks .block2 .btn-primary {
	background: #be9071;
	color: #fff;
	border-color: #be9071;
}
.introBlocks .block3 span {
	color: #78a859;
}
.introBlocks .block3 h2,
.introBlocks .block3 h3 {
	color: #78a859;
	font-weight: 300;
}
.introBlocks .block3 .btn-primary {
	background: #78a859;
	color: #fff;
	border-color: #78a859;
}

.introBlocks .block1 {
	background: #deebf7;
	padding:30px 40px 20px;
	border-radius: 30px;
	margin-bottom: 10px;
}
.introBlocks .block2 {
	background: #fbe5d6;
	padding:30px 40px 20px;
	border-radius: 30px;
	margin-bottom: 10px;
}
.introBlocks .block3 {
	background: #e2f0d9;
	padding:30px 40px 20px;
	border-radius: 30px;
	margin-bottom: 10px;
}
.introBlocks .block4 {
	background: #bfe2e2;
	padding:30px 40px 20px;
	border-radius: 30px;
	margin-bottom: 10px;
}
.introBlocks .block4 h2,
.introBlocks .block4 h3 {
	color: #006666;
	font-weight: 300;
}
.introBlocks .block4 .btn-primary {
	background: #006666;
	color: #fff;
	border-color: #006666;
}
.introBlocks .block4 span {
	color: #006666;
}


/* converted graphic */
.infoBanner {
	background-image: url(/cisiweb2/image/caixa/membresia.jpg);
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: bottom;
	margin-bottom: 30px !important;
}
.boxContainer {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    margin: auto;
    text-align: center;
	grid-column-gap: 80px;
}
.boxContainer div {
	padding: 40px 30px;
	height: auto;
	margin-top: 60px;
	color: white;
}
.b4 {
	grid-column: 1/4;
	grid-row: 2/3;
	font-size: 30px;
	font-weight: 600;
}
.b1, .b2, .b3, .b5, .b6, .b7 {
    border: 1px solid #965555;
	background: rgba(100, 0, 0, 0.7);
	border-radius: 20px;
}
@media(max-width: 768px) {
	.boxContainer {
		grid-template-rows: 1fr;
	}
}


/* converted graphic ends here */
.priceContainer {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 20px;
}
.priceContainer > div {
	background: #006666;
	color: white;
	padding: 20px;
	margin-bottom: 20px;
	text-align: center;
}
.priceContainer div .main {
	font-weight: 600;
}
/* split the grid */
@media (max-width: 768px) {
	.priceContainer {
		grid-template-columns: 1fr;
	}
}
.header {
	background-image:url('/cisiweb2/image/caixa/price.jpg');
	background-size:cover;
	background-position:center center;
	height:600px;
	text-align:center;
}
.headerText {
	height: 600px;
}
.benefits {
    background-image: url("/cisiweb2/image/caixa/benefits.jpg");	
	margin-bottom:80px !important; /* ?? look into having contianer inside container fluid */
	background-attachment:fixed;
	background-position:right 20%;
}
.benefits .sfContentBlock {
	padding:5% 5% 0% 5%;	
}
.greenblock{
background-color:#35a0a0;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
padding:25px 10px;
color:#ffffff !important;
text-align:center;
line-height:16px;
vertical-align:top;
font-weight:normal !important;
display:inline-block;
zoom: 1;
display: inline;
}
.greenblock:hover{
background-color:#62b7b7;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
padding:25px 10px;
color:#ffffff !important;
text-align:center;
line-height:16px;
vertical-align:top;
font-weight:normal !important;
}

@media (max-width : 1199px) {
	.benefits {
		margin-bottom:40px !important; /* ?? look into having contianer inside container fluid */
		background-position-x: 55%;
		background-position-y: 30%;
	}
}

@media (max-width : 991px) {
	.benefits .sfContentBlock {
		padding:5% 5% 0% 20%;	
	}
	.benefits {
		background-position: 75% 30% !important;
	}
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
	.benefits .sfContentBlock {
		padding:5% 5% 0% 40%;	
	}
	.benefits {
		margin-bottom:40px !important; /* ?? look into having contianer inside container fluid */
		background-position-x: 60%;
		background-position-y: 30%;
	}
}

@media (max-width: 767px) {
	.benefits .sfContentBlock {
		padding:2% 5% 0% 2%;	
	}
	.benefits {
		margin-bottom:40px !important; /* ?? look into having contianer inside container fluid */
		background-position-x: 80%;
		background-position-y: 20%;
	}
	
	.csLogos img{
		width:80% !important;	
	}
}