@import url("http://fonts.googleapis.com/css?family=Lato|Lato");

/*  Base
----------------------------*/

*,
*:before,
*:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html,
body {
    position: relaitve;
    height: 100%;
}

body {
    background: #FFFFFF;
    font-family: Lato;
    font-size: 14px;
    line-height: 1.42857143;
    color: #FFF;
    height: 100%;
}


/*  Theme Size
----------------------------*/
.large {
    font-size: 50px;
    line-height: 50px;
}
.medium {
    font-size: 24px;
    padding: 0 5px;
}
.small {
    font-size: 16px;
    padding: 0 5px;
}





/*  Theme style
----------------------------*/

h1,h2,h3,h4,h5,h6{
   color: white; 
}
.header,.index,.footer {
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding: 4em;
    background: rgba(100, 0, 0, 0.52);
}

.header{
    min-height: 25%;
    color: white;
}
.header h1{
    color:white;
}
.index {
    min-height:50%;
    color: #FFF;
}
.footer{
     min-height: 25%;
    
    
     color: #FFF;   
}

#countdown {
    position:relative;
    padding: 4em;
}
.rotate{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width: 35px;
    height: 35px;
    font-size: 35px;
    line-height:35px;
    padding: 0 5px;
    padding:0;
    margin:auto;
    -webkit-animation:rotate 5s infinite ease;
            animation:rotate 5s infinite ease;
}
@-webkit-keyframes rotate{
    0%{
        -webkit-transform:rotate(0deg);
                transform:rotate(0deg);
    }
    100%{
        -webkit-transform:rotate(1080deg);
                transform:rotate(1080deg);
    }
}
@keyframes rotate{
    0%{
        -webkit-transform:rotate(0deg);
                transform:rotate(0deg);
    }
    100%{
        -webkit-transform:rotate(1080deg);
                transform:rotate(1080deg);
    }
}



/*  Theme Style
----------------------------*/
body{
/* @AZ150909 */
    /* ORIGINALE background: url(../../img/theme1.jpg) no-repeat center center fixed; */
    background: url(themecreativa.jpg) no-repeat center center fixed;
    background-size: cover;
}

.only-day .ctn-num {
    font-size:8em;
}
.only-day .ctn-text {
    font-size: 3em;
}
.only-day #countdown{
    padding:0;
}
.social li a {
  color: #FFF;
}

a.plus,a.close-info {
  position: fixed;
  top: 1rem;
  right: 1rem;
  color: #FFF;
  transition: all 0.2s ease;
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
  display: block;
  text-align: center;
  width: 30px;
  height: 30px;
  line-height: 30px;
}
a.plus:hover,a.close-info:hover {
  color: #ddd;
  transition: all 0.2s ease;
  -webkit-transform: rotate(-360deg);
          transform: rotate(-360deg);
}
.demo-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-top:60px;
  visibility: hidden;
  opacity: 0;
  z-index: 901;
  transition: all 1s cubic-bezier(0.7,.01,.3,1);
}
.opened {
  visibility: visible;
  opacity: 1;
  transition: all 1s ease;
  background: #FFF;
  background: rgba(0, 0, 0, 0.62);
  color: #FFF;
}
.demo-container a img{
  margin-bottom:1em;
}







/*  Custom Foundation
----------------------------*/
.row{
    max-width: 80rem;
}
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea {
  background-color: rgba(255, 255, 255, 0);
  border-color: #FFF;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  color: rgba(255, 255, 255, 0.75);
}
button, .button {
  background-color: #FFF;
  border-color: #6E6E6E;
  color: #4F4F4F;
}
button:hover, button:focus, .button:hover, .button:focus {
  background-color: rgba(255, 255, 255, 0.21);
  outline-color: #FFF;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="color"]:focus, textarea:focus {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0);
  outline: none;
  color: #FFF;
}


@media (max-width:480px){
  .header,.index,.footer {
    padding:2em 1em;
  }
}