@font-face {
    font-family: 'montserratblack';
    src: url('font/montserrat-black-webfont.woff2') format('woff2'),
         url('font/montserrat-black-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratblack_italic';
    src: url('font/montserrat-blackitalic-webfont.woff2') format('woff2'),
         url('font/montserrat-blackitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratextrabold';
    src: url('font/montserrat-extrabold-webfont.woff2') format('woff2'),
         url('font/montserrat-extrabold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratextrabold_italic';
    src: url('font/montserrat-extrabolditalic-webfont.woff2') format('woff2'),
         url('font/montserrat-extrabolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratextralight';
    src: url('font/montserrat-extralight-webfont.woff2') format('woff2'),
         url('font/montserrat-extralight-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratextralight_italic';
    src: url('font/montserrat-extralightitalic-webfont.woff2') format('woff2'),
         url('font/montserrat-extralightitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratitalic';
    src: url('font/montserrat-italic-webfont.woff2') format('woff2'),
         url('font/montserrat-italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratregular';
    src: url('font/montserrat-regular-webfont.woff2') format('woff2'),
         url('font/montserrat-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body{
	background-color:black;
	margin:0;
	color:#D4D4D4;
  font-family:'montserratregular', normal;
  font-size:1em;
  overflow-x:hidden;
}

.fixedBgEcoArea:before {
  content: "";
  display: block;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -10;
  background: url('img/bbb.jpg') no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.header{
	display:flex;
	background: linear-gradient(to bottom, rgba(0,0,0,0.4) 0%, rgba(0,0,0,1) 100%), url('img/aaa.jpg');
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center center;
  background-repeat: no-repeat;
  height:100vh;
  justify-content: center;
  align-items: center;
}

#products {
	width:100vw;
}

.navbar-dark .navbar-toggler {
  border-color: transparent;
}

.topRightArrow {
	top:1rem;
	right:1rem;
	position: fixed;
	color: #FFA626;
  font-size: 1.3em;
  transition: 0.5s;
  z-index:10;
}

.rightMenu {
  height: 100%;
  width: 100px;
  position: fixed;
  z-index: 2;
  top: 68px; /*-2px for margin-top a*/
  right: -100px;
  transition: 0.5s;
}

.rightMenu a {
	margin-top:2px;
	font-size: 2em;
  padding: 1em;
  text-decoration: none;
  display: flex;
  transition: 0.6s;
}

#myRightMenu i {
	color: #FFF;
}

.title {
	font-size:2.5em;
	font-family: 'montserratextrabold_italic';
	color: #FFA626;
}

.textPadding {
	padding:3vh 10vw;
}

.textThin{
	font-family: 'montserratextralight';
}

.productName{
	font-family: 'montserratitalic';
	color: #FFA626;
	padding:1em;
}

.price{
	font-family: 'montserratregular';
}

#openModalFormMail:hover{
	cursor: pointer;
}

.buttonCloseForm {
	color:#D4D4D4;
  display: inline-flex;
  height: 40px;
  width: 120px;
  border: 2px solid #D4D4D4;
  text-transform: uppercase;
  text-decoration: none;
  font-size: .8em;
  letter-spacing: 1.5px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.buttonCloseForm:hover{
	color:#000;
	border: 2px solid #D4D4D4;
}

#closeForm {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

#closeForm a {
  position: relative;
  transition: all .2s ease-Out;
  color:inherit;
}

#closeForm a:hover {
  text-decoration: none;
}

#closeForm:hover #effectButtonRight {
  right: 0;
}

.buttonSendForm {
	color:#FFA624;
	border: 2px solid #FFA624;
	background: none;
  display: inline-flex;
  height: 40px;
  width: 150px;
  text-transform: uppercase;
  text-decoration: none;
  font-size: .8em;
  letter-spacing: 1.5px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.buttonSendForm:hover{
	color: #000;
}

#sendForm {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

#sendForm a {
  position: relative;
  transition: all .2s ease-Out;
  color:inherit;
}

#sendForm a:hover {
  text-decoration: none;
}

#sendForm:hover #effectButtonLeftSend {
  left: 0;
}

#effectButtonLeftSend {
  width: 100%;
  height: 40px;
  margin-top: 15px;
  align-self: flex-end;
  left: -200px;
  background: #FFA624;
  position: absolute;
  transition: all .2s ease-Out;
  bottom: 0;
}

#sendForm {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.button {
	font-family: 'montserratregular';
  display: inline-flex;
  height: 40px;
  width: 150px;
  border: 2px solid #D4D4D4;
  text-transform: uppercase;
  text-decoration: none;
  font-size: .8em;
  letter-spacing: 1.5px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.button:hover{
	color:#000;
	border: 2px solid #FFA626;
}

#buyNow {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

#buyNow a {
  position: relative;
  transition: all .2s ease-Out;
  color:inherit;
}

#buyNow a:hover {
  text-decoration: none;
}

#effectButtonLeft {
  width: 100%;
  height: 40px;
  margin-top: 15px;
  align-self: flex-end;
  left: -200px;
  background: #FFA626;
  position: absolute;
  transition: all .2s ease-Out;
  bottom: 0;
}

#effectButtonRight {
  width: 100%;
  height: 40px;
  margin-top: 15px;
  align-self: flex-end;
  right: -200px;
  background: #D4D4D4;
  position: absolute;
  transition: all .2s ease-Out;
  bottom: 0;
}

#buyNow:hover #effectButtonLeft {
  left: 0;
}

.gradientCentered {
	background-image: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,1) 100%);
	padding: 5vh 0;
}

.garment {
  background-size: cover;
  background-position: center;
  cursor: pointer;
  transition: all .2s ease-Out;
}

/*.garment:hover {
	background-image: url(img/back.jpg);
}*/

.segment {
	background: black;
}

.footer{
	bottom:0;
	padding:2vh;
	height:auto;
	display: flex;
  display:-webkit-flex;
  justify-content: center;
  align-items: center;
  background-color: #FFA626;
  color: black;
  
}

i {
	color: #FFA626;
	font-size: 1.2em;
	transition: all .2s ease-Out;
}

#navbar{
	background:#000;
	position: fixed;
  z-index: 1;
}

.socialNavbar {
	right:0;
	position: fixed;
	color: #FFA626;
  transition: 0.5s;
  z-index:10;
}

.socialNavbar i:hover {
	color: #FFF;
}

#closeModal {
	color: #FFA626;
}

input.form-control::placeholder {
  opacity: .2;
}

label {
  color: #FFA624;
}

a {
	color:#000;
}

a:link {
  color: #000;
}

a:visited {
	color:#000;
}

::-webkit-scrollbar {
	width:4px;
}
::-webkit-scrollbar-track {
	background:#000; 
}
::-webkit-scrollbar-thumb {
  background:#FFA626;
}