/*
  Theme Name: Fabby - One Product Shop Template
  Theme URL: http://www.codexmart.net/tf/fabby
  Author: Codexmart
  Author URI: http://www.codexmart.net
  Description: Fabby - Fabby is a one page Responsive HTML5 Landing page template.
  Version: 1.0
*/



/*======================================================
   Google fonts
========================================================*/
   @import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500');
   @import url('https://fonts.googleapis.com/css?family=Ceviche+One');


/*======================================================
   Global Styles 
========================================================*/


body,html {
    height: 100%;
    width: 100%;
    max-width: 100%;
}

body {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.8;
    color: #29282b;
    overflow-x: hidden;
    margin: auto;
    background: #fff;
    -webkit-font-smoothing: subpixel-antialiased;
}

.clearlist, .clearlist li {
    list-style: none;
    padding: 0;
    margin: 0;
    background: none;
}

::-moz-selection{ color: #fff; background:#29282b; }
::-webkit-selection{ color: #fff;    background:#29282b; }
::selection{ color: #fff;    background:#29282b; }

a{
    color: #999;
    text-decoration: none;
}
a:hover{
    color: #29282b;
    cursor: pointer;
}
a:hover,a:focus{
    -moz-outline: none;
    outline: none;
    text-decoration: none;
}

label{
    margin: 0;
}

ul {
    line-height: 0;
    margin: 0;
}

h1,h2,h3,h4,h5,h6 {
   font-family: 'Roboto', sans-serif;
    font-weight: 300;
    margin-bottom: 20px;
    line-height: 1.4;
    color: #374048;
}
h1{
    font-size: 60px;
}
h2{
    font-size: 38px;
}
h3{
    font-size: 32px;
}
h4{
    font-size: 16px;
}
h5{
    font-size: 14px;
}
h6{
    font-size: 12px;
}

p{
    font-weight: 200;
    font-size: 20px; 
    line-height: 30px;
    font-family: 'Roboto', sans-serif;
    margin: 0;
}

.img-responsive{
    margin: 0 auto;
    width: auto;
}


/*======================================================
    Intro section start
========================================================*/


#intro {

    background: rgba(0, 0, 0, 0) linear-gradient(#edf4f7, #daf0f8) repeat scroll 0 0;
}

.intro {
    padding: 60px 0;
}

.intro-heading h1 {
  line-height: 1.2;
  margin: 0 0 40px;
  color: #43a2dd;
  letter-spacing: -3px;
}

/*.intro-heading h1{
    font-family: "Ceviche One",cursive;
    font-size: 60px;
    margin: -15px 0 0;
    text-align: center;
}*/


.intro-heading h2 {
    color: #43a2dd;
    font-weight: 500;
    letter-spacing: -3px;
    line-height: 64px;
    margin: 0 auto;
    padding: 0 0 40px;
    text-align: center;
}

.intro-description h3{
    color: #43a2dd;
    font-weight: 400;
    line-height: 30px;
    margin: 0 0 20px;
}

/*======================================================
    Form start
========================================================*/


.fa {
    width: 20px;
    padding: 6px;
    font-weight: bold;
}

.form-control {
    border-radius: 0;
    box-shadow: none;
    height: 46px;
    border: 1px solid #43a2dd;
}

.btn-primary {
    background: #43a2dd;
    color: #fff;
    font-weight: bold;
    border: 1px solid #43a2dd;
    border-radius: 0;
}

.btn-pay {
    background: rgba(0, 0, 0, 0) linear-gradient(#43a2dd, #43a2dd) repeat scroll 0 0;
    box-shadow: 0 0 0 #78ccff inset, 0 -1px 1px #a33f03 inset;
}


.input-group-addon {
    border-radius: 0;
}


.input-group-addon {
    background: #43a2dd;
    color: #fff;
}

.form-padding {
    padding: 40px 0;
}

.list-inline {
    margin-left: 0;
}

.product-shop{
    padding: 18px;
    background: #fff none repeat scroll 0 0;
    color: #000;
    height: 60px;
    width: 60px;
    margin: 0 10px 0 0;
    text-align: center;
    font-size: 23px;
}



/*======================================================
    intro ends
========================================================*/


/*======================================================
    Trusted company start
========================================================*/

.trusted-company {
    padding: 60px 0;
}

.trusted img.trust{
    display: inline;
    margin: 10px 25px;
    max-height: 30px;
    opacity: 0.4;
    transition: all 0.3s ease 0s;
}

.trusted img:hover {
    opacity: 0.8;
}


/*======================================================
    Trusted company ends
========================================================*/




/*======================================================
    products section start
========================================================*/

#thewatch {
    background: #eee;
}

.thewatch {
    padding: 60px 0;
}

.products h2, #our-collection h2, .text h2, #reviews h2, #share h2 {
    color: #43a2dd;
    font-weight: 500;
    letter-spacing: -0.5px;
    line-height: 1;
    margin: 0 0 20px;
}

.products p{
    margin: 0 auto 40px;
    color: #969da3;
    text-align: center;
}

.products-section:after{
    margin: 0 auto 10px;
    width: 82px;
}

.products-section.v1:after{
    margin-left: 0;
}

.how-works p{
    color: #737c85;
    font-size: 20px;
    line-height: 30px;
}

.how-works h3 {
   color: #43a2dd;
   font-weight: 400;
}


/*======================================================
    products section ends
========================================================*/




/*======================================================
    our collection start
========================================================*/

#our-collection{
    background: rgba(0, 0, 0, 0) linear-gradient(#edf4f7, #daf0f8) repeat scroll 0 0;
}

.our-collection {
    padding: 60px 0;
}

.applewatch-collection > p{
    margin: 0 auto 20px;
    max-width: 710px;
    color: #969da3;
}


nav ul li {
    font-size: 20px;
    line-height: 40px;
    color: #969da3;
}

.font-cirle {
    color: #66c3fd;
    font-weight: bold;
    margin-right: 5px;
}

.paytext {
    margin-top: 40px;
}

.paytext a{
    border-radius: 5px;
    font-size: 20px;
    height: 55px;
    padding: 13px;
    width: 328px;
    border: none;
    font-weight: bold;
}

.cta-pay {
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  text-shadow: 1px 1px 3px #666666;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}

.cta-pay:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}

/*======================================================
    our collection ends
========================================================*/



/*======================================================
    gallery start
========================================================*/

#gallery{
    padding: 0;
}


.gallery-left {
    padding-left: 0;
    padding-right: 0;
}

.text {
    padding: 60px 35px;
}

.text p{
    color: #696f74;
}

.carousel-indicators li {
    border: 1px solid #43A2DD;
}


/*======================================================
    gallery section ends
========================================================*/


/*======================================================
    Share products start
========================================================*/

#share{
    background: #43a2dd  url(../images/stars.png) no-repeat scroll left top;
    text-align: center;
}

