/*------------------------------
    Table of Contents
---------------------------------
    I. Defaul Selectors
    II. Countdown Timer
	III. Social Icons
	IV. Animations
	V. Subscribe Form

 
*/



/*-------------------------------
    I. Defaul Selectors
---------------------------------*/
body {
    color: #fff;
    font-family: 'Roboto', sans-serif;
    -webkit-animation: 10s linear 0s normal none infinite loop;
    -moz-animation: 10s linear 0s normal none infinite loop;
    -ms-animation: 10s linear 0s normal none infinite loop;
    -o-animation: 10s linear 0s normal none infinite loop;
    animation: 10s linear 0s normal none infinite loop;
}

    body.blue {
        background: var(--primary-color) url('/content/images/blue.png') repeat 0 0;
    }

        body.blue .icon-effect .social-icon:hover {
            color: #3498db;
        }

    body.brown {
        background: #2980b9 url('../images/brown.jpg') repeat 0 0;
    }

        body.brown .icon-effect .social-icon:hover {
            color: #DB6934;
        }

    body.green {
        background: #2980b9 url('../images/green.jpg') repeat 0 0;
    }

        body.green .icon-effect .social-icon:hover {
            color: #2ecc71;
        }

    body.orange {
        background: #2980b9 url('../images/orange.jpg') repeat 0 0;
    }

        body.orange .icon-effect .social-icon:hover {
            color: #e67e22;
        }


    body.pink {
        background: #2980b9 url('../images/pink.jpg') repeat 0 0;
    }

        body.pink .icon-effect .social-icon:hover {
            color: #9b59b6;
        }

    body.red {
        background: #2980b9 url('../images/red.jpg') repeat 0 0;
    }

        body.red .icon-effect .social-icon:hover {
            color: #c0392b;
        }

    body.violet {
        background: #2980b9 url('../images/violet.jpg') repeat 0 0;
    }

        body.violet .icon-effect .social-icon:hover {
            color: #8e44ad;
        }

    body.yellow {
        background: #2980b9 url('../images/yellow.jpg') repeat 0 0;
    }

        body.yellow .icon-effect .social-icon:hover {
            color: #f1c40f;
        }

*::-webkit-input-placeholder {
    color: #ddd !important;
}

*:-moz-placeholder {
    color: #ddd !important;
}

*:-ms-input-placeholder {
    /* IE10+ */
    color: #ddd !important;
}


a:hover {
    text-decoration: none;
}

h1, h2, h3 {
    font-weight: 100;
    font-family: 'Roboto', sans-serif;
    color: white;
    margin-top: 0.2em;
    margin-bottom: 0.5em;
    line-height: 40px;
}

h1 {
    font-size: 60px;
}

h2 {
    font-size: 30px;
}

h3 {
    font-size: 23px;
}

/*-------------------------------
    I. End of Defaul Selectors
---------------------------------*/

.tagline {
    margin: 20px auto;
}

.logo {
    padding-top: 25px;
    font-size: 2.75em;
}

.form-group .email {
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}




/*-------------------------------
    II. Countdown Timer
---------------------------------*/
#countdown li p {
    font-size: 30px;
}

#countdown span {
    font-size: 17px;
    text-align: center;
    height: 40px;
    display: block;
}

#countdown input {
    font-family: 'Roboto', sans-serif !important;
    font-weight: 100 !important;
}

#countdown li div {
    display: block !important;
}

#countdown {
    color: #fff;
    text-align: center;
    margin: 0 auto;
    font-size: 90px;
    padding: 0;
}

.subtitle {
    text-align: center;
}

    .subtitle span {
        padding: 50px;
    }

#countdown li {
    display: inline-block;
    font-weight: 100;
    line-height: 60px;
}
/*-------------------------------
    II. End of Countdown Timer
---------------------------------*/



/*-------------------------------
    III. Social Icons
---------------------------------*/
.social-icon {
    display: inline-block;
    cursor: pointer;
    margin: 15px 21px;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    text-align: center;
    position: relative;
    z-index: 1;
    color: #fff;
}

    .social-icon i {
        display: block;
        color: #fff;
        position: absolute;
        top: 50%;
        left: 50%;
        transform:translate(-50%,-50%);
        font-size: 3em;
        margin: auto;
        z-index: 999;
    }
    .social-icon:hover i {
        color:#2980b9;
    }
        .social-icon:after {
            pointer-events: none;
            position: absolute;
            width: 100%;
            height: 100%;
            border-radius: 50%;
            content: '';
            -webkit-box-sizing: content-box;
            -moz-box-sizing: content-box;
            box-sizing: content-box;
        }

    .social-icon:before {
        speak: none;
        font-size: 48px;
        line-height: 90px;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        display: block;
        -webkit-font-smoothing: antialiased;
    }

