/*****************************************************************************/
/* ACADEMIA SANCHEZ CASAL REGISTER                                           */
/*****************************************************************************/

@font-face {
    font-family: 'open_sansregular';
    src: url('fonts/OpenSans-Regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/*
@font-face {
    font-family: 'open_sansbold';
    src: url('fonts/OpenSans-Bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansitalic';
    src: url('fonts/OpenSans-Italic-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sanslight';
    src: url('fonts/OpenSans-Light-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
*/

@font-face {
    font-family: 'neutra_displaym_titlintitling';
    src: url('fonts/neutradispm-titling-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'neutra_displaym_thinmedium';
    src: url('fonts/neutradispm-medium-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/*
@font-face {
    font-family: 'neutra_textlight_alt';
    src: url('fonts/neutratext-lightalt-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
*/

/*****************************************************************************/
#app .content {
    min-height: 500px;
}

a {
    outline: none;
}

input {
    outline: none;
}

select {
    outline: none;
}

body {
    background-color: #eeeeee;
    font-family: opensans_regular, Arial, Helvetica, sans-serif;
    font-size: 12px;
    margin: 0;
    padding: 0;
}

h1 {
    color: #085648;
    font-family: neutra_displaym_thinmedium, Arial, Helvetica, sans-serif;
    font-size: 30px;
    font-weight: normal;
    margin: 0px 0px 20px 0px;
    padding: 0;
    text-align: center;
    text-transform: uppercase;
}

h2 {
    color: #085648;
    font-family: neutra_displaym_thinmedium, Arial, Helvetica, sans-serif;
    font-size: 19px;
    font-weight: normal;    
    padding: 0;
    text-align: left;
}

/*****************************************************************************/

div#head {
    float: left;
    position: relative;
    width: 100%;
}

div#headTop {
    background-color: #085648;
    float: left;
    position: relative;
    width: 100%;
}

div#headTopLogo {
    float: left;
    position: relative;
    width: 33%;
}

div#headTopLogo img {
    display: block;
    float: left;
    margin: 10px 0px 10px 5%;
    max-width: 90%;
    position: relative;
}

div#headTopTitle {
    color: #fada61;
    float: left;
    font-family: neutra_displaym_titlintitling, Arial, Helvetica, sans-serif;
    font-size: 22px;
    font-weight: bold;
    padding: 25px 0px 0px 0px;
    position: relative;
    text-align: center;
    width: 34%;
}

div#headTopButts {
    color: #ffffff;
    float: left;
    position: relative;
    width: 33%;
}

a#cist {
    display: block;
    float: right;
    margin-top: 11px;
    position: relative;
    text-decoration: none;
}

div#langBody {
    background-color: #eeeeee;
    border: 1px solid #bbbbbb;
    display: none;
    position: absolute;
    right: 0;
    top: 40px;
    z-index: 1;
}

div#headBottom {
    background-color: #fada61;
    float: left;
    position: relative;
    width: 100%;
}

div#phase {
    float: left;
    font-size: 10px;
    margin: 7px 0px 7px 22%;
    overflow: hidden;
    position: relative;
    width: 56%;
}

div#phaseTop {
    float: left;
    margin: 0 5% 0 5%;
    position: relative;
    width: 100%;
}

div#phaseBottom {
    float: left;
    padding: 0 5% 0 5%;
    position: relative;
    width: 100%;
}

div#body {
    background-color: #eeeeee;
    float: left;
    position: relative;
    width: 100%;
}

div#bodyLeft {
    float: left;
    position: relative;
    width: 22%;
}

div#bodyCenter {
    background-color: #ffffff;
    float: left;
    /*min-height: 300px;*/
    padding: 2%;
    position: relative;
    width: 52%;
}

div#bodyCenterInner {
    float: left;
    position: relative;
    width: 100%;
}

div#bodyRight {       
    position: relative;   
}

footer#foot a {
    color: white;
}

footer#foot {
    background-color: #eeeeee;
    float: left;
    position: relative;
    width: 100%;
}

