/* Style fle- CSS */
/*v1.2*/

/*Entire page attributes*/
body{
	background-color: #F0F7FA;
	border-bottom: 5px solid green;
	padding-bottom: 200px;
	max-width: 1000px;
	margin: 0 auto;
	
}
/*Page Title*/
body > h1{
	color: back;
	border-bottom: 3px solid rgba(0,0,10,.2);
}
/*Page Descrition*/
#page_description{

	color: #31ADD6;
}

/* Ubuntu font family*/
.font_ubuntu{
	font-family:'Ubuntu', sans-serif;
}
/*Parent item of the pic_settures 
 Adjust image positioning here*/
#pic_set{
	grid-area: photo;
	justify-self: right;
	align-self: start;
	grid-row: span 2;
	border-right: 4px solid rgba(0,0,0,.5);
	 
	
}
/*Image per Organization
Adjust image sizing here*/
#pic_set > img{
    
	min-width: 130px;
	max-width: 98.5%;
	
	border : 1px solid rgba(0,0,0,.2);
	background-color: white;
	
}
/*description_set of each organizaion*/
#description_set{
	grid-area: info;
	margin-left:40px;
	align-self: center;
	font-size: 1.03em;


}

/*Organization external link*/
#get_connected_button{
	grid-area: button;
	height: 40px;
	width: 260px;
	align-self:end;
	justify-self: center;
	
	font-weight: bold;
	font-size: .91em;
	background-color:black;
	color: white;
	
	
}
#get_connected_button:Hover{
	
	color: black;
	background: rgba(0, 0, 0, 0);

	
}


.container {
	display:grid;
	grid-template-columns: 35% 65% 1fr;
	grid-template-rows:repeat(2, auto);
	margin-bottom: 30px;
	grid-gap: 1px;
	
	grid-template-areas: 
	"photo info"
	"photo button";
	
	box-shadow: 0px 0px 8px ;
	
	
	
}



/*Responsive Styles small screen*/
@media screen and (max-width : 760px){
	
	.container{
		grid-template-columns: 1fr;
		grid-template-rows:repeat(3,auto);
		grid-template-areas: 
			"photo"
			"button"
			"info";
	
		max-width: 95%;
		margin : 30px auto;
	}
	#pic_set{
		grid-row: span 1;
		align-self: center;
		justify-self: center;
		border-right: 0;
	}
	
	#pic_set > img{
    
		min-width:0;
		
		border : 4px solid rgba(0,0,10,.2);
		background-color: white;
		
	}

	}

}