h1,h2,h3,h4,p,strong,b,ul,li { margin:0px; padding:0px; list-style:none;  }
h1,h2,h3,h4 {     }
a { text-decoration:none; color:#666  }

button, input { outline: none; }
body { margin: 0; padding: 0;    font-size: 16px;  overflow-x:hidden; content: none; font-family: 'Montserrat', sans-serif;   }
input,select,textarea,button {  font-family: 'Montserrat', sans-serif; }



.bold { font-weight: bold;}
.ciz { text-decoration: line-through; }

.innerbox {     -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  box-sizing: border-box; }
.txtcrop { width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.clear:after { display: inline-table; clear: both; content: ''; }
.COMPUTER { }
.MOBILE { display: none; }

@media screen and (max-width: 1000px) {
.COMPUTER { display: none; }
.MOBILE { display: block; }

}


.fullbg { width: 100%;   object-fit: cover; position: relative; z-index: 30}
#clear { clear:both }

 


.YUKLENME { background:#fff; position:fixed; left:0; top:0; width:100%; height:100%; z-index:50000;  }
.YUKLENME img { width:90px; position:absolute; left:50%; top:40%; margin-left:-45px;   -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%); }
.loaderLOGO {  position:absolute; left:50%; top:50%;  width: 400px;  margin-left:-200px; margin-top:-200px; 
  animation: bounce 0.2s;
  animation-direction: alternate;
  animation-timing-function: cubic-bezier(.5,0.05,1,.5);
  animation-iteration-count: infinite;}

.loaderX { position:absolute; left:50%; top:50%;  width: 80px; height: 80px; margin-left:-40px; margin-top:-40px; border: 2px solid #004e9c;  border-top:2px solid #fff; border-radius: 50%; animation: spin 1s linear infinite;
}
.loaderTXT { position: fixed; width: 100%; text-align: center; top: 50%; margin-top: -20px; font-size: 20px }
.loaderTXT i { font-size: 40px; color: #004e9c;}




blockquote {
    background-color: #f2f2f2;
    border-left: 1em solid #000; 
    margin: 1.5em 0 1.5em;
    padding: 1em 1.5em 1em 2.5em;
    position: relative;
}
blockquote:before {
  color: #000;
  content: "\201C";
  font-size: 5em;
  position:absolute;
  left:5px;
  top: 0.6em;
  line-height: 0.1em;
}

blockquote:after {
   color: #000;
  content: "\201D";
  font-size: 5em;
  position:absolute;
  right:3px;
  bottom: 0em;
  line-height: 0.1em;
}


@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

/********************************** MESAJ UYARISI *********************************/ 
.UYARIBOX { position:fixed; width:100%; height:100%; z-index:5000; background:rgba(0,0,0,0.8); left:0; top:0; display:none   }
.UYARIBOX .uyari-a { font-size:18px; color:#fff; text-align:center;  }
.UYARIBOX .uyari-a .uyari-kapat { padding:8px; background:#FFF; color:#000; font-size:30px; display:inline-block; position:absolute; top:50px; right:50px; }
.UYARIBOX .uyari-a .uyari-kapat:hover { background:#000; color:#fff; cursor:pointer; }
.UYARIBOX .uyari-a .mesaj { position:fixed; top:45%; text-align:center; padding:0px 10%; width:80%; }
/********************************** MESAJ UYARISI *********************************/
/********************************** MESAJ UYARISI *********************************/ 
.UYARIBOX-2 { position:fixed; width:100%; height:100%; z-index:5000; background:rgba(0,0,0,0.8); left:0; top:0; display:none   }
.UYARIBOX-2 .uyari-a-2 { font-size:18px; color:#000; text-align:center; padding: 20px; width: 400px;   background: #fff; position: fixed; left: 50%; top: 40%; margin-left: -150px; border-radius: 8px }
.UYARIBOX-2 .uyari-a-2 .uyari-kapat { padding:8px; background:#FFF; color:#000; font-size:24px; display:inline-block; position:absolute; top:10px; right:10px; border-radius: 6px; }
.UYARIBOX-2 .uyari-a-2 .uyari-kapat:hover { background:#000; color:#fff; cursor:pointer; }
.UYARIBOX-2 .uyari-a-2 .mesaj-2 { padding: 30px 0px   }
/********************************** MESAJ UYARISI *********************************/



 

@media screen and (max-width: 1000px) {
 .UYARIBOX-2 .uyari-a-2 {   width: calc(90% - 40px); left: 5%; margin-left: 0;   }
 .UYARIBOX .uyari-a {   width: calc(90% - 40px); left: 5%; margin-left: 0;   }
}



.IN:after { clear: both;  content: ""; display: table; }


.clear:after { clear: both;  content: ""; display: table; }



.INCONTENT { background: #fff; position: relative; z-index: 2;   }

.in-co-1 {    
	
 
transform: scale(0.90) translate(-80%, 0px);

	/**transform: perspective(400px) rotateY(45deg);**/

}

 
 

.MENU-W { position: fixed; z-index: 2000; right:20px; top: 20px;  color: #000;   width: 50px; background: #fff; font-size: 28px; text-align: center;  }
.MENU-W i { line-height: 50px; }
.MENU-W:hover { cursor: pointer; color: #fff; background: #000  }



.ANIMOBIL { position: fixed; width: calc(100% - 0px); height:calc(100% - 0px); transition: 0.5s; background:#fff; z-index: 90; left: -100%; top:0px;  }
.ANIMOBIL ul {  padding: 0px; width: 300px; margin: 0 auto; }
.ANIMOBIL ul li { color: #000; font-size: 36px; padding: 9px 0px; font-weight: 100;  }
.mn-on { left:0px;  }
.ANIMOBIL img { position: absolute; left: 0; top: 0; height: 100%;}

 
 

.FBG { position: relative; z-index: 10;  }
.HM-2 { position: fixed; left: 0; top: 0; z-index: 50; width: 100%; }
.HM-2 .LOGO {  width: 300px; float: left; padding-left: 30px;  }
.HM-2 .LOGO img { width: 100%;}
.HM-2 .SOSYALMEDYA-GLOBAL {float: right; width: auto; padding-right:30px; padding-top: 15px; }



.AL-home { }

.AL-home .sol { position:fixed; z-index: 1;   top: 30%;  width: 60%; text-align: center; }
.AL-home .sol .LOGO { max-width: 700px; margin: 0 auto; }
.AL-home .sol .LOGO img { width: 100%;}

.AGRA { width: 100%; height: 150px; background: rgb(255,255,255);
background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 15%, rgba(0,212,255,0) 100%);   position:absolute; bottom:0px; z-index: 20; display: none; }
 
.AL-home .img { width: 40%; float: right; position: relative;}
.AL-home .img img {  height: 100%; position: fixed; top: 0; right: 0; z-index: 1 }



.MENU-A .trim    { width: 60px; height: 2px; background: #000; margin:30px auto; }
.MENU-A li { font-size: 16px; font-weight: 600; letter-spacing: 1px; padding: 0px 10px; display: inline-block; color: #000;  }
.MENU-A li:hover { color: #666}
 
 
@media screen and (max-width: 1400px) {
	
	.AGRA	{ display: block; }
	
.AL-home .sol { position:relative; z-index: 1;   top: 0;  width: 100%; text-align: center; background: #fff;  float: none }
.AL-home .img { width: 100%; height:auto; position:relative; top: 0; right: 0; object-fit: contain; background: #000; float: none}
.AL-home .img img { position:relative; right: 0; z-index: 0; width: 100%;  height:auto; object-fit: cover;} 
	.AL-home  .MENU-A .trim { display: none}	
	
	.AL-home .sol .MENU-A li {   width: 100%; line-height: 40px; }	
.AL-home .sol .LOGO { width: 70%; box-sizing: border-box;   margin: 0 auto; }
	
}
 


	.ASA { position:fixed; bottom: 40px; left: 60%; z-index: 100; margin-left: -20px; display: none; }	
	.ASA i { padding: 0px 0px; width: 40px; height: 40px; border-radius: 50px; background: #000; line-height: 40px; text-align: center; font-size: 28px; color: #fff;  animation: bounce 2s;
  animation-direction: alternate;
  animation-timing-function: cubic-bezier(.5,0.05,1,.5);
  animation-iteration-count: infinite;}
	.ASA i:hover { cursor:pointer; background: #000; color: #fff; }
	
  


@-webkit-keyframes bounce {
  from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  to   { -webkit-transform: translate3d(0, 50px, 0); transform: translate3d(0, 50px, 0); }
}


 

.ALTBANNER {     position: relative; z-index: 10; background: #fff;  }
.ALTBANNER .LOGO { padding-left: 100px; float: left;     }
.ALTBANNER .LOGO img { height: 90px;     }
.ALTBANNER .trim    { width: 60px; height: 2px; background: #000; margin:30px auto; }

.ALTBANNER .sm-wifi { float: right; padding-right: 60px; padding-top: 25px; }

.ALTBANNER .DAMENU {   float: right; padding: 0px 0px  }
.ALTBANNER .DAMENU a { font-size: 16px; display: inline-block; font-weight: 600; padding: 0px 15px; color: #000; line-height: 90px; }


@media screen and (max-width: 1000px) {
 .ALTBANNER .LOGO { padding-left: 30px;     }
.ALTBANNER .LOGO img { height: auto; width: 70%;     }
 .ALTBANNER .sm-wifi { padding-left: 30px;  }
	.ALTBANNER .DAMENU { display: none }
}



.CONTENT .IN { width: 50%; float: left; box-sizing: border-box; padding: 100px ;  }
.CONTENT h1 { font-size: 36px; padding-bottom: 15px; }
.CONTENT p { line-height: 30px; margin-bottom: 15px; }


.CONTENT .IMG { width: 50%; float: right;   }
.CONTENT .IMG img { width: 50%; height: 100%; position:fixed; z-index: 0; right: 0; top: 0; object-fit:cover; -webkit-object-fit:cover; -moz-object-fit:cover; }


@media screen and (max-width: 1000px) {
.CONTENT .IMG { width: 100%; float:none   }
.CONTENT .IMG img { width:100%; height:auto; position:relative;   }	
.CONTENT .IN { width: 100%; float: none; box-sizing: border-box; padding:30px 30px ;  }	
	
}




.ILETISIM .IN { width: 50%; float: left; box-sizing: border-box; padding: 100px ;  }
.ILETISIM h1 { font-size: 36px; padding-bottom: 15px; }
.ILETISIM p { line-height: 30px; margin-bottom: 15px; }
.ILETISIM h2 { font-size: 36px; padding-bottom: 15px; }

.ILETISIM .IMG { width: 50%; float: right;   }
.ILETISIM .IMG img { width: 50%; height: 100%; position:fixed; z-index: 0; right: 0; top: 0; object-fit:cover; }

@media screen and (max-width: 1000px) {
.ILETISIM .IMG { width: 100%; float:none   }
.ILETISIM .IMG img { width:100%; height:auto; position:relative;   }	
.ILETISIM .IN { width: 100%; float: none; box-sizing: border-box; padding:30px 30px ;  }	
	
}

.DERGILER { padding: 0px 100px; padding-bottom: 100px;  }
.DERGILER .li2 {   margin: 5px; float: left; text-align: center; padding: 20px;   box-sizing: border-box; 


	width: 20%;
 

}
.DERGILER .li2 img { width: 100%;  }
.DERGILER .li2 p { padding:10px 0px; font-weight: 800; }

.fiximg img { position: fixed; top: 0; right: 0; height: 100%; z-index: -1  }

@media screen and (max-width: 1000px) {
.DERGILER { padding: 0px 30px; padding-bottom: 50px;  }
.DERGILER .li2 { width:100%;  width: calc(100% / 1 - 10px); margin:5px; float: left; text-align: center; padding:5px;   box-sizing: border-box;  }	 
.DERGILER .li2 p { padding:5px 0px; font-weight: 800; font-size: 12px }
	
	
	
.fiximg img {  display: none}	 
	
	.copy { display: none}	
}

 
.TEMA1 {   margin: 0 auto; position: relative; z-index: 1}
.TEMA1 .item {  }
.TEMA1 .owl-dots,
.TEMA1 .owl-nav {text-align:center;-webkit-tap-highlight-color:transparent}
.TEMA1 .owl-nav {margin-top:10px; display: none; }
.TEMA1 .owl-nav [class*=owl-]{color:#FFF;font-size:14px;margin:5px;padding:4px 7px;background:#D6D6D6;display:inline-block;cursor:pointer;border-radius:3px}
.TEMA1 .owl-nav [class*=owl-]:hover{background:#869791;color:#FFF;text-decoration:none}
.TEMA1 .owl-nav .disabled{opacity:.5;cursor:default}
.TEMA1 .owl-nav.disabled+.owl-dots{margin-top:10px}
.TEMA1 .owl-dots .owl-dot{display:inline-block;zoom:1;  }
.TEMA1 .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#D6D6D6;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:30px}
.TEMA1 .owl-dots .owl-dot.active span,
.TEMA1 .owl-dots .owl-dot:hover span{background:#869791}
.TEMA1 .owl-dots button { outline: none; }	
.TEMA1 .owl-dots { padding: 15px 0px}
.TEMA1 img { height: 500px; width: 100%; object-fit: cover; }

.GALTUT { position: relative; z-index: 0; }
.SHOWBUTON { width: 100%; text-align: center; position: absolute; top: 40%; z-index: 50 ;  }
.SHOWBUTON a { display: inline-block;  background: #fff; color: #000; padding: 15px; border-radius: 50px; font-weight: 700; box-shadow: 0px 0px 19px -8px rgba(0,0,0,0.90); }
.SHOWBUTON a:hover {background:#000; color: #fff; }



.TAB { padding: 10px }
.TAB .TABI     { text-align: center } 
.TAB .TABI .li { padding: 15px 30px; font-size: 20px; color: #000; display: inline-block;   margin: 0px 2px; cursor: pointer; border-bottom: 3px solid #f2f2f2 }
.TAB .TABI .li i {font-size: 38px}
.TAB .TABI .li p { font-size: 18px; font-weight: 700; }
.TAB .TABI .active { border-bottom: 3px solid #000; }
.TAB .CONU     { padding: 30px }
.TAB .CONU .li { display: none; }
.TAB .CONU .u3 { column-count: 3; column-gap: 40px; }
.TAB .CONU a { display: inline-block; padding: 5px 0px; font-weight: 400;}


@media screen and (max-width: 1000px) {
 
.TAB .TABI .li {   display:block;     }
}




.FILMOGRAFI     {   padding-bottom: 60px }
.FILMOGRAFI .IN { max-width: 1200px; margin:  0 auto;   }
.filmosu        {  margin-bottom: 15px;  width: 50%; float: left; }
.filmosu .txt   { width: 60%; float: left; box-sizing: border-box; padding:0px 30px; line-height: 35px   }
.filmosu img    { width:180px;   height: 250px; float:left; object-fit: cover; transition:1s   }
 
.filmosu .txt a { background: #000; color: #fff; display: inline-block; padding: 5px 15px;   border-radius: 50px; margin-top: 15px; font-size:18px;   }
.filmosu .txt a:hover { background: #555; color: #fff; }


@media screen and (max-width: 1000px) {
.filmosu        {  margin-bottom: 15px;  width: 100%; float: none; }
.filmosu .txt   { width: 100%; float:none; box-sizing: border-box; padding:30px 00px; line-height: 35px   }
.filmosu img    { width:100%; height: auto;     float:none;    } 
 
}





.FOTOGALERI { padding: 0px 100px; padding-bottom: 100px; }
.FOTOGALERI img { width: 20%; width: calc(100% / 8); float: left; padding:15px; box-sizing: border-box; transition: 0.5s; -webkit-filter: grayscale(100%); filter: grayscale(100%); }
.FOTOGALERI img:hover { -webkit-filter: grayscale(0%); filter: grayscale(0%);}


@media screen and (max-width: 1000px) {
.FOTOGALERI { padding: 0px 30px; padding-bottom: 50px; } 
.FOTOGALERI img { width: calc(100% / 3); float: left; padding:15px; box-sizing: border-box; transition: 0.5s; -webkit-filter: grayscale(100%); filter: grayscale(100%); }
}






.SOSYALMEDYA-GLOBAL { padding: 9px 0px   }
.SOSYALMEDYA-GLOBAL img { display: inline-block; padding: 0px; width: 35px; height: 35px; background: #000; }
.SOSYALMEDYA-GLOBAL a { display: inline-block; padding: 0px; width: 35px; height: 35px; text-align: center; line-height: 35px;  }
.SOSYALMEDYA-GLOBAL a i { color: #fff;  line-height: 35px; transition: 0.5s}
.SOSYALMEDYA-GLOBAL a:hover i { color: rgba(255,255,255,0.5)}

.siyah a i { color: #000 }
.siyah:hover a i { color: #000 }
.siyah:hover a:hover i { color: rgba(0,0,0,0.5) }


.sm-border a { border: 1px solid #ccc; border-radius: 60px; }

.imdb { font-family: 'Anton', sans-serif; color: #000  }

 



.owl-carousel {
  display: none;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  /* position relative and z-index fix webkit rendering fonts issue */
  position: relative;
  z-index: 1; }
  .owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
    touch-action: manipulation;
    -moz-backface-visibility: hidden;
    /* fix firefox animation glitch */ }
  .owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0; }
  .owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    /* fix for flashing background */
    -webkit-transform: translate3d(0px, 0px, 0px); }
  .owl-carousel .owl-wrapper,
  .owl-carousel .owl-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0); }
  .owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; }
  .owl-carousel .owl-item img {
    display: block;
    width: 100%; }
  .owl-carousel .owl-nav.disabled,
  .owl-carousel .owl-dots.disabled {
    display: none; }
  .owl-carousel .owl-nav .owl-prev,
  .owl-carousel .owl-nav .owl-next,
  .owl-carousel .owl-dot {
    cursor: pointer;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
  .owl-carousel .owl-nav button.owl-prev,
  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel button.owl-dot {
    background: none;
    color: inherit;
    border: none;
    padding: 0 !important;
    font: inherit; }
  .owl-carousel.owl-loaded {
    display: block; }
  .owl-carousel.owl-loading {
    opacity: 0;
    display: block; }
  .owl-carousel.owl-hidden {
    opacity: 0; }
  .owl-carousel.owl-refresh .owl-item {
    visibility: hidden; }
  .owl-carousel.owl-drag .owl-item {
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
  .owl-carousel.owl-grab {
    cursor: move;
    cursor: grab; }
  .owl-carousel.owl-rtl {
    direction: rtl; }
  .owl-carousel.owl-rtl .owl-item {
    float: right; }

/* No Js */
.no-js .owl-carousel {
  display: block; }

/*
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated {
  animation-duration: 1000ms;
  animation-fill-mode: both; }

.owl-carousel .owl-animated-in {
  z-index: 0; }

.owl-carousel .owl-animated-out {
  z-index: 1; }

.owl-carousel .fadeOut {
  animation-name: fadeOut; }

@keyframes fadeOut {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

/*
 * 	Owl Carousel - Auto Height Plugin
 */
.owl-height {
  transition: height 500ms ease-in-out; }

/*
 * 	Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item {
  /**
			This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong
			calculation of the height of the owl-item that breaks page layouts
		 */ }
  .owl-carousel .owl-item .owl-lazy {
    opacity: 0;
    transition: opacity 400ms ease; }
  .owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) {
    max-height: 0; }
  .owl-carousel .owl-item img.owl-lazy {
    transform-style: preserve-3d; }

/*
 * 	Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000; }

.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url("owl.video.play.png") no-repeat;
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  transition: transform 100ms ease; }

.owl-carousel .owl-video-play-icon:hover {
  -ms-transform: scale(1.3, 1.3);
      transform: scale(1.3, 1.3); }

.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon {
  display: none; }

.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity 400ms ease; }

.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%; }
	
	
	
/* CSS3 Transitions */

.owl-origin {
	-webkit-perspective: 1200px;
	-webkit-perspective-origin-x : 50%;
	-webkit-perspective-origin-y : 50%;
	-moz-perspective : 1200px;
	-moz-perspective-origin-x : 50%;
	-moz-perspective-origin-y : 50%;
	perspective : 1200px;
}
/* fade */
.owl-fade-out {
  z-index: 10;
  -webkit-animation: fadeOut .7s both ease;
  -moz-animation: fadeOut .7s both ease;
  animation: fadeOut .7s both ease;
}
.owl-fade-in {
  -webkit-animation: empty 1ms both ease;
  -moz-animation: empty 1ms both ease;
  animation: empty 1ms both ease;
}
/* backSlide */
.owl-backSlide-out {
  -webkit-animation: backSlideOut 1s both ease;
  -moz-animation: backSlideOut 1s both ease;
  animation: backSlideOut 1s both ease;
}
.owl-backSlide-in {
  -webkit-animation: backSlideIn 1s both ease;
  -moz-animation: backSlideIn 1s both ease;
  animation: backSlideIn 1s both ease;
}

/* goDown */
.owl-goDown-out {
  -webkit-animation: scaleToFade .7s ease both;
  -moz-animation: scaleToFade .7s ease both;
  animation: scaleToFade .7s ease both;
}
.owl-goDown-in {
  -webkit-animation: goDown .6s ease both;
  -moz-animation: goDown .6s ease both;
  animation: goDown .6s ease both;
}
/* scaleUp */
.owl-fadeUp-in {
  -webkit-animation: scaleUpFrom .5s ease both;
  -moz-animation: scaleUpFrom .5s ease both;
  animation: scaleUpFrom .5s ease both;
}

.owl-fadeUp-out {
  -webkit-animation: scaleUpTo .5s ease both;
  -moz-animation: scaleUpTo .5s ease both;
  animation: scaleUpTo .5s ease both;
}
/* Keyframes */
/*empty*/
@-webkit-keyframes empty {
  0% {opacity: 1}
}
@-moz-keyframes empty {
  0% {opacity: 1}
}
@keyframes empty {
  0% {opacity: 1}
}
@-webkit-keyframes fadeOut {
  0% { opacity:1; }
  100% { opacity:0; }
}
@-moz-keyframes fadeOut {
  0% { opacity:1; }
  100% { opacity:0; }
}
@keyframes fadeOut {
  0% { opacity:1; }
  100% { opacity:0; }
}
@-webkit-keyframes backSlideOut {
  25% { opacity: .5; -webkit-transform: translateZ(-500px); }
  75% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); }
  100% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); }
}
@-moz-keyframes backSlideOut {
  25% { opacity: .5; -moz-transform: translateZ(-500px); }
  75% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); }
  100% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); }
}
@keyframes backSlideOut {
  25% { opacity: .5; transform: translateZ(-500px); }
  75% { opacity: .5; transform: translateZ(-500px) translateX(-200%); }
  100% { opacity: .5; transform: translateZ(-500px) translateX(-200%); }
}
@-webkit-keyframes backSlideIn {
  0%, 25% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(200%); }
  75% { opacity: .5; -webkit-transform: translateZ(-500px); }
  100% { opacity: 1; -webkit-transform: translateZ(0) translateX(0); }
}
@-moz-keyframes backSlideIn {
  0%, 25% { opacity: .5; -moz-transform: translateZ(-500px) translateX(200%); }
  75% { opacity: .5; -moz-transform: translateZ(-500px); }
  100% { opacity: 1; -moz-transform: translateZ(0) translateX(0); }
}
@keyframes backSlideIn {
  0%, 25% { opacity: .5; transform: translateZ(-500px) translateX(200%); }
  75% { opacity: .5; transform: translateZ(-500px); }
  100% { opacity: 1; transform: translateZ(0) translateX(0); }
}

@-webkit-keyframes scaleToFade {
  to { opacity: 0; -webkit-transform: scale(.8); }
}
@-moz-keyframes scaleToFade {
  to { opacity: 0; -moz-transform: scale(.8); }
}
@keyframes scaleToFade {
  to { opacity: 0; transform: scale(.8); }
}
@-webkit-keyframes goDown {
  from { -webkit-transform: translateY(-100%); }
}
@-moz-keyframes goDown {
  from { -moz-transform: translateY(-100%); }
}
@keyframes goDown {
  from { transform: translateY(-100%); }
}

@-webkit-keyframes scaleUpFrom {
  from { opacity: 0; -webkit-transform: scale(1.5); }
}
@-moz-keyframes scaleUpFrom {
  from { opacity: 0; -moz-transform: scale(1.5); }
}
@keyframes scaleUpFrom {
  from { opacity: 0; transform: scale(1.5); }
}

@-webkit-keyframes scaleUpTo {
  to { opacity: 0; -webkit-transform: scale(1.5); }
}
@-moz-keyframes scaleUpTo {
  to { opacity: 0; -moz-transform: scale(1.5); }
}
@keyframes scaleUpTo {
  to { opacity: 0; transform: scale(1.5); }
}




