/*

Template: Printer

category: Bakery

Author: Codelayers

Version: 1.0

Design and Developed by: Codelayers

*/





/*

======================================

[ CSS TABLE CONTENT ]

======================================



    [Table of contents]



	1.feature boxes

	2.parallax sections

	3.footer styles



	

======================================

[ END CSS TABLE CONTENT ]

======================================

*/



/*========= Bakery layout styles ===========*/



/*============ Feature boxes ============ */



.by-feature-box-1{

	position:relative;

	width:100%;

	padding:0;

	float:left;

	transition: all 0.3s ease-out 0s;

}

.by-feature-box-1 .item-circle{

	width:260px;

	height:260px;

	padding:0;

	float:left;

	border-radius:100%;

	background-color:#fff;

}

.by-feature-box-1 .price{

	position: absolute;

	width:86px;

	height:86px;

	padding:30px 0 0 0;

	font-weight:600;

	font-size:18px;

	text-align:center;

	float:left;

	color:#ecae3d;

	margin: 207px 0 0 90px;

	border-radius:100%;

	background-color:#fff;

	z-index:2;

}

.by-feature-box-1:hover h4, .by-feature-box-1.active h4{

	color:#ecae3d;

	transition: all 0.3s ease-out 0s;

}









/* ---------- feature box 2 ---------- */



.by-feature-box-2{

	width:100%;

	padding:40px;

	float:left;

	background-color:#fff;

	transition: all 0.3s ease-out 0s;

}



.opening-list {

	float: left;

	padding: 0;

	width: 100%;

}

.opening-list li {

	color: #101010;

	float: left;

	padding: 8px 0;

	width: 100%;

	border-bottom: 1px solid #f1f1f1;

}

.opening-list li:first-child {

	padding-top: 0px;

}

.opening-list li:last-child {

	border-bottom: none;

}



/* ---------- feature box 3 ---------- */



.by-feature-box-3{

	width:100%;

	padding:0px;

	float:left;

	border-right:1px solid #f1f1f1;

}

.by-feature-box-3.no-border{

	border-right:none;

}

.by-feature-box-3 .img-box{

	position:relative;

	width:100%;

	float:left;

	margin-bottom:10px;

}

.by-feature-box-3 .img-box .price{

	position: absolute;

	width:60px;

	height:60px;

	float:left;

	font-size:18px;

	text-align:center;

	padding:17px 0 0 0;

	top: 45px;

	right: 30px;

	border-radius:100%;

	background-color:#101010;

}





/*============ Section Titles ============ */



/* title container

 ------------------------------ */

.sec-title-container {

	width:100%;

	float:left;

	padding-bottom:70px;

}

.sec-title-container.less-padding {

	padding-bottom:50px;

}



/* page title

 ------------------------------ */

.by-section-title {

	font-weight: 400;

	font-size:42px;

}

.by-section-title.small {

	font-weight: 400;

	font-size:32px;

}

/* subtitle

 ------------------------------ */

.by-sub-title {

	width: 100%;

	font-size: 14px;

	margin: 0;

}





/* title line

 ------------------------------ */

.by-title-line-1 {

	width: 125px;

	height:2px;

	margin:4px auto 0 auto;

	border-bottom:1px solid #cfcfcf;

}

.by-title-line-2 {

	width: 180px;

	height:2px;

	margin:10px auto 0 auto;

	border-bottom:1px solid #cfcfcf;

}

.by-title-line-1.align-left {

	width: 125px;

	margin:4px auto 0 0;

}

.by-title-line-2.align-left {

	width: 160px;

	margin:10px auto 0 0;

}





/*============ Parallax Sections ============ */

