﻿
/* to define color of Vipps elements and bahavior*/

.vippsColor {
    background-color: #ff5b24;
    border-color: #1bbae1;
    color: #ffffff;
}

    .vippsColor.btn-alt {
        background-color: #ffffff;
        color: #1bbae1;
    }

    .vippsColor:hover {
        background-color: #1bbae1;
        border-color: #1593b3;
        color: #ffffff;
    }

    .vippsColor:focus,
    .vippsColor.focus,
    .vippsColor:active,
    .vippsColor:active:hover,
    .vippsColor:active:focus,
    .vippsColor.active,
    .vippsColor.active:hover,
    .vippsColor.active:focus,
    .open .vippsColor.dropdown-toggle,
    .open .vippsColor.dropdown-toggle:hover,
    .open .vippsColor.dropdown-toggle:focus,
    .open .vippsColor.dropdown-toggle.focus {
        background-color: #1bbae1;
        border-color: #1bbae1;
        color: #ffffff;
    }

    .vippsColor.disabled,
    .vippsColor.disabled:hover,
    .vippsColor.disabled:focus,
    .vippsColor.disabled:active,
    .vippsColor.disabled.active,
    .vippsColor[disabled]:hover,
    .vippsColor[disabled]:focus,
    .vippsColor[disabled].focus,
    .vippsColor[disabled]:active,
    .vippsColor[disabled].active,
    .vippsColor[disabled]:active:focus,
    .vippsColor[disabled].active:focus,
    fieldset[disabled] .vippsColor:hover,
    fieldset[disabled] .vippsColor:focus,
    fieldset[disabled] .vippsColor.focus,
    fieldset[disabled] .vippsColor:active,
    fieldset[disabled] .vippsColor.active,
    fieldset[disabled] .vippsColor:active:focus,
    fieldset[disabled] .vippsColor.active:focus {
        background-color: #1bbae1;
        border-color: #1bbae1;
        color: #ffffff;
    }

.vippsButtonText {
    font-family: "Vipps Text";
    vertical-align: middle !important;

}

.vippsVCenter {
    /* vertical center */
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
.noTopPadding {
    padding-top:0em
}
.vertical-align {
    display: flex;
    align-items: center;
}

.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

.ajustBigBtn {
    height: 3em;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* for use of the embracing container of the vippsbutton */
.bigBtnPadding {
    padding-left:15px;
    padding-right:15px;
}

.paddTopSpace
{
    padding:1em;
}


/* Define Vipps fonts (form "fonts.css" in vipps-design-guidelines-master/vipps-visuell-identitet) */
@font-face {
    font-family: "Vipps Text";
    src: url("/fonts/Vipps/VippsText-Regular-Web.woff2") format("woff2"), url("/fonts/Vipps/VippsText-Regular-Web.woff") format("woff"), url("/fonts/Vipps/VippsText-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Vipps Display";
    src: url("/fonts/Vipps/VippsDisplay-Regular-Web.woff2") format("woff2"), url("/fonts/Vipps/VippsDisplay-Regular-Web.woff") format("woff");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "Vipps Text";
    src: url("/fonts/Vipps/VippsText-Medium-Web.woff2") format("woff2"), url("/fonts/Vipps/VippsText-Medium-Web.woff") format("woff"), url("/fonts/Vipps/VippsText-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "Vipps Text";
    src: url("/fonts/Vipps/VippsText-Bold-Web.woff2") format("woff2"), url("/fonts/Vipps/VippsText-Bold-Web.woff") format("woff"), url("/fonts/Vipps/VippsText-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "Vipps Text";
    src: url("/fonts/Vipps/VippsText-Extrabold-Web.woff2") format("woff2"), url("/fonts/Vipps/VippsText-Extrabold-Web.woff") format("woff"), url("/fonts/Vipps/VippsText-Extrabold.ttf") format("truetype");
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: "Vipps Text";
    src: url("/fonts/Vipps/VippsText-Black-Web.woff2") format("woff2"), url("/fonts/Vipps/VippsText-Black-Web.woff") format("woff"), url("/fonts/Vipps/VippsText-Black.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
}

.glyphicon.spinning {
    animation: spin 1s infinite linear;
    -webkit-animation: spin2 1s infinite linear;
}

@keyframes spin {
    from {
        transform: scale(1) rotate(0deg);
    }

    to {
        transform: scale(1) rotate(360deg);
    }
}

@-webkit-keyframes spin2 {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}
