/************************************************ APP **********************************************************************/
/**************** GLOBAL OVERRIDDE**********************/
/* credit: http://stackoverflow.com/questions/3200249/html-list-style-type-dash */
ul {
  margin: 0;
}
ul.dashed {
  list-style-type: none;
}
ul.dashed > li {
  text-indent: -5px;
}
ul.dashed > li:before {
  content: "-  ";
  text-indent: -5px;
}

/* prevent uppercase styling as some languages do not feature it  */
label.btn, .btn, span.fc-button {
  text-transform: none;
  font-size: 1em;
}
.list-square, .list-square {
    list-style-type: square;
} 
.list-nostyle, .list-nostyle {
    list-style-type: none;
}
.alert alert-warning label {
    color:#8a6d3b;
}

html {
    height: 100vh;
}

body {
    height: 100vh;
    padding-top: 0px;
    padding-bottom: 0px;
    background: #68A4C4;
    background-color: #68A4C4;
}

#pagebody {
    min-height: 50vh;
    background: white;
    background-color: white;
}

.panel-default > .panel-heading, .alert-success, .alert-info, .alert-warning, .alert-danger {
    /* override bootstrap-theme.css, line 528. Prevent any (ugly) gradient */
    background-image: none; 
}

/* any placeholder will be set as italic. Credit: https://css-tricks.com/snippets/css/style-placeholder-text/ */
::-webkit-input-placeholder {
   font-style: italic;
}

:-moz-placeholder { /* Firefox 18- */
   font-style: italic;
}

::-moz-placeholder {  /* Firefox 19+ */
   font-style: italic;  
}

:-ms-input-placeholder {  
   font-style: italic;  
}

/**************** END GLOBAL OVERRIDDE**********************/

.eesc-titletable:before {
    position: absolute;
    height: 20px;
    top: 0px;
    right: 0px;
    bottom: auto;
    left: 0;
    margin: auto;
    display: block;
    width: 100%;
    content: '';
    background-color: #034EA2;
}

.eesc-titletable {
    min-width: 320px;
    min-height: 130px;
    margin: 0px 0px 0px 0px;
    display: block;
    position: relative;
    /*background-position: center 0px;
    background-image: url("../images/EESC-MP-1920-wave.png") !important;
    background-repeat: no-repeat;*/
}

@media (max-width: 519px) {
    .eesc-flag {
        min-height: 170px;
        min-width: 195px;
        position: relative;
        background-position: 20px 0px;
        background-image: url("../images/EESC-MP-flag.png") !important;
        background-repeat: no-repeat;
    }

    .eesc-flag_2020 {
        min-height: 170px;
        min-width: 195px;
        position: relative;
        background-position: 20px 20px;
        background-image: url("../images/EESC-MP-flag_2020.png") !important;
        background-repeat: no-repeat;
    }
}

@media (min-width: 520px) {
    .eesc-flag {
        min-height: 170px;
        min-width: 195px;
        position: relative;
        background-position: 20px 0px;
        background-image: url("../images/EESC-MP-flag.png") !important;
        background-repeat: no-repeat;
    }
    .eesc-flag_2020 {
        min-height: 170px;
        min-width: 195px;
        position: relative;
        background-position: 20px 20px;
        background-image: url("../images/EESC-MP-flag_2020.png") !important;
        background-repeat: no-repeat;
    }
}

header.navbar {
    min-height: 130px;
}

header .navbar-nav > li {
    padding-top: 0px;
    padding-bottom: 0px;
}

/*header .navbar-collapse ul.navbar-nav {
    margin-top: 30px;
}*/

.navbar-default .navbar-collapse {
    margin-top: 10px;
    padding-right: 15px;
}

.navbar .nav > li > a {
    padding-top: 0px;
    padding-bottom: 0px;
    font-size: 15px;
    text-transform: none;
}

@media (min-width: 768px) {
    .navbar-header {
        float: none;
    }
}

@media (max-width: 767px) {
    .navbar-header {
        margin-top: 25px;
    }
}

.in.navbar-collapse {
    margin-top: 0px;
}

@media (max-width: 519px) {
    .navbar-brand {
        display: none;
    }
}

@media (min-width: 520px) {
    .navbar-brand {
        height: auto;
        margin-top: 0px;
        margin-left: 0px;
        padding-top: 2px;
        padding-left: 230px;
    }
}

.navbar > .container .navbar-brand {
    margin-left: 0px;
    padding-top: 22px;
}

