/* #### Generated By: http://www.cufonfonts.com #### */

@font-face {
font-family: 'Morganite Book';
font-style: normal;
font-weight: normal;
src: local('Morganite Book'), url('Morganite-Book.woff') format('woff');
}


@font-face {
font-family: 'Morganite Book Italic';
font-style: normal;
font-weight: normal;
src: local('Morganite Book Italic'), url('Morganite-BookItalic.woff') format('woff');
}


@font-face {
font-family: 'Morganite Thin';
font-style: normal;
font-weight: normal;
src: local('Morganite Thin'), url('Morganite-Thin.woff') format('woff');
}


@font-face {
font-family: 'Morganite Thin Italic';
font-style: normal;
font-weight: normal;
src: local('Morganite Thin Italic'), url('Morganite-ThinItalic.woff') format('woff');
}


@font-face {
font-family: 'Morganite ExtraLight';
font-style: normal;
font-weight: normal;
src: local('Morganite ExtraLight'), url('Morganite-ExtraLight.woff') format('woff');
}


@font-face {
font-family: 'Morganite ExtraLight Italic';
font-style: normal;
font-weight: normal;
src: local('Morganite ExtraLight Italic'), url('Morganite-ExtraLightItalic.woff') format('woff');
}


@font-face {
font-family: 'Morganite Light';
font-style: normal;
font-weight: normal;
src: local('Morganite Light'), url('Morganite-Light.woff') format('woff');
}


@font-face {
font-family: 'Morganite Light Italic';
font-style: normal;
font-weight: normal;
src: local('Morganite Light Italic'), url('Morganite-LightItalic.woff') format('woff');
}


@font-face {
font-family: 'Morganite Medium';
font-style: normal;
font-weight: normal;
src: local('Morganite Medium'), url('Morganite-Medium.woff') format('woff');
}


@font-face {
font-family: 'Morganite Medium Italic';
font-style: normal;
font-weight: normal;
src: local('Morganite Medium Italic'), url('Morganite-MediumItalic.woff') format('woff');
}


@font-face {
font-family: 'Morganite SemiBold';
font-style: normal;
font-weight: normal;
src: local('Morganite SemiBold'), url('Morganite-SemiBold.woff') format('woff');
}


@font-face {
font-family: 'Morganite SemiBold Italic';
font-style: normal;
font-weight: normal;
src: local('Morganite SemiBold Italic'), url('Morganite-SemiBoldItalic.woff') format('woff');
}


@font-face {
font-family: 'Morganite Bold';
font-style: normal;
font-weight: normal;
src: local('Morganite Bold'), url('Morganite-Bold.woff') format('woff');
}


@font-face {
font-family: 'Morganite Bold Italic';
font-style: normal;
font-weight: normal;
src: local('Morganite Bold Italic'), url('Morganite-BoldItalic.woff') format('woff');
}


@font-face {
font-family: 'Morganite ExtraBold';
font-style: normal;
font-weight: normal;
src: local('Morganite ExtraBold'), url('Morganite-ExtraBold.woff') format('woff');
}


@font-face {
font-family: 'Morganite ExtraBold Italic';
font-style: normal;
font-weight: normal;
src: local('Morganite ExtraBold Italic'), url('Morganite-ExtraBoldItalic.woff') format('woff');
}


@font-face {
font-family: 'Morganite Black';
font-style: normal;
font-weight: normal;
src: local('Morganite Black'), url('Morganite-Black.woff') format('woff');
}


@font-face {
font-family: 'Morganite Black Italic';
font-style: normal;
font-weight: normal;
src: local('Morganite Black Italic'), url('Morganite-BlackItalic.woff') format('woff');
}

body {
  	background-color: #040608; 
  	margin:0;
  	padding:0;
  	overflow-x:hidden;
}

a {
     text-decoration: none;
     color:inherit;
}



.darkMaskHero{
width:100%;
height:1440px;
position:fixed;
z-index:6;
top:-1440px;
object-fit: contain;
background-blend-mode: multiply;
background-image: linear-gradient(to bottom, rgba(26, 26, 26, 0.7), rgba(26, 26, 26, 0.7));
}

.bios{  

  }
  

  .bio{
  display: inline-block;
   vertical-align: middle; 


	margin-top:4rem;
	padding-right:10rem;
  }
  
  .bioPic{
   display: inline-block;
   vertical-align: middle; 


  
  }

.outer{
top:0%;
left:0%;
height:100%;
width:100%;
overflow: hidden;
}
#video{width: 100%;}
#videoBlock {width: 100%; height: 100%;  display: flex;  justify-content: center; align-items: center;position:relative;}
#video{display:block;}

#container{

 overflow: hidden;
}

.Bitmap{
  width: 1440px;
  height: 613px;
  object-fit: contain;
  position:relative;
  }
.uvod{
width: 1440px;
}

.We-are-producing-fea a :hover{
color:#BC3518;

}

.We-are-producing-fea a:active{
color:#BC3518;

}
.aboutFilm{
padding-top:19px;
margin-left:89px;
position:relative;
display:inline-block;
}
#playButton{
position:absolute;
text-align: center;
left: 50%;
  top: 50%;
  cursor:pointer;
  z-index:9;
   -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.Stroke-3 {
  width: 39.7px;
  height: 39.7px;
  object-fit: contain;
  left: 50%;
  top: 50%;
  position:absolute;
    z-index:5;
    margin-left:-19.85px;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  
}

.Stroke-1 {
  width: 99.6px;
  height: 99.6px;
  object-fit: contain;
  left: 50%;
  top: 50%;
  position:absolute;
  z-index:5;
  margin-left:-49.8px;
}


.Sit-amet-nisl-purus {
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  text-align: center;
  color: #eaeaea;
  position: absolute;
}

.FEATURE-FILM-DRAMA {
	margin-left:89px;
  width: 359px;
  height: 60px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 26px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.15;
  letter-spacing: 0.06px;
  color: #eaeaea;
}

.aboutFilm div{
display:inline-block;
}


.FILM-TITILE{
padding-top:75px;
margin-left:89px;
  width: 527px;
  height: 120px;
  position:relative;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 120px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: 0.21px;
  color: #eaeaea;
}

.Festivals-Cannes-Fil {
 float:right; 
  width: 260px;
  height: 545px;
  object-fit: contain;
  font-family: Karla;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  color: #ffffff;
}

ul{list-style:none;}
li{opacity:0;right:100%;position:relative;
}

