Šablonas:Main Page/styles.css

.main-page-block-heading {
	color: #555555;
	font-size: 2em;
	font-variant: small-caps;
	padding: 10px 10px 10px 25px;
}

.main-page-block-heading {
	background-color: white;
	border-bottom: 1px solid #555555;
}

.main-page-block-contents {
	border-top: 3px solid white;
	padding: 10px;
}

.main-page-responsive-columns {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    margin-top: 5px;
}

.main-page-responsive-columns > div:first-of-type {
	flex: 1.18 1;
	margin-right: 2px;
}

.main-page-responsive-columns > div:last-of-type {
	flex: 1 1;
}

.main-page-responsive-columns td:nth-of-type(2) {
	border-left: 2px solid #fff;
}

.main-page-first-row > div {
	background-color: #f0f9f0;
}

.main-page-second-row > div {
	background-color: #f0f4f9;
}

.main-page-third-row > div {
	background-color: #f9f9f0;
}


/* Breakpoints */
@media all and ( max-width: 900px ) {
  .main-page-block-heading {
    font-size: 1.8em;
  }
}

@media all and ( max-width: 760px ) {
  .hp td {
     width: 50% !important;
  }
}

/* On mobile collapse into one column layout */
@media all and ( max-width: 500px ) {
  .hp td,
  .main-page-responsive-columns td {
     display: block;
  }

  .main-page-responsive-columns td:nth-of-type(2) {
	border-left: none;
  }

 .hp td {
    width: 100% !important;
    box-sizing: border-box;
    border: 0 !important;
  }

  .main-page-block-heading {
    text-align: center;
    padding: 10px;
  }
}