body{
    font-family: "Roboto", "Helvetica";
    font-size:16px;
    color:#000;
}
a{
    color: #5F57A1;
}
a:hover{
    color: #5F57A1;
    text-decoration: underline
}
.hand{cursor: pointer;}
.logo a:hover{
    color:#fff !important
}
.container-white{
    background-color: #FFF
}
.nav-bottom{
    padding-top:12px;
}

.step-bar{
    background-color: rgba(95,87,161,0.2);
    height: 60px;
    color: #5F57A1;
    font-family: "Roboto";	
    font-weight: 500;
    font-size: 26px;	
    line-height: 60px;
    padding-left:20px
}
.step-bar h1{
    font-size: 28px;
    line-height: 28px;
}
.voucher-bar{
    background-color: rgba(95,87,161,0.2);
    height: 60px;
    color: #333;
    font-family: "Roboto";	
    font-weight: 500;
    font-size: 18px;	
    line-height: 20px;
    padding-left:20px;
    /*margin-bottom:50px*/
}
.voucher-bar h1{
    font-size: 18px;
    line-height: 18px;
}
.voucher{
    background-color: #F2F2F2 !important;
    padding:30px 0;
    margin-bottom: 30px;
}
.voucher h2{
    font-size: 32px;
    letter-spacing: 0;
    line-height: 40px;
    margin-bottom: 30px;
}
.voucher h3{
    color: #5F57A1;
    font-size: 28px;
    letter-spacing: 0;
    line-height: 0;
    float: left;
    margin-right: 20px;
}
.voucher .semaforo{
    width: 36px;
    height: 36px;
}
.voucher p:nth-child(3){
    padding:15px 0;
}
.voucher .btn-vou{
    margin:30px 0 80px;
}
.voucher ul{
    margin-bottom: 20px;
}
.voucher ul li{
    list-style-type: none;
    line-height: 32px;
    margin-left: 30px;
}
.voucher ul li:before {
    background-image: url(/img/v003/li-v-green.png);
    background-size: 18px 18px;
    background-repeat: no-repeat;
    display: inline-block;
    width: 24px;
    height: 64px;
    content: "";
    position: absolute;
    left: 40px;
    background-position: 6px 6px;
}
.voucher .imageHardware{
    text-align: center;
}
.didaVoucher{
    color: #383838;
    font-size: 12px;
    letter-spacing: 0.12px;
    line-height: 16px;
}
.step-bar .cart{
    color: #4D4D4D;
    font-size: 15px;
    font-weight: 500;
    line-height: 17px;
    padding-right: 0;
    margin-top:12px;
}
.step-bar .family{
    /*padding-left: 0*/
}
.step-bar .cart img{
    float:right;
    margin-left: 10px;
    margin-right: 50px;
    height: 24px;
    margin-top: 5px;
}
.content ul, .content li{
    padding:2px 0;
    list-style: none
}
.bootstrap-select > .dropdown-toggle{
    border:0px;
    border-bottom: 2px solid #D8D8D8;
    border-radius: 0px;
}

.coverSpace .btn-group.open .dropdown-toggle {
    -webkit-box-shadow: inset 0 0px 0px rgba(0,0,0,.125);
    box-shadow: inset 0 0px 0px rgba(0,0,0,.125);
}

#tool-di-copertura .close, #tool-di-copertura .close:hover,#tool-di-copertura .close:focus,#buyMobile .close, #buyMobile .close:hover,#buyMobile .close:focus{
    opacity: 1;
}
#tool-di-copertura input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
#tool-di-copertura .close{
    margin-top:5px
}
#tool-di-copertura #goBack{
    cursor:pointer
}
#tool-di-copertura #goBack img{
    width: 24px;
    margin-top:5px;
}
#tool-di-copertura .close img,#buyMobile .close img {
    height: 24px;
    width: 24px;
}
/* progress bar custom */
.progress {
    border-radius: 4px;
    height: 9px;
    margin-top: 15px;
    background-color: rgb(85%, 85%, 85%);
}
.progress-bar {
    border-radius: 4px;
    height: 9px;
    background-color: rgb(37%, 34%, 63%);
}
/* tool di copertura */
*:focus {
    outline: none;
}
#tool-di-copertura{
    margin-top:150px
}
#tool-di-copertura .modal-header{
    border-bottom: none
}
#tool-di-copertura .modal-footer{
    text-align: center ;
    border-top: none
}
#tool-di-copertura .modal-body,#buyMobile .modal-body{
    height: 525px;
    padding:3px 25px
}
#tool-di-copertura .setup-content .coverSpace{
    min-height:355px;
}