.menu{
position:fixed;
z-index:100;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 100px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 1px;
  color: #eaeaea;
  right:10%;
  top:-1440px;
}  
.workTitle{
	 width: 139px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  position:absolute;
  font-size: 120px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 0.21px;
  color: #eaeaea;
  display:inline;
  padding-left:21.5%;
  padding-top:5%;	
}


.Project-Details-Dura {
 float:left; 
	margin-right:49px;
  width: 206px;
  height: 457px;
  object-fit: contain;
  font-family: Karla;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  color: #ffffff;
  
}
.work{
height:385px;

}



.PLAN-9-Logo.animate {
    transform: scale(2) translateY(40%) translateX(30%);
    transition: transform .5s ease;
}   
.text{
  width: 287px;
  height: 100px;
  object-fit: contain;
  font-family: Karla;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  color: #ffffff;

}

.Plan-9-MASKA-Copy {
z-index:33;
}
.minusButton{
   position: absolute;
   margin-top:54%;
  right:8%;
   cursor: pointer;
   z-index: 100;
}

.minusButtonMobile{
   position: absolute;
    margin-top:153%;
    right:10%;
   cursor: pointer;
   z-index: 100;
}
.minusButtonAll{
 position: fixed;
   top:12%;
   right:8%;
   cursor: pointer;
   z-index: 100;
   background-color: black;
}   
.Minus-Icon{
   position:absolute;
   object-fit: contain;
    width: 33px;
  height: 2px;
   background-color: black;
}

.Minus-IconALL{
   position:absolute;
   object-fit: contain;
    width: 33px;
  height: 2px;
   background-color: #edefef;
}


.Minus-Icon2ALL{
 width: 2px;
  height: 33px;
 top:-15.5px;
 left:15.5px;
  background-color: #edefef;
  position:relative;
  object-fit: contain;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease; 
}
.Minus-Icon2{
 width: 2px;
  height: 33px;
 top:-15.5px;
 left:15.5px;
  background-color: black;
  position:relative;
  object-fit: contain;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease; 
}

.active > .Minus-Icon2 {
    transform: rotate(90deg);
    }
    
.WHO-ARE-WE {
  width: 395px;
  padding-top:10%;
  padding-left:6.2%;
  font-family: 'Morganite ExtraBold';
  font-size: 120px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.39px;
  color: #eaeaea;
  position:relative;
  
}    
    


.PAVLE-VUCKOVIC-Lorem {
  object-fit: contain;
  font-family: Karla;
  color: #eaeaea;
  position:relative;

}  


.aboutUs{
width:90%;
position:relative;
 padding-left:6.2%;
 padding-bottom:5%;
}
.aboutUs div{
 display:inline-block;
}
.aboutUsParts{
	width:45%;
  display:inline-block;
}
.prodPic{
 width: 550px;
  height: 488px;
  object-fit: contain;
 


}

.Plan-9-is-a-producti {
  width: 416px;
  height: 161px;
  font-family: 'Morganite ExtraBold';
  font-size: 36px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.11;
  letter-spacing: 0.39px;
    color: #eaeaea;
} 
.PAVLE-VUCKOVIC-Lorem {
  width: 442px;

  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  

}

.PAVLE-VUCKOVIC-TITLE {
	color: #ffffff;
  font-family: 'Morganite ExtraBold';
  font-size: 36px;
  font-weight: 500;
  line-height: 0.67;
  letter-spacing: 0.14px;
}

.ourServices{
width:88.4%;
}

.OUR-SEVICES {
  width: 440px;
  height: 144px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 120px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.29px;
  color: #eaeaea;
  padding-left:6.2%;
  padding-bottom:5%;

  
}

.services{
  padding-left:6.2%;
  display:inline-block;

}

.FILM-PRODUCTION {
  width: 130px;
  height: 98px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 53px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.92;
  letter-spacing: 0.13px;
  color: #eaeaea;
}

.We-are-producing-fea {
  width: 200px;
  height: 164px;
  object-fit: contain;
  font-family: Karla;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.38;
  letter-spacing: 0.04px;
  color: #eaeaea;
}

.footer{

	position:relative;
}



.Synopsis-Jovan-start {
 float:left; 
	margin-right:98px;
  width: 299px;
  height: 430px;
  object-fit: contain;
  font-family: Karla;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  color: #ffffff;
}
.Plan-9-MASKA {
  width: 100%;
  position:absolute;
  object-fit: contain;
  z-index:2;
  left: 0;
}
 
.Down-ArrowTop {
  	width: 32px;
  	height: 40px;
  	object-fit: contain;
  	position:absolute;
    z-index:3;
    float:left;
    left:7%;
}
    
.PRODUCTION-COMPANY {
  object-fit: contain;
  font-family: 'Morganite Light';
  color: #1a1a1a;
  z-index:3;
  left:50%;
  margin-left:-97px;
  position:absolute;
}

.FOLOW-US-INSTAGRAM-F {
  width: 100%;
  height: 49px;
  object-fit: contain;
  position:relative;
  font-family: 'Morganite ExtraBold';
  font-size: 53px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: 0.92;
  letter-spacing: 0.33px;
  color: #eaeaea;
  z-index:33;
  padding-top:10%;
   left:6.4%;
}
.FOLOW-US-INSTAGRAM-F p
{
  display : inline; 
  margin-right: 5%;
}
.outerSmall{
position:relative;
overflow: hidden;
height:300px;
width:100%;
}

.outerSmallIpad{
position:relative;
overflow: hidden;
width:100%;
}


.IN-PRODUCTION {
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  
  color: #eaeaea;
  position: absolute;
  left:6.2%;
  z-index:3;
}


.FEATURE-FILM {
 	object-fit: contain;
  	font-family: 'Morganite ExtraBold';
 	z-index:3;
  	color: #eaeaea;
	position: absolute;
	left:6.2%;
}
.FROST {
  z-index:3;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  color: #eaeaea;
  position: absolute;
  left:6.2%;
}

.Lorem-ipsum-dolor-si {
  object-fit: contain;
  font-family: Karla;
  color: #ffffff;
  position: absolute;
  left:6.2%;
  z-index:3;
}

.Rectangle {
  object-fit: contain;
  background-color: #eaeaea;
  position: absolute;
  left:6.2%;
  z-index:3;
}

.FIND-OUT-MORE-Button {
 z-index:3;
   }

