.cd-user-modal {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: #000000;
   background-position: center center;
   background-repeat: no-repeat;
   background: -webkit-gradient(radial, center center, 0, center center, 460, from(#FFF), to(rgba(41, 26, 73, 0.3)));
   background: -webkit-radial-gradient(circle, #FFF, rgba(41, 26, 73, 0.3));
   background: -ms-radial-gradient(circle, #FFF, rgba(41, 26, 73, 0.3));
   z-index: 1000;
   overflow-y: auto;
   cursor: pointer;
   visibility: hidden;
   opacity: 0;
   -webkit-transition: opacity .3s, visibility .3s;
   -o-transition: opacity .3s, visibility .3s;
   transition: opacity .3s, visibility .3s
}

.cd-user-modal-container {
   position: absolute;
   top: 50%;
   left: 50%;
   width: 90%;
   max-width: 600px;
   -webkit-box-shadow: 0 0 45px -19px #000;
           box-shadow: 0 0 45px -19px #000;
   background: #FFF;
   cursor: auto;
   border-radius: .25em;
   -webkit-transition: -webkit-transform ease .4s;
   transition: -webkit-transform ease .4s;
   -o-transition: transform ease .4s;
   transition: transform ease .4s;
   transition: transform ease .4s, -webkit-transform ease .4s;
   -webkit-transform: translate3d(-50%, -50%,0) scale(0.8);
           transform: translate3d(-50%, -50%,0) scale(0.8)
}

.cd-close-form,
.cd-form label.image-replace {
   text-indent: 100%;
   white-space: nowrap;
   overflow: hidden
}

.cd-user-modal.is-visible {
   visibility: visible;
   opacity: .99
}

.cd-user-modal.is-visible .cd-user-modal-container {
   -webkit-transform: translate(-50%, -50%) scale(1);
       -ms-transform: translate(-50%, -50%) scale(1);
           transform: translate(-50%, -50%) scale(1)
}

.cd-user-modal-container .cd-switcher:after {
   content: "";
   display: table;
   clear: both
}

.cd-user-modal-container .cd-switcher li {
   width: 50%;
   border-bottom: 1px solid #eee;
   list-style-type: none;
   float: left;
   text-align: center
}

.cd-user-modal-container .cd-switcher li:first-child a {
   border-radius: .25em 0 0
}

.cd-user-modal-container .cd-switcher li:last-child a {
   border-radius: 0 .25em 0 0
}

.cd-user-modal-container .cd-switcher a {
   display: block;
   width: 100%;
   height: 50px;
   line-height: 50px;
   background: #fff;
   color: #000;
   font-family: Oswald;
   font-size: 18px;
   text-transform: uppercase;
}

.cd-user-modal-container .cd-switcher a.selected {
   background: #0C0820;
   color: #fff
}

@media (max-width:768px) {
   .cd-user-modal-container {}
   .cd-user-modal-container .cd-switcher a {
      height: 60px;
      line-height: 60px
   }
}

@media (max-width:480px) {
   .cd-user-modal-container {}
}

.cd-form {
   padding: 1.4em
}

.cd-form .fieldset {
   position: relative;
   margin: 1.6em 0
}

.cd-form .fieldset:first-child {
   margin-top: 0
}

.cd-form .fieldset:last-child {
   margin-bottom: 0
}

.cd-form label {
   font-size: 14px;
   font-size: .875rem
}

.cd-form label.image-replace {
   display: inline-block;
   position: absolute;
   left: 15px;
   top: 50%;
   bottom: auto;
   -webkit-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   transform: translateY(-50%);
   height: 20px;
   width: 20px;
   color: transparent;
   text-shadow: none;
   background-repeat: no-repeat;
   background-position: 50% 0
}

.cd-form label.cd-username {
   background-image: url(img/cd-icon-username.svg)
}

.cd-form label.cd-email {
   background-image: url(img/cd-icon-email.svg)
}

.cd-form label.cd-password {
   background-image: url(img/cd-icon-password.svg)
}

.cd-form input {
   margin: 0;
   padding: 0;
   border-radius: .25em
}

.cd-form input.full-width {
   width: 100%;
   -webkit-box-sizing: border-box;
           box-sizing: border-box
}

.cd-form input.has-padding {
   padding: 12px 20px 12px 50px
}

.cd-form input.has-border {
   border: 1px solid #d2d8d8;
   -webkit-appearance: none;
   -moz-appearance: none;
   -ms-appearance: none;
   -o-appearance: none;
   appearance: none
}

.cd-form input.has-border:focus {
   border-color: #343642;
   -webkit-box-shadow: 0 0 5px rgba(52, 54, 66, .1);
           box-shadow: 0 0 5px rgba(52, 54, 66, .1);
   outline: 0
}

.cd-form input.has-error {
   border: 1px solid #d76666
}

.cd-form input[type=password] {
   padding-right: 65px
}

.cd-form input[type=submit] {
   padding: .5em 0;
   cursor: pointer;
   background: #0C0820;
   color: #FFF;
   font-family: Oswald;
   font-size: 1.2em;
   text-transform: uppercase;
   border: none;
   -webkit-transition: all ease .2s;
   -o-transition: all ease .2s;
   transition: all ease .2s;
   -webkit-appearance: none;
   -moz-appearance: none;
   -ms-appearance: none;
   -o-appearance: none;
   appearance: none
}

.cd-form input[type=submit]:focus,
.cd-form input[type=submit]:hover {
   outline: 0;
   background: #000;
}

.cd-form .hide-password {
   display: inline-block;
   position: absolute;
   right: 0;
   padding: 6px 15px;
   border-left: 1px solid #d2d8d8;
   top: 50%;
   bottom: auto;
   -webkit-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   transform: translateY(-50%);
   font-size: 14px;
   font-size: .875rem;
   color: #343642
}

.cd-form .cd-error-message {
   display: inline-block;
   position: absolute;
   left: -5px;
   bottom: -35px;
   background: rgba(215, 102, 102, .9);
   padding: .8em;
   z-index: 2;
   color: #FFF;
   font-size: 13px;
   font-size: .8125rem;
   border-radius: .25em;
   pointer-events: none;
   visibility: hidden;
   opacity: 0;
   -webkit-transition: opacity .2s 0, visibility 0 .2s;
   -o-transition: opacity .2s 0, visibility 0 .2s;
   transition: opacity .2s 0, visibility 0 .2s
}

.cd-form .cd-error-message::after {
   content: '';
   position: absolute;
   left: 22px;
   bottom: 100%;
   height: 0;
   width: 0;
   border-left: 8px solid transparent;
   border-right: 8px solid transparent;
   border-bottom: 8px solid rgba(215, 102, 102, .9)
}

.cd-form .cd-error-message.is-visible {
   opacity: 1;
   visibility: visible;
   -webkit-transition: opacity .2s 0, visibility 0 0;
   -o-transition: opacity .2s 0, visibility 0 0;
   transition: opacity .2s 0, visibility 0 0
}

@media only screen and (min-width:600px) {
   .cd-form {
      padding: 2em
   }
   .cd-form .fieldset {
      margin: 1.6em 0
   }
   .cd-form .fieldset:first-child {
      margin-top: 0
   }
   .cd-form .fieldset:last-child {
      margin-bottom: 0
   }
   .cd-form input.has-padding {
      padding: 12px 20px 12px 50px;
      -webkit-box-shadow: inset 0 1px 5px 0px rgba(0, 0, 0, 0.1);
              box-shadow: inset 0 1px 5px 0px rgba(0, 0, 0, 0.1);
   }
   .cd-form input[type=submit] {
      padding: .5em 0
   }
}

.cd-form-message {
   line-height: 1.5em;
   padding: 2em 2em 0;
   text-align: left;
   font-size: 1.1em;
   font-family: source sans pro;
}

@media only screen and (min-width:600px) {
   .cd-form-message {
      padding: 2em 2em 0
   }
}

.cd-form-bottom-message {
   text-align: center;
   padding-top: 5px;
   color: #bbb;
   font-family: 'Source sans pro'
}

.cd-form-bottom-message a {
   color: #000
}

.cd-close-form {
   display: block;
   position: absolute;
   width: 40px;
   height: 40px;
   right: 0;
   top: -40px;
   background: url(img/cd-icon-close.svg) center center no-repeat
}

@media only screen and (min-width:1170px) {
   .cd-close-form {
      display: none
   }
}

#cd-login,
#cd-reset-password,
#cd-signup {
   display: none
}

#cd-login.is-selected,
#cd-reset-password.is-selected,
#cd-signup.is-selected {
   display: block;
   border-bottom: 5px solid #3B5997;
   border-radius: 0 0 3px 3px;
}

.fb-btn {
   background: #3B5997;
   display: block;
   overflow: hidden;
   border-radius: 4px;
   color: #fff;
   padding: 13px;
   text-align: center;
   position: relative;
   font-family: oswald;
   font-size: 21px;
   height: 47px;
}

.fb-btn:hover {
   color: #fff;
}

.fb-btn i {
   content: "\ea91";
   -webkit-transition: all 0.5s ease-in-out;
   -o-transition: all 0.5s ease-in-out;
   transition: all 0.5s ease-in-out;
   background: #354f88;
   padding: 12px;
   width: 40px;
   display: inline-block;
   font-size: 25px;
   position: absolute;
   top: -2px;
   left: -1px;
}

.fb-btn:hover i {
   width: 100%;
}

.login-lub {
   text-align: center;
   padding: 29px 0 0 0;
   text-transform: uppercase;
   font-family: sans-serif;
}

.login-lub:after {
   display: inline-block;
   margin: 0 0 6px 20px;
   height: 1px;
   content: " ";
   text-shadow: none;
   background-color: #999;
   width: 140px;
}

.login-lub:before {
   display: inline-block;
   margin: 0 20px 6px 0;
   height: 1px;
   content: " ";
   text-shadow: none;
   background-color: #999;
   width: 140px;
}

@media (max-width:480px) {
   .fb-btn {
      padding: 17px 0 0 34px;
      font-size: 15px;
   }
   .login-lub:before,
   .login-lub:after {
      width: 50px;
   }
   .cd-user-modal-container .cd-switcher a {
      height: 51px;
      line-height: 52px
   }
}