﻿/* back to top  */
.fsBody .fsForm {margin-top:-30px; width:100%; max-width:1300px!important;} 

.button-container input {
display: inline;
vertical-align: middle;
margin: 0px 5px 10px 0px;
}

.button-container form, .button-container form div {
display: inline;
}

.button {
	text-align: center;
    text-transform: uppercase;
    background-color: #ed1b2e;
    font-size: 1.75rem;
    font-weight: 800;
    letter-spacing: 2px;
    color: white;
    display: table;
    margin: 0 auto;
    border-radius: 50px;
    box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.5);
}

blockquote {
	display:block;
	margin:30px;
	border-left:10px solid #9A9A9A;
	padding:10px 20px;
	font-style:italic;
	color:#6E6E6E;
	font-size:22px;
	line-height:1.25;
	background-color:rgba(0,0,0,0.05)
}

.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
max-width:800px;
margin-left:auto;
margin-right:auto;
}

.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


.img {
border: 1px solid #ccc;
padding: 5px;
margin: 5px;
margin-bottom: 5px;
margin-bottom: 20px;
background: #f2f2f2;
-webkit-box-shadow: 0 28px 16px -26px rgba(0, 0, 0);
-moz-box-shadow: 0 28px 16px -26px rgba(0, 0, 0);
box-shadow: 0 28px 16px -26px rgba(0, 0, 0);
 }
 
.colBackground {
background-color:rgba(0,0,0,0.05);
padding:20px 10px!important;
}

.colBackground ol {
margin-left:30px;
list-style-type:lower-alpha;
color:rgba(0,0,0,0.70);
padding:5px;
}

.colBackground ul {
margin-left:30px;
}

.colBackground ul li {
padding:5px;
color:rgba(0,0,0,0.80);
display: list-item;
list-style-type: square;
}

.colBackground p{
margin:10px 5px;
}

.colBackground img {
border: 1px solid #ccc;
padding: 5px;
margin: 5px;
margin-bottom: 5px;
margin-bottom: 20px;
background: #f2f2f2;
-webkit-box-shadow: 0 28px 16px -26px rgba(0, 0, 0);
-moz-box-shadow: 0 28px 16px -26px rgba(0, 0, 0);
box-shadow: 0 28px 16px -26px rgba(0, 0, 0);
}

