/* Font Face */

@font-face {
 font-family: 'Graphik Semibold Web';
 src: url(https://www.uvic.cat/themes/custom/uvic/build/fonts/Graphik-Semibold-Web.eot);
 src: url(https://www.uvic.cat/themes/custom/uvic/build/fonts/Graphik-Semibold-Web.eot?#iefix) format("embedded-opentype"), url(https://www.uvic.cat/themes/custom/uvic/build/fonts/Graphik-Semibold-Web.woff2) format("woff2"), url(https://www.uvic.cat/themes/custom/uvic/build/fonts/Graphik-Semibold-Web.woff) format("woff");
 font-weight: 600;
 font-style: normal;
 font-stretch: normal
   }
   
   .Graphik-Semibold-Web {
 font-family: 'Graphik Semibold Web';
 font-weight: 800;
 font-style: normal;
 font-stretch: normal
   }
   
   @font-face {
 font-family: 'Graphik Bold Web';
 src: url(https://www.uvic.cat/themes/custom/uvic/build/fonts/Graphik-Bold-Web.eot);
 src: url(https://www.uvic.cat/themes/custom/uvic/build/fonts/Graphik-Bold-Web.eot?#iefix) format("embedded-opentype"),
  url(https://www.uvic.cat/themes/custom/uvic/build/fonts/Graphik-Bold-Web.woff2) format("woff2"),
  url(https://www.uvic.cat/themes/custom/uvic/build/fonts/Graphik-Bold-Web.woff) format("woff");
 font-weight: 700;
 font-style: normal;
 font-stretch: normal
   }
   
   .Graphik-Bold-Web {
 font-family: 'Graphik Bold Web';
 font-weight: 700;
 font-style: normal;
 font-stretch: normal
   }
   
   *, *::before, *::after {
 box-sizing: border-box;
   }
   html {
 font-style: normal;
 color: #4b4b4b;
   }
   body {
 margin: 0px;
 background-color: #f6f6f6;
   }
   h1 {
 font-size: 36px;
 font-weight: 800;
 color: #d9222b;
 line-height: 1.2;
 margin: 0 0 10px 0;
   }
   p {
 font-size: 16px;
 font-weight: 400;
 color: #4b4b4b;
 line-height: 1.5;
   }
   a {
 color: #CF0A2C;
   }
   a :hover {
 text-decoration: underline !important;
   }
   .bottom-space {
 height: 32px;
   }
   .head {
 background-color: #CF0A2C;
 padding: 20px 0px;
   }
   .cuerpo {
 text-align: left;
 padding: 40px 0px;
 border-bottom: 1px solid #ccc;
   }
   .cuerpo-img {
 background: url(https://image.info-uvic.cat/lib/fe32117075640474751c77/m/1/417169c4-14e5-4ad1-83cc-b0546cbe4a80.jpg);
 height: auto;
 background-repeat: no-repeat;
 background-size: cover;
 text-align: left;
 padding: 120px 0px;
 background-position-x: center;
 background-position-y: center;
 margin-bottom: 20px;
   }
   
   @media screen and (max-width: 820px) { 
   
 .cuerpo-img {
  background: url(https://image.info-uvic.cat/lib/fe32117075640474751c77/m/1/417169c4-14e5-4ad1-83cc-b0546cbe4a80.jpg);
  height: auto;
  background-repeat: no-repeat;
  background-size: cover;
  text-align: left;
  padding: 80px 0px;
  background-position-x: center;
  background-position-y: center;
  margin-bottom: 20px;
 }  
  
   }
   
   .cuerpo ul {
 padding-left: 15px;
 margin: 0px;
   }
   .cuerpo li {
 font-size: 12px;
 margin-bottom: 8px;
 line-height: 1.2;
 color: #4b4b4b;
   }
   .text {
 text-align: center;
 padding: 40px 0px;
   }
   .btn-lg {
 text-align: center;
 font-size: 18px;
 text-transform: uppercase;
 padding: 12px 16px;
 background-color: transparent;
 border: 1px solid #CF0A2C;
 border-radius: 4px;
 color: #CF0A2C;
 width: 100%;
   }
   .btn-lg:hover {background-color: #F1DDE0;}
   .btn-lg:disabled {background-color: #CCC; cursor: not-allowed}
   .image {
 background: url(https://image.info-uvic.cat/lib/fe32117075640474751c77/m/1/41c73652-ed83-46e2-94c7-b19af3ac4ae1.png);
 background-repeat: no-repeat;
 background-position: left;
 background-size: contain;
 height: 31px;
   }
   
   .idioma{
 position: absolute;
 right: 13.5%;
 top: 5%;
   }
   
   .idioma>div {
 display: inline-block;
   }
   
   .idiomaLink>a {
 color:white;
 text-decoration:none;
   }
   
   .selected{
 color: black !important;
   }
   
   .row {
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 padding: 20px 0px 0px 0px;
   }
   .col-1 {
 -webkit-box-flex: 0;
 -ms-flex: 0 0 25%;
 flex: 0 0 25%;
 max-width: 25%;
 padding: 0px 20px 0px 0px;
 align-items: center;
   }
   .col-2 {
 -webkit-box-flex: 0;
 -ms-flex: 0 0 75%;
 flex: 0 0 75%;
 max-width: 75%;
 padding: 0px 0px 0px 0px;
   }
   .text-campo {
 width: 100%;
 height: 40px;
 border-radius: 4px;
 border: 1px solid #ccc;
 padding: 0px 16px;
 font-size: 16px;
 color: #4b4b4b;
   }
   .opcion {
 position: relative;
 top: 10px;
   }
   .opcion-tit {
 position: relative;
 font-weight: 600;
 font-size: 18px;
 color: #000;
   }
   .form-control {
 display: block;
 width: 100%;
 padding: 0.375rem 0.75rem;
 font-size: 1rem;
 line-height: 1.5;
 color: #495057;
 background-color: #fff;
 background-clip: padding-box;
 border: 1px solid #ccc;
 border-radius: 4px;
 transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   }
 .form-control::-ms-expand {
 background-color: transparent;
 border: 0;
   }
   .form-control:focus {
 color: #495057;
 background-color: #fff;
 border-color: #80bdff;
 outline: 0;
 box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   }
 .form-control::-webkit-input-placeholder {
 color: #6c757d;
 opacity: 1;
   }
 .form-control::-moz-placeholder {
 color: #6c757d;
 opacity: 1;
   }
 .form-control:-ms-input-placeholder {
 color: #6c757d;
 opacity: 1;
   }
 .form-control::-ms-input-placeholder {
 color: #6c757d;
 opacity: 1;
   }
 .form-control::placeholder {
 color: #6c757d;
 opacity: 1;
   }
   .form-control:disabled, .form-control[readonly] {
 background-color: #e9ecef;
 opacity: 1;
   }
   select.form-control:not([size]):not([multiple]) {
 height: 40px;
   }
 select.form-control:focus::-ms-value {
 color: #495057;
 background-color: #fff;
   }
   .bloque {
 border-top: 1px solid #ccc;
 margin-top: 20px;
   }
   /* The container */
   .form-check {
 /* display: block; */
 position: relative;
 padding-left: 1.75rem!important;
 margin-bottom: 12px;
 cursor: pointer;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
   }
   /* Hide the browser's default checkbox */
   .form-check input {
 position: absolute;
 opacity: 0;
 cursor: pointer;
 height: 0;
 width: 0;
   }
   /* Create a custom checkbox */
   .checkmark {
 position: absolute;
 top: 0;
 left: 0;
 height: 20px;
 width: 20px;
 background-color: #F6F6F6;
 border-radius: 2px;
 border: 1px solid #979797;
   }
   /* On mouse-over, add a grey background color */
   .form-check:hover input ~ .checkmark {
 background-color: #ddd;
   }
   /* When the checkbox is checked, add a blue background */
   .form-check input:checked ~ .checkmark {
 background-color: #979797;
   }
   /* Create the checkmark/indicator (hidden when not checked) */
   .checkmark:after {
 content: "";
 position: absolute;
 display: none;
   }
   /* Show the checkmark when checked */
   .form-check input:checked ~ .checkmark:after {
 display: block;
   }
   /* Style the checkmark/indicator */
   .form-check .checkmark::after {
 left: 6px;
 top: 3px;
 width: 6px;
 height: 10px;
 border: solid white;
 border-width: 0 2px 2px 0;
 -webkit-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 transform: rotate(45deg);
   }
   
   /* Create a custom radio button */
   .checkradio {
 position: absolute;
 top: 0;
 left: 0;
 height: 20px;
 width: 20px;
 background-color: #F6F6F6;
 border-radius: 10px;
 border: 1px solid #979797;
   }
   /* On mouse-over, add a grey background color */
   .form-check:hover input ~ .checkradio {
 background-color: #ddd;
   }
   /* When the checkbox is checked, add a blue background */
   .form-check input:checked ~ .checkradio {
 background-color: #979797;
   }
   /* Create the checkmark/indicator (hidden when not checked) */
   .checkradio:after {
 content: "";
 position: absolute;
 display: none;
   }
   /* Show the checkmark when checked */
   .form-check input:checked ~ .checkradio:after {
 display: block;
   }
   /* Style the checkmark/indicator */
   .form-check .checkradio::after {
 left: 6px;
 top: 3px;
 width: 6px;
 height: 10px;
 border: solid white;
 border-width: 0 2px 2px 0;
 -webkit-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 transform: rotate(45deg);
   }
   
   
   @media screen and (max-width: 1024px) {
   .container {
 width: 94%;
 padding-right: 3%;
 padding-left: 3%;
 margin-right: auto;
 margin-left: auto;
   }
   }
   
   @media screen and (max-width: 768px) {
   .col-1 {
 -webkit-box-flex: 0;
 -ms-flex: 0 0 100%;
 flex: 0 0 100%;
 max-width: 100%;
 padding: 0px 0px 20px 0px;
 align-items: center;
   }
   .col-2 {
 -webkit-box-flex: 0;
 -ms-flex: 0 0 100%;
 flex: 0 0 100%;
 max-width: 100%;
 padding: 0px 0px 0px 0px;
   }
   .opcion {
 position: relative;
 top: 0px;
   }
   }
   
   /* MEDIA QUERIES
   
   // Extra small devices (portrait phones, less than 576px)
   @media (max-width: 575.98px) { ... }
   
   // Small devices (landscape phones, 576px and up)
   @media (min-width: 576px) and (max-width: 767.98px) { ... }
   
   // Medium devices (tablets, 768px and up)
   @media (min-width: 768px) and (max-width: 991.98px) { ... }
   
   // Large devices (desktops, 992px and up)
   @media (min-width: 992px) and (max-width: 1199.98px) { ... }
   
   // Extra large devices (large desktops, 1200px and up)
   @media (min-width: 1200px) { ... }
   
   */
   
   
   
   
   
   
   /* ┌─────────────────────────────────────────────┐
   │                   AdM UVic                  │
   └─────────────────────────────────────────────┘ */
   
   div.selector-idioma {
 float: right;
 margin-bottom: 15px;
 margin-top: -25px;
   }
   
   div.selector-idioma>a {
 color: white;
 margin-right: 10px;
   }
   
   div.selector-idioma>a.selected {
 color: white !important;
 font-weight: 700;
   }
   
   @media (max-width: 775px ) {
 div.selector-idioma {
  margin-top: 0px;
 }
   }
   
   
   
   #llistaGraus .block-estudis {
 display: flex;
 flex-direction: row;
 border-bottom: 1px solid #ccc;
 padding: 20px 0;
   }
   #llistaGraus .block-estudis .block-titol {
 flex: 2;
 padding-right: 15px;
   }
   #llistaGraus .block-estudis .block-llista {
 flex: 5;
   }
   
   @media (max-width: 775px ) {
 #llistaGraus .block-estudis {
  flex-direction: column;
 }
   }

   #llistaMasters .block-estudis {
 flex-direction: row;
 padding: 20px 0;
 }
   
   .btn-primary {
    color: #CF0A2C;
    background-color: #fff;
    border-color: #2b2224;
    width: 100%;
 }
 .btn-primary:hover {
  color: #fff;
  background-color: #CF0A2C;
  border-color: #CF0A2C;
 }

 .btn-primary.disabled, .btn-primary:disabled {
  color: #fff;
  background-color: #d6425b;
  border-color: #CF0A2C;
  cursor: not-allowed;
 }