/*
Template Name: CleanBusiness
File: Layout CSS
Author: OS Templates
Author URI: http://www.os-templates.com/
Licence: <a href="http://www.os-templates.com/template-terms">Website Template Licence</a>
*/

 

/* ----------------------------------------------Homepage Content-------------------------------------*/

#homecontent{
	padding:30px 0 25px 0;
	}

#homecontent ul{
	display:inline;
	margin:0;
	padding:0;
	list-style:none;
	margin-right:10%;
	}

#homecontent li{
	display:block;
	float:left;
	width:206px;
	/*width:290px;*/
	margin:0 45px 0 0;
	}

#homecontent li.last{
	margin-right:0;
	}

#homecontent h2{
	margin-bottom:15px;
	}

#homecontent p{
	margin:0 0 20px 0;
	line-height:1.4em;
	}

#homecontent p.readmore{
	margin-bottom:5px;
	}

#homecontent p.readmore a{
	margin-bottom: 0;
	padding: 5px 15px;
	font-weight: bold;
	line-height: normal;
	color: #69b23f;
	background-color: #F0F0F0;
	}

#imageline{
	padding:30px 0;
	border-top:1px dotted #999999;
	}

#imageline ul{
	display:inline;
	margin:0;
	padding:0;
	list-style:none;
	}

#imageline li{
	display:block;
	float:left;
	margin:0 10px 0 0;
	padding:4px;
	border:1px solid #999999;
	}

#imageline li.last{
	margin-right:0;
	}

/* ----------------------------------------------
   RESPONSIVE STYLES
-------------------------------------------------- */
@media screen and (max-width: 900px) {
    #homecontent li {
        width: 48%; /* Two columns */
        margin: 0 4% 20px 0;
    }
    #homecontent li:nth-child(2n) {
        margin-right: 0;
    }
     #homecontent li:nth-child(3) {
        width: 100%; /* Third item full width if it's a 3 column layout originally */
    }
}


@media screen and (max-width: 768px) {
    #homecontent ul {
        margin-right: 0;
    }
    #homecontent li,
    #homecontent li.last {
        width: 100%;
        float: none;
        margin: 0 0 30px 0;
    }

    #imageline li {
        float: none;
        margin: 0 auto 10px auto;
        display: table; /* To center block element */
    }
}