 /*
 * Globals
 */

 a {text-decoration: none; color:inherit;}
 .h1_ico {width: 65px; margin-top: 20px; margin-left: 10px;}
 .pt-6 {margin-top: 4rem;}
 .color1 {color:#B4515E;}
 
 .btn_ico { max-width:20px; margin-right: 15px; margin-top: -5px; }
 
 /* Custom default button */
 .btn-secondary,
 .btn-secondary:hover,
 .btn-secondary:focus {  color: #333;  text-shadow: none; /* Prevent inheritance from `body` */}
 
 .btn_download:hover {background-color: #7C5157!important; }
 
 @media screen and (max-width:767px) {
     h1 { background-color: #d9d9e3; padding: 30px 15px; margin-bottom: 0; }
     .title_h1 { margin-left:100px; }
     .h1_ico {float:left; margin-top: -50px;}
     .h-100 {height: auto!important;}
 
 }
 
 
 /*
  * Base structure
  */
 
 html, body {
     max-width: 100%;
     overflow-x: hidden;
 }
 
 body { font-family: Montserrat; font-size: 15px; background-color:#414141DB;   }
 h1 {font-weight: 700; line-height: 1; color: #5B5B5B; font-size: 2rem;}
 .cover-container {  max-width: 1400px;}
 
 @media screen and (max-width:767px) {
     main.px-3, .cover-container.px-4 {padding: 0!important;}
 }
 
 
 
 /*
  * Header
  */
 
 .navbar {padding: 5px 0 0 0;}
 
 .navbar-brand img {max-width: 260px; margin-top: -15px;}
 
 #navbarNav  {margin-top: 25px;}
 #navbarNav .nav-link { color: #fff; padding: 0 2rem; }
 #navbarNav > .navbar-nav > .nav-item > a { border-right: thin solid #fff; font-size: 14px; }
 #navbarNav .nav-item:last-child a {border: none;}
 #navbarNav .nav-link:hover,
 #navbarNav .nav-link:focus {  border-bottom-color: rgba(255, 255, 255, .25);}
 #navbarNav .nav-link + .nav-link {  margin-left: 1rem;}
 #navbarNav .active {  color: #FFF; }
 #navbarNav .active_bar {display:none; width: calc(100% - 4rem); background-color: #B4515E; height: 2px; margin: 0 auto; margin-top: 18px;}
 #navbarNav .active:hover + .active_bar, #navbarNav .active + .active_bar { display: block;}
 
 /*#navbarNav .nav-item .active:after{ content: ""; height: 2px; display: block; background-color: #B4515E; position: absolute; padding: 0 1rem; bottom: -8px;  }*/
 
 #navbarNav .nav-item .active{ color: #fff; }
 #navbarNav .dropdown-menu {border-radius: 0; background-color: #000; margin-left: 4rem;  margin-top: -1px;}
 
 #navbarNav .dropdown-item { color:#fff; font-size: 14px; padding: 5px 20px; }
 #navbarNav .dropdown-item:hover {background-color: #000; color: #B4515E;}
 
 #navbarNav .langDropdown { min-width: 4rem!important; margin-left: 2rem; }
 
 #navbarNav .nav-item .menu_ico {max-width:23px; margin-right: 10px; margin-top: -3.5px;}
 /*#navbarNav .nav-item .active .menu_ico{ filter: invert(32%) sepia(41%) saturate(768%) hue-rotate(303deg) brightness(113%) contrast(86%);}*/
 
 @media screen and (max-width:991px) {
     
     .navbar { padding: 11px 12px 7px;}
 
     .navbar-brand img { max-width: 220px; margin-top: -12px; }
     .home .navbar-brand img {  margin-top: -25px;}
 
     .navbar-toggler { border: none;}
     .navbar-toggler:focus,
     .navbar-toggler:active,
     .navbar-toggler-icon:focus { 	outline: none; 	box-shadow: none;}
     #navbarNav {margin-top: 10px;}
     #navbarNav > .navbar-nav > .nav-item > a {border:none; font-size: 16px; margin: 8px 0 8px 4px; text-transform: uppercase;}
     #navbarNav .nav-link {padding: 0;}
     #navbarNav .active + .active_bar {display: none;}
     #navbarNav .langDropdown { margin-left: 0; }
     #navbarNav .dropdown-menu {background-color: transparent; border: none; padding-top: 0;  text-transform: uppercase; margin-left: 24px!important;}
     #navbarNav .dropdown-item { font-size: 16px; }
     #navbarNav .navbar-toggler:hover {   border: 0; }
     .home #navbarNav, .home #navbarNav .dropdown-menu {    margin-top: 0!important;}
 }
 
 
 /*
  * Main
  */
 
 main { background: url("https://valuatravelsandbox.powerappsportals.com/main_background.jpg") no-repeat top center; padding: 6rem 0; background-size: cover; }
 .sub_h1 { font-weight: 400;font-size:25px; }
 .content_table { max-width: 1200px; }
 #msg_error { text-align: center; margin-top: 20px; font-size: 16px; color:red;}
 
 
 @media screen and (max-width:767px) {
     main {padding: 2rem; }
     main {background-size: auto;}
 }
 
 /*
  * Home
  */
 
 .home .navbar-brand {margin-top: 13px;}
 .home #navbarNav { margin-top: 18px;}
 .home #navbarNav .dropdown-menu { margin-top: 19px;}
 
 .home h1 {font-size: 2.8rem; margin-bottom: 5px;}
 .home .sub_h1 {margin-top: 10px;}
 
 #access {font-size: 14px; font-weight: 500;}
 #access .input_field { border-radius: 40px; border: none; padding: 10px 20px; width: 100%; font-size: 14px;font-weight: 600;}
 #access input[type="submit"] { background-color:#B4515E; padding: 10px 20px; color:#fff; border-radius: 40px; border:none; width: 100%;}
 #access input[type="submit"]:hover {background-color: #7C5157;}
 
 .error {background-color:#B4515E; color:#fff; padding: 41px 30px; text-align: center; border-radius: 15px; }
 .error .msg_ico { border-radius: 50%; border: 3px solid #fff; font-weight:600; font-size: 40px; width: 55px; height: 55px; line-height: 1; padding-top: 3px; margin: 0 auto; margin-bottom: 30px;}
 .error .msg_error { font-weight: 700; font-size: 30px; margin-bottom: 15px;}
 .error .msg_text { font-weight: 600; font-size: 17px; line-height: 1.2; }
 .error button { padding: 10px 20px; color:#fff; border-radius: 15px; border: thin solid #fff; background-color: transparent; margin-top: 20px; font-weight: 600; width:75px;}
 
 @media screen and (min-width:991px) {
     .home .cabcera { min-height: 71px; }
 }
 
 @media screen and (max-width: 990px) {
     .home .navbar {	padding: 5px 12px 0px;	}
 }
 
 @media screen and (max-width:767px) {
     .home h1 { font-size:2rem; margin-bottom: 30px;  text-align: center; }
     #access { padding: 30px; }
 }
 
 
 
 /*
  * Viatges
  */
 
 #viatges th { background-color: #f1f1f1!important; border-right: thin solid #fff!important; text-align: center; font-size:13px!important; font-weight: 400; color:#B4515E; padding: 30px 15px;}
 #viatges th:last-child {border-right: none!important;}
 #viatges td, #viatges th {border-color: #f1f1f1;}
 #viatges td {padding: 15px 5px; font-weight: 500; font-size: 13px!important; text-align: center; vertical-align: middle;}
 #viatges .table_ico {display: block;    margin: 0 auto;    max-width: 24px;    margin-bottom: 10px;}
 
 #viatges .dropdown-toggle { margin-top: 10px;}
 
 .td_dropdown:hover {background-color:#B4515E; }
 .td_dropdown:hover .dropdown > img { filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(180%) contrast(100%);}
 #viatges .td_dropdown .dropdown_info .table_ico {display: inline-block; margin: 0 10px;}
 
 #viatges_table .dropdown_info { border-radius:0; background-color:#B4515E; padding: 0; margin-left: -36px!important; margin-top: 20px!important; }
 #viatges_table .dropdown_info .dropdown-item { color:#fff; font-size: 14px; padding: 15px 25px; height: 56px; }
 #viatges_table .dropdown_info .dropdown-item:hover {background-color: #7C5157;}
 
 #viatges_xs {display: none; margin-bottom: 80px;}
 #viatges_xs .fitxa:not(:first-child) {margin-top: 40px;}
 #viatges_xs .interior {background-color:#fff; padding: 30px 50px; }
 #viatges_xs .row {background-color:#B4515E; color:#fff; margin: 0; }
 #viatges_xs .row .col-6 { padding: 10px 0 10px 0; text-align: center; } 
 #viatges_xs .row .col-6:first-child {border-right: thin solid #fff; text-align: center; } 
 #viatges_xs img {max-height: 22px; margin-right: 5px;}
 #viatges_xs .txt_bold {font-weight: 600;}
 
 @media screen and (max-width:767px) {
     #viatges_table {display: none;}
     #viatges_xs {display: block;}
      .viatges .h1_ico {
        margin-top: -42px;
        width: 52px;
      }
 }
 
 
 
 
 /*
  * Inscripcions
  */
 
 #container_table .btn_download {  border:none; background-color:#B4515E; color:#fff; padding: 10px 1px; font-size: 12px; width: 80px; height: 80px; margin-top: 60px; margin-bottom: 10px; text-align: center; }
 
 #container_table .btn_download img {margin: 0  auto 5px auto;}
 #container_table { margin-top: -80px;}
 
 #profesors, #alumnes {margin-top: 20px;}
 
 #profesors thead tr th, #alumnes thead tr th { background-color: #F1F1F1; padding-top: 20px; border-bottom: none; border-top: 3px solid #E2E2E2; }
 
 .table_white {background-color: white; }
 .table_white h2 {font-size: 21px; font-weight: 700; color:#5B5B5B; margin-left: 10px;}
 .table_white th {text-align: center; font-size: 13px!important;  font-weight: 400;  color: #B4515E; padding: 30px 15px 20px 15px;}
 .table_white td {   padding: 12px 10px;    font-weight: 500;    font-size: 13px!important;    text-align: center;}
 .table_white img {max-width: 30px; margin-right: 10px;}
 
 #alumnes_table h2 {margin-left: 20px;}
 #alumnes_table th img {margin: -3px auto 0 auto;}
 
 .alu_filter {width:80px; height: 80px; background-color:#B4515E; padding: 15px 10px; font-size: 13px; color:#fff; text-align: center;  cursor: pointer; border-radius: 0; border:0;}
 .alu_filter:hover {background-color:#7C5157!important; }
 
 .alu_filter img {margin-bottom: 5px; max-width: 22px;}
 
 #panel_filter, 
 #panel_filter_xs {background-color:#B4515E;  font-size: 13px; border-radius: 0; border:0; width:180px; color:#fff;}
 #panel_filter .sex,
 #panel_filter_xs .sex { border-bottom: thin solid #fff;  padding: 15px; }
 #panel_filter .sex input[type="radio"],
 #panel_filter_xs .sex input[type="radio"] { margin: 0 5px; width: 17px; height: 17px; position: relative; bottom: -3px;  }
 #panel_filter .dni,
 #panel_filter_xs .dni { display: block; padding: 15px;  }
 #panel_filter .dni input[type="checkbox"],
 #panel_filter_xs .dni input[type="checkbox"]  { margin: 0 5px 0 13px; width: 17px; height: 17px; position: relative; bottom: -3px;  }
 #panel_filter input[type="submit"],
 #panel_filter_xs input[type="submit"] { width: 100%; border:0; background-color: #5B5B5B; color:#fff; padding: 10px; font-size: 12px; font-weight: 500;}
 #panel_filter input[type="submit"]:hover,
 #panel_filter_xs input[type="submit"]:hover {background-color: #707070;} 
 
 #filtres_xs { display: none;}
 #filtres_xs { margin-top: 20px;}
 #filtres_xs .alu_filter {width: 100%; height: 50px; border-right: thin solid #fff; }
 #filtres_xs .btn_download {width: 100%; height: 50px; text-transform: uppercase;}
 #filtres_xs .btn_download img {margin-right: 10px; }
 #filtres_xs .col-6 {padding: 0;}
 #filtres_xs #panel_filter_xs {text-align: center;    width: 200%;    margin-top: 1px;}
 
 @media screen and (max-width:767px) {
     .inscripcions #container_table {margin-top: 0;}
     .inscripcions #container_table .px-5 {padding-left: 1.8rem!important; padding-right: 1.8rem!important;}
     .inscripcions .h1_ico {margin-top: -65px;}
     .inscripcions #container_table h2 { margin-left: 0; margin-bottom: 20px;}
     .inscripcions #container_table .col-6 { margin-bottom: 10px;}
     .inscripcions #container_table .col-6:nth-child(4) img, .inscripcions #container_table .col-6:nth-child(5) img { margin-left: 8px;}
     .inscripcions #container_table .col-md-1 { background: #fff; }
     .inscripcions #container_table .btn_download {margin: 0;}
     .inscripcions #container_table .telf {min-width: 120px;}
     #filtres {display: none;}
     #filtres_xs {display: block;}
 }
 
 
 /*
  * Documents
  */
 

 #docs_table { 
    max-width: 900px;
}
    
 #docs_table .btn_download { margin-top: 0;  border:none; background-color:#B4515E; color:#fff; padding: 10px 20px; font-size: 14px;  }
 
 #pills-tab .nav-item {width: 33%; }
 #pills-tab .nav-item:nth-child(2) { margin: 0 0.5%;}
 #pills-tab .nav-item .nav-link { width: 100%; border-radius: 0;  background: #E8E4E4 url("https://valuatravelsandbox.powerappsportals.com/flecha_off_doc.svg") no-repeat 10px center; background-size: 25px;  color:#5B5B5B; font-size: 18px; padding: 20px 0; }
 #pills-tab .nav-item .nav-link:hover {background-color:#CBCBCB; }
 #pills-tab .nav-item .nav-link.active { background: #B4515E url("https://valuatravelsandbox.powerappsportals.com/flecha_off_white.svg") no-repeat 10px center;  background-size: 25px;  color:#fff; }
 
 #pills-tabContent .tab-pane .clearfix {padding: 12px 20px 12px 40px; border-bottom: thin solid #E2E2E2;  }
 #pills-tabContent .float-start { margin-top: 12px; }
 
 @media screen and (max-width:767px) {
     #pills-tab .nav-item {width: 100%;}
     #pills-tab .nav-item:nth-child(2) { margin: 5px 0;}
     #docs_table .btn_download { margin:15px auto 10px auto; }
     #docs_table .float-start {float:none!important;}
     #docs_table {margin-bottom: 60px;}
 }
 
 
 /*
  * Contacte
  */
 
 #contacte #dades {background-color: #f1f1f1; padding: 70px;}
 #contacte #dades h2 { border-bottom: 4px solid #a7a7a7 ; padding-bottom: 5px; font-weight: 600;}
 #contacte .dades { font-weight: 600;}
 #contacte .details {margin:45px 25px;}
 #contacte .details_title { background-color:#faf3f4; padding: 20px 15px 2px 40px; border-top-left-radius: 40px;  border-top-right-radius: 40px;   }
 #contacte .details_title h2 {font-weight: 600;}
 #contacte .details .row {padding: 0 30px 0 90px; margin-top: 20px; }
 #contacte .details .txt_details {margin-top: 5px; font-weight: 500;}
 #contacte .parents table {margin-left: 14px; margin-top: 15px;}
 #contacte .parents table, #contacte .parents table td  {font-size: 15px!important; text-align: left;}
 #contacte .parents table th:first-child, #contacte .parents table td:first-child { padding: 14px 0; font-size: 13px!important;}
 #contacte .parents table th {padding: 0!important; font-size: 15px!important; text-align: left; }
 #contacte .parents table tr td:first-child { font-weight: 600; }
 #contacte .parents table tr td { padding-left: 0!important;}
 #contacte .parents table tr:last-child {border-bottom-color:#fff;}
 
 @media screen and (max-width:767px) {
     .contacte #container_table {margin-top: 0!important;     background-color: white;}
     .contacte .table_white.p-3 {padding: 0!important;}
     #contacte #dades {padding: 40px 57px;}
     #contacte .details {   margin: 40px 20px;}
     .contacte td {min-width: 120px; padding-right: 10px;}
     .contacte #contacte  .father { min-width: 80px!important; padding-left: 20px;}
     #contacte .details .row {padding-left: 42px;}
     #dades .ps-5 {padding-left: 0!important;}
     .col-md-2{width: 107.2vw;}
     
 }
 