.by-parallax-sec-1 {

	position:relative;

	width: 100%;

	float: left;

	padding: 0;

	margin: 0px;

	text-align: center;

	background: url(http://placehold.it/2000x1300);

	background-attachment: fixed;

	background-origin: initial;

	background-clip: initial;

	background-size: cover;

	background-repeat: no-repeat;

	background-position: 100% 0;

	background-position: center;

	z-index: 1;

}

.by-parallax-sec-1 .margin-box {

	width:100%;

	float:left;

	height:90px;

}

.by-parallax-sec-1 .overlay-img {

	position: absolute;

	width:460px;

	float: left;

	padding: 0;

	z-index: 2;

	text-align:center;

	margin:0 auto;

}







/*============ portfolio ============ */



/* portfolio box 1

 ------------------------------ */

.by-portfolio-box-1 {

	width:100%;

	float:left;

	padding:0px;

	transition: all 0.3s ease-out 0s;

}

.by-portfolio-box-1 .item-box {

	position:relative;

	width:100%;

	float:left;

	padding:0px;

	z-index:1;

}

.by-portfolio-box-1 .item-box .hover-box {

	position: absolute;

	width:100%;

	height:100%;

	float:left;

	padding:30px;

	z-index:2;

	opacity:0;

	background-color:rgba(0, 0, 0, 0.3);

	transition: all 0.3s ease-out 0s;

}

.by-portfolio-box-1 .item-box .hover-box .inner-box {

	width:100%;

	height:100%;

	float:left;

	padding:80px 0 0 0;

	z-index:2;

	border:6px solid #ecae3d;

	background-color:rgba(255, 255, 255, 0.3);

}

.by-portfolio-box-1.item-top-padding-1 .item-box .hover-box .inner-box {

	padding:80px 0 0 0;

}

.by-portfolio-box-1:hover .item-box .hover-box, .by-portfolio-box-1.active .item-box .hover-box {

	opacity:1;

}























/*----------------------------RESPONSIVE STYLES------------------------------- */

/* ---------- MAX 1024PX ---------- */

@media screen and (max-width: 1024px) {

	

.by-feature-box-1 .price {

    margin: 160px 0 0 65px;

}

.by-feature-box-1 .item-circle {

    width: 220px;

    height: 220px;

}

.iconbox-dxlarge {

    width: 165px;

    height: 165px;

}







}

	

	



	

	

/* ---------- MAX 991PX ---------- */

@media only screen and (max-width: 991px) {



.by-feature-box-1 .price {

    margin: 150px 0 0 65px;

}

.by-parallax-sec-1 .overlay-img {

    margin: 0 0 0 223px;

}

.by-feature-box-3 {

    border-right:none;

}

.by-feature-box-3 .img-box .price {

    left: 30px;

}











}







/* ---------- MAX 800PX ---------- */

@media only screen and (max-width: 800px) {

.by-feature-box-1 .price {

    margin: 168px 0 0 68px;

}

 .by-feature-box-1{

	 margin-bottom:30px;

}

.by-parallax-sec-1 .overlay-img {

    margin: 0 0 0 150px;

}









}







/* ---------- MAX 768PX ---------- */

@media only screen and (max-width: 768px) {





}





/* ---------- MAX 767PX ---------- */

@media only screen and (max-width: 767px) {



}





@media screen and (max-width: 640px) {

.by-parallax-sec-1 .overlay-img {

    margin: 0 0 0 70px;

}









}





@media screen and (max-width: 480px) {

.by-parallax-sec-1 .overlay-img {

	width:360px;

}

.by-portfolio-box-1.item-top-padding-1 .item-box .hover-box .inner-box {

    padding: 10px 0 0 0;

}













}



/* ---------- MAX 360PX ---------- */

@media screen and (max-width: 360px) {



.by-parallax-sec-1 .overlay-img {

	width:260px;

}

.by-portfolio-box-1 .item-box .hover-box {

    padding: 10px;

}

.master-slider .pattren-1-top {

    top: -23px;

}





}





/* ---------- MAX 320PX ---------- */

@media only screen and (max-width: 320px) {

.by-parallax-sec-1 .overlay-img {

	width:180px;

}



}