#tool-di-copertura .tcTitle{
    color: #333333;	
    font-size: 24px;	
    font-weight: 700;	
    line-height: 32px;
    margin-bottom: 23px;

}

#tool-di-copertura .mt50{
    margin-top: 50px !important;
}

#tool-di-copertura #cliBox,#tool-di-copertura-mobile #cliBox, #tool-di-copertura-mobile #boxRadioSelectVoce, #tool-di-copertura-mobile #boxRadioSelectAdsl {
    display: none
}
#tool-di-copertura #frsCli{
    margin-top: 40px;
    margin-bottom: 9px;
    width: 100%;
    color: #84828F;
    font-size: 16px;
}
#tool-di-copertura #cliBox .disclaimerCB{
    margin-top: 0px;
    margin-bottom: 9px;
    width: 100%;
    color: #84828F;
    font-size: 10px;
}
#tool-di-copertura #contactBox .disclaimerCB{
    margin-top:20px;
    margin-bottom: 9px;
    width: 100%;
    color: #84828F;
    font-size: 10px;
}
#tool-di-copertura #contactBox{
    display: none;
    margin-top: 40px;
}
#tool-di-copertura #contactBox #contactNumber{
    width:240px;
}
#tool-di-copertura .nextBtn{
    margin-top:38px;
}

#tool-di-copertura-mobile{
    top:0px;
    border-top: 4px solid #5f57a1;

}
#tool-di-copertura-mobile #step-2,#tool-di-copertura-mobile #step-3,#tool-di-copertura-mobile #step-4,#tool-di-copertura-mobile #step-5{
    display: none
}
#tool-di-copertura-mobile .close{
    margin-top:5px;
    opacity: 1.0;

}
#tool-di-copertura-mobile .back {
    -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
}
#tool-di-copertura-mobile #goBack img{
    width: 26px;
    margin-top:5px;
}
#tool-di-copertura-mobile .close img{
    width: 22px
}
#tool-di-copertura-mobile .modal-header{
    height:56px
}
#tool-di-copertura-mobile .modal-dialog{
    margin:0;
    height:100%
}
#tool-di-copertura-mobile .modal-content{
    border-radius:0;
    border:0;
    height: 100%;
}

