﻿
#daysbox  *{
    font-family: 'Poppins', sans-serif;
    box-sizing: border-box;    
}

#daysbox{
    color:#666;
    
}

#daysbox p{
    line-height:1.7em;
    font-size:1em;
}

#daysbox .dHeader{
    background-color: #9E056D;
    height:700px;
    color:#fff;
}

#daysbox .dHeader button.cta{
    margin-top: 50px;
}

#daysbox img.right{
    float:right;
}

#daysbox .tonda{
    border-radius:50%;
}

#daysbox .borderBlu{
    border:solid 6px #2d57a4
}


#daysbox .dContent{
    margin:0 auto;
    max-width: 1200px;
    padding: 25px;
    overflow: auto;
}

#daysbox h1{
    margin: 20px 0 15px;
    font-size: 2.6em;    
}

#daysbox h1 span{
    font-size:.7em;
    font-weight: normal;
}

#daysbox h2{
    font-size:2em;
    margin:0 0 5px 0;
}

#daysbox .box_1{
    margin: 0 auto;
    overflow: auto;
}

#daysbox .box_2{
    width: 50%;
    float:left;
    padding:10px;
}

#daysbox .box_3{
    width: 33.33%;
    float:left;
    padding:15px 25px;
}

#daysbox .box_4{
    width: 25%;
    float:left;
    padding:15px 30px;
}

#daysbox img{
    max-width: 100%;
}

#daysbox .intro{
    padding: 10px 0;
    font-size:1.05em;
    line-height: 1.7em;
}

#daysbox .intro .evidenzia{
    color:#F7D100;
}

#daysbox #info{
    list-style: none;
    font-size:1.1em;
    padding-left: 20px;
}

#daysbox #info > li{
    padding: 5px 0 5px 15px;
    position: relative;
    background: url(/immagini/CodingDays/right-arrow.png) no-repeat 0 50%;
    background-size: 16px;
}

#daysbox #info > li > span{
    display: inline-block;
    padding:0 5px 0 10px;
    color:#F7D100;
}

#daysbox #info > li > i
{
    font-style:normal;}

#daysbox #info > li ol{
    padding-left: 80px;
    position: absolute;
    top:5px;
    margin:0;
    list-style: none;
}
#daysbox #info > li ol li{
    padding: 0 0 3px;
}

#daysbox button.cta{
    color:#2d57a4;
    background: #f7d100;
    border: solid 2px #f7d100;
    padding:10px 25px;
    font-size:1.2em;
    cursor:pointer;
    font-weight:bold;
    border-radius:5px;
    display: inline-block;
    margin-top: 25px;
    transition: .3s;
}

#daysbox button.cta:hover{
    background: transparent;
    color:#f7d100;
    border-color: #f7d100;
}

#daysbox .box_3 h3{
    margin:0 0 20px 0
}

#daysbox .box_3 .left{
    float:left;
    margin:0 20px 10px 0;
}

#daysbox .box_3 .noMargin{
    margin:0;
}


#daysbox .programma{
    padding:50px 0;
    background: #F5F5F5;
}

#daysbox .programma h2{
    text-align: center;
    font-size:2em;
    margin:0 0 5px 0;
}

#daysbox .programma h4{
    margin:0;
    color:#9E056D;
    font-size:1.3em;
    text-align: center;
}

#daysbox .box6Days{
    padding:50px 0;
}


#daysbox .box6Days section{
    overflow: auto;
    margin:25px 0;
    border:solid 1px #f7d100;
    background: #fff;
}


#daysbox .box6Days h3{
    background:#9E056D;
    margin:0;
    padding:10px 25px;
    color:#f7d100;
    position:relative;
}

#daysbox .box6Days section a
{
    color:#9E056D; font-weight:bold; text-decoration:none}

#daysbox .box6Days section a:hover{text-decoration:underline}
#daysbox .box6Days section.passata{
    opacity:0.7;
    border:solid 1px #888;
    
}

#daysbox .box6Days section.passata h3{
    background:#555;
    text-decoration:line-through;
    opacity:0.6;
    color:#eee
}

#daysbox .box6Days h3 img
{
float:right; margin-left:5px}

#daysbox .box6Days p{    
    padding:25px;    
    margin:0;
    font-size:1em;    
}

#daysbox .box6Days ol
{
    margin:-15px 0 25px 0;
    list-style:none;
    padding-left:35px;
}

#daysbox .box6Days ol li{
    padding: 5px 0 5px 30px;
    position: relative;
    background: url(/immagini/CodingDays/right-arrow.png) no-repeat 0 50%;
    background-size: 16px;
    
}


#daysbox .box6Days ol li:hover{
    background-size: 20px;
    transition:.3s;
}



    
#daysbox .box6Days ol a:hover
{
    text-decoration:underline;
    }    

#daysbox .prova{
    padding:50px 0;
}

#daysbox .prova .cta:hover{
    color:#2d57a4;
    border-color:#2d57a4
}  

