@charset "utf-8";
/* 
Legal Notice - DO NOT REMOVE THIS NOTICE // START

  CSS Document Ownership.
  This CSS document is owned and managed by Swift Productions ABN 84 723 182 610,
  Level 7, 91 Philip Street PARRAMATTA NSW 2150, Australia.
  This document contains Code which has been written by Swift Productions.
  Unauthorised reproducing, copying, selling and/or modifying is strictly prohibited. Doing so may result in legal action.

Legal Notice - DO NOT REMOVE THIS NOTICE // END
*/

/* --------------------------------------------------------
   Project Name: BBQ Galore store
   Version: 1.0
   Created: 3 October 2017
   Last Modified: 3 October 2017 
   Last Modified By: Waqas
----------------------------------------------------------*/


@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900');

*{
  margin:0;
  padding: 0;
  outline: none;
  border:none;
  text-decoration : none;
}
img {
  max-width: 100%;
  display: block;
}
a{
  text-decoration:none;
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
  display: block;
}
.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
    float: left;
    position: relative;
  }
  .col-lg-12 {
    width: 100%;
  }
  .col-lg-11 {
    width: 91.66666667%;
  }
  .col-lg-10 {
    width: 83.33333333%;
  }
  .col-lg-9 {
    width: 75%;
  }
  .col-lg-8 {
    width: 66.66666667%;
  }
  .col-lg-7 {
    width: 58.33333333%;
  }
  .col-lg-6 {
    width: 50%;
  }
  .col-lg-5 {
    width: 41.66666667%;
  }
  .col-lg-4 {
    width: 33.33333333%;
  }
  .col-lg-3 {
    width: 25%;
  }
  .col-lg-2 {
    width: 16.66666667%;
  }
  .col-lg-1 {
    width: 8.33333333%;
  }
  
  #eBayAPPSchema {
	  display:none;
  }
  .pull-right {
  float: right !important;
}
.pull-left {
  float: left !important;
}
.hide {
  display: none !important;
}
.show {
  display: block !important;
}
.invisible {
  visibility: hidden;
}


.wrapper{
  float: left;
  width: 100%;
  font-family: 'Roboto', sans-serif;
}

.content {
  max-width: 1150px;
  width: 100%;
  margin: 0 auto;
  padding-left: 15px;
  padding-right: 15px;
  overflow: hidden;
  box-sizing: border-box;
}






/* ========== Listing Page STYLES // START ========== */

.gallery-container {
  clear: both;
  width: 100%;
  float: left;
  margin-top: 10px;
}

.gallery-detail {
    clear: both;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 22px 15px;
}
.logo {
	margin-bottom:35px;
}

.logo img {
	float:left;
}

.gallery-detail .herobanner {
	margin-top:25px;
}

.gallery-detail h1 {
    font-size: 32px;
    font-weight: 700;
    color: #252525;
    border-top: 1px solid #c5c5c5;
    border-bottom: 1px solid #c5c5c5;
    padding: 6px 0;
    margin-top: 35px;
}

.gallery {
  width: 100%;
  float: left;
  position: relative;
  margin-top: 14px;
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
}

.white-box {
  width: 100%;
  max-width: 530px;
  height: 446px;
  float: right;
}

.defaultimg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 446px;
  max-height: 446px;
  -webkit-animation: cssAnimation 0.0661s 1 ease-in-out;
  -moz-animation: cssAnimation 0.0661s 1 ease-in-out;
  -o-animation: cssAnimation 0.0661s 1 ease-in-out;
}
.defaultimg img {
    margin: auto;
    width: auto;
    max-height: 440px;
    position: absolute;
    top: 17px;
    right: 119px;
    max-width: 700px;
}

.thumbnails {
    list-style: none;
    float: left;
    margin-top: 45px;
    max-width: 140px;
}

.thumbnails li {
    display: inline-block;
    width: 120px;
    height: 120px;
}

.thumbnails .item-container {
    cursor: pointer;
    width: 116px;
    height: 116px;
    position: relative;
    border: 2px solid #ededed;
}

.thumbnails .item-container img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    max-width: 100px;
    max-height: 100px;
}

.thumbnails .item-container:hover {
  border: 2px solid #cdcdcd;
}
@media (min-width: 1101px){
	.defaultimg {
		left: 139px !important;
		width: calc(100% - 139px);
		max-width: calc(100% - 139px);
	}
.thumbnails .gallery-content {
		left: 139px !important;
		width: calc(100% - 139px);
		max-width: calc(100% - 93px);
	}
	.desktophidden {
		display:none;
	}
}
.thumbnails .gallery-content {
  display: none;
  position: absolute;
  top: 0;
  left:0;
  right: 0;
  bottom: 0;
  height: 446px;
  max-height: 446px;
}

.thumbnails .item-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.thumbnails .gallery-content img {
    position: absolute;
    top: 17px;
    right: 119px;
    bottom: 0;
    margin: 0 auto;
    max-width: 700px;
    max-height: 430px;
}