#tool-di-copertura-mobile .modal-body{
    padding:30px
}
#tool-di-copertura-mobile .tcTitle{
    color: #333333;	
    font-size: 24px;	
    font-weight: 700;	
    line-height: 32px;
    margin-bottom: 25px

}
#tool-di-copertura-mobile .nextBtnMobile{
    margin-top:150px;
    margin-left:10px
}
#tool-di-copertura-mobile #boxRadioSelectVoce{
    margin:20px 0
}
#tool-di-copertura-mobile .radioSelectVoce,#tool-di-copertura-mobile .radioSelectAdsl{
    padding:0
}
#tool-di-copertura-mobile #cliBox{
    margin:20px 0;
}
#tool-di-copertura-mobile #cliBox div{
    padding-left:0;
}
#tool-di-copertura-mobile #cliBox #frsCli{

    font-size: 16px;
    font-weight: 300;
}
#tool-di-copertura-mobile .radioSi{
    border-right: 2px solid #d8d8d8
}
#tool-di-copertura-mobile .radioCont{
    margin-left: 52px
}
#tool-di-copertura-mobile .radioSi,#tool-di-copertura-mobile .radioNo{
    height: 50px;
    padding-top: 10px;
    margin-bottom: 10px;
}
#tool-di-copertura-mobile .bootstrap-select > .dropdown-toggle{
    border: 0px;
    border-bottom: 1px solid #D8D8D8;
    border-radius: 0;
    font-size: 1.4em;
}
#tool-di-copertura-mobile .bootstrap-select.btn-group .dropdown-menu li a{
    font-size: 1.3em;
}
#tool-di-copertura-mobile .bootstrap-select.btn-group .dropdown-toggle .filter-option{
    width: 97%;
}
#tool-di-copertura-mobile .btn-default.active, .btn-default.focus, .btn-default:active, .btn-default:focus, .btn-default:hover, .open>.dropdown-toggle.btn-default{
    background-color: #FFF;

}
#tool-di-copertura-mobile .btn-group.open .dropdown-toggle{
    -webkit-box-shadow: none;
    box-shadow: none;
}
/*#tool-di-copertura-mobile #boxRadioSelectVoce li.selected,#tool-di-copertura-mobile #boxRadioSelectAdsl li.selected{
   color:#5F57A1
}*/
#tool-di-copertura-mobile .dropdown-menu .open{
    border:1px solid #D8D8D8;
    border-top:0;

}
.lightForm input{
    border:0;
    border-bottom: 1px solid #d8d8d8;
    display: block;
    width:100%;
    height:24px;
    line-height: 24px;
    outline: none;
    font-size: 20px;
}
.lightForm label{
    margin-bottom: 10px;
    margin-top: 8px;
    font-size: 16px;
    font-weight: 300;
}
.lightForm .check.glyphicon-ok {
    color:#3c763d;
    right:15px;
    top: 30px;
}
.lightForm .check.glyphicon-remove {
    color:#a94442;
    right:15px;
    top: 30px;
}
/* form by step */
.stepwizard {
    /*display: table;*/
    width: 100%;
    position: relative;
    padding-left: 20px
}
.stepwizard-step p {
    margin-top: 10px;
}
.stepwizard-row {
    /*display: table-row;*/
}
.stepwizard-step button[disabled] {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}
.spegni{
    pointer-events: none;
    cursor: not-allowed;
}
.stepwizard-row:before {
    top: 14px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 100%;
    height: 1px;
    z-order: 0;
}
.setup-panel a:hover{
    text-decoration: none
}
.stepwizard-step {
    /*display: inline;*/
    position: relative;
}

