
/*making all images responsive*/
img
{
    width: 100%;
    height: auto;
}
.red {
    background-color: #C3292D;
    color: #fff;
}
/*center classes borrowed from Thimble framework*/
.align-center
{
    -webkit-align-items: center;
    -ms-flex-align: center;
            align-items: center;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
            align-self: center;
}
.justify-center
{
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
            justify-content: center;
}
/*grey outlines added for display*/
.col-sm,
.col,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col-md-auto,
.col-lg-2,
.col-md-4,
.col-md-8
{
    min-height: 100px;

    /*border: thin solid #999; */
    border-radius: 4px;
}


/*no gutters*/
.row.no-gutters
{
    margin-right: 0;
    margin-left: 0;
}
.row.no-gutters > [class^='col-'],
.row.no-gutters > [class*=' col-']
{
    padding-right: 0;
    padding-left: 0;
}

/*typographic styling*/
.cta
{
    padding: 50px;

    text-align: center;

    background-color: aqua;
}
.huge
{
    font-size: 100px;

    text-align: center;

    color: white;
}
/* header */
.navbar-inverse {
    background-color: #8cd2cf;
    border-color: #8cd2cf;
}
/* meta nav code here */
#meta_nav {
    max-width: 1170px;
    height: 40px;
    margin: auto;
    text-align: right;
    padding: 5px;
}
#shipping {
    float: left;
    height: 50px;
    line-height: 50px;
    font-size: 16px;
    font-weight: 400;
    color: #e6e6e5;
    text-transform: uppercase;
}
/* nav bar code here sample test */
.top_nav
{
    width: 100%;
    height: 50px;
}
.top_nav_left {
  height: 50px;
   line-height: 50px;
   font-size: 16px;
   font-family: 'Utopia', sans-serif;
   font-weight: 400;
   color: #010101;
   text-transform: uppercase;
   background: #8cd2cf;
   text-align: center;


}
#free {
  padding: 0px;
  position: relative;
}


.navbar-brand {
    background-image: url(../img/logo3.png);
    height: 100px;
    width: 100px;
    text-indent: -9999px;
    background-size: cover;
}

/* mega menu my code start here */
.mega-menu{
  width: 1000px;
  overflow: hidden;
  padding: 20px;
}
.mega-menu a{
  text-decoration: none;
  color: #010101;
}
.mega-menu .sub-menu{
  color: #ed2224;
}
/* end mega menu *?

/* carousel section */
.carousel-inner img {
      width: 100%;
      height: 100%;
  }


/*the hero section
#hero
{
    display: flex;

    min-height: 800px;

    background-image: url(../img/store.jpg);
    background-repeat: no-repeat;
    background-size: cover;
} */

#newarrivals
{
    height: 300px;

    background: #3a506b;
}
.btn-huge{
    padding-top:20px;
    padding-bottom:20px;
}
/* test for text overlay
.thumbnail {
    position: relative;
}

.caption {
    position: absolute;
    top: 45%;
    left: 0;
    width: 100%;
}
/* end test */

/*---code for nutrition tips--*/
.cta {
  padding: 8px;
  margin-right: 20px;
  font-size: 20px;
  background-color: #c3292d;
  color: #e6e6e5;
  border-radius: 4px;
  float: right;
}
.grey {
  background-color: #b4b4b4;
  color: #e6e6e5;
  margin-bottom: 50px;
}
.vspace {
  padding-top: 50px;
  padding-bottom: 50px;
}
.medium {
  font-size: 50px;
  padding-top: 50px;
  color: #e6e6e5;
  text-align: center;
}
/* --- code for clearance section --*/
.big {
  font-size: 60px;
  padding-top: 100px;
  text-align: center;
  background-color: #b4b4b4;
  color: #e6e6e5;
}
.big1 {
  font-size: 50px;
  padding-top: 70px;
  padding-bottom: 70px;
  text-align: center;
  background-color: #b4b4b4;
  color: #e6e6e5;
}
.t_shirt {
  color: #010101;
  text-align: center;
  position: absolute;
  z-index: 10;
  bottom: 10px;
  left: 40%;
  text-transform: uppercase;
  font-size: 24px;
}
.subheading
{
    display: block;

    letter-spacing: 2px;

    color: #0b132b;
}
h4
{
    overflow: hidden;

    padding: 20px;

    text-align: center;
    text-transform: uppercase;
}
h4:before,
h4:after
{
    position: relative;

    display: inline-block;

    width: 50%;
    height: 1px;

    content: '';
    vertical-align: middle;

    background-color: #3a506b;
}
h4:before
{
    right: .5em;

    margin-left: -50%;
}
h4:after
{
    left: .5em;

    margin-right: -50%;
}
.cta {
  text-align: center;
  background-color:#ed2224;
  padding: 10px;
}
.cta1{
  text-align: center;
  background-color: #4e4e4e;
  padding: 50px;
  color: #e6e6e5;
}
.race {
  text-align: center;
  font-size: 30px;
  color: #e6e6e5;
}
.sign_sec {
  background-color: #4e4e4e;
}
.return {
  border: 1px solid #010101;
}
.last {
  font-size: 1.5rem;
  text-align: center;
}
.locator {
  text-align: center;
}

