/* ==============================================================

Template name : Korra-Clean and modern creative template
Categorie : Site template
Author : Nce18cex
Version : v1.0.0
Created : 07 June 2015
Last update : 20 June 2015

-----------------------------------------------------------------
CSS structure
-----------------------------------------------------------------

01. Color
02. Background color
03. Border color
	
============================================================== */

/*
Color
=========================== */
a,
a:hover,
a:focus,
.right-link li,
.text-light,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .dropdown.active .dropdown-toggle:hover
.navbar-default .navbar-nav > .dropdown .dropdown-toggle:hover,
.navbar-default .navbar-nav > .dropdown .dropdown-toggle:focus,
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.yamm-link li a:hover,
.yamm-link li a:focus,
.aside-container h3,
.panel-title a.active,
.panel-title a.active:hover,
.panel-title a.active:focus,
.fa-primary,
footer ul.link-list li a:hover,
.social-network li a:hover,
article h5 a:hover,
.filter-items li.active span,
.filter-items li span:hover,
.filter-items li span:active,
.filter-items li span:focus,
.img-caption span,
ul.category li a:hover,
.sidebar-post .media-body .media-heading a:hover,
ul.pagination li a:hover,
.comments .media-body .media-heading  a.pull-right,
.validation,
.price span,
.product-info h6 a:hover,
.aside-shop .widget ul.product-list li a:hover,
.aside-shop .widget ul.product-list li a:focus,
.aside-shop .widget ul.product-list li a:active,
div.jp-type-playlist div.jp-playlist a:hover,
.recent-product li h6 a:hover,
.item-title a:hover,
ul.slides li .wrap-slide h3 span{
	color:#8080FF;
}

/*
Background color
=========================== */
.btn-primary,
.progress-bar,
.heading span,
.primary-section,
.sparator-line,
.aside-container h3 span,
.btn-search,
.service-btn,
.owl-theme .owl-controls .owl-buttons div.owl-prev:hover,
.owl-theme .owl-controls .owl-buttons div.owl-next:hover,
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span,
.btn-started a:hover,
.btn-play a:hover,
.inner-heading,
ul.tags li a:hover,
.btn-cart,
#toTopHover,
.sale,
.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus,
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus,
div.jp-type-playlist div.jp-playlist li.jp-playlist-current,
.remove:hover{
	background-color:#eee;
	text-align:center;
}

blockquote span.quote{
	background-color:rgba(247, 114, 15, 0.3);
}

/*
Border color
=========================== */
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus ,
.navbar-default .navbar-nav > .dropdown.active .dropdown-toggle:hover
.navbar-default .navbar-nav > .dropdown .dropdown-toggle:hover,
.navbar-default .navbar-nav > .dropdown .dropdown-toggle:focus,
.form-control:focus,
.btn-primary,
.aside-gray,
.subscribe:focus,
.btn-started a:hover,
ul.circle-list li span,
ul.circle-list li span i,
ul.timeline li,
.zoom:hover,
.link:hover,
.filter-items li.active span,
.filter-items li span:hover,
.filter-items li span:active,
.filter-items li span:focus,
ul.tags li a:hover,
ul.pagination li a:hover,
.tab-content,
.price-item .panel:hover,
.price-item.popular .panel,
.aside-shop .widget .tags li a:hover,
.recent-product li:hover a img,
.recent-product li a:hover img,
.product-wrapper:hover{
	border-color:#ccc;
	color:#333;
}