.navbar-brand span {
    color: #004375;
}

.navbar-default .navbar-brand {
    color: #034EA2;
}

.navbar .nav > .active > a,
.navbar .nav > .active > a:hover,
.navbar .nav > li > a:hover,
.navbar .nav > li > a:focus,
.navbar .nav > .active > a:focus,
.validation {
    color: #034EA2;
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: #034EA2;
}

.navbar .nav > li > a {
  color: #111A33;
  font-weight: normal;
}

section.callaction {
    background-color: #68A4C4;
}

section.cookiesHeader {	
    background:#ffd617;
    padding-top:10px;
    padding-bottom:10px;	
}

.cookiesFont a {
    color:#424242;    
}

.cookiesFont input {
    color:white;
    background-color:#034EA2;    
}

.cookiesFont input:hover, .cookiesFont input:focus  {
    color:white;
    background-color:#023e82;  
}

.cookies-text {
	text-align: center;    
}

.cta-text h2 span {
    color: #FFFFFF;
    font-weight: bold;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* styles for validation helpers */
.field-validation-error {
    color: #b94a48;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}

.validation-summary-valid {
    display: none;
}

.form-control {
    height: auto;
    min-height: 34px;
}

article.interest .interest-personally-submitted {
    background-color: #00ACDC;
}

    article.interest .interest-personally-submitted a {
        color: #fff;
    }

        article.interest .interest-personally-submitted a:hover {
            color: #000;
        }

h5.widgetheading {
      margin: 0 0 0.5em 0;
}

#userguide .legal-text {
      margin: 3em 0 3em 0;
}

#userguide .legal-text .last {
    margin: 3em 0 1em 0;
    font-size: 0.85em;
}

#userguide .legal-text ul > li {
      margin: 0 0 1em;
}

#userguide ul > li {
    padding-right: 0;
}

#userguide ul.list-inline {
    padding-top: 0.25em;
}

#userguide .badge.document-language {
    max-width: 2.8em;
    width: 2.8em;
    color: #fff;
    background-color: #2dc937;
}

.box {
  margin: 1em 0;
}

    .box a {
        text-decoration: none;
    }
    
    .box .box-gray {
        position: relative;
    }

    .box .box-icon {
        position: absolute; 
        bottom: 25px;
        width: 100%;
    }

    .box .box-bottom {
        padding: 2px 0;
    }

.news-details section {
    margin: 0em 0 1em;
}

.news-details .content {
    margin-left: 1em;
}

.social-network-container {
    text-align: left;
    padding-top: 1em;
}

@media (min-width: 1200px) {
    .social-network-container {
          text-align: right;
          padding-top: 0;
    }
}

.social-network { }

    .social-network i {
        font-size: 1.3em;
    }

    ul.social-network li {
        display: inline-block;
        height: 19px;
        margin: 0 9px;
    }

    ul.social-network li.first {
        margin-left: 0px;
    }
        
    ul.social-network li.last {
        margin: 0;
    }

    ul.social-network li a {
        display: inline-block;
        height: 19px;
        line-height: 1;
        vertical-align: text-top;
    }

    ul.social-network li a:active {
        color: #fff;
    }

    ul.social-network li a.image-res {
        margin-top: 1px;
        vertical-align: middle;
    }

    /*  image toggle for hover color
    scoped to class .social-network and .image-res to avoid regressions

    default */
    ul.social-network li a.image-res img.default-state {
        display: inline;
    }

    ul.social-network li a.image-res img.hover-state {
        display: none;
    }

    /*  hover */
    ul.social-network li a.image-res:hover img.default-state {
        display: none;
    }

    ul.social-network li a.image-res:hover img.hover-state {
        display: inline;
    }

@media (max-width: 520px) {
    footer {
        font-size: 1.05em;
    }

    footer h5 {
        font-size: 1.05em;
    }
}

@media (max-width: 992px) {
    h5.widgetheading {
        padding: 1em 0 0.5em 0;
    }

    h5.widgetheading.first {
        padding: 0 0 0.5em 0;
    }
}

.link-action, .link-action:link, .link-action:hover, .link-action:visited, .link-action:active {
    color: inherit;
}

/************************************************ WARNING **********************************************************************/

#warning.container #main {
    margin: 2em 0 5em 0;
}

/************************************************ LANGUAGES MENU **********************************************************************/
#globe {
    padding: 5px 5px;
}

