.collumn{
    font-size: 14px;
    line-height: 20px;
    width: 17.5%;
    display: inline-block;
    padding: 0 1% 0 1%;
    vertical-align: top;
    margin-bottom: 50px;
    transition: all .7s;
}
@media only all and (max-width: 1300px) {
    .weatherforcastbox{
        display: none;
    }

}
@media only all and (max-width: 1200px) {
    .collumn{
        width: 31%;
    }

}
    @media only all and (max-width: 900px) {
    .collumn{
        width: 47%;
    }

}
@media only all and (max-width: 600px) {
    .collumn{
        width: 100%;
    }
	.collumn + .collumn {
				border-left: none;
      	border-bottom: 1px solid #2f2f2f;
	}
    header{
        max-width: 320px;
        font-size: 40px;
        line-height: 32px;
        overflow: hidden;
    }

}

@media only all and (max-width: 300px) {
    .collumn{
        width: 100%;
    }
	.collumn + .collumn {
				border-left: none;
      	border-bottom: 1px solid #2f2f2f;
	}
    header{
        max-width: 160px;
        font-size: 30px;
        line-height: 27px;
        overflow: hidden;
    }

}