div#footInner {
    background-color: #085648;
    float: left;   
    min-height: 60px;
    padding-top: 20px;
    position: relative;
    width: 100%;
}

div#footInnerName {
    color: #fada61;
    float: left;
    font-weight: bold;
    position: relative;
    text-align: center;
    width: 100%;
}

div#footInnerData {
    color: #ffffff;
    float: left;
    font-weight: bold;
    padding: 12px 0px 12px 0px;
    position: relative;
    text-align: center;
    width: 100%;
}

div#footInnerData img {
    margin-bottom: 3px;
    vertical-align: middle;
}

a#legalWarning {
    color: #ffffff;
    display: block;
    font-weight: normal;
    position: absolute;
    text-decoration: none;
    right: 20px;
    bottom: 10px;
}

a#legalWarning:hover {
    text-decoration: underline;
}

/*****************************************************************************/

.None {
    display: none;
}

.Hidden {
    visibility: hidden;
}

.Center {
    text-align: center;
}

.Info {
    font-family: neutra_displaym_titlintitling, Arial, Helvetica, sans-serif;
    /*font-weight: bold;*/
}

.m-r-50 {
    margin-right: 50px !important;
}

a.Idioma {
    clear: both;
    display: block;
    float: right;
    padding: 10px 20px 10px 20px;
    position: relative;
    text-decoration: none;
}

div.Phase {
    color: #085648;
    float: left;
    position: relative;
    text-align: center;
    width: 15%;
}

div.PhaseAct {
    font-weight: bold;
}

div.BlockIni {
    border-right: 2px solid #085648;
    float: left;
    height: 7px;
    position: relative;
    width: 6%;
}

div.Block {
    border-bottom: 2px solid #cccccc;
    float: left;
    height: 5px;
    position: relative;
    width: 18%;
}

div.DinfoOuter {
    float: left;
    margin: 0px 0px 20px 10%;
    position: relative;
    width: 80%;
}

div.Dinfo {
    color: #888888;
    float: left;
    position: relative;
    text-align: center;
}

div.DinfoF {
    color: #000000;
    float: left;
    font-size: 18px;
    padding: 20px 10px 4px 10px;
    position: relative;
    text-align: center;
}

div.Dinfo2 {
    float: left;
    padding-top: 12px;
    position: relative;
    text-align: center;
}

div.DinfoLang {
    float: left;
    margin: 12px 0 0 10%;
    position: relative;
    width: 80%;
}

div.DinfoLangHead {
    border-bottom: 1px solid #999999;
    color: #000000;
    float: left;
    position: relative;
    width: 100%;
}

div.DinfoLangBody {
    color: #999999;
    float: left;
    padding: 10px 0px 10px 0px;
    position: relative;
    text-align: center;
    width: 100%;
}

div.DinfoFoot {
    color: #999999;
    float: left;
    font-size: 11px;
    margin: 24px 0 12px 0;
    position: relative;
    text-align: center;
    width: 100%;
}

div.Pinfo select {
    display: inline;
}

div.Pinfo {
    color: #999999;
    float: left;
    padding: 60px 0px 60px 0px;
    position: relative;
    width: 100%;
}

div.PinfoL {
    float: left;
    padding: 5px 0px 5px 0px;
    position: relative;
    text-align: left;
    width: 33%;
}

div.PinfoC {
    float: left;
    padding: 5px 0px 5px 0px;
    position: relative;
    text-align: center;
    width: 34%;
}

div.PinfoR {
    float: left;
    padding: 5px 0px 5px 0px;
    position: relative;
    text-align: right;
    width: 33%;
}

div.BlockAct {
    border-bottom: 2px solid #085648;
    float: left;
    height: 5px;
    position: relative;
}

input.ButtonBack {
    background-color: #ffffff;
    background-image: url(../img/back.png);
    background-position: 5px 5px;
    background-repeat: no-repeat;
    border: 1px solid #bbbbbb;
    border-radius: 2px;
    color: #bbbbbb;
    cursor: pointer;
    display: block;
    font-weight: bold;
    padding: 4px 10px 4px 10px;
    padding: 4px 10px 4px 32px;   
    left: 0;
    top: 0;
}