.share {
    padding: 60px 0;
}

#share h2{
    letter-spacing: -0.5px;
    color: #fff;
    margin-bottom: 40px;
}

.share-social{
    text-align: center;
}

.social-icon {
    border: 1px solid #ddd;
    border-radius: 5px;
    color: #fff;
    font-size: 35px;
    height: 100px;
    margin-right: 10px;
    padding: 29px 0 0;
    text-align: center;
    width: 100px;
    transition: all 0.3s ease 0s;
}

.social-icon:hover{
    color: #fff;
    border-color: #fff;
    transition: all 0.3s ease 0s;
}

.facebook:hover {
    background: #425f9c;
    transition: all 0.3s ease 0s;
    border: 1px solid #425f9c;
}

.twitter:hover {
    background: #1da1f2;
    transition: all 0.3s ease 0s;
    border: 1px solid #1da1f2;
}

.google:hover {
    background: #db4437;
    transition: all 0.3s ease 0s;
    border: 1px solid #db4437;
}

.linkedin:hover {
    background: #1a84bc;
    transition: all 0.3s ease 0s;
    border: 1px solid #1a84bc;
}

.bold{
    font-weight: bold;
    color: #000;
}


/*======================================================
    Share products ends
========================================================*/



/*======================================================
    review section start
========================================================*/

#reviews{
    background: #f8fbfd;
}

.reviews {
    padding: 60px 0;
}

.review-content{
    margin-top: 50px;
}

.review-content > img{
    opacity: .5;
}
.review-content > p{
    padding: 25px 0 30px;
}

.testimonial-block{
    border: 1px solid #ccc;
    padding: 40px;
    text-align: center;
    color: #969da3;
}

.testimonial-block img {
    border: 2px solid #43a2dd;
    border-radius: 55px;
    margin-top: 5px;
}

.testimonial{
    font-size: 18px;
    font-style: italic;
}

.author {
    color: #43a2dd;
    font-size: 14px;
    font-weight: 600;
}


/*======================================================
    review section ends
========================================================*/




/*======================================================
    free quote starts
========================================================*/

#free-quote{
    background: url(../images/smart-watch.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.free-quote {
    padding: 60px 0;
}

.btn-cta {
    background: rgba(0, 0, 0, 0) linear-gradient(#f7941d, #d75305) repeat scroll 0 0;
    box-shadow: 0 1px 0 #ffbb6a inset, 0 -1px 2px #a33f03 inset
;}

.freetext a{
    border-radius: 5px;
    font-size: 20px;
    height: 55px;
    padding: 13px;
    width: 328px;
    border: none;
    font-weight: bold;
}

.freetext{
    text-align: center;
}

.freetext > h4{
    color: white;
    font-size: 23px;
    font-weight: bold;
    margin-top: 0;
}

.freeimg > img{
    position: absolute;
    top: -229px;
}


/*======================================================
    free quote ends
========================================================*/



/*======================================================
    footer start
========================================================*/

.footer {
    padding: 60px 0;
    color: #969da3;
}

/*======================================================
    footer ends
========================================================*/


/*======================================================
    Modal form
========================================================*/

.modal-modify{
    padding: 0 40px 40px 40px;
}

.modal-modify h2{
    font-size: 32px;
    font-weight: bold;
    text-align: center;
}

.modal-modify p{
    text-align: center;
}

.btn-form{
    height: 46px;
}


.popup-from h5 {
    color: #c0cad0;
    margin: 22px 0 0;
    text-align: center;
}


.modal-header {
    border-bottom: none;
    padding: 0;
}

.close{
    font-size: 40px;
}

.modal-header .close {
  border: 1px solid #777;
  height: 45px;
  margin-right: 3px;
  margin-top: 3px;
  padding: 0;
  width: 45px;
  transition: all 0.3s ease 0s;
}


/*======================================================
    Modal ends
============================================================*/