@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200&display=swap');


* {
	box-sizing: border-box;
}

body {
background: #f1f1f1;
font-family: 'Montserrat', sans-serif;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
  min-height: 100vh;
}
.container{
  background-color:#ffffff;
 height: 90vh;
  width: 90vw;
  margin: auto; 
  display: flex;
}
.header{
  background-color: #2e82ff;
  color: #ffffff;
  display: flex;
  flex: 3;
  flex-direction: column;
  justify-content: space-evenly;
  padding: 3%;
}
.header h1{
  position: relative;
}

.header h1::after {
	background-color: #fff;
	content: '';
	position: absolute;
	bottom: -10px;
	left: 0;
	height: 6px;
	width: 42%;
}
.author{
  display: flex;
  align-items: center;
}
.author img{
  border-radius: 50%;

  margin-right: 5%;
  height: 85px;
}
.author p {
  font-size: 16pt;
  color: white;
}

.content{
  background-color: #ffffff;
  flex:4;
  padding: 1% 2% 3% 2%;
  position: relative;
}
.text{
  overflow: auto;
  height: 100%;
  color: #616161;
}
.text h2{
  font-size: 200%;
  font-weight: bold;
}
.info{
  background-color: #ffffff;
  padding:2%;
  position: absolute;
  width: 100%;
  bottom:0;
  left: 0; 
}
.text a {
  color: blue !important
}

a{  
  text-decoration: none;
}

.app-image {
  width: 65%;
  height: 30%;
  margin: auto; 
  margin-top: 10%;
  display: flex;
  border: 3px solid #f1f1f1;
  border-radius: 30px;
  padding: 15px;
}

.g-sign-in-button {
  margin: 5% auto;
  display: flex;
  width: 240px;
  height: 50px;
  background-color: #4285f4;
  color: #fff;
  border-radius: 1px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25);
  transition: background-color .218s, border-color .218s, box-shadow .218s;
}

.g-sign-in-button:hover {
  cursor: pointer;
  -webkit-box-shadow: 0 0 3px 3px rgba(66, 133, 244, 0.3);
  box-shadow: 0 0 3px 3px rgba(66, 133, 244, 0.3);
}

.g-sign-in-button:active {
  background-color: #3367D6;
  transition: background-color 0.2s;
}

.g-sign-in-button .content-wrapper {
  height: 100%;
  width: 100%;
  border: 1px solid transparent;
}

.g-sign-in-button img {
  width: 18px;
  height: 18px;
}

.g-sign-in-button .logo-wrapper {
  padding: 15px;
  background: #fff;
  width: 48px;
  height: 100%;
  border-radius: 1px;
  display: inline-block;
}

.g-sign-in-button .text-container {
  font-family: Roboto,arial,sans-serif;
  font-weight: 500;
  letter-spacing: .21px;
  font-size: 16px;
  line-height: 48px;
  vertical-align: top;
  border: none;
  display: inline-block;
  text-align: center;
  width: 180px;
}


@media screen and (max-width: 800px) {
	.blog-container {
		flex-direction: column;
		height: auto;
	}
}