@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css);

* {
  /*box-sizing: border-box;*/
	 font-family: Arial;
	color: white;
}

html,
body {
  margin: 0;
  padding: 0;
  color: #fff;
  background: #333;
  overflow: hidden;
}

.landing-inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  text-align: center;
  margin: 0;
  padding: 0;
}

.landing {
  position: relative;
  background-size: cover;
  background-position: center;
  height: 100vh;
}
.img{
  background-size: cover;
  background-position: center;
  height: 100vh;
}

.landing h1 {
	margin-top: 45px;
	font-size: 50px;

}

.landing p {
	font-size: 20px;
	margin-top: -35px;

}

.social-share-icons{
	margin-top: 10px;
	height: 30px;
	width: 500px;
	margin-right: auto;
	margin-left: auto;
}

#social-share-icon-fb {
  height: 100%;
  width:80px;
  display: inline-block;
}
#social-share-icon-twitter {
  height: 100%;
  width:80px;
  display: inline-block;
}
#social-share-icon-googleplus {
  height: 100%;
  width:80px;
  display: inline-block;
}
#social-share-icon-pinterest {
  height: 100%;
  width:80px;
  display: inline-block;
}
.twitter-widget{
	background-color: red;
	margin-top: 5px;
	margin-right: auto;
	margin-left: auto;
	background: transparent;
}

.social-bottom-icons{
	position: absolute;
  bottom: 38px;
	width: 500px;
	margin-left: auto;
	margin-right: auto;
	height: 45px;
	left: 50%;
  transform: translateX(-50%);
  color: white;
}

a {
    text-decoration: none;
    color: #fff;
}
p > a:hover{
    color: #d9d9d9;
    text-decoration:  underline;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin:  1% 0 1% 0;
}
._12 {
    font-size: 1.2em;
}
._14 {
    font-size: 1.4em;
}
ul {
    padding:0;
    list-style: none;
}
.footer-social-icons {
    width: 350px;
    display:block;
    margin: 0 auto;
}
.social-icon {
    color: #fff;
}
ul.social-icons {
    margin-top: 10px;
}
.social-icons li {
    vertical-align: top;
    display: inline;
    height: 100px;
}
.social-icons a {
    color: #fff;
    text-decoration: none;
}
.fa-facebook {
    padding:14px 18px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
      opacity: 0.8;
}
.fa-facebook:hover {
    background-color: #3d5b99;
}
.fa-twitter {
    padding:14px 18px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
      opacity: 0.8;
}
.fa-twitter:hover {
    background-color: #00aced;
}
.fa-rss {
    padding:14px 18px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
      opacity: 0.8;
}
.fa-rss:hover {
    background-color: #eb8231;
}
.fa-youtube {
    padding:14px 18px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
      opacity: 0.8;
}
.fa-youtube:hover {
    background-color: #cc181e;
}
.fa-linkedin {
    padding:14px 18px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
      opacity: 0.8;
}
.fa-linkedin:hover {
    background-color: #0073a4;
}
.fa-google-plus {
    padding:14px 18px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
      opacity: 0.8;
}
.fa-google-plus:hover {
    background-color:  #d34836;
}
.fa-github {
    padding:14px 18px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
      opacity: 0.8;
}
.fa-github:hover {
    background-color:  #4078c0;
}
.fa-flickr {
    padding:14px 18px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
      opacity: 0.8;
}
.fa-flickr:hover {
    background-color:  #ff0084;
}
.fa-pinterest {
    padding:14px 18px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
    opacity: 0.8;
}
.fa-pinterest:hover {
    background-color:  #c8232c;
}


.allow-pages{
	position: absolute;
  bottom: 5px;
	left: 50%;
  transform: translateX(-50%);
	width: 500px;
	height: 20px;
}

.allow-pages a:hover{
  text-decoration: none;
  cursor: pointer;
  color: #17a2b8;
}

.allow-pages a:visited{
  color: white;
}

/*
  ***************************************************
	********** subscription area styles ***************
  ***************************************************
*/
.subscription-area-register {
	height: 50px;
	width: 20%;
	margin-right: auto;
	margin-left: auto;

}

.subscription-area-subscribe {
	height: 45px;
	width: 745px;
	margin-right: auto;
	margin-left: auto;
  background-color: transparent;
  margin-top: 7px;
  border-radius: 7px 7px 7px 7px;
}

#email-textbox-div {
  float: left;
  height: 100%;
  width: 500px;
  display: block;
}

#subscribe-button-div {
  float: left;
  height: 100%;
  width: 200px;
  display: block;
}