/*
2 color
=========================== */
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary,
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active,
.btn-search:hover,
.btn-cart:hover{
	background-color:#7c8dff
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary,
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active{
	border-color:#7c8dff;
}
/* HOSTING PLAN*/
.icon-left{
    padding: 12px 25px 10px 15px;
	position:relative;
	float:none;
    color:#8080FF;
}
.text{
    text-align:left;
    padding:0 0 0 15px;
	border-top:1px solid #ccc;
}
.text h4{
    padding-bottom:5px;
}

.membership-pricing-table {
    width: auto;
	padding-top:50px;
}

.membership-pricing-table table .icon-no,.membership-pricing-table table .icon-yes {
    font-size: 14px
}

.membership-pricing-table table .icon-no {
    color: #F00;
}

.membership-pricing-table table .icon-yes {
    color: #8080FF
}

.membership-pricing-table table .plan-header {
    text-align:center;
    font-size: 32px;
	font-weight:normal;
	text-transform:uppercase;
    border: 1px solid #e2e2e2;
    padding: 25px 0
}

.membership-pricing-table table .plan-header-free {
    background-color: #eee;
    color: #555;
}

.membership-pricing-table table .plan-header-blue {
    background-color: #eee;
}

.membership-pricing-table table .plan-header-standard {
    color: #fff;
    background-color: #8080FF;
}

.membership-pricing-table table td {
    text-align: center;
    width: 17%;
    padding: 7px 10px;
    background-color: #fafafa;
    font-size: 14px;
    -webkit-box-shadow: 0 1px 0 #fff inset;
    box-shadow: 0 1px 0 #fff inset
}

.membership-pricing-table table,.membership-pricing-table table td {
    border: 1px solid #ebebeb
}

.membership-pricing-table table tr td:first-child {
    background-color: transparent;
    text-align: right;
    width: 24%
}

.membership-pricing-table table tr td:nth-child(5) {
    background-color: #FFF
}

.membership-pricing-table table tr:first-child td,.membership-pricing-table table tr:nth-child(2) td {
    -webkit-box-shadow: none;
    box-shadow: none
}

.membership-pricing-table table tr:first-child th:first-child {
    border-top-color: transparent;
    border-left-color: transparent;
    border-right-color: #e2e2e2
}

.membership-pricing-table table tr:first-child th .pricing-plan-name {
    font-size: 22px
}

.membership-pricing-table table tr:first-child th .pricing-plan-price {
    line-height: 35px
}

.membership-pricing-table table tr:first-child th .pricing-plan-price>sup {
    font-size: 45%
}

.membership-pricing-table table tr:first-child th .pricing-plan-price>span {
    font-size: 30%
}

.membership-pricing-table table tr:first-child th .pricing-plan-period {
    margin-top: -7px;
    font-size: 25%
}

.membership-pricing-table table .header-plan-inner {
    position: relative
}

.membership-pricing-table table .recommended-plan-ribbon {
    box-sizing: content-box;
    background-color: #fff;
    color: red;
    position: absolute;
    padding: 10px 6px;
    font-size: 13px!important;
    font-weight: 500;
    left: -6px;
    bottom: -22px;
    z-index: 99;
    width: 100%;
    -webkit-box-shadow: 0 -1px #c2284c inset;
    box-shadow: 0 -1px #c2284c inset;
    text-shadow: 0 -1px #c2284c
}

.membership-pricing-table table .recommended-plan-ribbon:before {
    border: solid;
    border-color: #c2284c transparent;
    border-width: 6px 0 0 6px;
    bottom: -5px;
    content: "";
    left: 0;
    position: absolute;
    z-index: 90
}

.membership-pricing-table table .recommended-plan-ribbon:after {
    border: solid;
    border-color: #c2284c transparent;
    border-width: 6px 6px 0 0;
    bottom: -5px;
    content: "";
    right: 0;
    position: absolute;
    z-index: 90
}

.membership-pricing-table table .plan-head {
    box-sizing: content-box;
    background-color: #ff9c00;
    border: 1px solid #cf7300;
    position: absolute;
    top: -33px;
    left: -1px;
    height: 30px;
    width: 100%;
    border-bottom: none
}

/* CLIENT PROFILE*/
.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; }
.preview .tab-content > .tab-pane {
  background-color:transparent;
  padding:0;
} 

  @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;
	  cursor:pointer;
	  }
    .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-color: #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 {
  text-transform: uppercase;
  text-align:left;
  font-size:2em;
 }
.price, .sizes, .colors {
  text-transform: uppercase;
  text-align:left;
  font-size:1.2em;
 }
.checked, .price span {
  color: #8080FF; }

.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: #8080FF;
  padding: 1.5em 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: #00F;
    color: #fff; }

.not-available {
  text-align: center;
  line-height: 2em; }
  .not-available:before {
    font-family: fontawesome;
    content: "\f00d";
    color: #fff; }
.available {
  text-align: center;
  line-height: 2em; }
  .available:before {
    font-family: fontawesome;
    content: "\f00c";
    color: #fff; }


.red {
  background: #F00; }

.green {
  background: #85ad00; }

.blue {
  background: #8080FF; }

.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); } }