.thumbnails li:hover .gallery-content#image1 {
  display: block;
  -webkit-animation: cssAnimation 0.0661s 1 ease-in-out;
  -moz-animation: cssAnimation 0.0661s 1 ease-in-out;
  -o-animation: cssAnimation 0.0661s 1 ease-in-out; 
}

.thumbnails li:hover .gallery-content#image2 {
  display: block;

  -webkit-animation: cssAnimation 0.0661s 1 ease-in-out;
  -moz-animation: cssAnimation 0.0661s 1 ease-in-out;
  -o-animation: cssAnimation 0.0661s 1 ease-in-out; 
}

.thumbnails li:hover .gallery-content#image3 {
  display: block;

  -webkit-animation: cssAnimation 0.0661s 1 ease-in-out;
  -moz-animation: cssAnimation 0.0661s 1 ease-in-out;
  -o-animation: cssAnimation 0.0661s 1 ease-in-out; 
}

.thumbnails li:hover ~ .defaultimg {
  display: none;
}


@-webkit-keyframes cssAnimation {
from { -webkit-transform: rotate(0deg) scale(0.48) skew(-180deg) translate(0px); }
to { -webkit-transform: rotate(0deg) scale(1.0) skew(-180deg) translate(0px); }
}
@-moz-keyframes cssAnimation {
from { -moz-transform: rotate(0deg) scale(0.48) skew(-180deg) translate(0px); }
to { -moz-transform: rotate(0deg) scale(1.0) skew(-180deg) translate(0px); }
}
@-o-keyframes cssAnimation {
from { -o-transform: rotate(0deg) scale(0.48) skew(-180deg) translate(0px); }
to { -o-transform: rotate(0deg) scale(1.0) skew(-180deg) translate(0px); }
}




.tabs {
  clear: both;
  width: 100%;
  float: left;
  margin-top: 14px;
  border-top: 1px solid #c5c5c5;
  padding-top: 15px;
}

.tabs:after {
  content: '';
  display: table;
  clear: both;
}

.tabs input[type=radio] {
  display: none;
}

.tabs label {
  float: left;
  font-size: 18px;
  font-weight: 900;
  color: #252525;
  height: 55px;
  line-height: 55px;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  text-transform: uppercase;
  box-sizing: border-box;
  background: #fff;
  border-right: 3px solid #252525;
  border-top: 3px solid #252525;
  border-bottom: 3px solid #252525;
}

.tabs .tab1,
.tabs .tab2,
.tabs .tab3,
.tabs .tab4,
.tabs .tab5,
.tabs .tab6,
.tabs .tab7 {
  width: 25%;
}

.tabs .tab1 {
  border-left: 3px solid #252525;
}

.features {
	clear:both;
	border-bottom: 1px solid #c5c5c5;
}

.features img {
    display: inline-block;
    padding: 20px 2px 16px;
}

.tabs [id^="tab"]:checked + label {
  background: #252525;
  box-sizing: border-box;
  color: #ffffff;
}

.tab-content {
  display: none;
  width: 100%;
  float: left;
  padding: 36px 0% 45px 1.7%;
  min-height: 200px;
  box-sizing: border-box;
  background: #fff;
  border-bottom: 1px solid #c5c5c5;
}

#tab1:checked ~ #tab-content1,
#tab2:checked ~ #tab-content2,
#tab3:checked ~ #tab-content3,
#tab4:checked ~ #tab-content4,
#tab5:checked ~ #tab-content5,
#tab6:checked ~ #tab-content6 {
  display: block;
}

.tab-content * {
  -webkit-animation: scale 0.7s ease-in-out;
  -moz-animation: scale 0.7s ease-in-out;
  animation: scale 0.7s ease-in-out;
}

.tab-content h1, .tab-content h2, .tab-content h3, .tab-content h4, .tab-content h5  .tab-content h6 {
  color: #333;
  margin: 15px 0px;
  letter-spacing: 1px;
}

.tab-content h1 {
  font-size: 26px;
}

.tab-content h2 {
  font-size: 24px;
}

.tab-content h3 {
  font-size: 22px;
}

.tab-content h4 {
  font-size: 20px;
}

.tab-content h5 {
  font-size: 18px;
}

.tab-content h6 {
  font-size: 16px;
}

.tab-content p {
  padding: 5px 0;
  line-height: 23px;
  font-size: 15px;
  font-weight: 400;
  margin-bottom: 12px;
  letter-spacing: 0.1px;
}

.tab-content p,
.tab-content a {
  color: #252525;
}

.tab-content ol, .tab-content ul {
  margin-left: 4px;
  font-size: 15px;
  color: #252525;
  line-height: 23px;
}

.tab-content ol ol li {
  list-style-type: lower-alpha;
}

.tab-content ol ol ol li {
  list-style-type: lower-roman;
}

