@font-face {

    font-family: DINCE-Regular;

    src: url(DINCE-Regular.ttf);

}



body {

    font-family: DINCE-Regular;

    background: #424141;

    color: #fff;

    margin: 0px;

    overflow-x: hidden;

    overflow-y: scroll;

}



header {

    padding-bottom: 105vh;

}



.reklama {

    position: fixed;

    top: 5vw;

    left: 5vw;

}



.reklama2 {

    position: fixed;

    bottom: 1vw;

    right: 1vw;

    z-index: 2;

}



.reklama-img {

    height: 60px;

}



h1 {

    font-size: 60px;

    font-weight:900;

}



div.icon {

    font-size: 42px;

    position: relative;

    top: 0px;

    left: 5px;

    height: 50px;

    width: 50px;

    margin: -5px;

}



div.offers {

    width: 100%;

}



div.offers2 {

    width: 100%;

    color: white;

}



.a, .a:active, .a:link {

    color: white;

    position: relative;

    top: -10px;

    font-size: 100%;

    text-decoration: none;

    -webkit-transition: text-shadow 1s; /* Safari */

    transition: text-shadow 1s;

}



.a:hover {

    color: white;

    box-shadow: 10px;

    position: relative;

    top: -10px;

    font-size: 100%;

    text-shadow: 2px 2px 10px #FFFFFF;

}



@import "compass/css3";



.flex-container {

    text-align: center;

    padding: 0;

  margin: 0;

  list-style: none;

  

  display: -webkit-box;

  display: -moz-box;

  display: -ms-flexbox;

  display: -webkit-flex;

  display: flex;

  

  -webkit-flex-flow: row wrap;

  justify-content: space-around;

}



.flex-item {

  padding: 1%;

  width: 30%;

  height: 10%;

  margin-top: 1vh;

  font-size: 100%;

}



.flex-item2 {

  padding: 1%;

  width: 20%;

  height: 10%;

  margin-top: 1vh;

  font-size: 100%;

}



div.col {

    width: 20%;

    height: auto;

    position: relative;

    display: table-cell;

}



div.text {

    position: relative;

    left: 60px; top: -55px;

    width: 75%;

    height: 10%;

    text-align: left;

}



div.logo {

    position: relative;

    width: 100%;

    height: 100px;

    top: 16vh;

    text-align: center;

}



img.logo {

    position: relative;

    margin: auto;

    top: 0; left: 0; right: 0; bottom: 0;

    width: 50vh;

    height: auto;

}



div.title {

    line-height: 10%;

    width: 100%;

    position: relative;

    top: -50px;

}



div.title2 {

    line-height: 10%;

    width: 100%;

    position: relative;

    top: -50px;

    color: white;

}



section {

    color: #424141 !important;

    position: relative;

    background: #fff;

    color: #fff;

    text-align: center;

    height: auto;

}



.sec2 {

    color: #424141 !important;

    position: relative;

    background: #fff;

    color: #fff;

    text-align: center;

    height: auto;

}



section:before {

    position: absolute;

    content:'';

}



section.diagonal {

    background: #fff;

}



footer {

    position: relative;

    background: #424141;

    color: #fff;

    text-align: center;

    font-family: "DINCE-Regular"

}



footer:before {

    position: absolute;

    content: '';

}



footer.diagonal {

    background: #424141;

    padding: 3em;

}



p.indent{ 

    padding-left: 1.8em 

}



.diagonal {

    z-index: 1;

    padding: 3em;

    background: #424141;

}



.diagonal:before {

    -webkit-transform: rotate(-3deg);

    transform: rotate(-3deg);

    -webkit-transform-origin: 3% 0;

    transform-origin: 3% 0;

    top: 0px;

    left: -25%;

    z-index: -1;

    width: 250%;

    height: 100%;

    background: inherit;

}



.diagonal2 {

    z-index: 1;

    padding: 3em;

    background: #e4274d;

}



