﻿/*
Style Name:     buttons.css
Description:    Stili buttons
Author:         NS12 - dream-team - rcs 
Version:        2.3
Date:           16.04.2019
Modified:      	06.05.2020
*/

/* =============================================================
>> TABLE OF CONTENTS:
================================================================

7.0 - BUTTONS
    7.1 - Default
    7.2 - Outline
    7.3 - Size
    7.4 - Button Block
    7.5 - Button Deck

--------------------------------------------------------------*/

/* 
>> 7.0 - BUTTONS
   since: ver 1.0
==============================================================*/

.btn {
    font-family: Roboto, sans-serif;
    color: #2f2f2f;
    font-size: 1rem;
    line-height: 1.2;
    margin: 0;
    font-weight: 700;
    color: #295eb9;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
    text-decoration: none;
    display: inline-block;
    border-bottom: 1px solid #295eb9;
    padding-bottom: 0;
}

@media only screen and (min-width:48em) {
    .btn {
        font-size: 1rem;
        /*line-height: 1.8;*/
    }
}

.btn:hover {
    color: #152f5d;
    border-color: #152f5d;
    text-decoration: none;
}

.btn i {
    margin-right: .5rem;
}

/*
>> 7.1 - Default
   since: ver 1.0
--------------------------------------------------------------*/

.btn.default {
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    font-family: Oswald, sans-serif;
    color: #fff;
    text-transform: uppercase;
    font-weight: 500;
    background: #295eb9;
    letter-spacing: .1rem;
    border-radius: 25px;
    padding: .815rem 1.5rem;
}

@media only screen and (min-width:48em) {
    .btn.default {
        display: inline-block;
    }
}

.btn.default:hover {
    background: #152f5d;
    color: #fff;
    text-decoration: none;
}

/*
>> 7.2 - White
   since: ver 1.0
--------------------------------------------------------------*/

.btn.white {
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    font-family: Oswald, sans-serif;
    color: #295eb9;
    text-transform: uppercase;
    font-weight: 500;
    background: #fff;
    letter-spacing: .1rem;
    border-radius: 25px;
    padding: .815rem 1.5rem;
}

@media only screen and (min-width:48em) {
    .btn.white {
        display: inline-block;
    }
}

.btn.white:hover {
    /* background: #152f5d; */
    color: #152f5d;
    text-decoration: none;
}


/*
>> 7.2 - Outline
   since: ver 1.0
--------------------------------------------------------------*/

.btn.outline {
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    font-family: Oswald, sans-serif;
    color: #295eb9;
    text-transform: uppercase;
    font-weight: 500;
    border: 1px solid #295eb9;
    letter-spacing: .1rem;
    border-radius: 25px;
    padding: .815rem 1.5rem;
}

@media only screen and (min-width:48em) {
    .btn.outline {
        display: inline-block;
    }
}

.btn.outline:hover {
    border-color: #152f5d;
    background-color: transparent;
    color: #152f5d;
    text-decoration: none;
}

/*
>> 7.3 - Size
   since: ver 1.0
--------------------------------------------------------------*/

.btn.trn-xs {
    font-size: 0.75rem;
}

/* 12px */

.btn.trn-sm {
    font-size: 0.875rem;
}

/* 14px default testo */

.btn.trn-md {
    font-size: 1rem;
}

/* 16px */

.btn.trn-lg {
    font-size: 1.125rem;
}

/* 18px */

.btn.trn-xl {
    font-size: 1.375rem;
}

/* 22px */

.btn.trn-xxl {
    font-size: 1.875rem;
}

/* 30px */

/*
>> 7.4 - Button Block
   since: ver 1.0
--------------------------------------------------------------*/

.btn-block {
    display: block;
    width: 100%;
}

/*
>> 7.5 - Button Deck
   since: ver 1.0
--------------------------------------------------------------*/

.btn-deck {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
}

.btn-deck .btn {
    -ms-flex: 1;
    flex: 1;
    margin: .5rem 0;
    display: inherit;
}

.btn-deck .btn:first-child {
    margin-left: 0;
}

.btn-deck .btn:last-child {
    margin-right: 0;
}

@media only screen and (min-width: 48em) {
    .btn-deck {
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    .btn-deck .btn {
        margin: .5rem .5rem;
    }
}

@media only screen and (min-width: 62em) {
    .btn-deck .btn {
        /* margin: .5rem 1rem; */
    }
}