#daysbox .lavoro{
    padding:50px 0;
    background: #f7d100;
    color:#000
}


#daysbox .lavoro h2
{
    line-height:1.4em;}

#daysbox .lavoro .cta{
    border-color:#2d57a4;
    background: #2d57a4;
    color:#FFF
}

#daysbox .lavoro .cta:hover{
    color:#2d57a4;
    border-color:#2d57a4
}  
#daysbox .lavoro blockquote{
    border-left: 3px dashed #E8514E;
    margin: 1em 0;
    padding: 25px;
    color:#2d57a4;
    background:url(/immagini/CodingDays/quote.png) no-repeat 99% 5px #FAFAFA;

}

#daysbox .lavoro .box-alunni
{
    max-width:450px;
    float:right;
    position:relative}
    
#daysbox .lavoro .box-alunni a
{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    color:#FFF;
    text-decoration:none;
    padding:170px 50px;
    text-align:center;
    font-size:2.5em;
    font-weight:bold;
    background:rgba(45,87,164,.8);
    border-radius:50%;
    line-height:1.4em;
    opacity:0;
    transition:opacity .8s;
}    

#daysbox .lavoro .box-alunni a:hover
{
   opacity:1;
}    
    

#daysbox .spot5cd{
    padding:50px 0 100px;    
}

#daysbox .spot5cd h2{
    color:#2d57a4;
    text-align: center;
    margin: 25px 0 40px;
    font-size: 2.4em;
}
#daysbox .spot5cd h2 span{
    display: block;
    color:#9E056D;
}


#daysbox .spot5cd img{
    float: left;
    margin-right: 70px;
}

#daysbox .spot5cd p{
    text-align: left;
    font-size: 1.1em;
    line-height: 1.8em;
}

#daysbox .spot5cd .cta:hover{
    border-color: #2d57a4;
    background: #FFF;
    color:#2d57a4;
}


#modulo5cd{
    position:fixed;
    top:0;
    left:0;
    background: rgba(0,0,0,0.7);
    width:100%;
    height: 100%;
    z-index:10000;
    display:none;
}

#modulo5cd section{
    margin:5% auto;
    max-height: 90vh;
    background: #FFF;
    border-radius:10px;
    max-width: 1100px;
    padding:70px;
    overflow: auto;
    position: relative;
}

#modulo5cd section .info{
    float:left;
    width:50%;
    padding-right:100px;
}

#modulo5cd section .info h3{
    margin:0 0 10px;
    font-size:1.7em;
    color:#9E056D;
    line-height:1.5em;
    background:url(/immagini/CodingDays/right-arrow-blu.png) no-repeat right center;
    padding-right:80px;
}

#modulo5cd section .info h4{
    margin:50px 0 10px;
    font-size:1.3em;
    color:#2d57a4;
}


#modulo5cd section ul
{
   float:left;
    width:50%;  
    margin:0;
    list-style: none;
    padding:0;
}

#modulo5cd section ul li{
    padding:5px 0 20px;
}

#modulo5cd section label{
    display: block;
    font-size:1.1em;
    margin-bottom:2px;
    color:#888;
}

#modulo5cd section input,#modulo5cd section select{
    display: block;
    width: 100%;
    padding:8px;
    font-size:1.2em;
    border:solid 1px #999;
    border-radius:4px;
}

#modulo5cd section .testoError{
    border-color:#C00;
   background:#fff1f1;
}

#modulo5cd section .sub{
    padding:30px 0 0 0;
    text-align: right;
}

#modulo5cd section .sub input{
    width:200px;
    background:#f7d100;
    cursor:pointer;
    border:solid 2px #2d57a4;
    color:#2d57a4;
    font-weight:bold;
    text-transform: uppercase;
    display: inline-block;
    transition: .2s;
}

#modulo5cd section .sub input:hover{
    background:#2d57a4;
    color:#f7d100;
}

#modulo5cd .closeUX{
    position: absolute;
    top:25px;
    right:25px;
    opacity: 0.7;
    cursor:pointer;
    width: 32px;
}

#modulo5cd .privacy input{
    display:inline-block;
    width:15px;
}

#modulo5cd .privacy a{
    color:#9E056D;
    font-weight:bold;
}


#modulo5cd .privacy a:hover
{
    color:#2d57a4;
    }
    
    
#modulo5cd .esitoOk
{
    font-size:1.4em;
    margin:80px 0 40px;
    color:#33a42d;
    font-weight:bold;
    display:block;
    background:#33a42d;
    padding:15px 20px;
    border-radius:8px;
    color:#FFF; 
} 

#modulo5cd .esitoKo
{
    font-size:1.1em;
    margin:80px 0 40px;    
   color:#C00;
   font-weight:bold;
   display:block;
   background:#C00;
   padding:15px 20px;
   border-radius:8px;
   color:#FFF;
}
    
    
    