.icon-effect {
    display: block;
    clear: both;
    margin: 20px 0;
}

    .icon-effect .social-icon {
        background: rgba(255,255,255,0.1);
        -webkit-transition: background 0.2s, color 0.2s;
        -moz-transition: background 0.2s, color 0.2s;
        transition: background 0.2s, color 0.2s;
    }

        .icon-effect .social-icon:after {
            top: -7px;
            left: -7px;
            padding: 7px;
            box-shadow: 0 0 0 4px #fff;
            -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
            -webkit-transform: scale(.8);
            -moz-transition: -moz-transform 0.2s, opacity 0.2s;
            -moz-transform: scale(.8);
            -ms-transform: scale(.8);
            transition: transform 0.2s, opacity 0.2s;
            transform: scale(.8);
            opacity: 0;
        }


        .icon-effect .social-icon:hover {
            background: rgba(255,255,255,1);
            color: #3498db;
        }

            .icon-effect .social-icon:hover:after {
                -webkit-transform: scale(1);
                -moz-transform: scale(1);
                -ms-transform: scale(1);
                transform: scale(1);
                opacity: 1;
            }
/*-------------------------------
    III. End of Social Icons
---------------------------------*/


/*-------------------------------
    IV. Animations
---------------------------------*/
@-webkit-keyframes loop {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 500px 0;
    }
}

@-moz-keyframes loop {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 500px 0;
    }
}

@-ms-keyframes loop {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 500px 0;
    }
}

@-o-keyframes loop {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 500px 0;
    }
}

@keyframes loop {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 500px 0;
    }
}

.delay {
    -webkit-animation-duration: 1s;
    -moz-animation-delay: 2s;
    -o-animation-iteration-count: infinite;
}

.delayTwo {
    -webkit-animation-duration: 2s;
    -moz-animation-delay: 2s;
    -o-animation-iteration-count: infinite;
}

.delayThree {
    -webkit-animation-duration: 3s;
    -moz-animation-delay: 2s;
    -o-animation-iteration-count: infinite;
}

.delayFour {
    -webkit-animation-duration: 3s;
    -moz-animation-delay: 2s;
    -o-animation-iteration-count: infinite;
}

.delayFive {
    -webkit-animation-duration: 5s;
    -moz-animation-delay: 2s;
    -o-animation-iteration-count: infinite;
}
/*-------------------------------
    IV. End of Animations
---------------------------------*/

/*-------------------------------
    V. Subscribe Form
---------------------------------*/
.form-inline .form-group {
    /* margin: 0 20px; */
}

.subscribe-btn {
    vertical-align: middle;
    height: 38px;
    line-height: 34px;
    border: 1px solid #fff;
    border-left: none;
    background: none;
    color: #fff;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-shadow: border-box;
    margin-left: -3px;
}

.email-txt {
    padding: 4px 10px 4px 0;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 13px;
    font-weight: normal;
    height: 38px;
    line-height: 38px;
    border: 1px solid #fff;
    background: none;
    color: #fff;
    text-indent: 20px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -moz-box-sizing: border-box;
    box-shadow: border-box;
}

    .email-txt:focus {
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        border-color: #fff;
    }
/* Mobile with 480 */
@media (max-width: 480px) {
    .email-txt {
        margin: 0 auto;
        width: 90%;
    }

    .subscribe-btn {
        border-left: 1px solid #fff;
    }
}
/*-------------------------------
    V. End of Subscribe Form
---------------------------------*/


/*-------------------
Style Switcher - For Demo only
*/
.styleswitcher {
    position: fixed;
    z-index: 999999999999999;
    top: 90px;
    width: 100px;
    background: #999;
    margin-left: -100px;
}

    .styleswitcher ul {
        list-style-type: none;
        margin: 10px;
        padding: 0;
    }

        .styleswitcher ul li {
            margin: 2px 0;
        }

        .styleswitcher ul a {
            color: #FFF;
        }

    .styleswitcher a.closer2 {
        color: #FFFFFF;
        z-index: 9999999999999;
        font-size: 19px;
        display: block;
        width: 30px;
        height: 35px;
        background: #999;
        position: absolute;
        right: -35px;
        padding: 5px;
    }

    .styleswitcher a.closer3 {
        color: #FFFFFF;
        z-index: 9999999999999;
        font-size: 19px;
        display: block;
        width: 30px;
        height: 35px;
        background: #999;
        position: absolute;
        right: -35px;
        padding: 5px;
    }

@media (max-width: 960px) {
    .styleswitcher {
        display: none;
    }
}