body{
	background: #161616;
}

h1{
	font-family: 'Alte Haas Grotesk', sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 60px;
	color: #e64141;
}

h2{
	font-family: 'Alte Haas Grotesk', sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 32px;
	color: #fff;
}


a{
	color: #e64141;
	text-decoration: none;
}

a:hover{
	color: #f2f2f2;
	text-decoration: none;
}



#about{
	color: #f2f2f2;
	text-align: left;
	background: #161616;
	padding-top: 130px;
	padding-bottom: 50px;
}





.main {
  max-width: 100%;
  margin: auto;
}



.row {
  margin: 8px -16px;
}

/* Add padding BETWEEN each column (if you want) */
.row,
.row > .column {
  padding: 8px;
}

/* Create four equal columns that floats next to each other */
.column {
  float: left;
  width: 25%;
}

/* Clear floats after rows */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Content */
.content {
  padding: 0px;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 900px) {
  .column {
    width: 50%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column {
    width: 50%;
  }
}




#ekko-lightbox {
  border-width: 0 !important;
  height: auto !important;
  width: auto !important;
}




#contacts{
	text-align: left;
	background: #161616;
	color: #e64141;
	padding-top: 50px;
	padding-bottom: 50px;
}




#contacts a{
	color: #e64141;
	text-decoration: underline;
}




#contacts a:hover{
	color: #f2f2f2;
	text-decoration: none;
}




.copyright{
	font-family: 'Alte Haas Grotesk', sans-serif;
	font-weight: 400;
	font-style: normal;
	background: #e64141;
	color: #000;
	font-size: 12px;
	text-align: center;
}




/* Create two equal columns that floats next to each other */

.column1 {
  float: left;
  width: 100%;
  background: #e64141;
}

.column2 {
  float: left;
  width: 33%;
}

.column3 {
  float: left;
  width: 33%;
  Text-align: right;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column2 {
    width: 100%;
    text-align: center;
  }

  .column3 {
    width: 100%;
    text-align: center;
  }

  .column1 {
    width: 100%;
    text-align: left;
  }

}





/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {

	.contacts {
		text-align: right;
		margin-top: 0;
		td-width: 100%;
	}




/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {


	td>.main-photo{
		margin-bottom: 0;

	}

	.copyright{
		font-size: 12px;
	}
	
	.contacts {
		text-align: right;
		margin-top: 0;
	}

}


/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {


	td>.main-photo{
		margin-bottom: 0;
	}

	.contacts {
		text-align: right;
		margin-top: 0;
	}
 }

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {


	td>.main-photo{
		margin-bottom: 0;
	}

	.contacts {
		text-align: right;
		margin-top: 0;
	}

 }