.btn-step { 
    color: #000; 
    background-color: #FFFFFF; 
    border-color: #FFFFFF; 
    font-size: 16px;
    background-image: url('/img/v003/tdc/segnaposto.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 0 0;
    padding-left: 25px;
    line-height: 30px
} 
.btn-step.disabled{
    color:#84828F;
    cursor: default;
    background-image: none;
}
.btn-step.first{
    font-weight: 700
}
.btn-step:hover, 
.btn-step:focus, 
.btn-step:active, 
.btn-step.active, 
.open .dropdown-toggle.btn-step { 
    color: #84828F; 
    background-color: #FFFFFF; 
    border-color: #FFFFFF; 
} 

.btn-step:active, 
.btn-step.active, 
.open .dropdown-toggle.btn-step { 
    background-image: none; 
} 

.btn-step.disabled, 
.btn-step[disabled], 
fieldset[disabled] .btn-step, 
.btn-step.disabled:hover, 
.btn-step[disabled]:hover, 
fieldset[disabled] .btn-step:hover, 
.btn-step.disabled:focus, 
.btn-step[disabled]:focus, 
fieldset[disabled] .btn-step:focus, 
.btn-step.disabled:active, 
.btn-step[disabled]:active, 
fieldset[disabled] .btn-step:active, 
.btn-step.disabled.active, 
.btn-step[disabled].active, 
fieldset[disabled] .btn-step.active { 
    background-color: #FFFFFF; 
    border-color: #FFFFFF; 
} 

.btn-step .badge { 
    color: #FFFFFF; 
    background-color: #4A4A4A; 
}

/*.nextBtn{
   margin-top: 20px;

}*/
.has-error input[type="text"],.has-error input[type="number"]{
    border-color:red
}

/* Create a custom radio button */
/* The radioCont */
#boxOtherOloAdsl{
    margin-top: 20px
}
.radioCont {
    display: block;
    position: relative;
    top:35px;
    padding-left: 25px;
    margin-bottom: 5px;
    margin-top: 6px;
    cursor: pointer;
    /*font-size: 22px;*/
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.box-mobile .radioCont{
    padding-left: 40px;
    margin-top: 0px;
}
.radioCont input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
.radioCont .checkmark {
    position: absolute;
    top: 11px;
    left: 13px;
    height: 17px;
    width: 17px;
    background-color: #FFF;
    border-radius: 50%;
    border: 2px solid #008255;
}
.box-mobile {
    margin-top: 10px;
    width: 60%;
    margin: auto;
}
.box-mobile .radioCont{
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* On mouse-over, add a grey background color */
.radioCont:hover input ~ .checkmark {
    background-color: #FFF;
    border: 2px solid #008255;
}
#tool-di-copertura-mobile .mySelect{
    border: 0;
    border-bottom: 2px solid #D8D8D8;
    width: 100%;
    font-size: 16px;
    padding: 4px 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(/img/v003/drop-down.png) 98% / 6% no-repeat #FFF;
    margin-top: 20px;
}
/* When the radio button is checked, add a blue background */
.box-mobile .radioCont input:checked ~ .checkmark {
    background-color: #FFF;
}
/* When the radio button is checked, add a blue background */
.box-mobile .radioCont input:selected ~ .checkmark {
    background-color: #FFF;
}
.box-mobile .radioCont input:checked ~ .checkmark {
    background-color: #ccc;

    /*border:2px solid #0098a7*/
}
.box-mobile .radioCont input:selected ~ .checkmark {
    background-color: #ccc;

    /*border:2px solid #0098a7*/
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.radioCont input:checked ~ .checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.radioCont .checkmark:after {
    top: 1px;
    left: 1px;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #008255;
}
.box-mobile .radioCont .checkmark:after {

    background: #008255;
}
/* supporto */
.support{
    padding-top:20px;
    padding-bottom: 20px
}
.support h2{
    line-height: 16px;
    font-weight: 300;
    ;margin-top:5px !important
}
.support-box{
    min-height:100px;
    margin-top:20px
}
#loader{
    display: none;
    height: 100%;
    padding-top: 20%;
    text-align: center;
    font-size: 1.0em;
    color:#5f57a1;
}
#loader .fas{
    color:#5f57a1;
    font-size: 11em;
    margin-bottom: 20px;
}
.disclaimerTool{
    margin-top:45px
}
.disclaimerTool a{
    text-decoration: underline;
}
/* end tdc */
/* overlayer buy mobile */

#buyMobile .modal-header{
    border-bottom: 0
}

/* end overlayer buy mobile */
/* btn customizzati */
.btn-casa{
    height: 48px;
    width: 240px;
    border-radius: 8px;
    background-color: #FFBA00;
    color: #3A3A3A;	
    font-size: 18px;	
    line-height: 21px;
    font-weight: 600;
}
.btn-casa.disabled{
    color: #BEC2C9;
    border:2px solid  #f5f5f5;
    background-color: #FFF
}
.btn-casa:hover{
    background-color: #FFC400
}
.btn-casa:click{
    background-color: #FFAF00
}

