@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700');
html,body{
    margin:0;
    padding:0;
    font-family: 'Open Sans', sans-serif;
}
/*Phone*/
@media screen and (max-width:767px){
 
    .landing{
               width:100%;
    }

    .landing-subtitle{
        display:none;
        font-weight:700;
    }
    .landing-btn{
        margin-top:65vh;
        background-color:#ffe484;
        color:#1b1b1b;
        font-size:36px;
    }
    .packages-section{
        background-color:#e0eafc;
        padding-top:20px;
        padding-bottom:2em;
    }
    .packages-header{
        margin-top:0;
        text-align:center;
        margin-bottom:1em;
        font-weight:700;
        padding:20px;
    }
    .packages-container{
        width:80%;
        margin:0 auto;
        background-color:white;
        text-align:center;
        margin-bottom:2em;
        margin-top:1em;
        padding-bottom:20px;
        box-shadow:0px 1px 10px #1b1b1b;
    }
    .learn-btn,
    .get-btn{
        margin-top:0.5em;
    }
    .learn-btn{
        background:rgba(255, 228, 132, 0.5);
        color:black;
        margin-right:10px;
    }
    .get-btn{
        background:rgba(255, 228, 132, 1);
        color:black;   
        margin-left:10px;
    }
    .packages-container img{
        width:80%;
        padding-top:20px;
    }
    .email img{
        width:45%;
        padding-top:20px;
        padding-bottom:10px;
    }
    .producer img{
        width:70%;
        padding-bottom:15px;
    }
    .sponsor img{
        padding-bottom:15px;
    }
    .campaign-section {
        background-color:#e0eafc;
        padding-left:5%;
        padding-right:5%;
    }
    .campaign-header{
        text-align:center;
        font-weight:700;
        margin-bottom:1em;
        margin-top:0;
        padding:20px;
    }
    .campaign-section iframe{
        margin: 0 auto;
        width:100%;
    }
    .campaign-caption{
        font-size:18px;
        margin-bottom:2em;
    }
    .campaign-btn{
        background-color:#ffe484;
        color:#1b1b1b;
        font-size:36px;
        margin-bottom:2em;
    }
    .center-button{
        text-align:center;
    }
    .modal-dialog{
        width:1400px;
        height:800px;
    }
    .digital{
       width:40%;
       max-width:100%;
       height:auto;
       border-radius:5px;
       border: 5px solid black;
   }
}

/*Tablet*/
@media screen and (min-width:768px) and (max-width:1024px){
    body,html{
        overflow-x:hidden;
    }
    .landing{
        height:100vh;
    }
    .landing-bg {
        background: url('../img/tablet.png');
        background-size:cover;
        position:absolute;
        background-repeat: no-repeat;
        background-position-x:40%;
        width:100%;
        height:100%;
        z-index:-2;
        margin-top:100px;
    }

    .landing-subtitle{
        display:none;
        font-weight:700;
        font-size:54px;
    }
    .landing-btn{
        margin-top:75vh;
        background-color:#ffe484;
        color:#1b1b1b;
        font-size:36px;
    }
    .packages-section{
        background-color:#e0eafc;
        padding-top:80px;
        padding-bottom:2em;
        padding-left:5%;
        padding-right:5%;
        overflow:visible;
        margin-top:-50px;
    }
    .business{
        float:right;
    }
    .sponsor{
        float:right;
    }
    .packages-header{
        margin-top:0;
        text-align:center;
        margin-bottom:1em;
        font-weight:700;
        padding:20px;
        font-size:54px;
    }
    .packages-container{
        display:inline-block;
        width:45%;
        height:480px;
        margin:0 auto;
        background-color:white;
        text-align:center;
        margin-bottom:2em;
        margin-top:1em;
        padding-bottom:20px;
        box-shadow:0px 1px 10px #1b1b1b;
    }

    .learn-btn,
    .get-btn{
        margin-top:0.5em;
    }
    .learn-btn{
        background:rgba(255, 228, 132, 0.5);
        color:black;
        margin-right:10px;
    }
    .get-btn{
        background:rgba(255, 228, 132, 1);
        color:black;   
        margin-left:10px;
    }
    .packages-container img{
        width:74%;
        padding-top:20px;
    }
    .email img{
        width:40%;
        padding-top:20px;
        padding-bottom:10px;
    }
    .producer img{
        width:59%;
        padding-bottom:15px;
    }
    .sponsor img{
        padding-bottom:15px;
    }
    .campaign-section {
        background-color:#e0eafc;
        padding-left:5%;
        padding-right:5%;
    }
    .campaign-header{
        text-align:center;
        font-weight:700;
        margin-bottom:1em;
        margin-top:0;
        padding:20px;
        font-size:54px;
    }
    .campaign-section iframe{
        margin: 0 auto;
        width:100%;
    }
    .campaign-caption{
        font-size:32px;
        margin-bottom:2em;
    }
    .campaign-btn{
        background-color:#ffe484;
        color:#1b1b1b;
        font-size:36px;
        margin-bottom:2em;
    }
    .center-button{
        text-align:center;
    }
    .tablet{
        background:no-repeat;
        width:100%;
        margin-top:100px;
    }

       .digital{
       width:20%;
       max-width:100%;
       height:auto;
       margin-left:80%;
       margin-top:80px;
       border-radius:5px;
       border: 5px solid black;
   }
}

