/* CSS DOCUMENT */ 
@font-face {font-family: 'nexab';src:  url('../fonts/NexaBold.otf');}
@font-face {font-family: 'nexal';src:  url('../fonts/NexaLight.otf');}

/************** Start Global rules **************/
body{height: 100%;color: #383e52;;font-family: nexab;font-weight:400;text-rendering: optimizelegibility-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;background: #d92849}
*,
*:after,
*:before {-webkit-box-sizing: border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;box-sizing: border-box;}
::-webkit-input-placeholder {color: #4d4d4d;}
:-moz-placeholder {color: #fff;}
::-moz-placeholder {color: #fff;}
:-ms-input-placeholder {color: #fff;}
ul{padding: 0;margin: 0;list-style: none;}
a {text-decoration: none;color: rgba(255,255,255,.7);outline: none;cursor: pointer;}
.clearfix:after{visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
/************** End Global rules **************/
/************** Start Navbar Here **************/
.loader {
  width: 120px;
  height: 120px;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  stroke-linecap: round;
  stroke-width: 4;
  fill: none;
}
.loader .internal-circle,
.loader .external-circle {
  stroke: #fff;
  stroke-dashoffset: 0;
  -webkit-transform-origin: center;
          transform-origin: center;
}
.loader .internal-circle {
  stroke-dasharray: 187;
  -webkit-animation: internal 1s ease-in-out infinite;
          animation: internal 1s ease-in-out infinite;
  opacity: .4;
}
.loader .external-circle {
  stroke-dasharray: 312;
  -webkit-animation: external 1s linear infinite;
          animation: external 1s linear infinite;
  opacity: .9;
}

@-webkit-keyframes internal {
  0% {
    stroke-dashoffset: 187;
  }
  25% {
    stroke-dashoffset: 80;
  }
  100% {
    stroke-dashoffset: 187;
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes internal {
  0% {
    stroke-dashoffset: 187;
  }
  25% {
    stroke-dashoffset: 80;
  }
  100% {
    stroke-dashoffset: 187;
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes external {
  0% {
    stroke-dashoffset: 312;
    -webkit-transform: rotate(70deg);
            transform: rotate(70deg);
  }
  60% {
    stroke-dashoffset: -312;
  }
  100% {
    stroke-dashoffset: -312;
    -webkit-transform: rotate(450deg);
            transform: rotate(450deg);
  }
}
@keyframes external {
  0% {
    stroke-dashoffset: 312;
    -webkit-transform: rotate(70deg);
            transform: rotate(70deg);
  }
  60% {
    stroke-dashoffset: -312;
  }
  100% {
    stroke-dashoffset: -312;
    -webkit-transform: rotate(450deg);
            transform: rotate(450deg);
  }
}
.no-js #loader {display: none;}
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	background: #252525
}
.introo{
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}
.particle{
  position: absolute;
  left: -17%;
  top: 0;
  visibility: hidden;
  -moz-animation: scriple 1s ease 10s forwards;
  -webkit-animation: scriple 1s ease 10s forwards;
  -o-animation: scriple 1s ease 10s forwards;
  animation: scriple 1s ease 10s forwards;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
@keyframes scriple {
    to {visibility: visible;}
}
@-webkit-keyframes scriple {
    to {visibility: visible;}
}
.move {
  -moz-animation: mymove 1s ease 4s forwards;
  -webkit-animation: mymove 1s ease 4s forwards;
  -o-animation: mymove 1s ease 4s forwards;
  animation: mymove 1s ease 4s forwards;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
@keyframes mymove {
    to {
        left: 70%
    }
}
@-webkit-keyframes mymove {
    to {
        left: 70%
    }
}
.content{
  position: fixed;
  top: 49%;
  left: 30%;
  transform: translate(-50%, -50%);
  width: 25%;
}
.logo{

}
.logo img{width: 350px}/*
.logo img:first-child{display: none}*/
.text{margin: 0 0 0 35px;}
.text h2{text-align: left;font-size: 30px;text-transform: uppercase;margin: 0;color: #fff}
.text h2.soon{letter-spacing: 5px;font-size: 20px;margin-top: 10px;}
.one {-webkit-animation: dotOne 2s infinite;}
@-webkit-keyframes dotOne {
    0%, 24% {opacity: 0;}
    25% {opacity: 1;}
    100% {opacity: 1;}
}
.text span{font-size: 18px;}
.text .big{font-size: 23px;text-transform: uppercase}
ul.countdown {
  list-style: none;
  margin: 10% 0;
  padding: 0;
  display: block;
  color: #fff
}
ul.countdown li {
  display: inline-block;
  text-align: center;
}
ul.countdown li span {
  font-size: 50px;
  font-weight: 300;
  line-height: 40px;
}
ul.countdown li.seperator {
  font-size: 60px;
  line-height: 30px;
  vertical-align: top;
}
ul.countdown li p {
  font-size: 14px;
  text-transform: uppercase;
}
.footer  {text-align: left;color: #3C2415;}
.social{margin-top: 50px;}
.social h2 {text-transform: uppercase;font-size: 20px;}
.social a {display: inline-block;margin-right: 20px}
.social a:hover{color: #fff;}
.up{
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUp {
    from {opacity: 0;-webkit-transform: translate3d(0, 2000px, 0);transform: translate3d(0, 2000px, 0);}
    to {opacity: 1;-webkit-transform: none;transform: none;}
  }

@keyframes fadeInUp {
  from {opacity: 0;-webkit-transform: translate3d(0, 2000px, 0);transform: translate3d(0, 2000px, 0);}
  to {opacity: 1;-webkit-transform: none;transform: none;}
}
h2:first-child.up{
  -webkit-animation-delay: 6s;
  animation-delay: 6s;
}
h2:nth-child(2).up{
  -webkit-animation-delay: 6.5s;
  animation-delay: 6.5s;
}
ul.countdown{
  -webkit-animation-delay: 7s;
  animation-delay: 7s;
}
.social h2.up{
  -webkit-animation-delay: 7.5s;
  animation-delay: 7.5s;
}
.social hr {
  margin-bottom: 20px;
  margin-left: 0;
  width: 0;
  visibility: hidden;
  -moz-animation: tall 1s ease 8s forwards;
  -webkit-animation: tall 1s ease 8s forwards;
  -o-animation: tall 1s ease 8s forwards;
  animation: tall 1s ease 8s forwards;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
@keyframes tall {
    to {width: 150px;visibility: visible;}
}
@-webkit-keyframes tall {
    to {width: 150px;visibility: visible;}
}
.social a.up:nth-of-type(1){
  -webkit-animation-delay: 8.2s;
  animation-delay: 8.2s;
}
.social a.up:nth-of-type(2){
  -webkit-animation-delay: 8.3s;
  animation-delay: 8.3s;
}
.social a.up:nth-of-type(3){
  -webkit-animation-delay: 8.4s;
  animation-delay: 8.4s;
}
.social a.up:nth-of-type(4){
  -webkit-animation-delay: 8.5s;
  animation-delay: 8.5s;
}
.social a.up:nth-of-type(5){
  -webkit-animation-delay: 8.6s;
  animation-delay: 8.6s;
}
.social a.up:nth-of-type(6){
  -webkit-animation-delay: 8.7s;
  animation-delay: 8.7s;
}
footer {padding: 30px;text-align: center;color: #3C2415;position: absolute;bottom: 0;display: block;right: 0 ;font-size: 14px}
@media all and (max-width: 2250px){
  .content{width: 30%;}
}
@media all and (max-width: 1865px){
  .content{width: 41%;}
}
@media all and (max-width:1350px){
  .content{width: 50%;}
  .logo img{width: 250px}
  .text{margin: 0 0 0 30px}
  .text h2{font-size: 25px;}
  .text h2.soon{font-size: 15px}
  ul.countdown li span{font-size: 40px;line-height: 40px;}
  ul.countdown li p{font-size: 10px;}
  ul.countdown li.seperator{font-size: 40px;line-height: 30px}
  .social h2{font-size: 18px !important}
  .art{width: 700px;}
  .particle{width: 935px;}
}
@media all and (max-width:1050px){

}
@media all and (max-width:920px){
  .logo img{width: 200px}
  .text h2{font-size: 20px;}
  .text h2.soon{font-size: 10px;margin-top: 5px;}
  ul.countdown li span{font-size: 30px;line-height: 30px;}
  ul.countdown li p{font-size: 9px;}
  ul.countdown li.seperator{font-size: 20px;line-height: 10px}
  .social h2{font-size: 15px !important}
  .art{width: 600px;}
  .particle{width: 788px;}
}
@media all and (max-width:760px){
  .content{width: 60%;}
  .art,.particle{display: none;}
  .logo img:first-child{display: block;}
  .logo img:nth-child(2){display: none}
  h2:first-child.up{
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
  }
  h2:nth-child(2).up{
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s;
  }
  ul.countdown{
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
  }
  .social h2.up{
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s;
  }
  .social hr {
    margin-bottom: 20px;
    margin-left: 0;
    width: 0;
    visibility: hidden;
    -moz-animation: tall 1s ease 3s forwards;
    -webkit-animation: tall 1s ease 3s forwards;
    -o-animation: tall 1s ease 3s forwards;
    animation: tall 1s ease 3s forwards;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
  }
  .social a.up:nth-of-type(1){
    -webkit-animation-delay: 3.2s;
    animation-delay: 3.2s;
  }
  .social a.up:nth-of-type(2){
    -webkit-animation-delay: 3.3s;
    animation-delay: 3.3s;
  }
  .social a.up:nth-of-type(3){
    -webkit-animation-delay: 3.4s;
    animation-delay: 3.4s;
  }
  .social a.up:nth-of-type(4){
    -webkit-animation-delay: 3.5s;
    animation-delay: 3.5s;
  }
  .social a.up:nth-of-type(5){
    -webkit-animation-delay: 3.6s;
    animation-delay: 3.6s;
  }
  .social a.up:nth-of-type(6){
    -webkit-animation-delay: 3.7s;
    animation-delay: 3.7s;
  }

}
@media all and (max-height: 1050px){

}
@media all and (max-height: 900px){

}
@media all and (max-height: 786px){

}