.SMALL {
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  color: #eaeaea;
  position:absolute;
  z-index:2;
  	left:6.2%;
  	top:50%;
  	margin: 0;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  	 transition: all 0.4s ease-in-out;
    -webkit-transition: all .8s ease;
    -moz-transition: all .8s ease;
    -ms-transition: all .8s ease;
    -o-transition: all .8s ease;
    transition: all .8s ease; 
    }
  	
.DARK-BOX {
  width: 10%;
  height:300px;
  position:absolute;
  object-fit: contain;
  z-index:4;
}


.GENRE {
   position:absolute;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  color: #eaeaea;
  z-index:33;
   transition: all 0.4s ease-in-out;
    -webkit-transition: all .8s ease;
    -moz-transition: all .8s ease;
    -ms-transition: all .8s ease;
    -o-transition: all .8s ease;
    transition: all .8s ease; 
    top:40%;
     opacity:0; /* Completely visible. */
 
}

.workThumbs {
width:100%;
transition: transform .5s ease;
}

.outerFROST {
  overflow: hidden;
  position:relative;
 
}
.outerFROST:hover > .outerFROSTimg {
  transform: scale(1.11);
   transition: transform .5s ease;
   
   
}
.outerFROSTimg{

transition: transform .5s ease;
}

.outerSmall:hover .workThumbs{
 transform: scale(1.11);
   transition: transform .5s ease;
   opacity:0.6;
}


.outerSmall:hover > .SMALL{
   transform: scale(2) translateY(-40%) translateX(29.5%);
   transition: transform .5s ease;
  
}

.outerSmall:hover > .GENRE{
  transform: translateX(250px);
   transition: transform .5s ease;
        opacity:1; /* Completely visible. */
  
}

.FIND-OUT-MORE-Button-Copy {
  width: 10%;
  height: 30px;
  position: absolute;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 30px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 0.53px;
  color: #eaeaea;
  z-index:33;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all .8s ease;
    -moz-transition: all .8s ease;
    -ms-transition: all .8s ease;
    -o-transition: all .8s ease;
    transition: all .8s ease; 
    left:-15%;
    top:68%;
     border: 1px solid white;
   text-align: center;
   padding-top: 0.5%;
    cursor: pointer;
         opacity:0; /* Completely visible. */
   
}

.button {
   background-color: transparent;
  font-family: 'Morganite ExtraBold';
  color: #eaeaea;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
  position: absolute;
  bottom:20%;
   left:6.2%;
   z-index:3;
}




.FIND-OUT-MORE-Button-Copy:hover {

  background-color:#eaeaea;
  color: #000000;
   }
   
.outerSmall:hover > .FIND-OUT-MORE-Button-Copy{
  transform: translateX(223%);
   transition: transform .5s ease;
        opacity:1; /* Completely visible. */
  
}


.Hero-Video {
  width: 100%;
  object-fit: contain;
}

.Mraz-1 {
  width: 100%;
  object-fit: contain;
}

.RectangleFORST {
  width: 100%;
  object-fit: contain;
}

.rectangleSame {
  width: 88.5%;
  position: relative;
  left:6.2%;
  object-fit: contain;
  padding-bottom:5%;
}

.rectangleBLOCK {
  width: 88.5%;
   position: relative;
    left:6.2%;
    padding-bottom:7.05%;
  object-fit: contain;  
}

.Hero-Video-CopyiPad {
 width: 100%;
  object-fit: contain;
}

.Mraz-1-iPAD { 
 width: 100%;
  object-fit: contain;
}


 .button:hover {

  background-color:#eaeaea;
  color: #000000;
   }
   
 .LETS-WORK-TOGETHER {
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  color: #eaeaea;
  position: relative;
  left:6.2%;
}
.Ready-to-start-your {
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  color: #eaeaea;
  position: relative;
  left:6.2%;
} 
.officeplan9rs {
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  color: #eaeaea;
  position: relative;
  left:6.2%;
}
.FOLOW-US-INSTAGRAM-F {
  object-fit: contain;
  position:relative;
  font-family: 'Morganite ExtraBold';
  color: #eaeaea;
  left:6.4%;
}
.FOLOW-US-INSTAGRAM-F p
{
  display : inline; 
  margin-right: 5%;
}
.Copy-right-PLAN9-201 {
  font-family: 'Karla', sans-serif;
  color: #eaeaea;
  padding-left:6.2%;
  padding-right:6.2%;
  padding-bottom:2%;
} 

@media (min-width: 1921px) and (max-width:2880px) {
#workWrapMobile {display:none}
#workWrapIpad {display:none;}
.Mraz-1-iPAD { display:none;}
.Hero-Video-CopyiPad {display:none}
.Rectangle-Copy-10 { display:none;}
.Hero-Video-Copy {display:none}
 .Mraz-1-Copy {display:none} 
 .introMaskMobile {display:none;}
.minusButtonMobile { display:none;}


.PLAN-9-Logo {
  width: 200px;
  float:left;
  object-fit: contain;
   position: absolute;
   left:6.2%;
   top:100px;
}


.PRODUCTION-COMPANY {
   width: 494px;
   font-size: 78px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.04px;
     margin-top: 53.5%;

}
.Down-ArrowTop{
margin-top:53.5%;
 position:absolute;
 	width: 52px;
  	height: 60px;

} 

.menu{
  font-size: 220px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 1px;
  right:10%;
  top:-1400px;
}  
.darkMaskHero{
height:1800px;
top:-1800px;
}


#minusButtonId{

top:190px;
 right: 10%; 
 
}    
.Minus-Icon {
  width: 70px;
  height: 6px;
  object-fit: contain;
  position: absolute;
  
}

.Minus-Icon2{
 width: 6px;
  height: 70px;
 top:-33.5px;
 left:33.5px;
background-color: #edefef;
  position:relative;
  object-fit: contain;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease; 
}

.Rectangle-Copy {
  width: 2px;
  height: 33px;
  transform: rotate(-270deg);
  background-color: #edefef;
  position: absolute;
   top:85px;
   right:104px;
}


.Sit-amet-nisl-purus {
 width: 736px;
  height: 186px;
  font-size: 75px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 0.96;
  letter-spacing: 0.35px;
 	left:37%;
    top: 85%;
}
.Down-Arrow {
  width: 42px;
  height: 28px;
  object-fit: contain;
  position: absolute;
  left:49%;
  top:95%;
}



.IN-PRODUCTION {
 width: 334px;
  height: 61px;
  font-size: 55px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.4px;
   padding-top:87px;
}