#navbar-collapse {
    /*margin-top: -45px;*/
}

.selection .selection-control {
    cursor: pointer; 
    border: 1px solid #7E7E7E;
    background: #fff; 
    padding: 0.4em 0.9em;
    margin: 2em 0; 
    position: relative;
}

.selection .selection-control-text {
  font-style: italic;
}

@media (max-width: 767px) {
   .selection .selection-control {
        display: none;
    }
}

.selection .selection-control span {
    color: #333; 
    font-weight: normal; 
    padding-right: 2.7em;
}

.selection .selection-control .selection-caret {
    color: #fff;
    background: #034EA2;
    padding: 0.2em;
    width: 37px;
    text-align: center;
    font-size: 1em;
    line-height: 28px;
    position: absolute;
    top: 0;
    right: 0;
}

.selection .language {
}

    @media (max-width: 767px) {
        .selection .language ul {
            margin: 4em 1.1em 0;
        }
    }

    @media (min-width: 768px) {
        .selection .language ul {
            margin: 4em 1.1em 0;
            /*margin: 3.4em 0;*/
        }
    }

    .selection .language ul li div.row {
        margin: 0.6em 0;
        padding: 0em;
    }

    @media screen and (min-width: 200px) {
        .selection .language ul {
            min-width: 170px !important;
        }
    }

    @media screen and (min-width: 768px) {
        .selection .language ul {
            min-width: 480px !important;
        }
    }

    .selection .language li {
        background-color: #fff;
    }
    
    .selection .language li a:hover, .selection .language li a:active {
        transition: none;
        background: #fff;
    }

    .selection .language li a:hover span.language-value {
        text-decoration: underline;
    }

    
    .selection .language li a.selected:hover span.language-value {
        text-decoration: none;
    }

    .selection .language-item a {
        background-color: #fff;
        color: #777;
        padding: 0;
        margin: 0;
        text-shadow: none;
        border-bottom: none;
        background: #FFFFFF;
        text-decoration: none;
    }
    
    .selection .language-item a.selected {
        text-decoration: none;
        cursor: default;
    }
    
    .selection .language a.dropdown-toggle {
        text-decoration: none;
    }

    .selection .language a.dropdown-toggle span {
        border-top-color: #000;
    }

    .selection .language a.dropdown-toggle:focus, .selection .language a.dropdown-toggle:hover {
        background-color: #fff;
    }

    .selection .language-item {
          padding: 0.15em 0;
    }

        .selection .language-item .language-value {
              background: #FFFFFF;
              color: #333;
              font-size: 14px;
              text-decoration: none;
              padding-left: .2em;
              font-weight: normal;
        }
        
        .selection .language-item .language-value.selected {
              color: #999;
        }

        .selection .language-item .language-box {
              border: 1px solid #346195;
              background: #FFFFFF;
              color: #000;
              padding: 5px 8px 5px 6px;
        }

            .selection .language-item .language-box.selected {
                color: #fff;
                background: #034EA2;
            }

            .selection .language-item .language-box.language-box-hover {
                background-color: #5E5E5E;
                color: #fff;
            }

        .selection .language-item .language-box .language-code {
                display: block;
                width: 15px;
                text-transform: uppercase;
                font-size: 14px;
            }


/***************************************************************** INTEREST *****************************************************************************************/

section .toggle-expand-all {
    font-size: 20px;
}

.toggle-expand-all.btn:focus, .toggle-expand-all.btn:active:focus, .toggle-expand-all.btn.active:focus, .toggle-expand-all.btn.focus, .toggle-expand-all.btn:active.focus, .toggle-expand-all.btn.active.focus {
  outline: none;
}

/***************************************************************** LANGUAGES *****************************************************************************************/
button.more, button.more:active, button.more:focus {
    outline: none;
}

.more-languages {
    padding-top:0.5em;
}

ul.list-inline li.doc-entry {
    padding-bottom: 0.3em;
}

ul.document-language {
    color: #fff;
    max-width: 4.6em;
    width: 4.6em;
    background-color: #2dc937;
}

ul.document-language.unavailable {
    color: #fff;
    max-width: 2.7em;
    width: 2.7em;
    background-color: #e7b416;
}