input.Input {
    background-color: #eeeeee;
    border: 1px solid #bbbbbb;
    border-radius: 2px;
    color: #555555;
    padding: 3px 10px 3px 10px;
}

input.InputOptions {
    background-color: #eeeeee;
    border: 1px solid #bbbbbb;
    border-radius: 2px;
    color: #085648;
    margin: 0px 20px 4px 0px;
    padding: 3px 10px 3px 10px;
}

input.InputOptions:focus {
    border-color: #085648;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(128, 120, 72, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(128, 150, 120, 0.6);
}

input.InputOptions2 {
    background-color: #eeeeee;
    border: 1px solid #bbbbbb;
    border-radius: 2px;
    color: #888888;
    margin: 0px 20px 4px 0px;
    padding: 3px 10px 3px 10px;
    width: 170px;
}

input.Radio {
    margin-left: 40px;
}

input.Checkbox {
    margin-left: 40px;
}

input.Input2 {
    background-color: #ffffff;
    border: 1px solid #bbbbbb;
    color: #888888;
    font-size: 10px;
    padding: 1px 4px 1px 4px;
    width: 80px;
}

input.Input3 {
    background-color: #eeeeee;
    border: 1px solid #bbbbbb;
    color: #888888;
    font-size: 10px;
    padding: 1px 4px 1px 4px;
}

select.Select {
    background-color: #eeeeee;
    border: 1px solid #bbbbbb;
    border-radius: 2px;
    color: #555555;
    font-family: neutra_displaym_titlintitling, Arial, Helvetica, sans-serif;
    padding: 3px 10px 3px 10px;
}

select.Select2 {
    background-color: #eeeeee;
    border: 1px solid #bbbbbb;
    color: #555555;
    margin: 1px 0px 1px 0px;
    padding: 1px 5px 1px 5px;
}

select.Select2:focus {
    border-color: #085648;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(128, 120, 72, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(128, 150, 120, 0.6);
}

a.ButtonBack img {
    vertical-align: middle;
}

input.Button {
    background-color: #fada61;    
    background-position: 90% 5px;
    background-repeat: no-repeat;
    border: 1px solid #dddddd;
    border-radius: 2px;
    clear: both;
    color: #085648;
    cursor: pointer;
    display: block;
    float: right;
    font-weight: bold;
    padding: 4px 10px 4px 10px;
    position: relative;
}
input.ButtonNext {    
    background-image: url(../img/next.png);    
    padding: 4px 32px 4px 10px;    
}

a.ButtonNext img {
    vertical-align: middle;
}

input.Button2 {
    clear: none;
}

input.ButtonPlus {
    background-color: #eeeeee;
    border: 1px solid #bbbbbb;
    border-radius: 2px;
    clear: both;
    color: #085648;
    cursor: pointer;
    display: block;
    float: left;
    padding: 3px 10px 3px 10px;
    position: relative;
    text-decoration: none;
}

input.ButtonPlus img {
    vertical-align: middle;
}

input.ButtonAppl {
    background-color: #444444;
    border: 1px solid #bbbbbb;
    border-radius: 2px;
    color: #ffffff;
    padding: 3px 10px 3px 10px;
}

div.Option {
    float: left;
    padding-bottom: 20px;
    position: relative;
    width: 100%;
}

a.OptionHead {
    background-image: url(../img/down.png);
    background-position: 99% 10px;
    background-repeat: no-repeat;
    border: 1px solid #bbbbbb;
    border-radius: 2px;
    color: #000000;
    display: block;
    float: left;
    font-size: 14px;
    line-height: 14px;
    padding: 7px 2% 4px 2%;
    position: relative;
    text-decoration: none;
    width: 96%;
}

div.OptionBody {
    color: #888888;
    display: none;
    float: left;
    padding: 2%;
    position: relative;
    width: 96%;
}

div.General {
    float: left;
    padding-bottom: 14px;
    position: relative;
    width: 100%;
}

div.General a {
    color: #085648;
    font-style: italic;
}

