﻿
.videobtn {
	display:block;
	margin:10px auto;
    text-align: center;
    border-top: 3px solid #69371C;
    border-bottom: 3px solid #69371C;
    padding: 5px;
    font-size: 20px;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  background:#D3CAB5;
	color:#000000;
	font-weight:bold;
    font-family: 'Bitter', sans-serif;
    text-decoration:none!important;
}

.videobtn:hover{
  /*background-color:#E49F15;*/
}

.videobtn a {
	text-decoration:none!important;
	color:#000000;
}

.sold {
background-color: #FC0101;
padding:10px 10px 10px 50px;
color: #ffffff;
font-weight: bold;
font-size: 24px;
text-align: left;
display: block;
margin-top:-30px;
margin-left:-40px;
width:100%;
max-width:450px;
border-radius: 5px;
-ms-transform: rotate(-20deg); /* IE 9 */
-webkit-transform: rotate(-20deg); /* Chrome, Safari, Opera */
transform: rotate(-20deg);
z-index:500;
}

#saleImage {
/*background: url(images/metalroofs.jpg);*/
background-position:center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
	width:100%;
	display:block;
	margin-top:5px;
	padding:1px 0px 0px 0px; 	
}

@media only screen and (min-width: 600px) {

.sold {
background-color: #FC0101;
padding:10px 10px 10px 70px;
color: #ffffff;
font-weight: bold;
font-size: 24px;
text-align: left;
display: block;
margin-top:-50px;
margin-left:-50px;
width:100%;
max-width:450px;
border-radius: 5px;
-ms-transform: rotate(-20deg); /* IE 9 */
-webkit-transform: rotate(-20deg); /* Chrome, Safari, Opera */
transform: rotate(-20deg);
z-index:500;
}
}

/* Desktop Layout: 769px to a max of 1500px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 800px) {

.sold {
background-color: #FC0101;
padding:10px 10px 10px 60px;
color: #ffffff;
font-weight: bold;
font-size: 24px;
text-align: left;
display: block;
margin-top:-20px;
margin-left:-40px;
width:100%;
max-width:450px;
border-radius: 5px;
-ms-transform: rotate(-20deg); /* IE 9 */
-webkit-transform: rotate(-20deg); /* Chrome, Safari, Opera */
transform: rotate(-20deg);
z-index:500;
}
}

.saleContainer{
	display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.copywrite {
  color:#A3978B;
  font-size: 8pt;
  font-family: Arial, sans-serif;
  text-align:center!important;
  padding-top:15px; 
}

.row {
width:100%!important;
margin:auto;
  display: flex;
  flex-wrap: wrap;
}

.hp-item {
  padding: 20px;
  flex: 32%;
  margin:2px;
  padding-top:0px;
}

  .col-1-3 {
	flex: 32%;
	margin:2px;
  }

  .col-1-2 {
	flex: 48%;
	margin:2px;
  }

/* Responsive layout - makes a two column-layout instead of a three-column layout */
@media (max-width: 1000px) {
  .col-1-2 {
    flex: 48%;
  }
  .col-1-3 {
    flex: 48%;
  }
}


/* Responsive layout - makes a one column-layout instead of a two-column layout */
@media (max-width: 800px) {
  .col-1-3 {
    flex: 100%;
  }

  .col-1-2 {
    flex: 100%;
  }
  
    .col-1 {
    flex: 100%;
  }

}