.FEATURE-FILM {
  width: 334px;
  font-size: 100px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.05px;
  padding-top:400px;
}

.FROST {
  width: 295px;
  font-size: 480px;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.07px;
   top:200px;
}



.Rectangle {
  width: 208px;
  height: 16px;
  margin-top:40%;
}


.Lorem-ipsum-dolor-si {
  width: 455px;
  font-size: 30px;
  font-weight: 300;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.33;
  letter-spacing: 0.07px;
  margin-top:43%;
}

 .GENRE {
  width:15%;
  height: 60px;
  font-size: 55px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 0.53px;
  left:-30px;
  top:49%;
}

.FIND-OUT-MORE-Button {
  width: 320px;
  height: 80px;
   border: 2px solid white;
  font-family: 'Morganite ExtraBold';
  font-size: 70px;
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.2px;
  color: #eaeaea;
  object-fit: contain;
   position: absolute;
  bottom:5%;
   left:6.2%;
   text-align: center;
   padding-top: 22px;
   }
  .WHO-ARE-WE{
  font-size: 220px;
  width:600px;

} 



.Plan-9-is-a-producti{
  font-size: 60px;
    width:850px;

}

.PAVLE-VUCKOVIC-TITLE{
  font-size: 60px;
  padding-top:20%;

}

.PAVLE-VUCKOVIC-Lorem{
 font-size: 30px;
  width:650px;
}
 .prodPic{
 width: 1050px;
margin: 200px;
 
  position: relative;

  display:inline-block;
}

.ourServices{
padding-bottom:2%;

}
  .OUR-SEVICES{
  font-size: 220px;
  width:600px;
    padding-top:5%;

} 

.FILM-PRODUCTION{
  font-size: 100px;
 width:500px;
}
.We-are-producing-fea{
font-size: 30px;
 width:500px;
}
 .SMALL{
  width: 504px;
  height: 70px;
  object-fit: contain;
  font-size: 85px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.78;
  letter-spacing: 0.38px;

 }     
.outerSmall{
height:500px;

}

 .button {
  width: 12%;
   border: 2px solid #eaeaea;
  font-size: 50px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 0.53px;
  padding: 15px 32px;
  bottom:5%;
}
.LETS-WORK-TOGETHER {
   width: 1944px;
  object-fit: contain;
  font-size: 220px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.49px;
 

}
.Ready-to-start-your {
  width: 500px;
  object-fit: contain;
  font-size: 30px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.04px;
  color: #eaeaea;
} 

.officeplan9rs {
  width: 193px;
  height: 49px;
  font-size: 100px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: 0.92;
  letter-spacing: 0.13px;
   padding-bottom:8%;
}
.FOLOW-US-INSTAGRAM-F{
  font-size: 100px;

}

 .Copy-right-PLAN9-201 {
 padding-bottom:6%;
 font-size: 26px;
 float:right;
} 


}
@media (min-width: 1441px) and (max-width:1920px) {
.Mraz-1-iPAD { display:none;}
#workWrapMobile {display:none}
#workWrapIpad {display:none;}
.Hero-Video-CopyiPad {display:none}
.minusButtonMobile { display:none;}
.introMaskMobile {display:none;}
.Hero-Video-CopyiPad {display:none}
.Rectangle-Copy-10 { display:none;}
.Hero-Video-Copy {display:none;}
 .Mraz-1-Copy {display:none;} 
 
.PLAN-9-Logo {
  width: 82px;
  height: 33px;
  float:left;
  object-fit: contain;
   position: absolute;
   top:70px;
   left:89px;
}
.Plan-9-MASKA {
  top:-120px;
}
.minusButton{
  
   margin-top:46%;
  right:8%;
}    
.PRODUCTION-COMPANY {
   width: 194px;
   font-size: 45px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.04px;
     margin-top: 45%;

}
.Down-ArrowTop{
margin-top:45%;
 position:absolute;

} 

.bio{ padding-right: 25rem;

}   
.Rectangle-Copy {
  width: 2px;
  height: 33px;
  transform: rotate(-270deg);
  background-color: #edefef;
  position: absolute;
   top:85px;
   right:104px;
}


.Sit-amet-nisl-purus {
 width: 336px;
  height: 86px;
  font-size: 45px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 0.96;
  letter-spacing: 0.35px;
 	left:50%;
    bottom:5%;
    margin-left:-168px;
}

.Down-Arrow {
  width: 32px;
  height: 18px;
  object-fit: contain;
  position: absolute;
  left:49%;
  top:95%;
}

.IN-PRODUCTION {
 width: 234px;
  height: 61px;
  font-size: 50px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.4px;
   top:60px;
}

.FEATURE-FILM {
  width: 334px;
  height: 72px;
  font-size: 60px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.05px;
  padding-top:15%;
	 }

.FROST {
  width: 295px;
  height: 220px;
  font-size: 220px;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.07px;
   padding-top:10%;
}


.FROSTmain {
  width: 295px;
  height: 220px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 220px;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.07px;
  color: #eaeaea;
  position: absolute;
   padding-top:34px;
   left:6.2%;
}

.A-rational-police-de {
  width: 556px;
  height: 220px;
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  font-size: 18px;
  font-weight: 300;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.33;
  letter-spacing: 0.07px;
  color: #ffffff;
    position: relative;
  padding-top:289px;
   left:6.2%;
}

.SINOPSIS {
  width: 94px;
  height: 72px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 60px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.05px;
  color: #eaeaea;
   position: relative;
 	top:277px;
   left:6.2%;
}



.ABOUT-THE-PROJECT {
  width: 250px;
  height: 60px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 60px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.05px;
  color: #eaeaea;
  position: relative;
 	top:65px;
   left:6.2%;
}

.Frost-is-a-modern-fa {
  width: 720px;
  height: 585px;
  object-fit: contain;
  font-family: Karla;
  font-size: 18px;
  font-weight: 300;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.33;
  letter-spacing: 0.07px;
  color: #ffffff;
  position: relative;
 	top:86px;
   left:6.2%;
}
.Rectangle {
  width: 108px;
  height: 8px;
  margin-top:35%;
}


.Lorem-ipsum-dolor-si {
  width: 305px;
  height: 100px;
  font-size: 18px;
  font-weight: 300;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.33;
  letter-spacing: 0.07px;
  margin-top:38%;
}
 
 
 .button {
  width: 190px;
   border: 1px solid #eaeaea;
  font-size: 36px;
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.5px;
  padding: 15px 32px;
  bottom:8%;
}
 
 
 .SMALL{
  width: 304px;
  height: 70px;
  object-fit: contain;
  font-size: 45px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.78;
  letter-spacing: 0.38px;
 }  
 
 
 .GENRE {
  width:110px;
  height: 60px;
  font-size: 30px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 0.53px;
  left:-135px;

}

.outerSmall:hover > .GENRE{
  transform: translateX(280px);
   opacity:1; /* Completely visible. */
   transition:1s; 
   transition: transform .5s ease;
  
}


.LETS-WORK-TOGETHER {
   width: 744px;
  height: 144px;
  font-size: 120px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.49px;
}
.Ready-to-start-your {
  width: 320px;
  height: 91px;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.04px;
} 

.officeplan9rs {
  width: 193px;
  height: 49px;
  font-size: 53px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: 0.92;
  letter-spacing: 0.13px;
}
.Copy-right-PLAN9-201{

padding-top:289px;
}

}