div.RBox {
    clear: left;
    float: left;
    margin-left: 10%;
    position: relative;
}

div.CBox {
    float: left;
    margin-left: 5%;
    min-width: 250px;
    position: relative;
    width: 45%;
}

div.CBox2 {
    float: left;
    position: relative;
    width: 100%;
}

table.General {
    margin-top: 20px;
    width: 100%;
}

td.GeneralL {
    padding: 3px 3px 3px 20px;
    text-align: left;
}

td.GeneralLB {
    font-weight: bold;
    padding: 3px;
    text-align: left;
}

td.GeneralLB span {
    font-weight: normal;
}

td.GeneralC {
    text-align: center;
}

td.GeneralR {
    padding: 3px 3px 0px 3px;
    text-align: right;
}

td.GeneralTotalL {
    background-color: #eeeeee;
    border-top: 1px solid #bbbbbb;
    border-bottom: 1px solid #bbbbbb;
    border-left: 1px solid #bbbbbb;
    font-weight: bold;
    padding: 3px 3px 0px 3px;
    text-align: left;
}

.GeneralTotalC {
    background-color: #eeeeee;
    border: 1px solid #bbbbbb;
    text-align: right;
}

td.GeneralTotalR {
    background-color: #eeeeee;
    border-top: 1px solid #bbbbbb;
    border-bottom: 1px solid #bbbbbb;
    border-right: 1px solid #bbbbbb;
    font-weight: bold;
    padding: 3px 3px 0px 3px;
    text-align: right;
}

.ProgramDate p {
    border: solid 1px #085648;
    color: #085648;
    padding: 10px;    
    text-align: center;
}

.badge-player-counter {
    position: absolute;
    bottom: -7px;
    right: -12px;    
}

.summary-options p{
    margin: 3px;
}

/*****************************************************************************/

@media screen and (max-width: 919px) {

    h1 {
        margin: 0px 0px 10px 0px;
    }
    div#headTopTitle {
        padding: 15px 0px 0px 0px;
    }
    div#phase {
        margin: 7px 0px 7px 0;
        width: 100%;
    }
    div#bodyLeft {
        display: none;
    }
    div#bodyCenter {
        width: 60%;
    }
    div#bodyRight {      
    }
    div#footInner {
        margin-left: 0;
        width: 100%;
    }

}

/*****************************************************************************/

@media screen and (max-width: 799px) {

    div.Pinfo {
        padding: 30px 0px 30px 0px;
    }
    div.PinfoL {
        text-align: center;
        width: 100%;
    }
    div.PinfoC {
        text-align: center;
        width: 100%;
    }
    div.PinfoR {
        text-align: center;
        width: 100%;
    }

}

/*****************************************************************************/

@media screen and (max-width: 599px) {

    h1 {
        margin: 40px 0px 10px 0px;
    }
    div#headTopLogo {
        width: 80%;
    }
    div#headTopTitle {
        padding: 0px 0px 10px 0px;
        width: 100%;
    }
    div#headTopButts {
        position: absolute;
        right: 20px;
        top: 10px;
        width: initial;
    }
    div#BodyLeft {
        display: none;
    }
    div#bodyCenter {
        width: 96%;
    }
    div#bodyRight {      
    }
    a#legalWarning {
        float: left;
        margin-top: 12px;
        position: relative;
        right: initial;
        text-align: center;
        top: initial;
        width: 100%;
    }
    a.ButtonBack {
        margin: 2%;
    }

}

/*****************************************************************************/
/* Bootstrap extension. Icon to collapse component */

.panel-heading .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family: 'Glyphicons Halflings';  /* essential for enabling glyphicon */
    content: "\e114";    /* adjust as needed, taken from bootstrap.css */
    float: right;        /* adjust as needed */
    color: grey;         /* adjust as needed */
}
.panel-heading .accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\e080";    /* adjust as needed, taken from bootstrap.css */
}

.bootstrap-timepicker-widget table td input {
    width: 40px !important;
}

hr {
    border: 1px solid grey;
    border-top: 0;
    border-left: 0;
    border-right: 0;
}