/* KLIX Landing Page
* http://themeforest.net/author/SaurabhSharma
----- TABLE OF CONTENTS ---------
1. RESET BROWSER DEFAULTS
2. TYPOGRAPHY
3. STRUCTURE
4. HEADER
5. FEATURED AREA
6. MAIN CONTENT
7. FOOTER
8. MISCELLANEOUS
------------------------------- */
/* -- 1. RESET BROWSER DEFAULTS -- */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, code, em, i, font, img, small, strike, strong, ol, ul, li { margin:0px; padding:0px; border:0px; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline }
:focus { outline: 0 }
a { border:none; outline:none }
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner { border: none }
/* -- 2. TYPOGRAPHY -- */
body { margin:0px auto; font:12px/18px Arial, Helvetica, sans-serif; text-align:center; color:#666; background:#f0f0f0 url(./images/pat2.jpg); background-attachment:fixed; border-top:7px solid #e0e0e0 }
p, ul, ol { margin-bottom: 18px }
ul ul, ul ol, ol ul, ol ol { margin-bottom:0px }
ul { list-style:disc; margin-left: 18px }
ul ul { list-style:circle }
ul ul ul { list-style:square }
ol { list-style:decimal; margin-left: 18px }
ol ol { list-style:lower-alpha }
ol ol ol { list-style:lower-roman }
abbr, acronym { cursor:help }
hr { background-color: #e5e5e5; border: 0; clear: both; height: 1px; margin-bottom: 18px }
dl { margin: 0px 0px 18px 0px }
dt { font-weight: bold }
dd { margin: 0px 0px 9px 18px }
ins { border:none; color:#333 }
del { text-decoration:line-through; color:#999 }
h1, h2, h3, h4, h5 { font-family: "Droid Sans", Arial, Helvetica, Geneva, sans-serif; color:#333; font-weight:normal }
h1 { font-size: 24px; line-height: 34px; margin-bottom:13px }
h2 { font-size: 21px; line-height: 30px; margin-bottom:11px }
h3 { font-size: 17px; line-height: 32px; margin-bottom:11px }
h4 { font-size: 14px; line-height: 21px; margin-bottom:12px }
h5 { font-size: 12px; line-height: 18px; margin-bottom:12px }
h1 a, h2 a, h3 a, h4 a, h5 a { color:#333 }
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover { color:#000 }
a { color:#6699cc; text-decoration:none }
a:hover { color:#ff6633; text-decoration:none }
b, strong { font-weight:bold }
em, i { font-style:italic }
pre,code { font:11px/18px "Consolas", Courier New, Courier, monospace; color:#333; padding:4px 6px; background:#f7f7f7; margin:0px 0px 18px; border:1px solid #e7e7e7 }
code { padding:0px; background-image:none; border:none }
pre { white-space:pre-wrap; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word }
blockquote {
color:#777;
font-size:11px;
line-height:18px;
margin:0px 0px 18px;
border-left:4px solid #eaeaea;
padding-left:12px
}
small, .small { font-size:11px; color:#999; line-height:16px }
.tiny { font-size:10px; color:#888 }
.big { font-size:14px; line-height:21px }
/* -- 3. STRUCTURE -- */
.container_shadow { width:992px; padding:4px; overflow:hidden; margin:0px auto 9px; text-align:left; background:transparent url(./images/black_2.png) }
.container { width:990px; overflow:hidden; text-align:left; background:#fff; border:1px solid #d7d7d7 }
.full, .three_fourth, .half, .three_eighth, .three_sixteenth, .one_third, .two_third, .one_fourth, .one_fifth, .two_fifth, .three_fifth, .four_fifth, .one_sixth, .five_sixth { float:left; position:relative; overflow:hidden; margin-bottom:12px; margin-right:30px }
.full{ clear:both; float:none; width:930px; margin-right:0px }
.three_fourth { width:690px }
.half { width:450px }
.morehalf { width:550px }
.three_eighth { width:330px}
.one_third { width:290px}
.one_dos { width:390px}
.two_third { width:610px }
.one_fourth {
width:210px
}
.one_fifth { width:162px }
.two_fifth { width:354px }
.three_fifth { width:546px }
.four_fifth { width:738px }
.one_sixth { width:130px }
.five_sixth { width:770px }
.three_sixteenth { width:150px }
/* -- 4. HEADER -- */
.header { width:990px; position:relative; overflow:hidden; margin:0px auto; text-align:left }
.logo {
float:left;
width:450px;
margin-top: 15px;
margin-right: 30px;
margin-bottom: 15px;
margin-left: 10px;
}
.logo img { display:block }
.callout { float:right; text-align:right; width:450px; margin:30px 30px 0px 0px }
ul.social { margin:17px 0px 0px; padding:0px; list-style:none; float:right }
ul.social li { float:left; margin-right:4px }
ul.social li:last-child { margin-right:0px }
ul.social li.call { margin-right:10px; padding-right:10px; border-right:1px solid #ccc; font-family:"Droid Sans", Arial, Helvetica, sans-serif; line-height:16px }
ul.social li.call span {
font-size:18px;
color:#5EB9DC;
font-weight:bold
}
ul.social li a { width:16px; height:16px; display:block; background:url(./images/social_sprite.png) 0px 0px no-repeat }
ul.social li a.twitter { background-position:0px 0px }
ul.social li a.twitter:hover { background-position:0px -20px }
ul.social li a.facebook { background-position:-20px 0px }
ul.social li a.facebook:hover { background-position:-20px -20px }
ul.social li a.plus { background-position:-40px 0px }
ul.social li a.plus:hover { background-position:-40px -20px }
ul.social li a.skype { background-position:-60px 0px }
ul.social li a.skype:hover { background-position:-60px -20px }
/* -- 5. FEATURED AREA -- */
.featured { position:relative; overflow:hidden; border-bottom:1px solid #e7e7e7 }
.featured img { display:block }
.promo { position:absolute; padding:30px; width:420px; height:318px; left:0px; top:0px; background:transparent url(./images/black_70.png); z-index:999 }
.promo h1 { color:#fff }
.promo big, .promo p { color:#eee }
.promo small { color:#ccc }
/* -- Cycle Slider -- */
ul.cycle_slider { position:relative; overflow:hidden; width:990px; height:378px; list-style:none; margin:0px; padding:0px }
ul.cycle_slider li { width:990px; height:378px }
ul.cycle_slider li img { float:left }
.show_desc { position:absolute; font-size:14px; left:8px; bottom:8px; padding:8px 11px; background:#000; color:#fff; width:auto; max-width:440px; z-index:89; display:none }
ul.cycle_nav { position:absolute; overflow:hidden; margin:0px; padding:0px; list-style:none; bottom:10px; right:8px; z-index:999 }
ul.cycle_nav li { float:left }
ul.cycle_nav a { display:block; width:10px; height:10px; background:url(./images/bullets.png) 0px 0px no-repeat; text-indent:-9999px; border:0; margin-right:2px; float:left }
ul.cycle_nav li.activeSlide a { background-position: 0px -14px }
/* -- Nivo Slider -- */
#nivo_slider { position:relative; overflow:hidden; width:990px; height:378px; margin:0px; padding:0px; background:#fff url(./images/loading.gif) 50% 50% no-repeat }
.nivo-controlNav { position:absolute; bottom:10px; right:8px; z-index:9999 }
.nivo-controlNav a { display:block; width:10px; height:10px; background:url(./images/bullets.png) 0px 0px no-repeat; text-indent:-9999px; border:0; margin-right:2px; float:left }
.nivo-controlNav a.active { background-position: 0px -14px }
/* -- 6. MAIN CONTENT -- */
.content { position:relative; overflow:hidden; background:transparent url(./images/cross_lines.png) top repeat-x }
.wrap, .wrap_grey, .wrap_secondary, wrap_tercero { position:relative; overflow:hidden; padding:35px 30px 0px }
.wrap_grey, .wrap_secondary { padding:28px 30px 0px; background:#f7f7f7 url(./images/inner_shade.png) bottom repeat-x; border-top:1px solid #eaeaea; color:#777 }
.wrap_secondary { background:#fff url(./images/inner_shade.png) bottom repeat-x; color:#888 }
.secondary_cta { position:relative; overflow:hidden; padding:15px 30px 3px; background:#333 url(./images/sec_cta_bg.png) bottom repeat-x }
.sc_heading { font-size:17px; color:#fff; margin:0px; line-height:36px }
ul.products { margin:0px 0px 14px !important; position:relative; overflow:hidden; padding:0px; list-style:none }
ul.products li { float:left; margin:0px 6px 6px 0px }
ul.products li img { background:#fff; padding:3px; border:1px solid #e5e5e5; display:block; width:98px; height:64px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
form.subscribe { position:relative; overflow:hidden; margin-bottom:18px }
.subscribe input { border:1px solid #e5e5e5; background:#fff url(./images/inner_shade.png) 0px -1px repeat-x; color:#888; padding:6px 4px; margin-bottom:6px; width:200px; font-family:Arial, Helvetica, sans-serif;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.subscribe textarea { border:1px solid #e5e5e5; background:#fff url(./images/inner_shade.png) 0px -1px repeat-x; color:#888; padding:6px 4px; margin-bottom:6px; width:200px; font-family:Arial, Helvetica, sans-serif;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.subscribe input:focus { border-color:#ccc; background-position:0px -5px }
.subscribe textarea:focus { border-color:#ccc; background-position:0px -5px }
.subscribe input.submit { width:auto; font-size:11px; font-weight:bold; padding:7px 6px;
color: #fff;
background:#cc3300 url(./images/btn.png) top repeat-x;
border:1px solid #b92800;
text-shadow: 0px -1px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 1px 0px rgba(0,0,0,0.05);
-webkit-box-shadow: 0px 1px 0px rgba(0,0,0,0.05);
box-shadow: 0px 1px 0px rgba(0,0,0,0.05);
-moz-border-radius:3px;
-webkit-border-radius: 3px;
border-radius:3px;
cursor: pointer;
}
.subscribe input.submit:hover { color:#fff; background-color:#e23800; border-color:#cd2c00}
.subscribe input.submit:active { color:#ccc; background-color:#a42900; background-position:0px -4px; border-color:#942000;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none
}
#success, #error { display:none; color:#666; font-size:11px; line-height:16px; padding:4px 8px; background:#d7feba; border:1px solid #c8ecad }
#error { background:#ffffe0; border:1px solid #e6db55; color:#333 }
input.error { border-color:#cc0000 }
.subscribe_notifier { position:relative; overflow:hidden; padding:30px }
/* -- 7. FOOTER -- */
.footer { width:930px; margin:0px auto 20px; position:relative; overflow:hidden; text-align:left; font-size:11px; color:#888 }
.footer_left { float:left; width:450px; margin-right:30px }
.footer_right { float:right; width:450px; text-align:right }
.footer a { color:#666; border-bottom:1px dotted #bbb }
.footer a:hover { color:#333 }
ul.clients { margin:0px 0px 12px 0px; position:relative; overflow:hidden; padding:0px; list-style:none }
ul.clients li { float:left; margin:0px 6px 6px 0px; line-height:0px }
ul#twitter_update_list { list-style:none; margin:0px 0px 18px; padding:0px }
ul#twitter_update_list li { padding:5px 0px 6px; border-bottom:1px solid #efefef }
ul#twitter_update_list li span { display:block }
ul#twitter_update_list li span a { color:#6699cc }
ul#twitter_update_list li span a:hover { color:#ff6633; text-decoration:none }
ul#twitter_update_list li a { color:#aaa }
ul#twitter_update_list li a:hover { color:#666 }
/* -- 8. MISCELLANEOUS -- */
.highlight { color:#ffcc00 }
.preload { display:block; width:100%; height:100%; background:transparent url(./images/loading.gif) 50% 50% no-repeat }
.zoom { position:absolute; background:#333 url(./images/zoom.png) 50% 50% no-repeat; cursor:pointer }
.top_btn { position:fixed; right:10px; bottom:10px }
.top_btn a { display:block; width:20px; height:20px; background:transparent url(./images/top.png) 0px 0px no-repeat }
.top_btn a:hover { background-position:0px -30px }
ul.checklist { margin:0px 0px 15px; padding:0px; list-style:none }
ul.checklist li { padding:0px 0px 3px 20px; background:url(./images/check.png) 0px 5px no-repeat }
ul.linklist { margin:0px 0px 18px; padding:0px; list-style:none }
ul.linklist li { padding:5px 0px 6px; border-bottom:1px solid #efefef }
ul.linklist li a { color:#888 }
ul.linklist li a:hover { color:#333 }
.btn, .btn:visited {
position: relative;
display: inline-block;
padding: 9px 12px 10px;
font-size:18px;
line-height:18px;
color: #fff;
background:#cc3300 url(./images/btn.png) top repeat-x;
border:1px solid #b92800;
text-shadow: 0px -1px 0px rgba(0,0,0,0.1);
-moz-box-shadow: 0px 1px 0px rgba(0,0,0,0.05);
-webkit-box-shadow: 0px 1px 0px rgba(0,0,0,0.05);
box-shadow: 0px 1px 0px rgba(0,0,0,0.05);
-moz-border-radius:3px;
-webkit-border-radius: 3px;
border-radius:3px;
cursor: pointer;
}
.btn:hover { color:#fff; background-color:#e23800; border-color:#cd2c00 }
.btn:active { color:#ccc; background-color:#a42900; background-position:0px -4px; border-color:#942000;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.yellow, .yellow:visited { background-color:#ffc000; color:#000; border-color:#ebb100; text-shadow:0px 1px 0px rgba(255,255,255,0.3) }
.yellow:hover { color:#000; background-color:#ffcc00; border-color:#eabb00 }
.yellow:active { color:#000; background-color:#e0a900; border-color:#ce9b00 }
.ico_left { float:left; margin-right:10px }
.clearfix { display:block }
.clearfix:after, .clearf { content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0; margin:0px; padding:0px }
.last { margin-right:0px }
/* Live Preview Option Panel Styles */
.option_panel { position:fixed; width:180px; padding:18px 18px 6px; border:1px solid #e7e7e7; background:#fff; top:55px; left:0px; text-align:left; z-index:99999 }
.option_btn { position:absolute; width:21px; height:71px; top:35%; right:-22px }