ul.document-language.dw-only {
    max-width: 2.3em;
    width: 2.3em;
}

    ul.document-language li.document-language-lang {
        width: 50%;
    }

    ul.document-language li.document-language-lang > span {
        padding-left: 0.25em;
    } 
       
    ul.document-language.unavailable li.document-language-lang > span {
        padding-left: 0.4em;
    }

    ul.document-language li.document-language-lang > span > a {
        color: #fff;
        font-weight: normal;
    }
    
    ul.document-language li.document-language-actions {
        border-left: 1px solid #fff;
    }

    ul.document-language li.document-language-actions-area {
        padding-left: 0.3em;
    }

    ul.document-language li.document-language-actions a.caret-selector {
        color: #fff;
        font-weight: bold;
        text-decoration: none;
        padding-left: 0.3em;
    }

    ul.document-language .document-language-actions-popup {
        position: relative;
    }

    ul.document-language li.document-language-actions ul.document-language-actions-popup-list {
        position: absolute;
        top: 0;
        left: -67.20px;
        border: 1px solid #999;
        float: left;
        width: 160px;
        min-width: 160px;
        padding: 0.5em 0 1em 1em;
        font-size: 14px;
        text-align: left;
        list-style: none;
        background-color: #fff;
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
        border: 1px solid rgba(0, 0, 0, .15);
        border-radius: 4px;
        -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
        box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
        z-index: 10000;
    }

        ul.document-language li.document-language-actions ul.document-language-actions-popup-list li a.action-link {
            border-bottom: 1px solid #ffffff;
            font-weight: lighter;
            color: #656565;
            line-height:2em;
        }
    

/*.badge.document-language {
  background-color: #2C2D69;
  padding: 5px 5px 4px 5px;
  width: 40px;
}

.badge.document-language.unavailable {
    background-color: #ECECEC;
    color: #4C3535;
}

a.link-unavailable {
    color: #fff;
    line-height: 1.9em;
    padding: 3px;
    float: left;
}*/

/*********************************************** ORTOS INTEREST DOCUMENTS *************************************************************************/
.ortos {
    float: left; 
    margin: 0;
}

.ortos .dropdown-toggle {
    padding: 5px 5px 5px 0; 
}

.ortos .dropdown-menu {
    top: 100%;
    left: 0;
}

.ortos .badge {
  min-width: 4.6em;
  max-width: 4.6em;
  padding-left: 0.6em;
}

.ortos.nav > li > a.actions {
    padding: 0 1em 1em 0;
}

.ortos.nav > li > a:hover, .ortos.nav > li > a:focus {
    background-color: #fff;
}

.ortos .document-language .open-list {
  padding-left: 0.5em;
  border-left: 1px solid #FFF;
  margin-left: 0.4em;
}

li.foreseen {
    border-bottom: 1px dashed #C0C0C0;  padding: 0 0 1em 0;
}

li.open section {
   padding-top: 1em;
}

.foreseen-work-open-calls {
    padding-top: 1em;
}

    .foreseen-work-open-calls ul.list-unstyled {
        margin: 0;
    }

.closed-calls ul.list-unstyled li {
    margin: 1em 0;
}

/***************************************************************** LOST PASSWORD *****************************************************************************************/

.lost-password {
}

.lost-password img {
    border: 1px solid #EAEAEA;
}

    .lost-password section, .lost-password header {
        margin: 1em 0;
    }

    .lost-password header p::first-letter {
        font-size: 2em;
        font-weight: bold;
    }

    .lost-password .caution {
    }
    
        .lost-password .caution ul {
            margin: 0.5em 3em 0;
        }    
        
        .lost-password .caution .warning {
              margin: 2em 0 0;
        }

    .lost-password .start-procedure {
    }

        .lost-password .start-procedure .info { 
            font-size: 0.85em;
            margin: 1em 0 0;
        }

        .lost-password .start-procedure .info p { 
            margin: 0;
            padding: 0;
        }
        
    .lost-password .main-list {
         margin: 0 3em 4em;
        padding: 0;
         line-height: 0em;
    }

        .lost-password .main-list > li {
             margin: 0 3em 4em;
             line-height: 0em;
        }

    .lost-password .secondary-list {
        list-style-type: square;
    }

        .lost-password .secondary-list li {
            line-height: 1em;
        }

        .lost-password .secondary-list li img {
            margin: 1em 0;
        }

/*************************************************************** AGENDA **********************************************************************************************/
.agenda section h3 span {
    color: #2C4390;
}