@media (min-width: 1024px) and (max-width:1440px) {
#workWrap {display:none;}
#workWrapMobile {display:none;}
.Mraz-1-iPAD { display:none;}
.Hero-Video-CopyiPad {display:none}
.Hero-Video-CopyiPad {display:none}
.Rectangle-Copy-10 { display:none;}
.Hero-Video-Copy {display:none}
 .Mraz-1-Copy {display:none} 
 .introMaskMobile {display:none;}
 .minusButtonMobile { display:none;}
 
/* 
  WORK  PAGE
*/
 
 .outerSmallIpad:hover .workThumbs{
 transform: scale(1.11);
   transition: transform .5s ease;
   opacity:0.6;
}
.outerSmallIpad:hover > .SMALL{
   transform: scale(1.8) translateY(-90%) translateX(26%);
   transition: transform .5s ease;
  
}

.outerSmallIpad:hover > .GENRE{
  transform: translateX(230px);
   transition: transform .5s ease;
    opacity:1; /* Completely visible. */
  
}

.outerSmallIpad:hover > .FIND-OUT-MORE-Button-Copy{
  transform: translateX(223%);
   transition: transform .5s ease;
  opacity:1;
}
 
 .GENRE {
  width:100px;
  height: 60px;
  font-size: 28px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 0.53px;
  left:-135px;

 
}

 .minusButton{
  
   margin-top:52%;
  right:8%;
}
 .PRODUCTION-COMPANY {
   width: 194px;
   font-size: 45px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.04px;
     margin-top: 50%;

}
.Down-ArrowTop{
margin-top:50%;
 position:absolute;

}
 
 .Sit-amet-nisl-purus {
   width: 234px;
  height: 56px;
  font-size: 30px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.08;
  letter-spacing: 0.2px;
  text-align: center;
  top:82%;
  position: absolute;
}
.Down-Arrow {
  width: 28px;
  height: 18px;
  object-fit: contain;
  position: absolute;
  left:50%;
  margin-left:-14px;
  bottom:4%;
 
}

.SMALL{
  width: 298px;
  height: 35px;
  object-fit: contain;
  font-size: 45px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.78;
  letter-spacing: 0.08px;
}

  

.LETS-WORK-TOGETHER {
   width: 740px;
  height: 144px;
  font-size: 120px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.29px;
}

.Ready-to-start-your {
  width: 320px;
  height: 91px;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.04px;
} 

.officeplan9rs {
  width: 193px;
  height: 49px;
  font-size: 53px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: 0.92;
  letter-spacing: 0.13px;
}

 

/* 
  PRIVREMENA MAIN PAGE
*/


.Hero-Video {
  width: 100%;
    object-fit: contain;
}

.PLAN-9-Logo {
  width: 82px;
  height: 33px;
  float:left;
  object-fit: contain;
   position: absolute;
   top:70px;
   left:89px;
}

.Minus-Icon {
  width: 33px;
  height: 2px;
  object-fit: contain;
  position: absolute;
   
}

.Rectangle-Copy {
  width: 2px;
  height: 33px;
  transform: rotate(-270deg);
  background-color: #edefef;
}



.IN-PRODUCTION {
  width: 167px;
  height: 32px;
  font-size: 26px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.02px;
  padding-top:20px;
}

.FEATURE-FILM {
  width: 181px;
  height: 43px;
  font-size: 36px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.03px;
	padding-top:160px;
}

.FROST {
   width: 194px;
  height: 192px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 160px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.05px;
   padding-top:10%;
}

.Rectangle {
  width: 90px;
  height: 4px;
  bottom:38%;
 

}


.Lorem-ipsum-dolor-si {
   width: 247px;
  height: 100px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
   bottom:15%;

}

 .button {
  width: 120px;
   border: 1px solid #eaeaea;
   font-size: 26px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.5px;
  padding: 8px 12px;
  bottom:8%;
}
 
 .prodPic{
 width:520px;
 }

}
@media (min-width: 768px) and (max-width: 1023px) {
.Mraz-1-Copy {display:none}  
.Hero-Video {display:none}  
.Mraz-1 {display:none} 
.Hero-Video-Copy {display:none} 
.Rectangle-Copy-10 { display:none;} 
.introMaskMobile{display:none;}
#workWrapMobile{display:none;}
.minusButtonMobile { display:none;}
#workWrap{display:none;}
.GENRE {

  left:-235px;

 
}
  
.Plan-9-MASKA {

}
.PLAN-9-Logo {
  width: 72px;
  height: 33px;
  float:left;
  object-fit: contain;
   position: absolute;
   top:70px;
   left:79px;
}

.Minus-Icon {
  width: 33px;
  height: 2px;
  object-fit: contain;
  position: absolute;
   
}

.PRODUCTION-COMPANY {
   width: 194px;
   font-size: 45px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.04px;
     margin-top: 50%;

}
.Down-ArrowTop{
margin-top:50%;
 position:absolute;

}
.Rectangle-Copy {
  width: 2px;
  height: 33px;
  transform: rotate(-270deg);
  background-color: #edefef;
  position: absolute;
   top:85px;
   right:104px;
}


.Sit-amet-nisl-purus {
   width: 234px;
  height: 56px;
  font-size: 30px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.08;
  letter-spacing: 0.2px;
  text-align: center;
  top:80%;
}
.Down-Arrow {
  width: 28px;
  height: 18px;
  object-fit: contain;
  position: absolute;
  left:50%;
  margin-left:-14px;
  bottom:5%;
}

.IN-PRODUCTION {
  width: 167px;
  height: 32px;
  font-size: 26px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.02px;
  padding-top:20px;
}

.FEATURE-FILM {
  width: 181px;
  height: 43px;
  font-size: 36px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.03px;
	padding-top:120px;
}

.FROST {
   width: 194px;
  height: 192px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 160px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.05px;
   top:10%;
}

.Rectangle {
  width: 90px;
  height: 6px;
 bottom:42%;

}


.Lorem-ipsum-dolor-si {
   width: 247px;
  height: 100px;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  bottom:20%;

}
   
    .button {
  width: 160px;
   border: 1px solid #eaeaea;
   font-size: 26px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.5px;
  padding: 8px 12px;
  bottom:10%;
}


.SMALL{
  width: 298px;
  height: 35px;
  object-fit: contain;
  font-size: 35px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.78;
  letter-spacing: 0.08px;
}

 .GENRE {
  width:300px;
  height: 50px;
  font-size: 26px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 0.53px;
  left:-135px;

 
}

.FIND-OUT-MORE-Button-Copy {
  width: 10%;
  height: 20px;
  font-size: 25px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1;
  letter-spacing: 0.53px;
  color: #eaeaea;
  z-index:3;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all .8s ease;
    -moz-transition: all .8s ease;
    -ms-transition: all .8s ease;
    -o-transition: all .8s ease;
    transition: all .8s ease; 
    left:-50px;
    top:60%;
     border: 1px solid white;
   text-align: center;
  padding: 8px 12px;
    cursor: pointer;
   
   
}

.outerSmallIpad:hover > .SMALL{
   transform: scale(1.8) translateY(-18px) translateX(75px);
   transition: transform .5s ease;
  
}

.outerSmallIpad:hover > .GENRE{
  transform: translateX(200px);
   transition: transform .5s ease;
    opacity:1; /* Completely visible. */
  
}

.outerSmallIpad:hover > .FIND-OUT-MORE-Button-Copy{
  transform: translateX(115px);
   transition: transform .5s ease;
  opacity:1;
}

 .outerSmallIpad:hover .workThumbs{
 transform: scale(1.11);
   transition: transform .5s ease;
   opacity:0.6;
}

.LETS-WORK-TOGETHER {
  width: 550px;
  height: 120px;
  font-size: 100px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.24px;
}
.Ready-to-start-your {
   width: 320px;
  height: 91px;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.04px;
} 

.officeplan9rs {
 width: 164px;
  height: 49px;
  font-size: 45px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.09;
  letter-spacing: 0.11px;
}


/* 
  IPAD FORST PAGE
*/

.Rectangle-Copy-10 {
  width: 1024px;
  height: 768px;
}

.FROSTmain {
   width: 194px;
  height: 192px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 160px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.05px;
  color: #eaeaea;
  position: absolute;
   padding-top:34px;
   left:6.2%;
}

.SINOPSIS {
 width: 56px;
  height: 43px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 36px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.03px;
  color: #eaeaea;
   position: relative;
 	top:230px;
   left:6.2%;
}


.A-rational-police-de {
  width: 525px;
  height: 198px;
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  color: #ffffff;
    position: relative;
  padding-top:253px;
   left:6.2%;
}



.ABOUT-THE-PROJECT {
    width: 123px;
  height: 43px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 36px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.03px;
  color: #eaeaea;

  position: relative;
 	top:54px;
   left:6.2%;
}

.Frost-is-a-modern-fa {
  width: 640px;
  height: 585px;
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  color: #ffffff;

  position: relative;
 	top:43px;
   left:6.2%;
}
 
  
 .DIRECTORS-BIO {
   width: 94px;
  height: 43px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 36px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.03px;
  color: #eaeaea;
  position: relative;
 	top:61px;
   left:6.2%;
} 

.Pavle-vukovi-is-bo {
  width: 695px;
  height: 424px;
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  color: #ffffff;
  position: relative;
   left:6.2%;
   top:86px;
   
}
.DIRECTORS-STATMENT {
 width: 231px;
  height: 43px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 36px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.03px;
  color: #eaeaea;

  position: relative;
   left:6.2%;
   top:59px;
}

.This-subject-and-ide {
 width: 688px;
  height: 624px;
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  color: #ffffff;

  position: relative;
   left:6.2%;
   padding-top:103px;
}

.Frost-Myth {
 width: 595px;
  height: 344px;
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  color: #ffffff;
  position: relative;
   left:6.2%;
   padding-top:64px;

}
 
 .prodPic{
 width:450px;
 }
 
 .bio{
	padding-right:5rem;
 }
 
 .PAVLE-VUCKOVIC-Lorem{
  width:400px;

 }
 
}

