/*
    This file is part of PACT-Vote.

    PACT-Vote is the PACT Party of Canada's official online voting and
    democracy facilitation system. It may eventually become the worlds.

    Copyright (C) PACT. AUTHORS listed in AUTHORS file.

    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program.  If not, see <http://www.gnu.org/licenses/>.

    You can contact the PACT party online at http://pact.tk/,
    or via paper mail at:

    PACT - PRCT
    260 SPADINA AVE UNIT 402
    TORONTO ON   M5T 2E4
    Canada

    Or by email:
    Contact@ACT-Party.CA

    this file is derived from Infinitygrid - http://www.aonethemes.com/infinitygrid
    Infinitygrid is also GPL3
*/

/*
    login.css

    Styles related to login
*/

.login_container {
    background: #e8eced url(/public/system/assets/img/login_bg.png) no-repeat bottom right;
    padding:    33px 45px;
}

.login_container .language {
    float:        right;
    margin-right: -30px;
    margin-top:   -20px;
}

.login_container .language a:hover {
    color: #cc002c;
}

.login_container .headline_login h1 {
    font-family:   "GothamMediumROMMedium";
    font-size:     3.6em;
    line-height:   1em;
    margin-bottom: 30px;
}

.login_container .headline_login h1 strong {
    font-family: 'GothamBoldROMBold';
}

.login_container .please_login h5 {
    font-size:     1.3em;
    margin-bottom: 15px;
    font-weight:   400
}

.login_container .login_detalis {
    position: relative;
    left:     -15px;
}

.login_container .login_detalis .login {
    width: 100%;
}

.login_container .login_detalis .user {
    float:     left;
    width:     35%;
    margin:    0 3% 35px 0;
    min-width: 230px;
}

.login_container .login_detalis .user_text {

}

.login input[type=text],
.login input[type=password] {
    border:           none;
    background-color: #ffffff;
    width:            100%;
    padding:          10px;
    border:           solid 1px #e4e8e9;
}

.login_container .login_detalis .pass {
    float:     left;
    width:     35%;
    margin:    0 3% 35px 0;
    min-width: 230px;
}

.login_container .login_detalis .pass_text {

}

.login_container .login_detalis .checkbox_container {
    float:          right;
    width:          15%;
    min-width:      105px;
    vertical-align: middle;
    margin:         -40px 0 0 0;
}

.login_container .login_detalis .checkbox_container .keep_logged {
}

.login_container h3 a:hover {
    color: #cc002c;
}

/* breadcrumbs */
.bread {
    margin: 0 0 0 -41px;
}

.crumbs {
    position: relative;
}

.crumbs .corner {
    background: url("/public/system/assets/img/triangle.png") no-repeat;
    display:    block;
    width:      11px;
    height:     12px;
    position:   absolute;
    left:       0;
    top:        52px;
}

.crumbs ul li a {
    display:         block;
    float:           left;
    /*height: 50px;*/
    background:      #98a8ae;
    text-align:      center;
    padding:         4px 40px 0;
    position:        relative;
    margin:          15px 10px 0 0;
    line-height:     33px;
    font-size:       25px;
    text-decoration: none;
    color:           #fff;
    text-transform:  uppercase;
    /*text-indent: 2%;*/
    font-family:     'GothamBoldROMBold';
}

.crumbs ul li a span {
    display:     inline-block;
    float:       left;
    font-size:   18px;
    font-family: "GothamMediumROMMedium";
    padding:     0 10px 0 0;
}

.crumbs ul li i {
    float:  right;
    margin: 3px 0 0 0;
}

.crumbs ul li a.red_default {
    background:      #cc002c;
    display:         block;
    float:           left;
    /*height: 50px;*/
    /* background: #98a8ae; */
    text-align:      center;
    padding:         4px 40px 0;
    position:        relative;
/*    margin:          0 10px 0 0;
*/    line-height:     33px;
    font-size:       25px;
    text-decoration: none;
    color:           #fff;
    text-transform:  uppercase;
    text-indent:     2%;
    font-family:     'GothamBoldROMBold';
}

.crumbs ul li {
    display: inline;
}

.crumbs ul li a:after {
    content:       "";
    /* border-top: 40px solid red;
    border-bottom: 40px solid red;
    border-left: 40px solid blue;
    */
    border-top:    18px solid transparent;
    border-bottom: 18px solid transparent;
    border-left:   18px solid #98a8ae;
    position:      absolute;
    right:         -18px;
    top:           0;
    z-index:       1;
}

.crumbs ul li a.red_default:after {
    content:       "";
    /* border-top: 40px solid red;
    border-bottom: 40px solid red;
    border-left: 40px solid blue;
    */
    border-top:    18px solid transparent;
    border-bottom: 18px solid transparent;
    border-left:   18px solid #cc002c;
    position:      absolute;
    right:         -18px;
    top:           0;
    z-index:       1;
}

.crumbs ul li a:before {
    content:       "";
    border-top:    18px solid transparent;
    border-bottom: 18px solid transparent;
    border-left:   18px solid #E8ECED;
    position:      absolute;
    left:          0;
    top:           0;
}

.crumbs ul li:first-child a:before {
    display: none;
}

/* .crumbs ul li:last-child a {
	padding-right: 80px;
}
*/
/* .crumbs ul li:last-child a:after {
	display: none;
}
*/

.crumbs ul li a:hover {
    background: #cc002c;
}

.crumbs ul li a:hover:after {
    border-left-color: #cc002c;
}

.login_crumbs {
    display: inline-block;
    vertical-align: top;
}

.login_with {
    display: inline-block;
    vertical-align: top;
}

.login_with_list li {
    display: inline-block;
    font-size: 1.2em;
    vertical-align: middle;
    text-transform: uppercase;
    color: #444;
    margin-top: 25px;
}

.login_with_description {
    margin-left: 30px;
}

.awesome_font_login {
    margin-left: 20px;
}

.awesome_font_login i {
    font-size: 2em;
    margin-top: -8px;
}

.create {
    margin-top: 20px;
    margin-bottom: 0;
    margin-left: -30px;
}

input#email {
    float: left;
    border-radius: 0px;
    border: 0px solid #e5e5e5;
    background-color: #f0f0f0;
    color: #898989;
    font-size: 12px;
    outline: 0;
    padding: 5px 10px;
    margin: 0 0 10px 0;
    -webkit-box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
    -moz-box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
    box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
    border-radius: 3px;
}
input#email:focus {
    background-color: #f4f4f4;
    border: 0px solid #bbb;
    outline: 0;
    -webkit-box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
    -moz-box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
    box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
}

.form-control {
    -webkit-box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
    -moz-box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
    box-shadow: inset 0px 0px 0px 0px rgba(255, 255, 255, 0);
}



@media (max-width: 767px) {
    .login .pass .user_text span {font-size: 11px !important;}
}



@media (min-width: 768px) and (max-width: 991px) {
    .login_container .headline_login h1 {font-size: 2.4em !important;}
    .login .pass .user_text span {font-size: 11px !important;}
}


@media (max-width: 767px) {
    .login_container .headline_login h1 {font-size: 1.7em !important;}
}