@font-face{font-family:'Yekan';src:url('fonts/BYekan.eot?#') format('eot'),
url('fonts/BYekan.woff') format('woff'),
url('fonts/BYekan.ttf') format('truetype');}
*{padding: 0;margin: 0;font-family: "Yekan","Droid Sans", sans-serif;font-weight: normal;}
html{background: #000}
body{
    background: url("../image/bg.svg") #FFC83F;
    margin: 0;
    min-height: 550px;
    max-height: 550px;
    line-height: 2;
    overflow-x: hidden;
}
:focus {
	outline: 0;
}
::-webkit-input-placeholder {
    color: rgba(0,0,0,.3);
}

:-moz-placeholder { /* Firefox 18- */
    color: rgba(0,0,0,.3);
}

::-moz-placeholder {  /* Firefox 19+ */
    color: rgba(0,0,0,.3);
}

:-ms-input-placeholder {
    color: rgba(0,0,0,.3);
}
.container{padding: 50px 20px;}
.container,.countdown{
    direction:rtl;
    text-align: right;
}
.text{text-align: center;color: #4b3912;z-index: 12;position: relative;width: 80%;margin: 0 auto;font-size: 1.8em}
.countdown{width: 100%;position: absolute;top: 420px;left: 0;}
.ClassyCountdown{z-index: 99;color: #FFC83F;width: 50%;margin: 0 auto;}
.circle{
    width: 70px;
    height: 70px;
    border-radius: 100%;
    padding: 5px 10px 5px 8px;
    position: absolute;
    top: 180px;
    background: #FFC83F;
    border: 5px solid #ebb63e;
    color: #4b3912;
    z-index: 11;
}
.circle:focus,.circle:active,.circle:hover{outline: 0;}
.circle:hover{background-color: #f5bf3e;cursor: pointer;}

.contact{right: 10px;}
.about{left: 10px;}

.box{width: 50%;height: auto;margin: 0 auto;position: relative;z-index: 99;display: none;background: rgba(0,0,0,.1);padding: 5px 15px 15px 15px;border-radius: 10px;}

.input{background: rgba(0,0,0,.1);color: #000;border: none;border-radius: 5px;padding: 11px 10px;font-size: 20px;width: 46%;}
textarea.input{margin-top: 10px;width: 96%;}
.input:focus,.input:active{background: rgba(0,0,0,.2);}
.btn{
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: none;
    background: rgba(0,0,0,.2);
    padding: 10px 20px;
    color: rgba(0,0,0,.5);
    cursor: pointer;
}
.btn:hover{background: rgba(0,0,0,.3);}
.input,.circle{
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -ms-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s;
}
.spins{position: absolute;top: 262px;left: 50%; margin-left: -140px;z-index: 13}

.ClassyCountdown-wrapper>div{display:inline-block;position:relative;width:calc(25% - 20px);margin:10px}
.ClassyCountdown-wrapper .ClassyCountdown-value{width:100%;line-height:1em;position:absolute;top:50%;text-align:center;left:0;display:block}


.cloud{position: absolute;}
.cloud1{
    -webkit-animation: cloud1-keyframes 60s linear infinite; /* Chrome, Safari, Opera */
    animation: cloud1-keyframes 60s linear infinite;
    z-index: 0;
}
.cloud2{
    -webkit-animation: cloud2-keyframes 23s linear infinite; /* Chrome, Safari, Opera */
    animation: cloud2-keyframes 23s linear infinite;
    z-index: 1;
}
.cloud3{
    -webkit-animation: cloud3-keyframes 16s linear infinite; /* Chrome, Safari, Opera */
    animation: cloud3-keyframes 16s linear infinite;
    z-index: 2;
}
.cloud4{
    -webkit-animation: cloud4-keyframes 20s linear infinite; /* Chrome, Safari, Opera */
    animation: cloud4-keyframes 20s linear infinite;
    z-index: 3;
}
.cloud5{
    -webkit-animation: cloud5-keyframes 40s linear infinite; /* Chrome, Safari, Opera */
    animation: cloud5-keyframes 40s linear infinite;
    z-index: 4;
}

@-webkit-keyframes cloud1-keyframes {
    0%   {-webkit-transform: translate(-100px,35px);}
    100% {-webkit-transform: translate(1500px,35px);}
}
@keyframes cloud1-keyframes {
    0%   {transform: translate(-100px,35px);}
    100% {transform: translate(1500px,35px);}
}

@-webkit-keyframes cloud2-keyframes {
    0%   {-webkit-transform: translate(-1000px,10px);}
    100% {-webkit-transform: translate(1500px,10px);}
}
@keyframes cloud2-keyframes {
    0%   {transform: translate(-1000px,10px);}
    100% {transform: translate(1500px,10px);}
}

@-webkit-keyframes cloud3-keyframes {
    0%   {-webkit-transform: translate(-200px,20px);}
    100% {-webkit-transform: translate(1500px,20px);}
}
@keyframes cloud3-keyframes {
    0%   {transform: translate(-200px,20px);}
    100% {transform: translate(1500px,20px);}
}

@-webkit-keyframes cloud4-keyframes {
    0%   {-webkit-transform: translate(-800px,0px);}
    100% {-webkit-transform: translate(1600px,0px);}
}
@keyframes cloud4-keyframes {
    0%   {transform: translate(-800px,0px);}
    100% {transform: translate(1600px,0px);}
}
@-webkit-keyframes cloud5-keyframes {
    0%   {-webkit-transform: translate(-500px,220px);}
    100% {-webkit-transform: translate(1500px,220px);}
}
@keyframes cloud5-keyframes {
    0%   {transform: translate(-500px,220px);}
    100% {transform: translate(1500px,220px);}
}

@media (max-width: 810px) {
    .ClassyCountdown{width: 90%;}
}