@media (min-width: 681px) and (max-width: 767px) {
  .introMaskMobile{ display:none;} 
 #workWrapIpad{display:none;} 
  #workWrap{display:none;} 
.Mraz-1-Copy {display:none}  
.Hero-Video {display:none}  
.Mraz-1 {display:none} 
.Hero-Video-Copy {display:none} 
.Rectangle-Copy-10 { display:none;} 
.Rectangle{ display:none;} 
.PLAN-9-Logo {
 width: 62px;
  height: 33px;
  float:left;
  object-fit: contain;
   position: absolute;
   top:70px;
   left:6.2%;
}

.PRODUCTION-COMPANY {
   width: 194px;
   font-size: 35px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.04px;
     margin-top: 52%;
     left:50%;
     margin-left:-97px;
    

}
.Down-ArrowTop{
margin-top:50%;
 position:absolute;
 	width: 24px;


}

.Minus-Icon {
  width: 24px;
  height: 2px;
  object-fit: contain;
  position: absolute;
  
}

.Minus-Icon2{
 width: 2px;
  height: 24px;
 top:-11.5px;
 left:11.5px;

  position:relative;
  object-fit: contain;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease; 
}

.Rectangle-Copy {
  width: 2px;
  height: 33px;
  transform: rotate(-270deg);
  background-color: #edefef;
  position: absolute;
   top:85px;
   right:104px;
}


.Sit-amet-nisl-purus {
   width: 194px;
  height: 56px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 26px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.08;
  letter-spacing: 0.2px;
  text-align: center;
  color: #eaeaea;
  position: absolute;
 	left:50%;
 	margin-left:-97px;
    top: 80%;
}
.Down-Arrow {
  width: 24px;
  height: 18px;
  object-fit: contain;
  position: absolute;
  left:50%;
  top:92%;
  margin-left:-12px;
}

.IN-PRODUCTION {
   width: 167px;
  height: 32px;
  font-size: 26px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.02px;
  padding-top:40px;
}

.FEATURE-FILM {
  width: 181px;
  height: 43px;
  font-size: 36px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.03px;
  top:25%;
}

.FROST {
   width: 194px;
  height: 192px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 140px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.05px;
   top:15%;
}

.Rectangle {
 width: 90px;
  height: 4px;
  object-fit: contain;
  background-color: #eaeaea;
  position: absolute;
 bottom:35%;
   left:6.2%;
}


.Lorem-ipsum-dolor-si {
  width: 247px;
  height: 100px;
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  font-size: 13px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.06px;
  color: #ffffff;

  position: absolute;
   bottom:15%;
   left:6.2%;
}

   
      .button {
  width: 140px;
   border: 1px solid #eaeaea;
   font-size: 24px;
  font-weight: 400;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.5px;
  padding: 8px 12px;
  bottom:10%;
}
.SMALL{
  width: 298px;
  height: 35px;
  object-fit: contain;
  font-size: 45px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.78;
  letter-spacing: 0.08px;
}

.LETS-WORK-TOGETHER {
  width: 550px;
  height: 120px;
  font-size: 100px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.24px;
}
.Ready-to-start-your {
   width: 320px;
  height: 91px;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.38;
  letter-spacing: 0.04px;
} 

.officeplan9rs {
 width: 164px;
  height: 49px;
  font-size: 45px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.09;
  letter-spacing: 0.11px;
}




/* 
  IPAD FORST PAGE
*/


    .videopopupjs__content{
        max-width:90%!important;
    }


}