@media only screen and (max-width: 900px) 
{
     #daysbox .box_2
     {
         width:35%
      }

   #daysbox .box_2:first-of-type
   {
       width:65%
    }

    #daysbox .box_3 .left
    {
    margin: 0 10px 20px 0
    }
    #daysbox .box_3 h3
    {
        line-height:1.4em;}
        
 
#modulo5cd section{
    max-width: 800px;
    padding:45px;
} 
 
 
     #daysbox .lavoro .box_2
     {
         width:100%
      } 
 
    
   #daysbox .lavoro .box_2:first-of-type
   {
       width:100%
    }
    
   #daysbox .lavoro .box-alunni
   {
       float:none;
       margin:20px auto}
       
      
      
  #daysbox .lavoro .box-alunni img
  {
      float:none}     
       
 #daysbox .lavoro .box-alunni a
{
    position:static;
    color:#FFF;
    text-decoration:none;
    padding:15px 25px;
    text-align:center;
    font-size:1.2em;
    font-weight:bold;
    border-radius:0;
    line-height:1.4em;
    opacity:1;
    transition:opacity .8s;
     border-color: #2d57a4;
    background: #2d57a4;
    color: #FFF;    
    display:block;
    margin:25px auto;
    width:300px;
    border-radius:5px
   }          
       
}

@media only screen and (max-width: 720px) 
{
    
    #daysbox .dContent
    {
        padding:15px;
       }
       
       #daysbox h1
       {
           font-size:2.5em;
           line-height:1.2em;}
    
    #daysbox h1 span
    {
      display:block; }
    
    #daysbox .dHeader
    {
        height:auto;}
    
     #daysbox .box_2
     {
         width:100%;
         float:none;
      }
      
    #daysbox .box_2:first-of-type
   {
         width:100%;
         float:none;
    }     
    
    
   #daysbox img.right
   {
    float:none;
    margin: 0 auto;
    display:block;
    max-width:300px;
    margin-top:25px
    } 
    
    
    #daysbox button.cta
    {
        display:block;
        margin:35px auto 0;}
    
    
    #daysbox .box_3
    {
     float:none;
     width:100%;
     overflow:auto;

     }
     
     #daysbox .box_3 h3
     {
         margin-bottom:8px}
    
    
    #daysbox .spot5cd img
    {
        display:block;
        max-width:300px;
        margin:15px auto 25px;
        float:none;
        }
    
 #daysbox .spot5cd p
 {
     text-align:center;}
 
        
#daysbox .spot5cd h2{
    color:#2d57a4;
    text-align: center;
    margin: 15px 0 25px;
    font-size: 1.8em;
} 
       
#daysbox .programma h2
{
    line-height:1.5em;}       
       

#daysbox .box6Days h3{
    background:#f7d100;
    margin:0;
    padding:8px 15px;
    color:#2d57a4;
    position:relative;
}

#daysbox .box6Days h3 img
{
float:right; margin-left:5px}

#daysbox .box6Days p{
    padding:15px;
    font-size:1em;    
}

#daysbox .box6Days ol
{
    margin-top:-5px;
    padding-left:25px;
}


  
 #daysbox #info
 {
     padding-left:0;} 
  
  
 #daysbox #info > li > span
 {
     display:block;} 
  
 
 #daysbox #info > li{
    padding: 5px 0 5px 10px;
    background: url(/immagini/CodingDays/right-arrow.png) no-repeat 0 11px;
    background-size: 12px;
}


#daysbox #info > li ol{
    padding-left: 10px;
    position: static;
}

#daysbox #info > li > i
{
    display:inline-block;
    padding-left:10px;}
 
 
 #daysbox .lavoro img.right
 {
     max-width:100%}
 
 
#modulo5cd section .info{
    float:none;
    width:100%;
    padding-right:0;
}

#modulo5cd section .info h3{
    margin:0 0 10px;
    background:none;
    padding-right:0;
}

#modulo5cd section .info p
{
    display:none;}

#modulo5cd section .info h4{
    margin:0 0 10px;
    font-size:1.3em;
    color:#2d57a4;
    
}


#modulo5cd section ul
{
   float:none;
    width:100%;  
    margin:0;
} 
 
   #modulo5cd section{
    padding: 25px 18px;
}      

#modulo5cd section ul li
{
    padding:0 0 12px 0}


#modulo5cd section input,#modulo5cd section select{
    display: block;
    width: 100%;
    padding:6px;
    font-size:1.1em;
}

#modulo5cd .closeUX{
    top:15px;
    right:15px;
    opacity: 0.8;
    width: 30px;
}

#modulo5cd section label
{
    margin-bottom:0;}


#modulo5cd section .sub
{
    padding-top:15px;
    padding-bottom:25px}

#modulo5cd section .sub input{
    width:200px;
    display: block;
    margin:0 auto;
}

#modulo5cd section .info h4
{
    line-height:1.4em;}


#daysbox .lavoro blockquote{
    border-left: 0;
    margin: 1em 0;
    padding: 30px 15px;
    background:url(/immagini/CodingDays/quote.png) no-repeat 99% 5px #FAFAFA;

}

}