.btn-trasp{
    width: 160px !important;
    background-color: #FFF !important;
    color: #3A3A3A;
}
.btn-trasp.disabled{
    color: #BEC2C9;
    border:0 !important;
    background-color: #FFF
}
.btn-trasp:hover{
    background-color: #FFF
}
.btn-trasp:click{
    background-color: #FFF
}
.btn-trasp:focus{
    outline: none;
}
.btn-servizi{
    height: 48px;
    width: 240px;
    border-radius: 8px;
    background-color: #FFF;
    color: #000;	
    font-size: 18px;	
    line-height: 21px;
    font-weight: 600;

}
.btn-servizi:hover{
    text-decoration: underline;
}
.btn-servizi:click{
    background-color: #F2F2F2;
    text-decoration: underline;
}
a.btn-casa{
    padding:13px
}
a.btn-servizi{
    padding:13px
}
.tipoconsigli{
    display: none;
}
.MediaQuery-desktop .myT-app{
    z-index: 1039 !important
}

/*articolo portale*/
.articolo h1{
    font-size: 30px;
    font-family: 'Roboto Condensed', sans-serif;
    line-height: 34px;
    font-weight: 700
}
.articolo .subTit{
    font-style: italic;
    color:#5f6a6a
}
.magazine{
    padding-top: 30px
}
.ppMagazineTitle{
    padding: 0 10px;
    /*margin: -60px 10px 0;*/
    position:absolute;
    bottom:-50px;
    left:40px;
    width: 90%;
    color: #FFF;
    background-color: #5F57A1;
    z-index: 1;
    min-height: 110px;
    float:left;
    font-family: 'Roboto Condensed', sans-serif;
    text-align: center;

}
.ppMagazine{
    position:relative
}
.ppMagazineTitle h1{
    font-size: 36px;
    line-height: 44px;
    margin-top: 10px
}
.ppMagazineTitle a{
    color:#FFf
}
.ppMagazineImg{
    z-index: 0;
    float:left
}
.spMagazine{
    position:relative;
    padding:0 10px;
    margin-bottom:37px
}
.spMagazineTitle{
    padding: 0 10px;
    position:absolute;
    bottom:-20px;
    left:20px;
    width:90%;
    color: #FFF;
    background-color: #5F57A1;
    z-index: 1;
    font-family: 'Roboto Condensed', sans-serif;
    text-align: center;
}
.spMagazineTitle h2{
    font-size: 24px;
    line-height: 29px;
    margin-top: 10px
}
.spMagazineTitle a{
    color:#FFf
}
.spMagazineImg{
    z-index: 0;
    float:left
}
.otherMagazine{
    margin-top: 13px;
    display: flex;
    flex-wrap: wrap;
}
.otherMagazine header{
    min-height:70px
}
.otherMagazine h2{
    margin-top:5px
}
.autopromo{
    padding:15px
}
.share-article {
    width: 100%;
    margin: 29px 0 25px 0;
    overflow: hidden;
    position: relative;
}

.tsIcoSocial {
    float: left;
    margin-right: 15px;
}
.fbArrBox {
    float: left;
    margin-right: 5px;
}
.fbLikeArrBox {
    float: left;
    display: table;
    vertical-align: middle;
    margin-right: -6px;
    height: 30px;
    z-index: 1;
    position: relative;
}
.fblikeCount {
    float: left;
    height: 30px;
    min-width: 32px;
    border: 1px solid #3F5FA3;
    z-index: 0;
    position: relative;
    padding: 0 10px;
    line-height: 30px;
    font-weight: bold;
}
.arrow-left {
    width: 10px;
    height: 10px;
    border-width: 1px;
    border-style: solid;
    border-color: transparent #3F5FA3 #3F5FA3 transparent;
    transform: rotate(135deg);
    vertical-align: middle;
    font-style: normal;
    font-weight: normal;
    font-size: 1px;
    background: #fff;
    display: inline-block;
    margin-top: 9px;
}

.share-bottom{
    margin-bottom: 60px 
}
article h2{
    font-size: 20px;
    min-height: 40px;
    margin-top:20px
}
.container-Image{
    width:100%;
    position:relative
}

.container-Image img{
    max-width:100%
}

