/****************** FONTS *****************/
@font-face {
    font-family: 'PatrickHand';
    src: url('../fonts/PatrickHand-Regular.ttf');
}

/****************** GENERAL *****************/

body {
    background: url('../img/fonsgran.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height:100%;
}

#dvLoading {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 99999999;
    background: url('../img/loader.gif') 50% 50% no-repeat rgb(249,249,249);
}

a { text-decoration:none!important; }
.txtBlock p { line-height: 1.7vw; }
.container-fluid{height: 100vh;}

.camiBlock{
    position:relative;
    /*height:100vh;*/
}

.Absolute-Center-Calc {
    position: absolute;
    top: 0%;
    transform: translateY(-moz-calc(-50%));
    transform: translateY(-webkit-calc(-50%));
    transform: translateY(-o-calc(-50%));
    transform: translateY(calc(-50%));
}

.Absolute-Center-Flex {
    display: flex;
    align-items: center;
}

.imgCamiContainer{
    text-align: center;
    width: 100%;
    position:relative;
    /*z-index: 1;*/
}

.imgCami{
    margin: 0 auto;
}

.imgHeader{
    width: 100%;
}

.headerBlock{
    /*display:none;*/
    position: absolute;
    /*top: -8vh;*/
    top:0;
    left: 18vw;
    height: 22.3vw;
    width: 37vw;
}

.headerTitle-1, .headerTitle-2{
    background-color:#0e71b4;
    color:#fff;
    font-family: 'PatrickHand';
    font-size: 2.4vw;
}

.headerTitle-1 {
    position: absolute;
    top: 50%;
    left: -9%;
    width: 30%;
    border-radius: 8px;
    text-align: center;
}

.headerTitle-1 p{    
    margin-top: 0vh;
}

.headerTitle-2 {
    position: absolute;
    border-radius: 8px;
    width: 70%;
    text-align: center;
    top: 67%;
    left: -1vw;
}

[data-item-cloned*="sort"] {
    line-height: 25px;
}

.temps-fotos-cloned{
    line-height: 25px;
}

.crono-cloned{
    line-height: 35px;
    padding-bottom:15px;
}

area{ cursor: default!important; }
area:focus { outline: 0; }

.menuItem{ background-color:#0e71b4;  }
.menuClonedItem{ background-color:transparent; }

.menuItem, .menuClonedItem {
    position: absolute;
    padding: 10px 25px 10px 25px;
    /*z-index: 2;*/
    -webkit-transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    transform: rotate(5deg);
    border-radius: 8px;
}


.menuItem p{
    visibility: hidden;
}

.menuClonedItem p{
    cursor: pointer;
}

.menuItem p, .menuClonedItem p{
    width: 100%;
    position: relative;
    color:#fff;
    font-family: 'PatrickHand';
    font-size:1.1vw;
    margin:0!important;
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    transform: rotate(-4deg);
    text-align: center;
}

.txtBlock div, .imgBlock img{
    position:absolute;
}

.fakeImgContainer{
    position: absolute;
    top: 0;
    width: 100%;
}

.imgPicto1{
    position: relative;
    width: 120%;
    z-index:15;
} 

.imgPicto2{
    position: relative;
    width: 114%;
    z-index:15;
} 

.imgPicto4{
    position: relative;
    width: 100%;
    z-index:15;
} 

.imgPicto5{
    position: relative;
    width: 107%;
    z-index:15;
} 

.imgPicto6{
    position: relative;
    width: 120%;
    z-index:15;
} 

.imgPicto8{
    position: relative;
    width: 110%;
    z-index:15;
} 


.imgPicto{
    position: relative;
    width: 104%;
    z-index:15;
} 

.pictoBlock{
    display:block!important;
    position: absolute;
}

.pictoBlock > p{
    display:block;
    position:absolute;
    /*visibility: hidden;*/
}

.txtClonedBlock p {
    position:absolute;
    font-family: 'PatrickHand';
    font-size:1.2vw;
    text-align: center;
    display: block;
    /*visibility: hidden;*/
}

.imgBlock img, .headerTitle-1, .headerTitle-2{
    z-index: 3;
}

.fakeImg,.menuClonedItem {
    z-index: 16;
}

.fakeImg{
    position:relative;
}

.txtBlock {
    font-family: 'PatrickHand';
    font-size:1.2vw;
    text-align: center;
    z-index: -1;
    top:100%;
    width:133%;
}

/************ BOOTSTRAP MODAL *************/
.vertical-alignment-helper {
    display:table;
    height: 100%;
    width: 100%;
    pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
}
.vertical-align-center {
    /* To center vertically */
    display: table-cell;
    vertical-align: middle;
    pointer-events:none;
}
.modal-content {
    /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
    width:inherit;
    height:inherit;
    /* To center horizontally */
    margin: 0 auto;
    pointer-events: all;
}

.modal-header{
    border-bottom:0px solid transparent!important;
    margin-right:10px;
    padding:0px!important;
}

.modal-body {
    padding: 0px 25px 25px 25px!important;
}

.close{
    font-size:45px!important;
}

.modal-content{
    font-family: 'PatrickHand';
    font-size:1.05vw;
    background-color: #0e71b4;
    color:#fff;
}

body.modal-open .camiBlock{
    -webkit-filter: opacity(100%);
    -moz-filter: opacity(100%);
    -o-filter: opacity(100%);
    -ms-filter: opacity(100%);
    filter: opacity(100%);
}

/************ MEDIA QUERIES ***************/
@media (min-width: 1250px) {
    [data-item*="entorn"],[data-item-cloned*="entorn"]{
        padding:19px 25px 10px 25px;
    }
}

@media (max-width: 1520px){
    .headerBlock{
        height: 29vw;
        width: 43vw;
    }
}