

/*added by virag */

.p_justify
{
	text-align:justify !important;
}

.copyright

{

	font-size:12px;

}

.align_left

{

	text-align:left;

}







.background {

  

  width: 100%;

  height: 500px;

  background-image: url(../images/video-bg.jpg);

  background-size: cover;

  background-position: center;

  text-rendering: optimizeLegibility;

}

.background:after {

  content: '';

 

  top: 10px;

  right: 10px;

  bottom: 10px;

  left: 10px;

  border: 1px solid rgba(255,255,255,.2);

}

.wrapper {

  display: none;

}





/* 1. Intro Keyframe

--------------------------------------- */

#intro {

  position: fixed;

  top: 20%;

  left: 10%;

  width: 80%;

  color: #fff;

  text-align: center;

  text-transform: uppercase;

}

.name {

  font-size: 35px;

  letter-spacing: 12px;

  line-height: 1.5;

  font-weight: 900;

}

.byline { 

  font-size: 15px;

  letter-spacing: 4px;

  text-align: center;

  font-weight: 300;

}

.ampersand {

  font-family: "Adobe Caslon Pro", "brandon-grotesque";

  font-style: italic;

}



/* 2. Explosion/Images/Links Structure and Text

--------------------------------------- */

#explosion,

#images {

  position: fixed;

  top: 100%;

  width: 100%;

  height: 100%;

}

.explosion-byline,

.images-byline {

  position: fixed;

  top: 63%;

  left: 10%;

  color: white;

  max-width: 22%;

  opacity: 0;

}

.images-byline-2 {

  text-align: center;

  position: fixed;

  top: 93%;

  left: 25%;

  color: white;

  width: 50%;

  opacity: 0;

}



/* 3. Explosion Keyframe

--------------------------------------- */

#domExplosionList {

  position: fixed;

  width: 270px;

  top: 100%;

  right: 15%;

  opacity: 0;

}

.dom-explosion-item {

  position: absolute;

  width: 60px;

  height: 60px;

  background-color: #fff;

}

.dei-1  { top: 0;   left: 0;  }

.dei-2  { top: 0;   left: 70px; }

.dei-3  { top: 0;   left: 140px; }

.dei-4  { top: 0;   left: 210px; }

.dei-5  { top: 70px;   left: 0;  }

.dei-6  { top: 70px;   left: 70px; }

.dei-7  { top: 70px;   left: 140px; }

.dei-8  { top: 70px;   left: 210px; }

.dei-9  { top: 140px;   left: 0;  }

.dei-10 { top: 140px;   left: 70px; }

.dei-11 { top: 140px;   left: 140px; }

.dei-12 { top: 140px;   left: 210px; }

.dei-13 { top: 210px;   left: 0;  }

.dei-14 { top: 210px;   left: 70px; }

.dei-15 { top: 210px;   left: 140px; }

.dei-16 { top: 210px;   left: 210px; }





/* 3. Images Keyframe

--------------------------------------- */

.raw-page {

  position: fixed;

  width: 45%;

  border-radius: 6px;

  box-shadow: inset 0 0 1px rgba(255,255,255,.3);

  border: 1px solid rgba(0,0,0,.2);

  background-clip: padding-box;

}

#mediumHomepage {

  top: 100%;

  right: 5%;

}

.iphone {

  position: fixed;

  right: 40%;

  top: 102%;

  width: 16%;

}

.iphone-frame {

  position: relative;

  width: 100%;

  height: auto;

  background-size: 100%;

  z-index: 2;

}

.iphone-viewport {

  width: 83.5%;

  height: 69.5%;

  position: absolute;

  top: 14%; 

  left: 8%;

  overflow: hidden;

  background-color: #000;

}

.iphone-content {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

}

#medium-profile-iphone {

  z-index: 2;

}



/* 3. Links Keyframe

--------------------------------------- */

#links {

  position: fixed;

  top: 48%;

  left: 10%;

  width: 80%;

  color: #fff;

  text-align: center;

  opacity: 0;

}

.links-byline {

  font-size: 30px;

  line-height: 1.15;

}

.btn {

  display: inline-block;

  padding: 10px 20px;

  border: 1px solid rgba(255,255,255,.5);

  color: rgba(255,255,255,.8);

  font-size: 12px;

  font-weight: 900;

  text-decoration: none;

  border-radius: 50px;

  text-align: center;

  text-transform: uppercase;

  letter-spacing: .1em;

}

.btn:hover,

.btn:focus {

  color: #fff;

  border-color: #fff;

}

.twitter {

  position: fixed;

  top: 20px;

  right: 20px;

}



/* 4. Handling resize and small devices

--------------------------------------- */

.error {

  display: none;

  position: fixed;

  width: 80%;

  font-size: 30px;

  font-weight: 300;

  text-align: center;

  top: 30%;

  left: 10%;

}

.page-error .error {

  display: block;

}

.page-error .container {

  display: none;

}

@media all and (max-width: 1000px) {

/*  .container {

    display: none;

  }*/

  .error {

    display: block;

    font-size: 22px;

  }







@media (max-width: 767px) {



/*added by virag on 20-07-2015 */

.contact-form {

	margin-bottom:50px !important;

}

}