ul.document li.document-item {
    list-style-type: square;
    padding: 0.7em 0;
}
/****************************************************************** WIP ***********************************************************************************************/
@media (max-width: 1200px) {
    .wip.table-responsive.table-adaptative td {
          white-space: normal !important;
    }
    .wip.table-responsive.table-adaptative .small-width {
        width: 100px;
    }
    .wip.table-responsive.table-adaptative .default-width {
        width: 150px;
    }
    .wip.table-responsive.table-adaptative .large-width {
        width: 350px;
    }
}
/****************************************************************** ALL BODIES ***********************************************************************************************/
/* override bootstrap default styling */
.bodies .list-group .body-item.list-group-item {
    border-left-width: 0; 
    border-right-width: 0;
    border-top-left-radius: 0; 
    border-top-right-radius: 0;
}
.bodies .list-group .body-item.list-group-item.warning {
    background-color: #fcf8e3;
}
/****************************************************************** MEETINGS LEGEND ***********************************************************************************************/
/* odd number of columns; workaround is to generate 2 different contents */
#legend td {
  border: 1px solid #ddd;
}
#legend td.square {
  padding: 0.2em 0;
  line-height: 2em;
  margin: 0.5em;
  width: 7px;
}
@media (max-width: 500px) {
    #legend .two-columns {
        display: block;
    }

    #legend .seven-columns {
        display: none;
    }
}
@media (min-width: 501px) {
    #legend .two-columns {
        display: none;
    }

    #legend .seven-columns {
        display: block;
    }
}
/************************************************ HELPERS **********************************************************************/
/* http://stackoverflow.com/questions/826782/css-rule-to-disable-text-selection-highlighting */
*.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.margin-clearfix {
    margin-bottom: 0px;
}

.margin-reset {
    margin: 0;
}

a.disabled { 
    /* IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
    /* IE 5-7 */
    filter: alpha(opacity=10);
    /* Netscape */
    -moz-opacity: 0.1;
    /* Safari 1.x */
    -khtml-opacity: 0.1;
    /* Good browsers */
    opacity: 0.1;
}

.padding-reset {
    padding: 0;
}

.margin-bottom-reset {
    margin-bottom: 0 !important;
}

/**  Firefox hack for table responsiveness. See http://getbootstrap.com/css/#tables-responsive  **/
@-moz-document url-prefix() {
    fieldset {
        display: table-cell;
    }
}

/* will ensorfe and cursor (handglove) to show up */
.hand-area {
    cursor: pointer;
}
/* use in conjunction with Bootstrap's table-responsive */
@media (max-width: 768px) {
    .table-responsive.table-adaptative td {
          white-space: normal !important;
    }
    .table-responsive.table-adaptative .small-width {
        width: 100px;
    }
    .table-responsive.table-adaptative .default-width {
        width: 150px;
    }
    .table-responsive.table-adaptative .large-width {
        width: 350px;
    }
    .table-responsive.table-adaptative .has-200-width {
        width: 200px;
    }
    .table-responsive.table-adaptative .has-300-width {
        width: 300px;
    }
    .table-responsive.table-adaptative .has-400-width {
        width: 400px;
    }
}
input[type="text"].small-width {
    width: 5em;
}

/* http://stackoverflow.com/questions/20547819/vertical-align-with-bootstrap-3 */
.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

.no-bullet {
    list-style-type: none;
}

.fa-smaller {
    font-size:0.7em;
}

/************************************ ELLIPSIS ICON AS BUTTON****************************************** */

.btn-default.icon-button, .btn-default.icon-button:link, .btn-default.icon-button:hover, .btn-default.icon-button:visited, .btn-default.icon-button:active {
    border: none;
    background-color: inherit;
}

.btn-default.icon-button:hover {
    background-color: #F9F9F9;
}

/************************************************ PRINT **********************************************************************/
@media print {
    .noprint {
        display: none;
    }

    a[href]:after {
        content: none !important;
    }
}

@media screen {
    .noscreen {
        display: none;
    }
}
/****************************************************** MEETING DOCUMENTS ********************************************************************************/
.session-info .tag {
    float: left;
    width:30px;
}
.session-info h1, .agenda h2, .agenda h3, .agenda h4, .agenda h5, .agenda h6 {
    margin: 0.5em 0;
}
.session-info h5 {
    color: #999;
    font-weight: normal;
}

.buttonTextWrap {
    white-space: normal;
    text-align:left;
}

.star {    
    font-size: 300%; /* Make it 3 times  as large */
}

.forceToWhite a {
    color: #f8f8f8;
}