#email-textbox{
	width: 100%;
  height: 100%;
  margin-top:0px;
  font-size: 15px;
  border-radius: 7px 0px 0px 7px;
}
#subscribe-button{
	width: 100%;
  height: 100%;
  border: none;
  background: #17a2b8;
  color: white;
  font-size: 5px;
  border-radius: 0px 7px 7px 0px;
}
#register-button{
	width: 100%;
	height: 100%;
  border: none;
	background: #17a2b8;
	color: white;
	cursor: pointer;
	font-size: 18px;
  margin-top: 15px;
  border-radius: none;
  display: block;
}

/*
  ***************************************
	********** timer styles ***************
  ***************************************
*/
.countdown {
  font-size: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin-top: 30px;
}
.countdown div {
  padding: 20px;
  border: 1px #fff solid;
  border-radius: 10px;
  background: #000;
  opacity: 0.7;
  margin: 5px;
}
.countdown div:first-child {
  background: #17a2b8;
}
.countdown span {
  display: block;
  font-size: 25px;
}

/*
  ***************************************
	********** Responsive styles **********
  ***************************************
*/

@media (min-width: 1501px) {
	.twitter-widget{
		display:block;
		width: 30%;
		height: 30%;
	}
	.twitter-widget iframe {
		display:inline-block;
		width: 100% !important;
		height:100% !important;
	}
  .countdown div {
    border: 1.3px #fff solid;
    border-radius: 13px;
    background: #000;
    opacity: 0.7;
    margin: 7px;
  }
  .landing h1 {
    font-size: 70px;
    margin-top: 80px;
  }
  .landing p {
    font-size: 22px;
    margin-top: -35px;
    font-style: normal;
    font-weight: normal;
  }
  .subscription-area-register {
    width: 280px;
    height: 60px;
    margin-right: auto;
    margin-left: auto;
  }

  #register-button{
    font-size: 23px;
    font-style: normal;
    font-weight: normal;
  }
}
/*
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/
@media (min-width: 1281px) and (max-width: 1500px) {
	.twitter-widget{
		display:block;
		width: 30%;
		height: 20%;
	}
	.twitter-widget iframe {
		display:inline-block;
		width: 100% !important;
		height:100% !important;
	}
  .landing h1 {
    font-size: 60px;
  }

  .landing p {
    font-size: 20px;
    margin-top: -35px;
    font-style: normal;
    font-weight: normal;
  }

  .subscription-area-register {
    width: 250px;
    margin-right: auto;
    margin-left: auto;

  }

  #register-button{
    font-size: 20px;
    font-style: normal;
    font-weight: normal;

  }
}

/*
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/
@media (min-width: 1025px) and (max-width: 1280px) {
	.twitter-widget{
		display:none;
	}
	.twitter-widget iframe {
		display:none !important;
	}
	.landing h1 {
    font-size: 60px;
  }

  .landing p {
    font-size: 20px;
    margin-top: -25px;
    font-style: normal;
    font-weight: normal;
  }

  .subscription-area-register {
    width: 250px;
    margin-right: auto;
    margin-left: auto;

  }

  #register-button{
    font-size: 20px;
    font-style: normal;
    font-weight: normal;
  }
}

/*
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/
@media (min-width: 768px) and (max-width: 1024px) {
	.twitter-widget{
		display:none;
	}
	.twitter-widget iframe {
		display:none !important;
	}
	.landing h1 {
    font-size: 50px;
  }

  .landing p {
    font-size: 20px;
    margin-top: -25px;
    font-style: normal;
    font-weight: normal;
  }

  .subscription-area-register {
  	width: 220px;
  	margin-right: auto;
  	margin-left: auto;

  }

  #register-button{
  	font-size: 20px;
    font-style: normal;
    font-weight: normal;
  }

  .subscription-area-subscribe {
  	height: 45px;
  	width: 600px;
  	margin-right: auto;
  	margin-left: auto;
    background-color: red;
    margin-top: 7px;
    border-radius: 5px 5px 5px 5px;
  }

  #email-textbox-div {
    float: left;
    height: 100%;
    width: 450px;
    display: block;
  }

  #subscribe-button-div {
    float: right;
    height: 100%;
    width: 150px;
    display: block;
  }

  #email-textbox{
  	width: 100%;
    height: 100%;
    margin-top:0px;
    font-size: 15px;
    border-radius: 5px 0px 0px 5px;
  }
  #subscribe-button{
  	width: 100%;
    height: 100%;
    border: none;
    background: #17a2b8;
    color: white;
    border-radius: 0px 5px 5px 0px;
  }
}

/*
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/
@media (min-width: 481px) and (max-width: 767px) {
	.twitter-widget{
		display:none;
	}
	.twitter-widget iframe {
		display:none !important;
	}
  .countdown {
    font-size: 30px;
    flex-direction: column;
  }

  .countdown div {
    display: none;
  }

  .countdown div:first-child {
    display: block;
    width: 80%;
    padding: 10px;
  }

  .landing h1 {
    font-size: 40px;
  }

  .landing p {
    font-size: 18px;
    margin-top: -10px;
    font-style: normal;
    font-weight: normal;
  }

  .subscription-area-register {
  	width: 180px;
  	margin-right: auto;
  	margin-left: auto;

  }

  #register-button{
  	font-size: 18px;
    font-style: normal;
    font-weight: normal;
  }
  .subscription-area-subscribe {
  	height: 100px;
  	width: 80%;
  	margin-right: auto;
  	margin-left: auto;
    margin-top: 7px;
    border-radius: 5px 5px 5px 5px;
    background-color: transparent;
  }

  #email-textbox-div {
    height: 45px;
    width: 100%;
    margin-bottom: 10px;
  }

  #subscribe-button-div {
    height: 45px;
    width: 200px;
    margin-right: auto;
    margin-left: auto;
    float: none;
  }

  #email-textbox{
  	width: 100%;
    height: 100%;
    margin-top:0px;
    font-size: 15px;
    border-radius: 5px 5px 5px 5px;
  }
  #subscribe-button{
  	width: 100%;
    height: 100%;
    border: none;
    background: #17a2b8;
    color: white;
    border-radius: 5px 5px 5px 5px;
    margin-right: auto;
    margin-left: auto;
  }

}

/*
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/
@media (min-width: 320px) and (max-width: 480px) {
	.social-bottom-icons{
		display:none;
	}
	.twitter-widget{
		display:none;
	}
	.twitter-widget iframe {
		display:none !important;
	}
  .countdown {
    font-size: 30px;
    flex-direction: column;
  }

  .countdown div {
    display: none;
  }

  .countdown div:first-child {
    display: block;
    width: 80%;
    padding: 10px;
  }

  .landing h1 {
    font-size: 35px;
  }

  .landing p {
    font-size: 15px;
    margin-top: -10px;
  }

  .subscription-area-register {
  	width: 150px;
  	margin-right: auto;
  	margin-left: auto;
  }

  #register-button{
  	font-size: 15px;
    font-style: normal;
    font-weight: normal;
  }

  .subscription-area-subscribe {
  	height: 100px;
  	width: 80%;
  	margin-right: auto;
  	margin-left: auto;
    margin-top: 7px;
    border-radius: 5px 5px 5px 5px;
    background-color: transparent;
  }

  #email-textbox-div {
    height: 45px;
    width: 100%;
    margin-bottom: 10px;
  }

  #subscribe-button-div {
    height: 45px;
    width: 200px;
    margin-right: auto;
    margin-left: auto;
    float: none;
  }

  #email-textbox{
  	width: 100%;
    height: 100%;
    margin-top:0px;
    font-size: 15px;
    border-radius: 5px 5px 5px 5px;
  }
  #subscribe-button{
  	width: 100%;
    height: 100%;
    border: none;
    background: #17a2b8;
    color: white;
    border-radius: 5px 5px 5px 5px;
    margin-right: auto;
    margin-left: auto;
  }

}

@media (max-height: 600px) {
  img {
    width: 20%;
  }
}

@media (max-height: 400px) {
   img {
    padding-bottom: 30px;
  }
}


/*
  **********************************
	********** Modal styles **********
  **********************************
*/