/* code for button on top of the image */
.img-wrapper {
 position: relative;
 width: 100%;
}

.img-overlay {
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 text-align: center;
}

.img-overlay:before {
 content: ' ';
 display: block;
 /* adjust 'height' to position overlay content vertically */
 height: 33%;
}

/*  code for input form */

#custom-search-input{
    padding: 3px;
    border: solid 1px #E4E4E4;
    border-radius: 6px;
    background-color: #fff;
}

#custom-search-input input{
    border: 0;
    box-shadow: none;
}

#custom-search-input button{
    margin: 2px 0 0 0;
    background: none;
    box-shadow: none;
    border: 0;
    color: #666666;
    padding: 0 8px 0 10px;
    border-left: solid 1px #ccc;
}

#custom-search-input button:hover{
    border: 0;
    box-shadow: none;
    border-left: solid 1px #ccc;
}

#custom-search-input .glyphicon-search{
    font-size: 23px;
}
#footer
{
		color: #e6e6e5;
    background: #86dcd5;
		font-size: 14px;
		text-align: center;
		line-height: 2;
}
.history
{
		font-size: 14px;
		line-height: 1.5;
		text-indent: 50px;
		text-align: justify;
		color: #e6e6e5;
}
.footer-links {
	color: #010101;
	font-size: 25px;
	text-transform: capitalize;
}
.info-list a{
	color: #010101;

	font-size: 16px;
}
.info-list a:hover {
  text-decoration: none;
  color:#b3b3b3;
}
/* socail icons style */
.fa {
	padding: 10px;
  font-size: 30px;
  width: 30px;
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
  border-radius: 50%;
}

.fa:hover {
    opacity: 0.5;
}

.fa-facebook {
  background: #4e4e4e;
  color: #b4b4b4;
}
.fa-twitter {
	background:#4e4e4e;
  color: #b4b4b4;
}
.fa-instagram {
	background:#4e4e4e;
  color: #b4b4b4;
}
.fa-youtube {
	background: #4e4e4e;
  color: #b4b4b4;
}



/*hover images captions. Replace with your images */
.title-arch
{
    font-size: 22px;

    margin: 50px 0;

    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
}
.project
{
    float: left;

    width: 100%;
    height: 500px;
    padding: 0 !important;

    background-image: url(../img/pick1.jpg);
    background-position: center;
    background-size: cover;
}
.project-2
{
    /* background-image: url(https://image.freepik.com/free-vector/abstract-geometric-background-design_1045-764.jpg); */
    background-image: url(../img/pick2.jpg);
}
.project-3
{
    /* background-image: url(https://image.freepik.com/free-vector/abstract-geometric-background-design_1045-764.jpg); */
    background-image: url(../img/pick3.jpg);
}
.project-4
{
    /* background-image: url(https://image.freepik.com/free-vector/abstract-geometric-background-design_1045-764.jpg); */
    background-image: url(../img/pick4.jpg);
}
.project-hover
{
    width: 100%;
    height: 100%;
    padding: 40% 30px !important;

    -webkit-transition: all .5s ease;
       -moz-transition: all .5s ease;
         -o-transition: all .5s ease;
            transition: all .5s ease;

    opacity: 0;
    color: #010101;
    background-color:#b4b4b4;
}
.project-hover hr
{
    width: 0;
    height: 30px;

    -webkit-transition: all .5s ease;
       -moz-transition: all .5s ease;
         -o-transition: all .5s ease;
            transition: all .5s ease;

    border: 0;
    background-color: rgba(255, 255, 255, 1);
}
.project-hover a
{
    line-height: 40px;

    padding: 2px 22px;

    -webkit-transition: all .5s ease-in-out;
       -moz-transition: all .5s ease-in-out;
         -o-transition: all .5s ease-in-out;
            transition: all .5s ease-in-out;

    color: rgba(255, 255, 255, 1);
    border: 2px solid rgba(255, 255, 255, 1);
}
.project-hover a:hover
{
    color: rgba(51, 51, 51, 1);
    border-color: rgba(51, 51, 51, 1);
    background-color: #ed2224;
}
.project:hover .project-hover
{
    opacity: 1;
}
.project:hover .project-hover hr
{
    width: 100%;
    height: 5px;
}
/*---My code start here---*/
.nav-links
{
    display: inline-block;

    padding: .5em 1em;

    text-decoration: none;

    color: white;
}
/* curling canada nav bar */
.navbar-right {
    margin-top: 50px;
    margin-right: 0px;
}