/*Desktop*/
@media screen and (min-width:1025px){
    body,html{
        overflow-x:hidden;
    }
    .landing{
        height:100vh;
    }
    .landing-bg-color{
        position:absolute;
        z-index:-3;
        width:100vw;
        height:100vh;    
        background: #E0EAFC; /* fallback for old browsers */
        background: -webkit-linear-gradient(to left, #E0EAFC , #CFDEF3); /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(to left, #E0EAFC , #CFDEF3); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */      
    }

    .landing-subtitle{
        display:none;
        font-weight:700;
        font-size:54px;
    }

    .packages-section{
        background-color:#e0eafc;
        padding-top:80px;
        padding-bottom:2em;
        overflow:visible;
        text-align:center;
        margin-top:-50px;
    }
    .packages-header{
        margin-top:0;
        text-align:center;
        margin-bottom:1em;
        font-weight:700;
        padding:20px;
        font-size:54px;
    }
    .packages-container{
        display:inline-block;
        width:22%;
        margin:0 auto;
        background-color:white;
        text-align:center;
        margin-bottom:2em;
        margin-top:1em;
        padding-bottom:20px;
        margin-left:20px;
        box-shadow:0px 1px 10px #1b1b1b;
        vertical-align:bottom;
        height:450px;
        position:relative
    }
    .align-bottom {
        position:absolute;
        bottom:0;
        margin-bottom:20px;
        width:100%;
    }
    .producer{
        padding-top:8px;
    }
    .sponsor{
        padding-top:8px;
    }
    .learn-btn,
    .get-btn{
        margin-top:0.5em;
    }
    .learn-btn{
        background:rgba(255, 228, 132, 0.5);
        color:black;
        margin-right:10px;
    }
    .get-btn{
        background:rgba(255, 228, 132, 1);
        color:black;   
        margin-left:10px;
    }
    .packages-container img{
        width:74%;
        padding-top:20px;
    }
    .email img{
        width:40%;
        padding-bottom:10px;
    }
    .producer img{
        width:59%;
        padding-top:20px;
        padding-bottom:15px;
    }
    .sponsor img{
        padding-bottom:15px;
    }
    .campaign-header{
        text-align:center;
        font-weight:700;
        margin-bottom:1em;
        margin-top:0;
        padding:20px;
        font-size:54px;
    }
    .campaign-section {
        background-color:#e0eafc;
        padding-left:5%;
        padding-right:5%;
        text-align:center;
    }
    .video{
        display:inline-block;
        width:30%;
        margin-left:20px;
        text-align:left;
    }
    .campaign-section iframe{
        margin: 0 auto;
        width:100%;
    }
    .campaign-caption{
        font-size:26px;
        margin-bottom:2em;
    }
    .campaign-btn{
        background-color:#ffe484;
        color:#1b1b1b;
        font-size:36px;
        margin-bottom:2em;
    }
    .center-button{
        text-align:center;
    } 
    .tablet{
        background:no-repeat;
        width:100%;
    }

    .modal-dialog{
        width:1400px;
        height:800px;
    }
    
   map.map, map area{
       outline: none;
    }
   .digital{
       width:15%;
       max-width:100%;
       height:auto;
       margin-left:80%;
       margin-top:80px;
       border-radius:5px;
       border: 5px solid black;
   }
   /*.responsive-image{
       width:300px;
       max-width:100%;
       height:auto;
    }*/

} 


@media screen and (min-device-width:1026px) and (max-device-width:1046px) {
     ol, ul {
        margin-top:-85px;
        margin-bottom:10px;
    }

    .modal-dialog{
        width:1400px;
        height:800px;
    }
  

}
@media screen and (max-device-width:1200px){
    .landing-bg{
        min-width:1425px;
    }
     .packages-section{
        background-color:#e0eafc;
        padding-top:80px;
        padding-bottom:2em;
        overflow:visible;
        text-align:center;
        margin-top:-50px;
    }
       .tablet{
        background:no-repeat;
        width:100%;
    }

    .modal-dialog{
        width:1400px;
        height:800px;
    }
}

@media screen and (max-width:1000px) {
         .packages-section{
        background-color:#e0eafc;
        padding-top:80px;
        padding-bottom:2em;
        overflow:visible;
        text-align:center;
        margin-top:-50px;
    }

         .tablet{
        background:no-repeat;
        width:100%;
        position:relative;
        margin-top:120px;
      }

        .modal-dialog{
            width:1400px;
            height:800px;
        }
 }


@media screen and (max-width:800px) {
         .packages-section{
        background-color:#e0eafc;
        padding-top:80px;
        padding-bottom:2em;
        overflow:visible;
        text-align:center;
        margin-top:-50px;
    }

    .modal-dialog{
        width:1400px;
        height:800px;
    }
  
}

@media screen and (max-width:600px){
    .packages-perks {
        font-size:18px;
    }
      .tablet{
        background:no-repeat;
        width:100%;
        position:relative;
        margin-top:100px;
      }
      desktop-ul{
        padding-top:15px;
      }

        .packages-section{
        background-color:#e0eafc;
        padding-top:60px;
        padding-bottom:2em;
        overflow:visible;
        text-align:center;
        margin-top:-50px;
    }
}