/* CSS Document */

/*HOME START*/
#home{
    padding: 50px 0px;
    color: #000000;
    background-image: url('../img/banner-bg.png');
    background-attachment: scroll;
    background-repeat: no-repeat;
    background-size: contain;
}
.banner ::selection{
	background: transparent;
    text-shadow: none;
}
.banner .container{
    width: 70%;
}
.banner h1{
    font-weight: 700;
    font-size: 100px;
    line-height: 1;
}
@media screen and (max-width: 768px){
	.banner .container{
        width: 90%;
    }
}

#projects{
    padding: 150px 50px 20px 50px;
}
#projects h4{
    text-align: center;
    font-weight: 100;
}
#projects h4 span{
    font-weight: 500;
}
#projects button{
    background-color: #0e76bd;
    margin-bottom: 50px;
}
.project-row{
    margin: 100px 0px;
}
.project-row .rtl{
    text-align: right;
}
.project-row .title{
    font-weight: 600;
    margin: 0;
}
.project-row .description{
    color: #7C7C7C;
    font-weight: 100;
}
.project-row a{
    color: #0e76bd;
    font-weight: 700;
}
.project-row a:hover{
    color: #2595e0;
}
@media screen and (max-width: 992px){
    #projects{
        padding: 150px 0px 20px 0px;
    }
}
@media (max-width: 767.98px) {
	.project-row .rtl{
		text-align: left;
	}
	.project-row img{
		margin-bottom: 10px;
	}
}

#clients{
    background-image: url('../img/banner-bg.png');
	background-attachment: scroll;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
    margin: 50px 0px 100px 0px;
}
#clients .banner{
    margin-bottom: 50px;
}
#clients #clients-list{
	width: 80%;	
}
.clients-list-item{
	padding: 20px;
}
.clients-list-item .card{
	display: -webkit-box;
	background-color: #2b2b2b;
	border-radius: 0px;
	height: 120px;
	text-align: center;
	transform: skewX(20deg);
	cursor: pointer;
}
.clients-list-item div:hover, .hovered{
	-webkit-box-shadow: 0px 0px 5px 4px #0e76bd;
	-moz-box-shadow: 0px 0px 5px 4px #0e76bd;
	box-shadow: 0px 0px 5px 4px #0e76bd;
}
.clients-list-item img{
	transform: skewX(-20deg);
	padding: 20px;
	-webkit-filter: grayscale(100%);
       -moz-filter: grayscale(100%);
         -o-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
            filter: grayscale(100%);
}
.clients-list-item img:hover{
    -webkit-filter: grayscale(0%);
       -moz-filter: grayscale(0%);
         -o-filter: grayscale(0%);
        -ms-filter: grayscale(0%);
            filter: grayscale(0%);
}

#reviews{
    background-image: url('../img/banner-bg.png');
    background-attachment: scroll;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
    margin: 50px 0px 100px 0px;
}
#reviews #banner{
    margin-bottom: 50px;
}
#reviews-list h3{
    text-align: center;
    font-weight: 300;
	margin-top: 40px;
}

.review{
    width: 70%;
    margin: 50px auto;
}
.review p{
    margin: 0;
}
.review .client-words{
    font-family: 'Abhaya Libre', serif;
    font-size: 30px;
	text-align: justify;
}
.review .client-name{
    text-align: right;
    font-weight: 300;
}
.review .client-company{
    text-align: right;
    font-weight: 500;
}
@media (max-width: 991.98px) { 
	.review{
		width: 90%;
	} 
}
/*HOME END*/