Auctiva_casexmode_template2

Developer
Size
9,123 Kb
Views
12,144

How do I make an auctiva_casexmode_template2?

What is a auctiva_casexmode_template2? How do you make a auctiva_casexmode_template2? This script and codes were developed by Ben Song on 05 November 2022, Saturday.

Auctiva_casexmode_template2 Previews

Auctiva_casexmode_template2 - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Auctiva_casexmode_template2</title>
</head>
<body>	<table align="center" style="border-spacing: 0px; width: 100%;">	<tr>	<td>	<div id="ds_div">	<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>[TITLE]</title>
<link href="https://fonts.googleapis.com/css?family=Arimo:400,400i,700|Raleway:700" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
<div class="html">
<div class="body">
<div clas="wrap">
<section class="main-wrap">
<main class="wrap">
<div class="inner-wrap flex-main"><div style="margin:0 auto; margin-top:150px; width:100%;font-size: 28px;font-size: 2.8rem;font-weight: 600;color: #4b4b4b;"><h1>[TITLE]</h1></div>
<div class="prod-img-cont xgallery">
<div class="gal-cont">
<div class="gal-cells">
<div class="img-large hero-img">
<div>
<!-- REPLACE IMG URL TO SHOW INITIAL 1ST IMAGE -->
<img src="[IMAGE1_URL]">
<!-- END! -->
</div></div><span class="img-group"><div class="img-small"><div>
<!-- THUMBNAILS HERE: -->
<!-- (THUMBNAIL) 1ST IMAGE IN CAROUSEL -->
<img src="[IMAGE1_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE1_URL]">
<!-- (THUMBNAIL) 1ST IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 2ND IMAGE IN CAROUSEL -->
<img src="[IMAGE2_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE2_URL]">
<!-- (THUMBNAIL) 2ND IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 3RD IMAGE IN CAROUSEL -->
<img src="[IMAGE3_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE3_URL]">
<!-- (THUMBNAIL) 3RD IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 4TH IMAGE IN CAROUSEL -->
<img src="[IMAGE4_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE4_URL]">
<!-- (THUMBNAIL) 4TH IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 5TH IMAGE IN CAROUSEL -->
<img src="[IMAGE5_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE5_URL]">
<!-- (THUMBNAIL) 5TH IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 6TH IMAGE IN CAROUSEL -->
<img src="[IMAGE6_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE6_URL]">
<!-- (THUMBNAIL) 6TH IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 7TH IMAGE IN CAROUSEL -->
<img src="[IMAGE7_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE7_URL]">
<!-- (THUMBNAIL) 7TH IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 8TH IMAGE IN CAROUSEL -->
<img src="[IMAGE8_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE8_URL]">
<!-- (THUMBNAIL) 8TH IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 9TH IMAGE IN CAROUSEL -->
<img src="[IMAGE9_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE9_URL]">
<!-- (THUMBNAIL) 9TH IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 10TH IMAGE IN CAROUSEL -->
<img src="[IMAGE10_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE10_URL]">
<!-- (THUMBNAIL) 10TH IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 11TH IMAGE IN CAROUSEL -->
<img src="[IMAGE11_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE11_URL]">
<!-- (THUMBNAIL) 11TH IMAGE IN CAROUSEL - END! -->
</div></div></span><span class="img-group"><div class="img-small"><div>
<!-- (THUMBNAIL) 12TH IMAGE IN CAROUSEL -->
<img src="[IMAGE12_URL]"></div></div>
<div class="img-large"><div>
<img src="[IMAGE12_URL]">
<!-- (THUMBNAIL) 12TH IMAGE IN CAROUSEL - END! -->
</div>
</div>
</span>
</div>
</div>
</div>
<div class="prod-desc-cont">
[DESCRIPTION]
</div>
<div class="sellers">
<div class="card forestGreen">
<i class="fa fa-shield" aria-hidden="true"></i>
<div>
<h3>Trusted Merchant</h3>
<p>You are guaranteed a secure purchase.</p>
</div>
</div>
<div class="card orange">
<i class="fa fa-truck" aria-hidden="true"></i>
<div>
<h3>Express Delivery</h3>
<p>We deliver the order within <b>12 hours</b>.</p>
</div>
</div>
<div class="card dodgerBlue">
<i class="fa fa-comments" aria-hidden="true"></i>
<div>
<h3>Customer Support</h3>
<p>Where here to help with any questions you may have.</p>
</div>
</div>
</div>
</div>
</main>
</section>
<section class="secondary-wrap">
<div class="wrap">
<div class="inner-wrap tabs">
<input class="tabbers" type="radio" name="tabs" id="tab1" checked="">
<label class="tabbers" for="tab1">
<i class="fa fa-heart" aria-hidden="true"></i><span>About Us</span>
</label>
<input class="tabbers" type="radio" name="tabs" id="tab2">
<label class="tabbers" for="tab2">
<i class="fa fa-truck" aria-hidden="true"></i><span> Shipping/Delivery</span>
</label>
<input class="tabbers" type="radio" name="tabs" id="tab3">
<label class="tabbers" for="tab3">
<i class="fa fa-reply-all" aria-hidden="true"></i><span>Return</span>
</label>
<input class="tabbers" type="radio" name="tabs" id="tab4">
<label class="tabbers" for="tab4">
<i class="fa fa-credit-card-alt" aria-hidden="true"></i><span>Payments</span>
</label>
<input class="tabbers" type="radio" name="tabs" id="tab5">
<label class="tabbers" for="tab5">
<i class="fa fa-phone" aria-hidden="true"></i><span>Contact Us</span>
</label>
<div id="tab-content1" class="tab-content">
<h3>About Us</h3>
<p>Since 2009, CaseXmode has been pleased to provide a large collection of wireless accessories. We sell only the highest quality accessories for all products. Our mission is to "offer competitive pricing and excellent customer service."</p>
</div>
<div id="tab-content2" class="tab-content">
<h3>Shipping / Delivery</h3>
<p>Delivery time is 2-7 days for order within the United States. Note: This is an average delivery time. USPS does not guarantee delivery time.
After receiving your payment, your order will usually be shipped the same or next business day. Please disregard weekends and holidays.
We will ship to eBay's provided address only unless buyer's notifies us right after bidding/buying our products(s). In other word, WE ARE NOT RESPONSIBLE for any lost item(s) caused by invalid mailing address.
Local pick up is not allowed.</p>
</div>
<div id="tab-content3" class="tab-content">
<h3>Return</h3>
<p>We have a no hassle return policy within 30 days of purchase.
If you are not satisfied with your purchase, our team will try their best to resolve any issues.
Our return policy is for exchange and/or money back. You can exchange for the same or different item in similar price.
You must return items in new or unused condition with all original materials included with the shipment. Buyers are responsible for the shipping cost for return items.</p>
</div>
<div id="tab-content4" class="tab-content">
<h3>Payment</h3>
<p>We accept Paypal Only!!! Payment is expected within 30 days of purchase. After 30 days have passed, your purchase will automatically be rolled into an unpaid case.
eBay checkout will automatically combine multiple purchases and create a payment amount base on your order.
We are required to collect sales tax only when shipping to California.
Item will be shipped according to eBay address. Due to secure reasons, we are not allowed to address changes through e-mail.</p>
</div>
<div id="tab-content5" class="tab-content">
<h3>Contact Us</h3>
<p>Contact us on eBay's Internal Message System for any questions or concerns you may have.
You can count on us to answer all your questions or concerns within a 24-48 hours period.
We strive to deliver 5-Star customer service to everyone.
We pride ourselves on making sure each and every customer is satisfied after the sale is completed.
Once feedback has been received, our feedback system will automatically leave a positive feedback</p>
</div>
</div>
</div>
</section>
<footer>
<div class="wrap">
<div class="inner-wrap footer">
<ul class="footer-nav">
<li><a href="http://stores.ebay.com/CaseXmode"><i class="fa fa-home" aria-hidden="true"></i>Shop</a></li>
<li><a href="http://stores.ebay.com/casexmode/about-us"><i class="fa fa-info" aria-hidden="true"></i>About Us</a></li>
<li><a href="http://feedback.ebay.com/ws/eBayISAPI.dll?ViewFeedback2&userid=casexmode&&_trksid=p2047675.l2560&rt=nc&iid=230831101683&sspagename=VIP:feedback&ftab=FeedbackAsSeller"><i class="fa fa-star" aria-hidden="true"></i>Feedback</a></li>
<li><a href="http://contact.ebay.com/ws/eBayISAPI.dll?FindAnswers&requested=casexmode&_trksid=p2050430.m2531.l4583&rt=nc"><i class="fa fa-phone" aria-hidden="true"></i>Contact</a></li>
</ul>
<span class="copyright">Copyright © 2016<a href="http://stores.ebay.com/casexmode/">CASEXMODE - All rights reserved.</a></span>
</div>
</div>
</footer>
</div>
</div>
</div></div>	</td>	</tr>
</table><span id="closeHtml"></span>
<div class="navcontainer">
<nav> <div id="logo"> <img src="http://ninepanda.com/xmode/images/logo.png"></div> <label for="drop" class="navtoggle"><img src="https://cdn4.iconfinder.com/data/icons/wirecons-free-vector-icons/32/menu-alt-512.png" width="35px"></label> <input type="checkbox" id="drop" /> <ul class="menu"> <li class="dropdown"> <!-- First Tier Drop Down --> <label for="drop-1" class="toggle">Phone +</label> <a href="#">Shop by Phone</a> <input type="checkbox" id="drop-1"/> <ul id="limheight"> <li><a href="http://stores.ebay.com/CaseXmode/Alcatel-/_i.html?_nkw=temper&_fsub=4928199012&_sid=974019352&_trksid=p4634.c0.m322">Alcatel</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Amazon-/_i.html?_fsub=3374407012&_sid=974019352&_trksid=p4634.c0.m322">Amazon</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Apple-/_i.html?_fsub=2494419012&_sid=974019352&_trksid=p4634.c0.m322">Apple</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Apple-iTouch-/_i.html?_fsub=2494424012&_sid=974019352&_trksid=p4634.c0.m322">Apple iTouch</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Asus-/_i.html?_fsub=6160428012&_sid=974019352&_trksid=p4634.c0.m322">Asus</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Blackberry-/_i.html?_nkw=temper&_fsub=4928199012&_sid=974019352&_trksid=p4634.c0.m322">Blackberry</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Coolpad-/_i.html?_fsub=13402121012&_sid=974019352&_trksid=p4634.c0.m322">Coolpad</a></li> <li><a href="http://stores.ebay.com/CaseXmode/HTC-/_i.html?_fsub=2494426012&_sid=974019352&_trksid=p4634.c0.m322">HTC</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Huawei-/_i.html?_fsub=2494428012&_sid=974019352&_trksid=p4634.c0.m322">Huawei</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Kyocera-/_i.html?_fsub=2150732012&_sid=974019352&_trksid=p4634.c0.m322">Kyocera</a></li> <li><a href="http://stores.ebay.com/CaseXmode/LG-/_i.html?_fsub=2494429012&_sid=974019352&_trksid=p4634.c0.m322">LG</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Microsoft-/_i.html?_fsub=10150639012&_sid=974019352&_trksid=p4634.c0.m322">Microsoft</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Motorola-/_i.html?_fsub=2494430012&_sid=974019352&_trksid=p4634.c0.m322">Motorola</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Nokia-/_i.html?_fsub=2494433012&_sid=974019352&_trksid=p4634.c0.m322">Nokia</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Samsung-/_i.html?_fsub=2494431012&_sid=974019352&_trksid=p4634.c0.m322">Samsung</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Sharp-/_i.html?_fsub=8278827012&_sid=974019352&_trksid=p4634.c0.m322">Sharp</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Sony-/_i.html?_fsub=2494435012&_sid=974019352&_trksid=p4634.c0.m322">Sony</a></li> <li><a href="http://stores.ebay.com/CaseXmode/ZTE-/_i.html?_fsub=3141962012&_sid=974019352&_trksid=p4634.c0.m322">ZTE</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Other-Bargain-Bin-/_i.html?_fsub=2689191012&_sid=974019352&_trksid=p4634.c0.m322">Other - Bargain</a></li> <li><a href="http://stores.ebay.com/CaseXmode/Universal-Leather-Pouch-/_i.html?_fsub=4573439012&_sid=974019352&_trksid=p4634.c0.m322">Universal Leather Pouch</a></li> </ul> </li> <li class="dropdown"> <!-- First Tier Drop Down --> <a href="http://stores.ebay.com/casexmode/_i.html?_nkw=temper&submit.x=13&submit.y=12">Tempered Glass</a> </li> <li class="dropdown"><a href="http://stores.ebay.com/casexmode/about-us">About Us</a></li> <li class="dropdown"><a href="FEEDBACK">Feedback</a></li> <li class="dropdown"><a href="http://contact.ebay.com/ws/eBayISAPI.dll?FindAnswers&requested=casexmode&_trksid=p2050430.m2531.l4583&rt=nc">Contact</a></li> </ul>
</nav> <div style="text-align:center;color:#3db9e4;font-size:1.4em;font-style: italic;"><strong>FREE GROUND SHIPPING </strong> ON ALL ORDERS*</div>
</div> <style> body{margin: 0px;}
h1 { font-size: 60px; text-align: center; color: #FFF;
}
h3 { font-size: 30px; line-height: 34px; text-align: center; color: #FFF;
}
a { color: #FFF; }
h1 { margin-top: 100px; text-align: center; font-size: 60px; line-height: 70px;
}
#container { margin: 0 auto; max-width: 890px;
}
p { xtext-align: center; } .navtoggle,.toggle, [id^=drop] { display: none;
}
.navcontainer{background: url(http://ninepanda.com/xmode/images/header_navbg.gif); height: 80px; border-top:#3db9e4 solid 4px; z-index:99999; position: absolute; /*newly added*/ top: 0px;/*newly added*/ width:100%; zoom:100%;
}
nav { margin: 0 auto; padding: 0; max-width:1120px;
}
#logo { display: block; padding: 0 30px; float: left; font-size: 20px; line-height: 60px; margin-top:4px;
}
nav:after { content: ""; display: table; clear: both;
}
nav ul { float: right; padding: 0; margin: 0; list-style: none; position: relative;
}
nav ul li { margin: 0px; display: inline-block; float: left; xbackground-color: #254441; color: #8f8f8f; font-family: 'Open Sans Condensed', sans-serif; text-transform: uppercase; font-weight: bold; xbackground: #e7e8e9; xborder-left: 1px solid #bcbdbc; -ms-transform: skewX(0deg); /* IE 9 */ -webkit-transform: skewX(0deg); /* Safari */ transform: skewX(0deg); border-radius: 4px;
}
nav ul li.dropdown{ margin-top: 10px;}
nav li{ position: relative;
}
nav li a { display: block; position: relative; padding: 10px 20px; color: #0088CC; font-size: 15px; text-decoration: none;
}
.nav > li > a:hover,
.nav > li > a:focus { text-decoration: none; background-color: #eee;
}
.dropdown > li.active > a,
.dropdown > li.active > a:hover,
.dropdown > li.active > a:focus { color: #fff; background-color: #337ab7;
}
nav ul li ul li:hover { background: #000000; }
nav a:hover{ background: #3db9e4; color: #FFF; border-radius: 4px
}
nav li:hover a { background: #3db9e4; color: #FFF; border-radius: 4px; font-weight: 700;
}
nav li li a:hover{ color: #3db9e4; background-color: #FFF;
}
nav ul ul { display: none; position: absolute; top: 45px; background: #3db9e4;
}
nav ul li:hover > ul { display: inherit; }
nav ul ul li { width: 270px; float: none; display: list-item; position: relative;
}
nav ul ul ul li { position: relative; top: -66px; left: 170px;
}
li > a:after { content: ' +'; }
li > a:only-child:after { content: ''; }
#limheight { font-size: 0px; max-height: 500px; /*your fixed height*/ -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; /*3 in those rules is just placeholder -- can be anything*/
}
#limheight li { display: inline-block; /*necessary*/ width:200px; font-size: 16px;
}
/* Media Queries
--------------------------------------------- */
@media all and (max-width : 768px) {
#logo { display: block; padding: 0; width: 100%; text-align: center; float: none;
}
nav { margin: 0; }
#limheight { max-height:830px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; /*3 in those rules is just placeholder -- can be anything*/
}
#limheight li { display: inline-block; /*necessary*/ height: 20px; width:100%;
}
.toggle + a, .navtoggle + a, .menu { display: none; }
.navtoggle {margin-top:-70px; display: block; background-color: ; padding: 0 20px; color: #FFF; font-size: 20px; line-height: 60px; text-decoration: none; border: none; float:right; }
.toggle { display: block; background-color: #3db9e4; padding: 0 20px; color: #FFF; font-size: 20px; line-height: 60px; text-decoration: none; border: none;
}
.toggle:hover { background-color: #000000; }
[id^=drop]:checked + ul { display: block; }
nav ul li.dropdown { margin-top: 0px;
}
nav ul li.dropdown a{ background: #3db9e4; color:#FFF;
}
nav ul li { display: block; width: 100%;
}
nav ul ul .toggle, nav ul ul a { padding: 0 40px; }
nav ul ul ul a { padding: 0 80px; }
nav a:hover, nav ul ul ul a { background-color: #000000; }
nav ul li ul li .toggle, nav ul ul a { background-color: #212121; }
nav ul ul { float: none; position: static; color: #ffffff;
}
nav ul ul li:hover > ul,
nav ul li:hover > ul { display: none; }
nav ul ul li { display: block; width: 100%;
}
nav ul ul ul li { position: static;
}
}
@media all and (max-width : 330px) {
nav ul li { display: block; width: 94%;
}
}
@media (min-width: 992px) { .navcontainer nav > ul > li.dropdown #limheight li a, .navcontainer nav > ul > li.dropdown .dropdown-mega-sub-nav li a { -webkit-transition: margin-top 0.2s ease; -moz-transition: margin-top 0.2s ease; transition: margin-top 0.2s ease; -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; -webkit-perspective: 1000; margin-top: -10px; } .navcontainer nav > ul > li.dropdown:hover > #limheight li a, .navcontainer nav > ul > li.dropdown:hover .dropdown-mega-sub-nav li a { margin-top: 0; }
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, button,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, input, label, legend, textarea,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; box-sizing: border-box; }
.wrap { line-height: 1; height: 100%; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
/* remember to define focus styles! */
:focus { outline: 0; }
/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }
/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }
textarea { resize: none; overflow: auto; }
html { font-size: 62.5%; }
body { font-size: 16px; font-size: 1.6rem; font-family: "Arimo", "Helvetica", "Arial", sans-serif !important; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; color: #808080; }
h1 { font-size: 28px; font-size: 2.8rem; font-weight: 600; color: #4b4b4b; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #dcdcdc; letter-spacing: -1px; line-height: 32px; align-self: flex-start; font-family: "Raleway", "Helvetica", "Arial", sans-serif; }
h2 { font-size: 22px; font-size: 2.2rem; font-weight: 400; color: #4b4b4b; margin-bottom: 10px; font-family: "Raleway", "Helvetica", "Arial", sans-serif; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #dcdcdc; letter-spacing: -1px; }
h3 { font-size: 18px; font-size: 2rem; font-weight: 600; color: #4b4b4b; }
h4 { font-size: 18px; font-size: 1.8rem; color: #4b4b4b; margin-bottom: 20px; font-weight: 600; }
p { margin-bottom: 5px; line-height: 22px; font-size: 16px; font-size: 1.6rem; color: #808080; font-weight: 400; }
p a { display: inline-block; *display: inline; *zoom: 1; text-decoration: underline; } p a:hover { color: #3db9e4; }
span { font-size: 16px; font-size: 1.6rem; color: #808080; display: block; }
a { color: #808080; display: block; text-decoration: none; font-weight: 400; font-size: 16px; font-size: 1.6rem; -webkit-transition: all 0.3s; -o-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } a:hover { color: #d95459; }
ul { font-size: 0; }
ul li,
ol li { font-size: 16px; font-size: 1.6rem; line-height: 28px; }
ul li a,
button { color: #808080; font-size: 16px; font-size: 1.6rem; }
i,
input,
td { font-size: 16px; font-size: 1.6rem; }
small { font-size: 12px; font-size: 1.2rem; }
textarea { font-family: "Arimo", "Helvetica", "Arial", sans-serif; }
html { min-height: 100%; }
.wrap { max-width: 1020px; display: block; margin: 0 auto; font-size: 0; height: inherit; }
.inner-wrap { padding: 2.94118%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; }
.main-wrap { background-color: #FFF; }
.secondary-wrap { background-color: #ececee; }
i { vertical-align: inherit; margin-right: 5px; } i:before { vertical-align: top; }
.card { background-color: #ffffff; box-shadow: -10px 5px 20px 5px rgba(0, 0, 0, 0.05); padding: 20px; margin-bottom: 30px; }
.card p,.card h3{color:#FFF;text-align: left;}
.flex-head { justify-content: space-between; border-bottom: 1px solid #dcdcdc; }
.nav { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; } .nav li a { padding: 0 20px; vertical-align: text-top; } .nav li a i { color: #d95459; }
.logo { display: inline-block; *display: inline; *zoom: 1; font-size: 0; vertical-align: top; text-align: center; } .logo .title { font-size: 40px; font-size: 4rem; font-family: "Raleway", "Helvetica", "Arial", sans-serif; margin-bottom: .5rem; color: #d95459; text-shadow: -1px 1px 0px #d3373d; }
@media only screen and (max-width: 767px) { .flex-head { flex-wrap: wrap; border: 0; padding: 2.94118% 0; } .logo { margin: auto auto 20px; border-bottom: 1px solid #dcdcdc; width: 100%; padding-bottom: 20px; } .nav { margin: auto; flex-wrap: wrap; text-align: center; width: 100%; } .nav li { background: #d95459; display: block; width: 100%; border-top: 1px solid #df7175; border-bottom: 1px solid #d3373d; } .nav li a { color: #ffffff; padding: 10px; } .nav li a i { color: #ffffff; } }
.flex-main { flex-wrap: wrap; }
.prod-img-cont { max-width: 700px; width: 73%; vertical-align: top; } .prod-img-cont > img { box-shadow: -10px 5px 20px 5px rgba(0, 0, 0, 0.05); width: 100%; height: auto; vertical-align: top; margin-top: 0 !important; }
.xgallery { border: 0px solid #2b2b2b; background-color: #FFFFFF; position: relative; } .xgallery .img-group:hover .img-small div { color: #2b2b2b; } .xgallery .img-small div, .xgallery .img-large div { background-color: #fff; } .xgallery .gal-cont { width: 100%; padding-top: 139.39%; } .xgallery .gal-cont .gal-cells { width: 96.96%; height: 83.46%; } .xgallery .gal-cont .img-small { width: 16.60%; height: 90px; margin-top:10px} .xgallery .gal-cont .img-large { width: 98.75%; height: 82.29%; margin: 0.62%; } .xgallery .gal-cont .img-small img { max-width: 93.33%; max-height: 93.33%; } .xgallery .gal-cont .img-large img { max-width: 99.83%; max-height: 99.83%; } .xgallery .gal { position: relative; margin: auto; } .xgallery .gal-cells { position: absolute; left: 0; top: -13%; bottom: 0; right: 0; margin: auto; } .xgallery img { position: absolute; width: auto; height: auto; left: 0; top: 0; bottom: 0; right: 0; margin: auto; } .xgallery .img-small { position: relative; overflow: hidden; float: left; display: block; } .xgallery .img-large { position: absolute; overflow: hidden; display: none; left: 0%; top: 0%; z-index: 1; } .xgallery .img-small div { position: absolute; left: 0%; top: 0%; right: 0%; bottom: 0%; } .xgallery .img-large { display: none; } .xgallery .img-large div { position: absolute; left: 0%; top: 0%; right: 0%; bottom: 0%; } .xgallery .img-large.hero-img { position: relative; display: block; float: left; z-index: 0; } .xgallery .img-group:hover .img-small div { border: 1px solid; } .xgallery .img-group:hover .img-large { display: block; left: 0%; top: 0%; }
.prod-desc-cont { max-width: 460px; width: 27%; padding-left: 0px; }
.desc span { display: inline-block; *display: inline; *zoom: 1; vertical-align: top; font-weight: 600; }
.desc div { display: block; vertical-align: top; margin-bottom: 20px; }
.desc .price { font-size: 40px; font-size: 4rem; color: #d95459; line-height: 0.8; padding-left: 20px; }
.desc .btn { width: 48%; padding: 10px; background-color: #d95459; display: inline-block; *display: inline; *zoom: 1; color: #ffffff; text-align: center; } .desc .btn:first-of-type { margin-right: 4%; } .desc .btn:hover { background-color: #d23339; }
.sellers { width: 100%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; margin-top: 30px; } .sellers .card { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; width: 32%; margin: 0; margin-right: 2%; } .sellers .card:last-of-type { margin-right: 0; } .sellers i { font-size: 39px; font-size: 3.9rem; margin-right: 20px; color: #FFF;} .sellers h3 { margin-bottom: 10px; } .sellers p { display: inline-block; *display: inline; *zoom: 1; min-height: 56px; }
.features{ margin-top:20px;}
.features ul { padding-left: 0px; padding-bottom:20px;
} .features ul li { list-style: disc;margin-left: 20px; }
.colours { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; margin-bottom: 40px; justify-content: space-around;
}
.colours ul { width: 100%; display: flex; flex-wrap: wrap;
}
.colours span { display: block; padding: 10px; margin-bottom: 10px; background-color: #2d2d2d; border-radius: 3px; text-align: center; color: white; font-weight: bold;
}
.colours li { padding-right: 10px; width: 25%;
}
.colours span.red-temp{background-color:#E42528;}
.colours span.blue-temp{background-color:#3498db;}
.colours span.green-temp{background-color:#a5c63b;}
.colours span.orange-temp{background-color:#ffa800;}
.colours span.pink-temp{background-color:#f47cc3;}
.colours span.watermelon-temp{background-color:#d95459;}
.colours span.yellow-temp{background-color:#ffcd02;}
.half { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; width: 100%; margin-bottom: 40px;
}
.item { width: 50%;
}
.item.img { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
}
.item iframe{
width:100%!important;
height: 360px!important;
}
.item img {width: 350px;height: 350px;margin-left: auto;}
.inner-wrap.tabs p { margin-bottom: 40px;
}
@media only screen and (max-width: 767px) { .prod-img-cont, .prod-desc-cont { max-width: 100%; width: 100%; display: block; padding: 0; } .prod-img-cont { margin-bottom: 20px; } .desc .btn { width: 100%; } .desc .btn:first-of-type { margin-bottom: 10px; margin-right: 0; }
.card p,.card h3{text-align: center;} .sellers { flex-wrap: wrap; text-align: center; } .sellers .card { width: 100%; margin-bottom: 10px; margin-right: 0; justify-content: center; } .sellers p { min-height: auto; } }
.tabs { float: none; list-style: none; padding-top: 0; flex-wrap: wrap; } .tabs:after { content: ''; display: table; clear: both; } .tabs input[type=radio] { display: none; } .tabs label { display: block; float: left; xwidth: 32%; color: #808080; font-size: 30px; font-size: 3rem; text-align: center; cursor: pointer; -webkit-transition: all 0.3s; -o-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; vertical-align: super; padding: 10px; } .tabs label span { display: inline-block; *display: inline; *zoom: 1; vertical-align: text-top; color: #808080; line-height: 2.5; } .tabs label i { padding: 5px; vertical-align: bottom; } .tabs label:hover, .tabs label:hover span { color: #c9c9c9; } .tabs h3 { margin-bottom: 20px; font-size: 24px; font-size: 2.4rem; }
.tab-content { display: none; width: 100%; float: left; padding: 30px; box-sizing: border-box; background-color: #ffffff; }
.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; }
@keyframes scale { 0% { transform: scale(0.9); opacity: 0; } 50% { transform: scale(1.01); opacity: 0.5; } 100% { transform: scale(1); opacity: 1; } }
.tabs [id^="tab"]:checked + label { background: #3db9e4; color: #ffffff; } .tabs [id^="tab"]:checked + label:hover, .tabs [id^="tab"]:checked + label:hover span { color: #ffffff; } .tabs [id^="tab"]:checked + label span { color: #ffffff; }
#tab1:checked ~ #tab-content1,
#tab2:checked ~ #tab-content2,
#tab3:checked ~ #tab-content3,
#tab4:checked ~ #tab-content4,
#tab5:checked ~ #tab-content5{ display: block; }
.colours { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; margin-bottom: 40px; justify-content: space-around;
}
.colours ul { width: 100%; display: flex; flex-wrap: wrap;
}
.colours span { display: block; padding: 10px; margin-bottom: 10px; background-color: #2d2d2d; border-radius: 3px; text-align: center; color: white; font-weight: bold;
}
.colours li { padding-right: 10px; width: 25%;
}
.colours span.red-temp{background-color:#E42528;}
.colours span.blue-temp{background-color:#3498db;}
.colours span.green-temp{background-color:#a5c63b;}
.colours span.orange-temp{background-color:#ffa800;}
.colours span.pink-temp{background-color:#f47cc3;}
.colours span.watermelon-temp{background-color:#d95459;}
.colours span.yellow-temp{background-color:#ffcd02;}
.half { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; width: 100%; margin-bottom: 40px;
}
.item { width: 50%;
}
.item.img { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
}
.item iframe{
width:100%!important;
height: 360px!important;
}
.item img {width: 350px;height: 350px;margin-left: auto;}
.inner-wrap.tabs p { margin-bottom: 40px;
}
@media only screen and (max-width: 767px) { .colours li{ width:50%; } .item { width: 100%;
} .item img { display:none;
} .half { flex-wrap: wrap; } .tabbers { display: none !important; } .tab-content { display: block; } }
footer { background: #383838; } footer .footer { flex-wrap: wrap; text-align: center; } footer ul { width: 100%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: center; margin-bottom: 50px; } footer ul a { padding: 0 20px; vertical-align: text-bottom; color: #3db9e4; } footer ul a:hover { color: #388bd1; } footer .footer-nav { border-bottom: 1px solid #808080; padding-bottom: 2.94118%; } footer .contact li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } footer .contact li a { color: #d95459; } footer .copyright { width: 100%; } footer .copyright a { color: #3db9e4; } footer .copyright a img { vertical-align: middle; }
@media only screen and (max-width: 767px) { footer ul { flex-wrap: wrap; text-align: center; } footer ul li { width: 100%; margin-bottom: 10px; } footer ul li:last-of-type { margin-bottom: 0; } footer .contact li { justify-content: space-between; } }
.forestGreen { background: #7fc242;
}
.orange { background: #ff8a3c;
}
.dodgerBlue { background: #388bd1;
} </style>
</body>
</html>
Auctiva_casexmode_template2 - Script Codes
Auctiva_casexmode_template2 - Script Codes
Home Page Home
Developer Ben Song
Username speedz55
Uploaded November 05, 2022
Rating 3
Size 9,123 Kb
Views 12,144
Do you need developer help for Auctiva_casexmode_template2?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Ben Song (speedz55) Script Codes
Create amazing SEO content with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!