body {
    /*background-image: linear-gradient(45deg, #567EA2,#231B30);*/
    background-image: linear-gradient(45deg,#164284, #276395);
    color : #fffffff;
    font : 1.2em 'Lato', sans-serif;
    height: 100%;
    margin: 0;
    width: 100%;
}

h1{
    font-size: 3.5em;
	color: rgba(255,255,255, 0.8);
}

p{
    color: white;/*#e8e0dc;*/
    font-size: 1.2em;
    margin-right: 20%;
}

a{
	color:#6FC7EE;
}



.container{
    align-items: center;
    display: flex;
    justify-content: center;
    max-width: 100%;
}

.container div{
    display: flex;
    width: 40%;
    height: 100vh;
}

.container div{
    flex-direction: column;
    justify-content: center;
    text-align: left;
}

div.picture_bg{
    /*background-image: url('oceanbranch.jpg');*/
    background-image: url('rodi2.png');
    background-position: center center;
	repeat: no-repeat;
	

	
    justify-content: flex-end;/**/
}

div.picture_bg p{
    align-self: flex-end;
    opacity: 0.4;
    margin: 0;
    padding: 0 4% 2% 0;
}



.myButton {
	background-color:#27ABE5;
	border-radius:10px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;	
	font : 1em 'Lato', sans-serif;
	
	padding:16px 31px;
	text-decoration:none;
	
	font-weight:500;
	
	letter-spacing: 1px;
	
	transition: background-color 1.5s, letter-spacing 1.5s;
	transition-timing-function: ease;
}
.myButton:hover {
	background-color: rgba(39, 171, 229, 0.5);
	
	letter-spacing: 2px;;
	
}
/*
.myButton:active {
	background-color: rgba(16, 145, 201, 0.3);
	background-color: white;
	color:black;
}*/


@media only screen and (max-width: 600px) {

	.container{
		align-items: center;
		display: flex;
		flex-direction: column;
		justify-content: center;
		max-width: 100%;
	}

	.container div{
		display: flex;
		width: 80%;
		height: 50vh;
	}

	img {
		width:90%;
}
    
}