/*---------------------------------
	IMPORTS
-----------------------------------*/
@import url(https://fonts.googleapis.com/css?family=Gabriela:400,700);

/*---------------------------------
	OVERRIDES
-----------------------------------*/
h1,h2,h3,h4,h5,h6{
	/*font-family: "Gabriela", arial, verdana, sans-serif;*/
font-weight:normal;
}


blockquote{
font-family: "Gabriela", arial, verdana, sans-serif;
}

/*---------------------------------
	LAYOUT
-----------------------------------*/
body{
	margin:0;
	padding:0 0 0 0;
	background:#efefef url(img/gray_jean.png);
	/* font-family: "Gabriela", arial, verdana, sans-serif !important; */
}

label{
	font-weight: normal !important;
}

/* Registration form: label sits above its input on phones (col-xs-12, stacked) and
   right-aligned beside it from tablet width up (col-sm-4, side-by-side) - see register.jsp. */
@media (min-width: 768px){
	.register-label{
		text-align: right;
	}
}

.ui-autocomplete-loading {
    background: white url("../images/ui-anim_basic_16x16.gif") right no-repeat;
  }



#header{
	margin-bottom: 0px;
}
#header li a {
    display: block;
    color: white;
    background-color: #333;
    padding: 14px 16px;
    text-decoration: none;
    background-image: none;
}

li a:hover{
	background-color: #cc0066 !important;
    color: #FFC0CB !important;
    background-image: none;
}

 .beauty-active {
	background-color: #cc0066 !important;
    color: #FFC0CB !important;
}

#profileDropDownButton a:hover{
	background-color: #cc0066 !important;
    color: #FFC0CB !important;
    background-image: none;
}
	
.dropdown-menu .divider {
   background-color: #333 !important;  
}
/**center header ****/
.navbar .navbar-nav {
  display: inline-block;
  float: none;}.navbar .navbar-collapse {
  text-align: center;
}
/*** profileMenuItem dropdown background: ***/
#profileMenuItem{
	background-color: #333 !important;
}

.container-fluid-setting {
	width: 98%;
	margin-left: auto;
	margin-right: auto;
	min-height: 100vh !important;
}
.min-height{
	/* Make container expand at least to full viewport height so the main content
	   fills the screen even when short. Keep a sensible fallback for older browsers. */
	min-height: 100vh !important;
	
}
.maincontainer{
    border-style: solid; 	
    border-width: 1px;
    background-image: linear-gradient(to right, white, #C0C0C0);
	height: 100%;
  }


.maincontent {

    height: 100% !important;
}

.left-menu {
    height: 100% !important;
    position: fixed;
    /* Bootstrap's .container class (also on this div) sets width to 750-1170px depending on
       breakpoint, and position:fixed takes the element out of its col-md-3/col-lg-3 parent's
       width constraint - without this override the menu renders at full container width instead
       of sidebar width. !important needed to beat .container's own width rule. */
    width: 230px !important;
}

.left-menu a{
    color : #333;
}

#sideBarDiv li {
    clear: both;
    width: 150px;
}

/****** login page *****************************/
/* Large devices (desktops, 1200px and up) */
@media (max-width: 1200px) {
	#loginForm {
		text-align: center;
		margin-left: 28%;
		margin-top: 16%;
		width:30% ;   /* different **/
		background-color: #333;
		border-radius: 5px;
		color: white;
		margin-bottom: 15px;   
	}

}
/* Medium devices (desktops, 992px and up) */
@media (max-width: 992px) {
	#loginForm {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		margin-top: 16%;
		width:30% ;   /* different **/
		background-color: #333;
		border-radius: 5px;
		color: white;
		margin-bottom: 15px;   
	}

}
/* Small devices (768px and up) */
@media (min-width: 768px) {
	#loginForm {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		margin-top: 16%;
		width:60% ;   /* different **/
		background-color: #333;
		border-radius: 5px;
		color: white;
		margin-bottom: 15px;   
	}

	.view-profile-min-height{
		min-height: 403px !important;
	}
}

/* Small devices (tablets, 768px and up) */
@media (max-width: 768px) {
	#loginForm {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		margin-top: 29%;
		width:80% ;   /* different **/
		background-color: #333;
		border-radius: 5px;
		color: white;
		margin-bottom: 15px;   
	}
}


 #loginForm a{
 	color: #ffffff; 	
 }

 #loginForm a:hover{
 	color: #FFC0CB; 	
 }
/*********** login page ends here **********************/

/*********** Pink button **********************/
.btn-pink {
  color: white !important;
  background-color: #E81D62;
  border-color: #c51954;
}
.btn-pink:hover {
    color: #FFC0CB !important;
    background-color: #c51954;
    border-color: #c51954;
}

/*********** Pink button ends here **********************/

/**** form validation marks ***************/
.form-valid  {
  border-left: 5px solid #42A948 !important; /* green */
}

.form-invalid  {
  border-left: 5px solid #a94442 !important; /* red */
}

/**** form validation marks ends ***************/

/************ panel ***********************/
.panel-heading{
	background-image: linear-gradient(to right, white, #646464) !important;
	font-weight: bold !important;
}
/************ panel ends here ***********************/

.carousel img{
	width: auto;
	height: 200px;
	max-height: 200px;
}
/******** heading on message page ********/
.review-heading{
	background-image: linear-gradient(to right, white, rgb(248,127,175));
	color: rgb(0,0,0);
	padding: 5px;
}

.fb-share-button {
    
    transform-origin: center;
}

.basket{
	padding-top: 5px;
	border: 1px solid;
	background-color: rgb(255, 251, 255);
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

#shippingHolder .row{
	margin-right: 0px !important;
	margin-left: 0px !important;
}