.colBackground a:link    {color:#9a3b01; text-decoration:none; font-weight:bold;}
.colBackground a:visited {color:#9a3b01; text-decoration:none; font-weight:bold;}
.colBackground a:active  {color:#9a3b01; text-decoration:none; font-weight:bold;}
.colBackground a:hover   {color:#c17400; text-decoration:none; font-weight:bold;}


a:link.readmore    {color:#FE4201; text-decoration:none; font-weight:bold;}
a:visited.readmore  {color:#FE4201; text-decoration:none; font-weight:bold;}
a:active.readmore   {color:#FE4201; text-decoration:none; font-weight:bold;}
a:hover.readmore    {color:#CC9999; text-decoration:none; font-weight:bold;}


hr {
border:1px solid rgba(0,0,0,0.20);
margin:20px auto!important;
}   

.mainContent{
display:block;
margin:auto;
width:100%;
max-width:1450px;
padding:20px 10px;
}

.mainContent a:link    {color:#9a3b01; text-decoration:none; font-weight:bold; }
.mainContent a:visited {color:#9a3b01; text-decoration:none; font-weight:bold; }
.mainContent a:active  {color:#9a3b01; text-decoration:none; font-weight:bold; }
.mainContent a:hover   {color:#c17400; text-decoration:none; font-weight:bold; }

/* Back to Top  */

#return-to-top {
position: fixed;
bottom: 20px;
right: 20px;
background: rgb(0, 0, 0);
background: rgba(255,0,0, 0.99);
width: 50px;
height: 50px;
display: block;
text-decoration: none;
text-align:center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
display: none;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}

#return-to-top i {
color: #fff;
margin: 0;
position: relative;
left: 0px;
top: 20px;
font-size: 30px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
#return-to-top:hover {
background: rgba(0, 0, 0, 0.9);
}
#return-to-top:hover i {
color: #fff;
top: 5px;
}


/* end back to top  */

/*==============================================*/
/*1: GLOBAL STYLES*/
/*==============================================*/

* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

body {
font-size: 1rem;
font-family: "Nunito", sans-serif;
}

.gridContainer {
margin-left: auto;
margin-right: auto;
width: 100%;
padding-left: 0.0%;
padding-right: 0.0%;
clear: none;
float: none;
}

.gridContainer {
box-sizing: border-box;
}

.masthead {
width: 100%;
background-image: url(../images/navbar-background.jpg);
background-repeat: no-repeat;
background-color: #00457c;
}
 
/*new - started with desktop, confirm if mobile works*/ 
.masthead {
background-size: contain;
background-size: cover;
background-position: bottom;
}
 

.mast-container {
width: 100%;
}

/*navigation - global
changes can be made in the separate media queries
*/
				
nav ul li a {
text-decoration: none;
color: white;
font-weight: 700;
font-size: 1.5rem;
display: block;
font-family: "Nunito", sans-serif;
text-shadow: 2px 2px 5px rgba(0,0,0,0.25);
}

/*submenu bg on desktop, regular menu bg on mobile*/
.nav-wrapper ul.sub-menu, #toggleNav nav ul {
background-color: #ed1b2e;
}

.nav-wrapper ul.sub-menu a, #toggleNav nav ul a {}

/*submenu hover bg on desktop, regular submenu on mobile*/
.sub-menu a:hover, #toggleNav nav ul.sub-menu {
background-color: #00457c;
}

/*submenu hover link on desktop*/
.sub-menu a:hover{
color: white;
text-shadow: 2px 2px 5px rgba(0,0,0,0.25);
}

/*regular submenu link on mobile*/
#toggleNav nav ul.sub-menu a {
color: white;
font-weight: normal;
text-shadow: 2px 2px 5px rgba(0,0,0,0.25);
}

/*generic links*/

a {
color:#00457c;
}

a:hover {
color:black;
}

/*active mobile link-overrides a above*/
#mobileMenu a:hover {
color: white;
}

/*page content*/

h1, h2, h3, h4 {
font-family: "Nunito", sans-serif;
font-weight: normal;
}

p {
font-size: 1rem;
font-weight: normal;
line-height: 145%;
color: black;
}

a {
text-decoration: none;
}

ul li a {
text-decoration: none;
}

.page ul {
 margin-left:30px;
 margin-bottom:15px;
}

.page ol {
 margin-left:30px;
 margin-bottom:15px;
}

.page li{
 padding:5px;
}

footer {
width: 100%;
background-image: url(../images/footer-bg.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: bottom;
}


/*==============================================*/
/*2: MOBILE STYLES*/
/*==============================================*/

@media only screen and (min-width: 275px) { 
   
.container {
width: 90%;
margin: 0 auto;
padding: 1rem;
}	 
	
.top-half {
width: 100%;
position: relative;
}	
	
.hero {
width: 100%;
}

.hero img {
width: 100%;
}

/*this cannot be renamed.*/
.image-container {
overflow: hidden;
width: 100%;
}

#slideshowContainer {}

/*responsiveslides css file has this at 1500px*/

.rslides img {
min-width: 100%;
}

.main-content {
margin: 0 auto;
}

.container {
margin-bottom: 0.5rem;
}	

h1, h2, h3, h4, p{
margin-bottom: 0.5rem;
}

h1 {
font-size: 2rem;
}

h2 {
font-size: 1.5rem;
}

p {
/*if font is too big:*/
/*font-size: 0.9rem;*/
line-height: 160%;
}

/*=intro:*/

.intro {
margin: 0 auto;
margin-top: 0;
/*text-align: center;*/
}

.intro .container {
width: 90%;
padding: 0;
padding-top: 1rem;
padding-bottom: 1rem;
margin: 0 auto;
}

.intro-header {
width: 100%;
background-color: #ed1b2e;
}

.intro-header .container {
padding-left: 0;
padding-right: 0;
}

.intro-header p {
color: white;
font-weight: 700;
text-shadow: 2px 2px 5px rgba(0,0,0,0.5);
line-height: 170%;
}

.intro-text {
background-color: #00457c;
padding-top: 1.5rem;
padding-bottom: 3rem;
background-image: url(../images/logo-bg.png);

/*smaller version:*/
/*background-size: contain;*/
}

.intro-text .container {
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}

.intro-text p {
color: white;
font-size: 18px!important;
line-height: 150%;
font-weight: 700;
text-shadow: 2px 2px 5px rgba(0,0,0,0.5);
}

p.intro-thanks  {
font-size: 1.5rem;
}

p.intro-name   {
font-style: italic;
}
 
/*call to action*/	
	
.call-to-action {
width: 100%;
}	
	
.call-to-action .container {
margin-top: -3.25rem;
margin-bottom: 1rem;
}

.call-to-action a {
padding: 1.25rem;
text-align: center;
text-transform: uppercase;
background-color: #ed1b2e;
font-size: 1.75rem;
font-weight: 800;
letter-spacing: 2px;
color: white;
display: table;
margin: 0 auto;
border-radius: 50px;
box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.5);
}
 	
/*wrapper*/  
/*main stories*/  
  
.main-stories {
display: flex;
flex-direction: column;
}  
  
.prevention-month {
order: 1;
}  

.what-is-a-casa {
order: 2;
}  

/*National Child Abuse Prevention Month*/  
 
.prevention-month {
background-color: #e4ecf5;
}

.prevention-header.container{
padding-bottom: 0;
}

.prevention-month h1 {
color:  #00457c;
font-weight: 700;
font-size: 1.8rem;
}

.prevention-text.container {
padding-top: 0;
}
  
.inset-photo {
margin-top: 1rem;
margin-bottom: 0.5rem;
}  

.prevention-text span {
color: #ed1b2e;
font-weight: 700;
}

.prevention-text p {
font-size: 18px;
}

.prevention-text li {
font-size: 18px;
padding:2px;
}

a.text-link {
font-weight: 700;
text-decoration: underline;
color: #00457c;
}


a.text-link:hover{
font-weight: 700;
text-decoration: underline;
color: black;
}
  
/*What is a Casa?*/

.casa-video.container{
padding: 0;
}

.casa-header.container{
padding-bottom: 0;
}

.casa-header h1 {
color: #ed1b2e;
font-weight: 700;
font-size: 1.8rem;
}

.casa-text h3 {
font-weight: bold;
font-size: 1.25rem;
}

.casa-text.container {
padding-top: 0;
}
  
/*=footer*/ 	
 
footer {
/*removes gap at bottom*/
position: absolute;
padding-top: 0.5rem;
background-color: #00457c;
border-top: 5px solid #ed1b2e;
padding-top: 1.5rem;
padding-bottom: 0;
background-image: url(../images/logo-bg.png);
background-position: top;
} 	
	
footer .container {
display: block;
text-align: center;
margin-bottom: 0;
padding-top: 0;
}	

.footer-col-wrap {}

.footer-col{
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}

p.footer-title  {
font-size: 1.35rem;
}

p.footer-name {}

p.footer-address span {
color: #ed1b2e;
}

footer p {
color: white;
font-size: 1.15rem;
font-weight: 600;
margin-bottom: 0.5rem;
text-shadow: 2px 2px 5px rgba(0,0,0,0.5);
}

p.footer-phone {
font-size: 1.75rem;
font-weight: 700;
margin-bottom: 0.5rem;
margin-top: 1rem;
}

p.footer-mail {
margin-bottom: 1.5rem;
}

p.footer-mail a {
color: white;
text-decoration: underline;
font-size: 1.5rem;
}

footer p.footer-mail a:hover {
color: #a8f1f0;
}
 
p.footer-login a {
padding: 0.75rem;
padding-left: 1rem;
padding-right: 1rem;
text-align: center;
text-transform: uppercase;
background-color: #ed1b2e;
font-weight: 800;
letter-spacing: 2px;
color: white;
display: table;
margin: 0 auto;
margin-top: 1rem;
margin-bottom: 1rem;
border-radius: 50px;
text-shadow: none;
box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.5);
} 
 
p.copyr {
font-weight: normal;
font-size: 0.8rem;
line-height: 170%;
padding-top: 0.5rem;
text-transform: uppercase;
}

p.copyr a {
color: white;
}

p.copyr a:hover {
color: #a8f1f0;
}

/*secondary pages:*/

/*replaces the main-content class for secondary pages*/
.page {
margin-top: 1rem;
margin-bottom: 1rem;
}

.page .container {
width: 90%;
margin: 0 auto;
} 	

.top-half img {
width: 100%;
}

.page h1 {
font-size: 1.75rem;
color: #ed1b2e;
font-weight: 700;
}

.page .container h1 {
margin-bottom: 2rem;
}

.page h2 {
font-size: 1.5rem;
margin-bottom: 0.5rem;
color: #00457c;
font-weight: 700;
}

.page h3 {
font-size: 1.25rem;
color: black;
font-weight: 700;
margin-bottom:20px;
}

.page p {
/*margin-bottom: 1rem;*/
}


/*don't touch*/
}
/*don't touch*/

 
/*==============================================*/
/*3: =TABLET AND ADDITIONAL MOBILE STYLES*/
/*==============================================*/

/*phone landscape*/

@media only screen 
and (min-device-width: 320px) 
and (max-device-width: 1112px) 
and (orientation: landscape){ 

 
/*don't touch*/
}
/*don't touch*/



/*-------------------------------------*/
/*tablet general*/

@media only screen and (min-device-width : 768px) 
	and (max-device-width : 1024px) { 

.intro-header p {
font-size: 3vw;  
font-weight: 500!important;
}

.intro-text p {
font-size: 20px!important;
font-weight: 500!important;
}

.main-stories p {
font-size: 18px!important;
font-weight: 500!important;
line-height: 125%!important;
}

.main-stories-wrap {
display: flex!important;
flex-direction: column!important;
}

.what-is-a-casa {
display: flex!important;
flex-direction: column!important;
order: 2!important;
}  

.prevention-month {
display: flex!important;
flex-direction: column!important;
order: 1!important;
}
.prevention-month img{
display:block!important;
margin:0px auto!important;
width:100%!important;
}  
 
.prevention-header.container {
padding-top: 2rem!important;
} 
 
.inset-photo {
display: table!important;
margin: 0 auto!important;
margin-top: 1rem!important;
margin-bottom: 1rem!important;
} 

.every-child {
display: table!important;
margin: 0 auto!important;
margin-top: 1rem!important;
margin-bottom: 1rem!important;
} 

p.footer-phone {
font-size: 2.5rem!important;
}

/*don't touch*/
}
/*don't touch*/


/*-------------------------------------*/
/*tablet landscape only*/

@media only screen 
	and (min-device-width: 768px) 
	and (max-device-width: 1024px) 
	and (orientation: landscape) {


.intro-text .container {
padding-left: 1.5rem!important;
padding-right: 1.5rem!important;
}

.intro-text p {
font-size: 20px!important;
line-height: 170%!important;
}

.main-stories-wrap {
display: flex!important;
flex-direction: row!important;
}

.main-stories p {
font-size: 18px!important;
line-height: 125%!important;
}

.what-is-a-casa {
order: 2!important;
}  

.prevention-month {
order: 1!important;
}  

/*don't touch*/
}
/*don't touch*/

 

/*==============================================*/
/*4: =DESKTOP STYLES*/
/*==============================================*/

@media only screen and (min-width: 900px) { 

 
		/*turn these styles on for a fixed width site:*/
/*
		.gridContainer, footer  {
		max-width: 1600px;
		border: 1px solid black;
		}
*/
		
.container {
width: 100%;
}  
  
.top-half {}

.hero {
max-height: 850px;
overflow: hidden;
}
 
.hero img {
vertical-align: top;
} 

/*keep main main-content centered on page*/
.main-content {
margin: 0 auto;
}	 

h1 {
font-size: 4rem;
}

h2 {
font-size: 3rem;
}

p {
margin-bottom: 0.5rem;
/*font-size: 1rem;*/
font-weight: normal;
} 
		
.top-half {}

.hero {}

.image-container{}

 
/*intro-desktop*/

.intro {}

.intro .container {
width: 100%;
padding: 2rem;
padding-left: 1rem;
padding-right: 1rem;
max-width: 1500px;
margin: 0 auto;
}

.intro-header .container{
padding-top: 1rem;
padding-bottom: 1rem;
}

.intro-header p{
font-size: 3vw;  
font-weight: 500;
text-shadow: 2px 2px 5px rgba(0,0,0,0.3);  
line-height: 140%;  
}
   
.intro-header p span {
font-weight: 700;
}

.intro-text {
display: flex;
background-size: contain;
background-repeat: no-repeat;
background-position: bottom center;
padding-bottom: 2rem;
}

.intro-text .container {
padding-left: 3rem;
padding-right: 3rem;
padding-bottom: 2rem;
padding-top: 0;
}

.intro-text p {
font-weight: 300;
text-align: left;
font-size: 20px!important;
text-shadow: 2px 2px 5px rgba(0,0,0,0.5); 
line-height: 160%;
margin-bottom: 1rem;
}
 
p.intro-thanks {
font-size: 1.35vw; 
font-weight: 700;
}


/*call to action-desktop*/

.call-to-action {
margin-bottom: 2rem;
}

.call-to-action .container {
max-width: 1500px;
margin: 0 auto;
padding: 3rem;
padding-bottom: 1rem;
margin-top: -6rem;
}

.call-to-action a {
font-size: 2.5vw;
height: auto;
box-sizing: border-box;
padding: 1.5rem;
letter-spacing: 4px;
}

.call-to-action a:hover {
background-color: black;
color: #ed1b2e;
}

/*main stories-desktop*/  

.main-stories {}  

.main-stories-wrap{
display: flex;
flex-direction: row;
max-width: 1500px;
margin: 0 auto;
padding-bottom: 2rem;
}
  
.main-stories .container{
padding-left: 2rem;
padding-right: 2rem;
}  

.main-stories p {
font-size: 18px!important;
line-height: 125%!important;
font-weight: 400;
margin-bottom: 1rem;
}
  
.prevention-month {
order: 1;
width: 50%;
margin: 0 auto;
}  

.prevention-header.container {
padding-top: 2rem;
}

.prevention-header h1 {
font-size: 2.2vw;
font-weight: 700;
}

.what-is-a-casa {
order: 2;
width: 50%;
margin: 0 auto;
}  

.casa-video.container {
padding-right: 0;
}

.what-is-a-casa .container {
padding-right: 0.5rem;
}

.casa-header.container {
padding-top: 2rem;
}

.casa-header h1 {
font-size: 2.2vw;
font-weight: 700;
}

.casa-text h3 {
font-size: 1.25rem;
font-weight: bold;
}

.casa-text p {
font-size: 18px;
}

.casa-text li {
font-size: 18px;
padding:2px;
}

.inset-photo {
display: inline-block;
margin-top: 0;
margin-bottom: 0;
width: 50%;
max-width: 350px;
}

.prevention-month .inset-photo {
float: left;
margin-right: 1rem;
margin-left: -0.5rem;
}

.what-is-a-casa .inset-photo{
float: right;
margin-left: 1rem;
margin-right: -0.5rem;
}

.every-child {
display: table;
margin: 0 auto;
margin-top: 2rem;
}


/*footer-desktop*/

footer {
position: relative;
margin-bottom: 0;
bottom: 0;
padding-top: 0.5rem;
}
 
footer .container {
padding-top: 1rem;
padding-bottom: 1rem;
}

footer p {
font-size: 1.5rem;
letter-spacing: 1px;
text-shadow: 2px 2px 5px rgba(0,0,0,0.3);
}

p.footer-title {
font-size: 2rem;
}

p.footer-name {
font-size: 1.5rem;
font-weight: 300;
}

p.footer-address {
font-size: 1.75rem;
font-weight: 300;
} 

p.footer-phone {
font-size: 3rem;
margin-top: 0;
}

p.footer-mail a {
font-size: 2rem;
font-weight: normal;
}

p.footer-login a{
padding-left: 1.5rem;
padding-right: 1.5rem;
font-weight: 700;
}

p.footer-login a:hover {
background-color: black;
color: #ed1b2e;
}

p.copyr, a.sm {
padding-top: 1rem;
font-size: 0.9rem;
letter-spacing: 1px;
}

/*secondary pages:*/

/*keep main main-content centered on page*/

.main-content.page {
max-width: 1500px;
margin: 0 auto;
margin-top: 2rem;
margin-bottom: 3rem;
}	 		

.page h1 {
margin-bottom: 0.5rem;
font-size: 2.5rem;
}

.page h2 {
font-size: 2rem;
margin-bottom: 0.5rem;
}

.page h3{
font-size: 1.5rem;
}

.page p {
font-size: 1rem;
}

/*don't touch*/	
}
/*don't touch*/


/*-------ADDITIONAL DESKTOP STYLES---------*/ 
 
 /*....*/


/* -----------------------------------
Form - narrow
----------------------------------- */

.row-form {
	clear: left;
	overflow: hidden;
	zoom: 1;
	margin: 0 0 1em;
}

.label {
	display: block;
	margin: 0 0 .1em;
}

.input, .select, .textarea {
	width: 100%;
 /**width: 90%;*/
	box-sizing: border-box;
	border: 1px solid #999;
	border-radius: .3em;
}

.input, .textarea {
	padding: 10px;
	font-size:22px;
}

.textarea {
	height: 150px;
}

.radio {
	margin-left: 1px;
	margin-right: .5em;
}

.form-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.btn, .fsSubmitButton, .fsNextButton, .fsPreviousButton{
	font-family:Arial, Helvetica, sans-serif;
	display: inline-block;
	margin: 10px 0;
	padding: .7em 1.2em!important;
	border: 0;
	border-radius: .3em!important;
	color: #fff;
	background-color: #071F3D;
	line-height: 1;
}

.btn:focus, .fsSubmitButton:focus, .fsNextButton:focus, .fsPreviousButton:focus {
	background-color: #000;
}

.btn:hover, .fsSubmitButton:hover, .fsNextButton:hover, .fsPreviousButton:hover {
	background-color: #000;
}

.btn:active, .fsSubmitButton:active, .fsNextButton:active, .fsPreviousButton:active {
	background-color: #002500;
}


/* -----------------------------------
Form - wide
----------------------------------- */

@media (min-width:33em) {

.submission-form {
	max-width: 40em;
}

.label {
	float: left;
	width: 25%;
	margin: 0 2% 0 0;
	text-align: right;
}

.input, .select, .textarea {
	float: left;
	width: 70%;
}

.form-indent {
	margin-left: 27%;
	width: 70%;
}
}

.hp-container {
  display: flex;
  flex-wrap: wrap;
  margin-top:0px;
  margin-bottom:40px;
}

.hp-item {
background-color:#D9E1FF;
  padding: 15px;
  flex: 31%;
  margin:10px 15px;
}

.hp-item img{
	width:90%;
	margin:10px auto 0px;
}

.hp-item h2 {
	font-size:24px;
	font-weight:bold;
	color:#00457c;
	margin-top:20px;
}

.hp-item h3 {
	font-size:22px;
	font-weight:bold;
	margin:20px 0px;
}

.hp-item ol, ul{
	margin-left:25px;
	margin-top:0px;
}

.hp-item li{
	padding:3px;
	line-height:1.25;
}
/* Responsive layout - makes a one column-layout instead of a two-column layout */
@media (max-width: 800px) {
  .hp-item {
    flex: 100%;
  }
}


/*-BLOG STUFF-*/

.blogContainer {
  display: flex;
  flex-wrap: wrap;
  margin-top:0px;
  margin-bottom:40px;
}

.blogItem {
  background-color:#00457C;
  padding: 15px;
  flex: 30%;
  margin:10px 15px;
  color:#ffffff;
}

.blogItem p {
	color:#ffffff;
}

.blogItem img {
width:100%;
	max-height:250px;
	overflow:hidden;
	object-fit: cover;
	top: 0;
    left: 0;
    border:1px solid #ccc;
   padding:5px;
   margin-bottom:10px;
   background:#f2f2f2;
-webkit-box-shadow: 0 28px 16px -26px rgba(0, 0, 0);
-moz-box-shadow: 0 28px 16px -26px rgba(0, 0, 0);
box-shadow: 0 28px 16px -26px rgba(0, 0, 0);
transition: all 0.5s ease;
}

.blogItem h2 {
	font-size:24px;
	font-weight:bold;
	color:#BEC4DD;
	margin-top:20px;
}

.blogItem h3 {
	font-size:22px;
	font-weight:bold;
	color:#BEC4DD;
	margin-top:20px;
}

.blogItem smallfont{
	font-size:11pt;
}
.author {
	color:#D43790;
	font-size:16px;
}
.noImg {
	display:block;
	background-color:rgba(0,0,0,0);
	height:250px;
}


/* Responsive layout - makes a one column-layout instead of a two-column layout */
@media (max-width: 800px) {
  .blogItem {
    flex: 100%;
  }
  .noImg {
	display:none;
}
}