.diagonal2:before {

    -webkit-transform: rotate(-3deg);

    transform: rotate(-3deg);

    -webkit-transform-origin: 3% 0;

    transform-origin: 3% 0;

    top: 0px;

    left: -25%;

    z-index: -1;

    width: 250%;

    height: 100%;

    background: inherit;

}



.btn-circle {

    width: 40px;

    height: 40px;

    position: fixed;

    bottom: 15vh;

    padding: 14px;

    border: 2px solid white;

    border-radius: 100% !important;

    font-size: 40px;

    color: white;

    background: transparent;

    -webkit-transition: background 0.3s ease-in-out;

    -moz-transition: background 0.3s ease-in-out;

    transition: background 0.3s ease-in-out;

    margin: 0;

    position: absolute;

    top: 65vh;

    transform: translate(-50%, -50%);

}



.btn-circle:hover,

.btn-circle:focus {

    outline: none;

    color: #e4274d;

    border: 2px solid #e4274d;

}



.btn-circle i.animated {

    -webkit-transition-property: -webkit-transform;

    -webkit-transition-duration: 1s;

    -moz-transition-property: -moz-transform;

    -moz-transition-duration: 1s;

}



.btn-circle:hover i.animated {

    -webkit-animation-name: pulse;

    -moz-animation-name: pulse;

    -webkit-animation-duration: 1.5s;

    -moz-animation-duration: 1.5s;

    -webkit-animation-iteration-count: infinite;

    -moz-animation-iteration-count: infinite;

    -webkit-animation-timing-function: linear;

    -moz-animation-timing-function: linear;

}



.btn {

    text-transform: uppercase;

    font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;

    font-weight: 400;

    -webkit-transition: all 0.3s ease-in-out;

    -moz-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

    border-radius: 0;

}



.btn-default {

    border: 1px solid #42DCA3;

    color: #42DCA3;

    background-color: transparent;

}



.btn-default:hover,

.btn-default:focus {

    border: 1px solid #e4274d;

    outline: none;

    color: black;

    background-color: #e4274d;

}



@-webkit-keyframes pulse {

  0% {

    -webkit-transform: scale(1);

    transform: scale(1);

  }

  50% {

    -webkit-transform: scale(1.2);

    transform: scale(1.2);

  }

  100% {

    -webkit-transform: scale(1);

    transform: scale(1);

  }

}



@-moz-keyframes pulse {

  0% {

    -moz-transform: scale(1);

    transform: scale(1);

  }

  50% {

    -moz-transform: scale(1.2);

    transform: scale(1.2);

  }

  100% {

    -moz-transform: scale(1);

    transform: scale(1);

  }

}



/* MOBILE WEB */

@media (max-width: 700px) {

    div.mobile-col1 {

        position: absolute;

        top: 0vh;

        width: auto;

        left: 5%;

        right: 5%;

    }

    

    section {

        color: #424141 !important;

        position: relative;

        background: #fff;

        color: #fff;

        text-align: center;

        height: auto;

    }

    

    .sec2 {

        height: auto;

    }

    

    .diagonal:before {

        -webkit-transform: rotate(-4deg);

        transform: rotate(-4deg);

        -webkit-transform-origin: 3% 0;

        transform-origin: 3% 0;

        top: 0px;

        left: -25%;

        z-index: -1;

        width: 250%;

        height: 100%;

        background: inherit;

    }

    

    .diagonal2:before {

        -webkit-transform: rotate(-4deg);

        transform: rotate(-4deg);

        -webkit-transform-origin: 3% 0;

        transform-origin: 3% 0;

        top: 0px;

        left: -25%;

        z-index: -1;

        width: 250%;

        height: 100%;

        background: inherit;

    }

    

    .flex-item {

        padding: 1%;

        width: 95%;

        height: 10%;

        margin-top: 1vh;

        font-size: 100%;

    }



    .flex-item2 {

        padding: 1%;

        width: 95%;

        height: 10%;

        margin-top: 1vh;

        font-size: 100%;

}



.reklama2 {

    position: fixed;

    bottom: 10vw;

    right: 10vw;

    z-index: 2;

    width: 25%;

}





.reklama-img {

    height: 0px;

}

}