/*	Reset Code	*/

* { margin: 0; padding: 0; }

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

body { background: #fff; font-family: 'Ubuntu', sans-serif; font-size: 16px; color: #3b3b3b; overflow: auto; margin: 0; padding: 3px; }

h1 { font-size: 32px; }
h2 { font-size: 22px; padding: 5px 0; }
h3 { font-size: 19px; }
h4 { font-size: 10px; }
h5 { font-size: 8px; }
h6 { font-size: 6px; }

ol,
ul { list-style: none; margin: 0; padding: 0; }

table { border-collapse: separate; border-spacing: 0; }

caption,
th,
td { font-weight: normal; text-align: left; }

blockquote:before,
blockquote:after,
q:before,
q:after { content: ''; }

blockquote,
q { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; quotes: none; }

a,
a:hover,
a:active,
a:focus { outline: 0; }

a img { border: 0; }

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #fff;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #fff;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #fff;
}
:-moz-placeholder { /* Firefox 18- */
  color: #fff;
}

/* ==========================================================================
	#Helpers
========================================================================== */
.alignleft { float: left; }
.alignright { float: right; }

.hidden { display: none; visibility: hidden; }

.clearfix:before,
.clearfix:after { display: table; content: ' '; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* ==========================================================================
	#Header
========================================================================== */
.loading-animation-holder { background: #ee3381; width: 100%; height: 100%; position: fixed; -moz-transition: all 1.2s ease-out;
        -webkit-transition: all 1.2s ease-out;
            -o-transition: all 1.2s ease-out;
    transition: all 1.2s ease-out; }

.loading-animation { position: fixed; width: 45px; height: 45px; margin: 100px auto; background: #FFF; border-radius: 50%; margin: auto; top: 0; bottom: 0; left: 0; right: 0; 
	-moz-transition: all 1.2s ease-out;
        -webkit-transition: all 1.2s ease-out;
            -o-transition: all 1.2s ease-out;
    transition: all 1.2s ease-out;
}

.loading-animation.end { width: 100%; height: 100%; position: relative; }
.loading-animation-holder.end { position: relative;}

.loading { position: absolute; width: 45px; height: 45px; background-image: url(loader-tfs-border.png); border-radius: 100%;  
	-webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
  		animation: sk-scaleout 1.0s infinite ease-in-out;
}

.letter { position: absolute; background-image: url(loader-tfs-only-t.png); display: block; width: 17px; height: 16px; margin: auto; top: 0; bottom: 0; left: 0; right: 0; }

/* ==========================================================================
	#Animation
========================================================================== */

@-webkit-keyframes sk-scaleout {
  0% { -webkit-transform: scale(0) }
  100% {
    -webkit-transform: scale(1.0);
    opacity: 0;
  }
}

@keyframes sk-scaleout {
  0% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 100% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
    opacity: 0;
  }
}

@keyframes move {
  50% {
    bottom: auto;
    transform: translate(20px, 0);
  }
}

/* ==========================================================================
  #Content
========================================================================== */
.shell { width:auto; max-width: 700px; margin: 0 auto; padding: 0 10px; position: relative; }

.title { padding: 20px 0; margin-bottom: 25px; border-bottom: 1px solid #000066; }
.title h1 { color: #000066; text-align: left; font-weight: 400; position: relative; }

.content {
    -moz-transition: all 1.5s ease;
           -webkit-transition: all 1.5s ease;
               -o-transition: all 1.5s ease;
       transition: all 1.5s ease; }

.content.write { bottom: 80%; }

.content.help p { border: 0; margin-bottom: 15px; padding: 12px; background: #fff; color: #3b3b3b; line-height: 1.4; }
.content.help p b { font-weight: bold; }
.content.help ul { margin-left: 20px; list-style-type: disc; color: #fff; }
.content.help li strong { padding: 10px; background: #3b3b3b; display: inline-block; margin: 5px 0; font-weight: 200; }

.shell form { width: 50%; }
.shell form .row { margin-bottom: 25px; }
.shell form input,
.content a { width: 30%; border: 2px solid rgba(255, 255, 255, 0.21); padding: 15px; box-sizing: border-box; background-color: rgba(255, 255, 255, 0.21); 
    -moz-transition: all 1.2s ease-out;
        -webkit-transition: all 1.2s ease-out;
            -o-transition: all 1.2s ease-out;
    transition: all 1.2s ease-out; outline: 0; font-size: 16px; color: #fff; }
.shell form input:focus { border-bottom: 2px solid #fff; }

.content a { display: inline-block; width: 25%; text-align: center; text-decoration: none; }
.content > .row-actions { margin: 30px 0 20px; }

.shell form input.btn,
.content a { cursor: pointer; opacity: 0.7; text-transform: uppercase; }
.shell form input.btn:hover,
.content a:hover { opacity: 1; background-color: rgba(255, 255, 255); color: #c81e6f; }

.shell form .form-row .fa-search { color: #fff; position: absolute; top: 45px; left: 10px; }
.shell form .form-row .fa-search:before { font-size: 20px; }

.shell .list-employers { margin: 0; padding: 0; width: 100%; margin-top: 15px; }
.shell .list-employers li { padding: 14px; background-color: #fff; margin-bottom: 5px; }
.shell .list-employers span { display: block; }
.shell .list-employers li > .employer-descr { width: 33.33%; display: inline-block; float: left; }
.shell .list-employers li .label { font-weight: 600; padding: 5px 0; }

.shell .list-employers span.image { width: 14%; display: block; margin: 0 auto; }
.shell .list-employers span.image img { max-width: 100%; display: block; border-radius: 50%; border: 1px solid #c81e6f; }


.col-2 { width: 49%; float: left; display: inline-block; box-sizing: border-box; }
.col-2 ~ .col-2 { margin-left: 2%; }

form .row.select { background-color: #fff; }
form .row select { width: 100%; font-size: 16px; border: 2px solid rgba(255, 255, 255, 0.21); padding: 15px; padding-left: 35px; background-color: rgba(200, 30, 111, 0.86);
    -moz-transition: all 1.2s ease-out;
    -webkit-transition: all 1.2s ease-out;
    -o-transition: all 1.2s ease-out;
    transition: all 1.2s ease-out; color: #fff;
}

p.error { padding: 15px; background-color: rgb(200, 30, 111); color: #fff; margin-top: 0px; text-decoration: underline; font-weight: 700; }

.holiday > a { background-color: #ec2117!important; color: #fff!important; }
.weeknd > a { background-color: #ea923a!important; color: #fff!important; }


p { margin-bottom: 5px; text-align: left; color: #000066; }

.btn_payment{
  background-color: #171c66;
  color: #ffffff;
  padding: 10px;
  cursor: pointer;
  width: 110px;
  text-align: center;
  margin-top: 25px;
}
.btn_payment:hover{
  color: #ffffff;
}
.notify.shell{
  text-align:center;
}
.notify.shell .btn_payment{
  margin-bottom: 150px;
}