.navbar-right {
    margin-top: 50px;
    margin-right: 0px;
}
/* end curling canada */
/*---product detail page--*/

/*****************globals*************/
body {
  font-family: 'open sans';
  overflow-x: hidden; }

img {
  max-width: 100%; }

.preview {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column; }
  @media screen and (max-width: 996px) {
    .preview {
      margin-bottom: 20px; } }

.preview-pic {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1; }

.preview-thumbnail.nav-tabs {
  border: none;
  margin-top: 15px; }
  .preview-thumbnail.nav-tabs li {
    width: 18%;
    margin-right: 2.5%; }
    .preview-thumbnail.nav-tabs li img {
      max-width: 100%;
      display: block; }
    .preview-thumbnail.nav-tabs li a {
      padding: 0;
      margin: 0; }
    .preview-thumbnail.nav-tabs li:last-of-type {
      margin-right: 0; }

.tab-content {
  overflow: hidden; }
  .tab-content img {
    width: 100%;
    -webkit-animation-name: opacity;
            animation-name: opacity;
    -webkit-animation-duration: .3s;
            animation-duration: .3s; }

.card {
  margin-top: 50px;
  background: #eee;
  padding: 3em;
  line-height: 1.5em; }

@media screen and (min-width: 997px) {
  .wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex; } }

.details {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column; }

.colors {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1; }

.product-title, .price, .sizes, .colors {
  text-transform: UPPERCASE;
  font-weight: bold; }

.checked, .price span {
  color: #ed2224; }

.product-title, .rating, .product-description, .price, .vote, .sizes {
  margin-bottom: 15px; }

.product-title {
  margin-top: 0; }

.size {
  margin-right: 10px; }
  .size:first-of-type {
    margin-left: 40px; }

.color {
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
  height: 2em;
  width: 2em;
  border-radius: 2px; }
  .color:first-of-type {
    margin-left: 20px; }

.add-to-cart, .like {
  background: #ed2224;
  padding: 1.2em 1.5em;
  border: none;
  text-transform: UPPERCASE;
  font-weight: bold;
  color: #fff;
  -webkit-transition: background .3s ease;
          transition: background .3s ease; }
  .add-to-cart:hover, .like:hover {
    background: #b4b4b4;
    color: #fff; }

.not-available {
  text-align: center;
  line-height: 2em; }
  .not-available:before {
    font-family: fontawesome;
    content: "\f00d";
    color: #fff; }

.orange {
  background: #ff9f1a; }

.green {
  background: #b4b4b4; }

.blue {
  background: #8cd2cf; }
.black {
  background: #010101;
}
.red {
  background: #ed2224;
}

.tooltip-inner {
  padding: 1.3em; }

@-webkit-keyframes opacity {
  0% {
    opacity: 0;
    -webkit-transform: scale(3);
            transform: scale(3); }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1); } }

@keyframes opacity {
  0% {
    opacity: 0;
    -webkit-transform: scale(3);
            transform: scale(3); }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1); } }

/*# sourceMappingURL=style.css.map */

/* media code */
@media (max-width:500px){
  .mega-menu{
    width: 300px;
  }
}

/* media queries*/
@media only screen and (max-width: 640px){
  .cta {
    padding: 20px;
  float: none;
  }
  .img-overlay{
    position: relative;
    margin-top: 50px;
  }
}
@media screen and (max-width:768px){
  .navbar-brand{
    background-image: url(../img/jackie logo.png);
    width: 90px;
    height: 90px;
  }
}
