* {
	margin:0;
	padding: 0;
}

body,html {
	height: 100%;
	background-color: #2d5270;
	overflow-x: hidden;
	font-family: 'montserrat', sans-serif;
}

form {
	display: none;
}

.weatherType {
	height: 100px;
	width: 100px;
	margin: 10% 0 0 10%;
	position: absolute;
}

.background__container {
	height: 70%;
	width: 100vw;
	background: url(test2.svg) center no-repeat;
	background-size: contain;
	background-position: bottom;
}

.data__container {
	position: relative;
	height: 30%;
	background-color: #f0f4f7;
	text-align: center;
	color: #2d5270;
}

.data__containerCenterfix {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

.data__location {
	font-size: 1em;
    margin-bottom: .8em;
}

.temp__container p{
	display: inline-block;
	font-size: .8em;
	font-weight: 700;
	background-color: #f0f4f7;
	width: 45px;
	height: 45px;
	line-height: 45px;
	border-radius: 50%;
	transition: .35s;
   -webkit-user-select: none;  /* Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;
	border: solid 2px #2d5270;
}


@media (orientation: landscape) {
	.background__container {
		height: 50%;	
	}
	
	.data__container {
		height: 50%;	
	}
	
   .weatherType {
       height: 80px;
	   width: 80px;
	   margin: 4% 0 0 25%;
	   position: absolute;
}
    
}

@media (min-width: 540px) {
    body {
        font-size: 150%;
    }
    
    
}

@media (min-width: 880px) {

    body {
        font-size: 200%;
    }
    
    .temp__container p{
        width: 70px;
        height: 70px;
        line-height: 70px;
}
    
    .weatherType {
	height: 140px;
	width: 140px;
	margin: 8% 0 0 25%;
	position: absolute;
}
}