@media (min-width: 320px) and (max-width: 680px) {
.Mraz-1-iPAD { display:none;}
.minusButton { display:none;}
.Hero-Video {display:none}  
.Hero-Video-CopyiPad {display:none}
.Mraz-1 {display:none} 
#workWrap {display:none} 
.Rectangle {display:none}
 .FIND-OUT-MORE-Button-Copy {display:none}
 .GENRE {display:none}
  #workWrapIpad{display:none;} 
.Mraz-1-Copy {
   width: 100%;
  object-fit: contain;
}
.outerSmall{
height:144px;
}
.prodPic{
  position: relative;
 
 padding-top:2rem;
  width: 310px;
  height: 203px;
}



.PLAN-9-Logo.animate {
    transform: scale(1.4) translateY(40%) translateX(30%);
    transition: transform .5s ease;
    z-index:22;
} 

.textWork{
 width: 150px;
  height: 60px;
  object-fit: contain;
  font-family: Karla;
  position:relative;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.22;
  letter-spacing: 0.04px;
  color: #ffffff;
  left:34%;
}

.Minus-Icon {
  width: 23px;
  height: 2px;
  object-fit: contain;
  position: absolute;
}

.Minus-Icon2{
 width: 2px;
  height: 23px;
 top:-10.5px;
 left:10.5px;
  background-color: black;
  position:relative;
  object-fit: contain;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease; 
} 
.SMALL {
  width: 241px;
  height: 35px;
  object-fit: contain;
  font-size: 32px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.09;
  letter-spacing: 0.06px;
}
   

.OUR-SEVICES {
  width: 200px;
  height: 61px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 50px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.12px;
  color: #eaeaea;
 
}




.Copy-right-PLAN9-201{
   width: 320px;
  height: 22px;
  object-fit: contain;
  font-family: Karla;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: 0.02px;
  color: #eaeaea;
  padding-bottom:45px;
  margin:0px;
  position:relative;

}
.Hero-Video-Copy {
  width: 100%;
  object-fit: contain;
}
.PLAN-9-Logo {
   width: 57px;
  height: 23px;
  object-fit: contain;
  position: absolute;
   top:44px;
   left:6%;
}





.Down-Arrow{
 width: 22px;
  height: 12px;
  object-fit: contain;
   position: absolute;
  left:50%;
  margin-left:-11px;
  top:92%;
 }
 

.IN-PRODUCTION {
 width: 147px;
  height: 22px;
  font-size: 20px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.02px;
   padding-top:7.2%;
}




.Lorem-ipsum-dolor-si {
  width: 115px;
  height: 100px;
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  font-size: 12px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.22;
  letter-spacing: 0.04px;
  color: #ffffff;

  position: absolute;
  margin-top:67%;
   left:6.2%;
}


 
 
 .LETS-WORK-TOGETHER {
  width: 325px;
  height: 61px;
  font-size: 50px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.12px;  
}
.Ready-to-start-your {
    width: 191px;
  height: 49px;
  font-size: 14px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.22;
  letter-spacing: 0.02px;
} 

.officeplan9rs {
   width: 95px;
  height: 49px;
  font-size: 26px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.88;
  letter-spacing: 0.06px;
  margin-top: 5rem;
}
.bio{

margin-right:0px;
margin-top: 0rem;
}

.bios{
margin-right: 0px;
margin-bottom: 5rem;
}


/* 
  FROST PAGE Mobile
*/
.Mraz-1-iPAD { display:none;}
.RectangleFORST{display:none;}
.Rectangle-Copy-10 {
  width: 100%;
  object-fit: contain;
}

.FROSTmain {
 width: 61px;
  height: 61px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 50px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.02px;
  color: #eaeaea;
  position: absolute;
  padding-top:34px;
  left:6.2%;
}

.SINOPSIS {
 width: 28px;
  height: 22px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 20px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.02px;
  color: #eaeaea;
   position: relative;
 	top:95px;
   left:6.2%;
}

.A-rational-police-de {
  width: 269px;
  height: 107px;
  object-fit: contain;
  font-family: Calibre;
  font-size: 20px;
  font-weight: 300;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.2;
  letter-spacing: 0.04px;
  color: #ffffff;
    position: relative;
  padding-top:115px;
   left:6.2%;
}

.ABOUT-THE-PROJECT {
   width: 62px;
  height: 22px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 20px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.02px;
  color: #eaeaea;
  position: relative;
 	top:20px;
   left:6.2%;
}

.Frost-is-a-modern-fa {
   width: 285px;
  height: 300px;
  object-fit: contain;
  font-family: Calibre;
  font-size: 20px;
  font-weight: 300;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.2;
  letter-spacing: 0.04px;
  color: #ffffff;
  position: relative;
 	top:20px;
   left:6.2%;
}

.DIRECTORS-BIO {
  width: 47px;
  height: 22px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 20px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.02px;
  color: #eaeaea;
   position: relative;
 	top:20px;
   left:6.2%;
}


 
.Pavle-vukovi-is-bo {
  width: 266px;
  height: 195px;
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  font-size: 20px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.22;
  letter-spacing: 0.04px;
  color: #ffffff;

  position: relative;
   left:6.2%;
   padding-top:3%;
   
}
.DIRECTORS-STATMENT {
 width: 190px;
  height: 22px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 20px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.02px;
  color: #eaeaea;

  position: relative;
   left:6.2%;
   top:20px;
}



.Frost-Myth {
 width: 271px;
  height: 179px;
  object-fit: contain;
  font-family: 'Karla', sans-serif;
  font-size: 10px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.22;
  letter-spacing: 0.04px;
  color: #ffffff;
  position: relative;
   left:6.2%;
   padding-top:3%;

}

.FOLOW-US-INSTAGRAM-F {
 width: 265px;
  height: 49px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 26px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.88;
  letter-spacing: 0.06px;
  color: #eaeaea;
	position: relative;
	
  z-index:33;
   
  
   
}
.FOLOW-US-INSTAGRAM-F p
{
  display : inline; 
  margin-right: 5%;
}

.services{
  padding-left:6.2%;
  display:inline-block;

}
.FILM-PRODUCTION {
   width: 100px;
  height: 40px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 28px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.11;
  letter-spacing: 1px;
  color: #eaeaea;

}

.We-are-producing-fea {
  width: 300px;
  height: 104px;
  object-fit: contain;
  font-family: Karla;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.22;
  letter-spacing: 0.02px;
  color: #eaeaea;

}



/*
    MOBILE: Main Page------------------------------------------------------------------------------------
*/

.introMask { display:none;}
.Plan-9-MASKA-Copy{
 width: 100%;
 z-index:100;
}
.introMaskMobile{
 width: 100%;
  position:absolute;
  object-fit: contain;
  z-index:33;
  left: 0;
}
.Down-ArrowTop{
width: 20px;
  height: 25px;
  object-fit: contain;
  margin-top:150%;

}



.PRODUCTION-COMPANY {
    width: 135px;
  height: 42px;
 font-weight: 500;
 font-size: 35px;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.03px;
  text-align: center;
    top: 79%;
    margin-left:-67.5px;

}
.menu{
position:fixed;
z-index:100;
  width: 68px;
  height: 50px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 55px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.91;
  letter-spacing: 1px;
  color: #eaeaea;
  left:6%;
  padding-top:40%;
}



.Sit-amet-nisl-purus {
 width: 136px;
  height: 40px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 18px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.11;
  letter-spacing: 0.14px;
  text-align: center;
  color: #eaeaea;
  position: absolute;
 	left:50%;
 	margin-left:-68px;
    top: 75%;
}

.FROST {
  width: 61px;
  height: 61px;
  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 50px;
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.02px;
  color: #eaeaea;
  position: absolute;
   padding-top:35%;
   left:6.2%;
}

.FEATURE-FILM {
   width: 49px;
  height: 18px;
  font-size: 18px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.02px;
  padding-top:30%;
}

    
    .button {
  width: 80px;
   border: 1px solid #eaeaea;
  font-size: 18px;
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0.01px;
  padding: 8px 12px;
  bottom:10%;
}
 
 .WHO-ARE-WE {
  width: 224px;
  height: 61px;
 
  font-size: 50px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.12px;

  padding-top:5rem;

}

.PAVLE-VUCKOVIC-TITLE{

  object-fit: contain;
  font-family: 'Morganite ExtraBold';
  font-size: 28px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: 1px;
  color: #ffffff;
  position:relative; 

}

.PAVLE-VUCKOVIC-Lorem {
  width: 300px;
  
  font-size: 15px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.22;
  letter-spacing: 0.02px;
  
  position:relative;

}

.Plan-9-is-a-producti {
  width: 250px;
  height: 93px;
  font-family: 'Morganite ExtraBold';
  font-size: 20px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.11;
  letter-spacing: 1px;
  color: #eaeaea;
  position:relative;  
}


}