/* Full-width input fields */
input[type=text], input[type=password],input[type=email],input[type=number] {
    width: 100%;
    padding: 0px 15px;
    margin: 5px 0 22px 0;
    display: inline-block;
    border: none;
    background: #f1f1f1;
	  color: black;
}

/* Add a background color when the inputs get focus */
input[type=text]:focus, input[type=password]:focus,input[type=email]:focus,input[type=number]:focus {
    background-color: #ddd;
    outline: none;
}

/* Set a style for all buttons */


.signupbtn:hover {
    opacity:1;
}

/* Extra styles for the cancel button */
.cancelbtn {
    padding: 14px 20px;
    background-color: #f44336;
}

.signupbtn{
  background-color: #4CAF50;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 100%;
  opacity: 0.9;
}
/* Float cancel and signup buttons and add an equal width */
.cancelbtn, .signupbtn {
  float: left;
  width: 50%;
}

/* Add padding to container elements */
.container {
    padding: 16px;
}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgba(0, 0, 0, 0.4);
    padding-top: 50px;
	color: black;
}

/* Modal Content/Box */
.modal-c {
    background-color: #fefefe;
    margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
}

/* Style the horizontal ruler */
hr {
    border: 1px solid #f1f1f1;
    margin-bottom: 25px;
}

/* The Close Button (x) */
.close {
    position: absolute;
    right: 35px;
    top: 15px;
    font-size: 40px;
    font-weight: bold;
    color: #f1f1f1;
}

.close:hover,
.close:focus {
    color: #17a2b8;
    cursor: pointer;
}

/* Clear floats */
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}

/* Change styles for cancel button and signup button on extra small screens */
@media screen and (max-width: 480px) {
    .cancelbtn, .signupbtn {
       width: 100%;
    }
}