/*
| --------------------------------------------------------
| Plugin Name : Ecommerce Grid
| Plugin Version : 1.1
| Created Date : 17/01/2018
| Modified Date : 21/11/2018
| Platforms : HTML5, CSS3, Bootstrap3, JS, Jquery
| Plugin Author : Yankee Themes
| Author URI : https://themeforest.net/user/yankeethemes
| Author Contact : enquiry[at]yankeeinfoweb[dot]com
| File : style.css
| --------------------------------------------------------
*/

/*
| --------------------------------------------------------
| TABLE OF CSS CONTENT
| --------------------------------------------------------
|  1. Layout Global CSS
|     	Body, 
|		Global Classes, 
|		Trypography, 
|		Colors,
|		Image, 
|		Line Divider
|		Margin & padding
|		Listing,
|		Links,
|		Alignment
|  2. Component CSS
|		Button
|		Forms
|		Alignment
|  3. Landing Page CSS
|  3. Product Grid Page CSS
*/

/* Note : style.css is only used for preview page, do not include any plugin css in this file */

/* 01 : Website Global CSS BOF
========================================================== */
body { background:#ffffff; font-family: 'Open Sans'; font-size:14px; line-height:normal; font-weight:300; color:#333; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }	
*, html { margin:0px; padding:0px;  }
a { color:#333; }
a:hover, a:focus, a:active { color: #ff504c; text-decoration:none; }
a, *:hover, *:focus, *:active :focus { text-decoration:none; outline:none !important; outline-offset:0 !important; }
a img, img { border:none; outline:none !important; outline-offset:0 !important; opacity:1; }
a:hover img { opacity:.6; } 
ul { list-style:none; margin:0; padding:0; } 
ul li { display:inline-block; line-height:1.5; }
i { font-family:'FontAwesome'; } 
img { height:auto; max-width:100%; vertical-align: middle; line-height:normal; }
	
    /* Browser Selection CSS BOF */
	::selection { background:#c92925; color:#fff; } ::-moz-selection { background:#c92925; color:#fff; } ::-webkit-selection { background:#c92925; color:#fff; }    		
   		::-o-selection { background:#c92925; color:#fff; } ::-ms-selection { background:#c92925; color:#fff;  }

	/* Combine Selector CSS BOF */
	a, i, img, .btn { transition: all 0.5s ease-in-out 0s; -webkit-transition: all 0.5s ease-in-out 0s; -moz-transition: all 0.5s ease-in-out 0s; 
	-o-transition:all 0.5s ease-in-out 0s; -ms-transition:all 0.5s ease-in-out 0s; }


/* 02 : Global Classes CSS BOF
==================================================== */	
.center-items * { text-align:center; margin-left:auto; margin-right:auto; display:block; } 
.block { display:block; }
.pos-relative { position:relative; }
.overflow { overflow:hidden; }
.grey-color-bg { background-color:#f1f1f1; }
.light-grey-color-bg { background-color:#f5f5f5; }
.display-table { display:table; }
.display-cell { display:table-cell; }
.desktop-right { float:right; }
figcaption { font-style:italic; }
.mrg-center { margin-left:auto; margin-right:auto; }
.mrg-v-space { margin-top:20px; }
.orange-color-text { color:#ff504c; }
.white-color-text { color:#fff; }

/* 03 : Heading Style CSS BOF
=================================================== */
h1, h2, h3, h4, h5, h6 { margin:3px 0; padding:3px 0; line-height:1.5; font-family: 'Open Sans'; }
h5, h6 { font-weight:300; }
h1 { font-size:35px; font-weight:700; }
h2 { font-size:30px; font-weight:600; }
h3 { font-size:25px; font-weight:400; }
h4 { font-size:20px; font-weight:600; }
h5 { font-size:17px; font-weight:600; }
h6 { font-size:15px; }

/* 04 : Paragraph Style CSS BOF
=================================================== */
p { padding-top:5px; padding-bottom:5px; line-height:1.5; }

/* 05 : Image Style CSS BOF
=================================================== */
img { margin-bottom:0; }
.img-center { margin:0 auto; display:block; text-align:center; }
		
/* 06 : Linedivider Style CSS BOF
=================================================== */	
hr { border-top:solid 1px #2d9bef; border-bottom:medium none; margin-top:25px; margin-bottom:25px; }
hr.style-two { width:70px; height:2px; border:medium none; }
		
/* 07 : Button Style CSS BOF
=================================================== */	
.btn { padding:5px 10px; color:#fff; font-size:16px; border:medium none; -moz-border-radius:0; -webkit-border-radius:0; border-radius:0; }
	
		/* Hover State CSS BOF */
		.btn:hover, .btn:focus, .btn:active, .btn.active { color:#fff; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; outline:none; }

/* 08 : Listing Style CSS BOF
=================================================== */	
.common-listing { margin-top:15px; }
.common-listing li { font-weight:400; }
.common-listing li:before { content:"-"; font-size:20px; font-weight:600; margin-right:15px; }
.listing-block li { display:block; }

/* 09 : Go To Top CSS BOF
==================================================== */	
.back-top #toTop { position: fixed; bottom:80px; right:10px; z-index:50; background:#ff504c; width:40px; height:40px; font-size:20px; color:#fff; line-height:40px; }
.back-top #toTop:hover { background:#333; }

/* 10 : Flaticon CSS BOF
==================================================== */	
/*
Flaticon icon font: Flaticon
Creation date: 16/01/2018 11:10
*/
@font-face {
  font-family: "Flaticon";
  src: url("../font/Flaticon.eot");
  src: url("../font/Flaticon.eot") format("embedded-opentype"),
       url("../font/Flaticon.woff") format("woff"),
       url("../font/Flaticon.ttf") format("truetype"),
       url("http://yankeethemes.com/envato/ecommerce-grid/html/css/fonts/Flaticon.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: "Flaticon";
    src: url("http://yankeethemes.com/envato/ecommerce-grid/html/css/fonts/Flaticon.svg") format("svg");
  }
}

[class^="flaticon-"]:before, [class*=" flaticon-"]:before,
[class^="flaticon-"]:after, [class*=" flaticon-"]:after {   
font-family: Flaticon;
font-size: inherit;
font-style: normal;
margin-left:0;
}

.flaticon-envato:before { content: "\f100"; }

/*
| ========================================================
| INDEX PAGE CSS BOF
| ========================================================
*/
.page-wrapper { margin:0px auto; }
.landing-page, .grid-list-page { overflow-x:hidden; }
.flex-grid { display:flex; height:80vh; align-items:center; justify-content:center; }
section { padding-top:70px; padding-bottom:70px; }

/* HEADER CSS BOF 
======================================================= */
header .navbar-inverse { background:#2a2d3d; border-color:transparent; }
header .navbar-brand { height:auto; }
header .navbar-nav { float:none; display:inline-block; margin:22px auto; }
header .navbar-inverse .navbar-nav > li > a { font-weight:600; text-transform:uppercase; }
header .navbar-inverse .navbar-collapse { text-align:center; }	
header .social-links { margin:30px auto; }

	/*** Social Links CSS BOF ***/
	ul.social-links a { -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; font-size:20px; height: 40px; line-height: 38px; padding: 0; width: 40px; margin:0 3px;
		display:block; }

/*** Banner CSS BOF ***/
.intro-banner { margin-top:100px; padding:5em 0 10em; position:relative; z-index:1 }
.intro-banner::after { background: rgba(0, 0, 0, 0) url("../image/hero-curve-layer.svg") no-repeat scroll center bottom / contain; bottom: -3px; content: ""; height: 100%; left:-1px; 
	position: absolute; width: 101%; z-index:-1; right:-1px; margin:0 auto; }
.intro-banner .banner-content h1 { line-height: 1.3; }
.intro-banner .btn { margin:10px 0; }
.intro-banner .btn +.btn { margin-left:15px; }
.intro-banner .intro-thumbnail { max-width:none; position:absolute; }
.intro-banner figure { float:right; }

/* CONTENT CSS BOF 
======================================================= */

/*** Key Design Section CSS BOF ***/
.principle-ecom-grid figure { order: 0; }
.principle-ecom-grid article { order: 1; }

/*** Showcase Section CSS BOF ***/
.showcase ul.showcase-listing { margin-top:20px; margin-bottom:70px; }
.showcase hr { margin:25px auto; }
.showcase ul.showcase-listing li a { border:solid 2px rgba(0, 0, 0, .0); display:block; position:relative; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; }
.showcase ul.showcase-listing li a:hover { border:solid 2px #ff504c; -moz-box-shadow:2px 0 5px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow:2px 0 5px 5px rgba(0, 0, 0, 0.1); 
	box-shadow:2px 0 5px 5px rgba(0, 0, 0, 0.1); }

/*** Showcase Section CSS BOF ***/
.showcase-list ul.showcase-listing { margin-top:20px; margin-bottom:40px; }
.showcase-list hr { margin:25px auto; }
.showcase-list ul.showcase-listing li a { border:solid 2px rgba(0, 0, 0, .0); display:block; position:relative; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; margin-bottom:25px; }
.showcase-list ul.showcase-listing li a:hover { border:solid 2px #ff504c; -moz-box-shadow:2px 0 5px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow:2px 0 5px 5px rgba(0, 0, 0, 0.1); 
	box-shadow:2px 0 5px 5px rgba(0, 0, 0, 0.1); }	

/*** Credit Section CSS BOF ***/
.ecom-grid-credit ul.credit-listing { margin-top:25px; }
.ecom-grid-credit ul.credit-listing li .item { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0); padding: 10px; text-align: center; margin-bottom:25px; -moz-border-radius:5px; 
	-webkit-border-radius:5px; border-radius:5px; }

/*** Buy Now Section CSS BOF ***/
.buynonw { background:url(../image/buynow-bg.jpg) no-repeat 0 0; position:relative; z-index:0; }
.buynonw::after { content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: -1; 
background: -moz-linear-gradient(top,  rgba(0,0,0,0.6) 0%, rgba(0,0,0,.5) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,.5) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}
.buynonw { color: #ffffff; }
.buynonw .item { background: rgba(0, 0, 0, 0.6); padding: 5px 10px 25px; }
.buynonw ul.social-links { margin-top:25px; margin-bottom:25px; }