/*
    GitHub URL: https://github.com/gucastiliao/video-popup-js
*/

.videopopupjs{
    background-color:#000;
    background-color:rgba(0,0,0,0.6);
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    left:0;
    z-index:99999;
    text-align: start!important;
}
.videopopupjs--hide{
    -webkit-animation-duration: 0.2s;
    animation-duration: 0.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: videoPopupJsHide;
    animation-name: videoPopupJsHide;
}
.videopopupjs__close{
    width:30px;
    height:30px;
    cursor:pointer;
    display:block;
    margin-bottom:10px;
    color:rgba(255, 255, 255, 0.59);
}
.videopopupjs__close:after{
    width:30px;
    height:30px;
    display:block;
    text-align:center;
    content:'X';
    font-family:'Verdana';
    border-radius:50%;
    background:#333;
    line-height:2.2;
    font-size:13px;
}
.videopopupjs__close:hover{
    opacity:0.5;
}
.videopopupjs--animation{
    opacity: 0;
    -webkit-animation-duration: 0.2s;
    animation-duration: 0.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: videoPopupJs;
    animation-name: videoPopupJs;
}
.videopopupjs__content{
    margin:0 auto;
    height:100%;
    height:500px;
    width:100%;
    margin-top:5%;
}
.videopopupjs__content iframe{
    width:100%;
    height:100%;
}
.videopopupjs__block--notfound{
    position:absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    width:100%;
    height:500px;
    background-color:#fff;
    text-align:center;
    vertical-align: middle;
    line-height: 500px;
    font-family:'Arial';
    font-size:20px;
}

@-webkit-keyframes videoPopupJs{
    0%{
        opacity: 0;
    }

    100%{
        opacity: 1;
    }
}

@keyframes videoPopupJs{
    0%{
        opacity: 0;
    }

    100%{
        opacity: 1;
    }
}

@-webkit-keyframes videoPopupJsHide{
    0%{
        opacity: 1;
    }

    100%{
        opacity: 0;
    }
}

@keyframes videoPopupJsHide{
    0%{
        opacity: 1;
    }

    100%{
        opacity: 0;
    }
}



}