.tab-content ul {
  list-style-type: none;
  padding-bottom: 6px;
}

.tab-content ul ul li {
  list-style-type: circle;
}

.tab-content ul ul ul li {
  list-style-type: square;
}

@keyframes scale {
  0% { 
  transform: scale(0.9);
  opacity: 0;
    }

  50% {
  transform: scale(1.01);
  opacity: 0.5;
    }

  100% { 
  transform: scale(1);
  opacity: 1;
  }
}

/* ========== Listing Page STYLES // END ========== */







/* ========== Footer STYLES // START ========== */

footer {
  clear: both;
  width: 100%;
  float: left;
  text-align: center;
  padding-top: 61px;
  padding-bottom: 49px;
}

footer .payment-info img,
footer .logo-footer img {
  display: inline-block;
}

footer .payment-info {
  clear: both;
  width: 100%;
  float: left;
  margin-bottom: 24px;
}

footer .logo-footer {
  clear: both;
  width: 100%;
  float: left;
  margin-bottom: 22px;
}


footer .copyrights-info span {
  display: block;
}
/* ========== Footer STYLES // END ========== */




/* ========== RESPONSIVE STYLES // START ========== */

@media (max-width: 1100px){
	.gallery-detail {
		max-height:1100px;
		padding:20px 0;
	}
	.gallery-detail img {
		margin:0 auto;
	}
	
	.gallery-detail h1 {
	    text-align: center;
	}
	
	.gallery {
		float:none;
		text-align:center;
	}
	
	.logo img {
		float:none;
	}
	.white-box {
		float:none;
	    margin: 0 auto;
	}
	
	.thumbnails {
		float: none;
		display: inline;
		text-align: center;
		margin: 0 auto;
	}
	
	.defaultimg {
		left:0;
	}
	
	.defaultimg img {
		right: 0;
		left: 0;
		max-height:420px;
	}
	
	.content {
		box-sizing:border-box;
		max-width: 1070px;
	}
	
	.thumbnails .gallery-content {
		height:436px;
	}
	.thumbnails .gallery-content img {
		right: 0;
		bottom: 0;
		left: 0;
		max-width: none;
		max-height: 420px;
	}   
	
	.gallery-detail .herobanner {
		width:97%;
	
		margin:25px auto 0;
}
	.mobilehidden {
		display:none;
	}
}
@media (max-width: 980px){
   
}

@media (max-width: 900px){

  .tabs .tab1, .tabs .tab2, .tabs .tab3, .tabs .tab4, .tabs .tab5, .tabs .tab6, .tabs .tab7 {
    width: 100%;
  }

  .tabs .tab1 {
    border-top: 3px solid #252525;
  }

  .tabs label {
    border-top: none;
    border-left: 3px solid #252525;
  }
}

@media (max-width: 768px){
  
}

@media (max-width: 736px){
  .logo {
    float: none;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 270px;
  }
}

@media (max-width: 667px){

}

@media (max-width: 640px){

}

@media (max-width: 568px){
  .content {
	  padding:0;
  }
  .features img {
	  width:48.6%;
  }
}

@media (max-width: 430px) {

}

@media (max-width: 414px){
.defaultimg img,
.thumbnails .gallery-content img {
	max-width:400px;
}
.thumbnails .item-container {
    cursor: pointer;
    width: 110px;
    height: 110px;
}
.thumbnails .item-container img {
    max-width: 90px;
    max-height: 90px;
}

.thumbnails li {
    display: inline-block;
    width: 113px;
    height: 113px;
}

.features img {
    width: 100%;
    max-width: 273px;
    margin: 0 auto;
    text-align: center;
    display: block;
}
}

@media (max-width: 385px){
.defaultimg img,
.thumbnails .gallery-content img {
	max-width:380px;
}
.thumbnails .item-container {
    cursor: pointer;
    width: 108px;
    height: 108px;
}
.thumbnails .item-container img {
    max-width: 90px;
    max-height: 90px;
}

.thumbnails li {
    display: inline-block;
    width: 108px;
    height: 108px;
}
}

@media (max-width: 360px){

}

@media (max-width: 320px){
  
}

/* ========== RESPONSIVE STYLES // END ========== */

#footerwrap {
float: left;
width: 100%;
background: #fff;
padding-bottom: 10px;
}

.dbusfoot {
background-image: url('https://accessmylogin.s3.amazonaws.com/assets/swift-bottom-seperator.png');
margin: 20px auto 0;
max-width: 617px;
height: 20px;
background-repeat: no-repeat;
background-position: center; 
clear:both;
position:relative;
top:10px;
}

.dbus {
text-align: center;
background-image: url('https://accessmylogin.s3.amazonaws.com/assets/swift-bottom-logo.png');
float: left;
width: 100%;
background-repeat: no-repeat;
background-position: center bottom;
height: 70px;
margin-bottom:30px;
}