.container-Image-txt{
    width:100%;
    margin-bottom:20px;
    position:relative;
}
.container-Image-txt img{
    max-width:100%
}

.image-responsive{max-width:100%}
.lastNewsTitle{
    padding:5px;
    width:100%;
    font-size:20px;
    font-weight: 500;
    background-color: #dfe1e1;
    margin: 30px 0 20px;
    color:#333
}
.navigaChiama{
    text-align: center;
    margin-top: 30px
}
.navigaChiamaHp{
    text-align: center;
    margin-top: 20px
}
.signature {
    width: 100%;
    margin-bottom: 20px;
    font-weight: 500
}
.articolo{
    font-family: 'Roboto';
    font-weight: 300
}
.articolo figure img{
    width:750px;
    height:510px
}
.titleLabel{
    margin:5px 0 20px;
    line-height: 24px
}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover{
    background-color: #5F57A1;
    border-color: #5F57A1;
}
.pagination>li>a, .pagination>li>span{
    color:#5F57A1
}
.contentmarketing{
    padding:10px !important
}

/* ARTICLE VIDEO */
.video-container-txt{
    width:100%;
    margin-bottom:20px
}


.video-container{
    width:100%;
    padding-bottom:16px
}

.video-container object,.video-container embed, .video-container iframe,.video-container-txt object, .video-container-txt embed, .video-container-txt iframe, .video-container video,.video-container-txt video{
    width:100%;
    height:422px
        /* todo => viewport auto nei dispositivi mobili */	
}

/* template magazine mobile */
.magazineMobile{
    margin:0;padding: 0
}
.magazineMobile img{
    width:100%;
    height:100%
}
.ppMagazineMobile{
    padding:0;
    margin:0
}
.ppMagazineMobile header h1{
    padding:10px;
    margin-left:15px;
    margin-top:0;
    font-size:26px;
    font-weight: 700;
    line-height: 24px;
    font-family: 'Roboto Condensed', sans-serif;
}
.ppMagazineMobile header h1 a{
    color:#525859
}
.otherMagazineMobile{
    margin-top:25px
}
.otherMagazineMobile header h2{
    background-color: #5F57A1;
    padding: 10px;
    margin-top: 0;
    font-size: 18px;
    line-height: 24px;
}
.otherMagazineMobile header h2 a{
    color:#FFF;
    font-weight: 400
}

.content{
    padding-top:30px;
    padding-bottom:30px;
}
.content table{
    margin:5px 0 30px
}
.navbar-price{
    height: 120px;
    background-color: #5F57A1;
}
.navbar-price .stonePrezzo{
    color:#fff;
    font-size: 65px;
    background-repeat: no-repeat;
    background-size: contain;
    height:168px;
    text-align: center;
    padding-top:15px;
    font-family: "Montserrat";
    font-weight: 500;
}
.navbar-price .stonePrezzo .daPrezzo{
    font-size: 16px;
    margin-bottom: -20px;
    margin-top: 15px;
}

.navbar-price .stonePrezzo .prezzo sup{
    font-size:20px;
    font-weight: 600;
    top:-35px;
}
.navbar-price .stonePrezzo .prezzo sub{
    font-size: 30px;
    bottom: 0px;
    left: -24px;
    color:#fff
}
.navbar-price .euro{
    font-family: "Montserrat";
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 18px;
    color:#FFF;
    margin-top: 48px;
    padding-left: 0 !important;
}
.navbar-price .btn-casa{
    background-color: #FFF !important;
    margin-top: 30px;
    width: 100%;
}
@media only screen and (max-width: 1366px){
    .MediaQuery-desktop .myT-app.app-visible {
        left:20px !important;
        justify-content: flex-start !important;
    }

}
@media only screen and (max-width: 768px){
    .btn-servizi{
        width:85%;
    }
    .infoSocial a.btn-casa{
        width:85%
    }
}
@media (max-width: 767px) {
    .video-container video,.video-container-txt video{
        height:auto;
        max-height:366px; 
    }
}
