/* 
    Document   : home
    Created on : 27/01/2016, 06:31:16 PM
    Author     : ovazquez
    Description:
        Purpose of the stylesheet follows.
*/

@font-face {
    font-family: OratorStd;
    src: url(css/fonts/OratorStd.otf);
}

@font-face{
	font-family:"Orator Std";
	src:url("http://www.myfontfree.com/data/54/o/orator-std/OratorStd.otf");
}

@font-face {
    font-family: Avenir;
    src: url(css/fonts/Avenir.ttc);
}

    /* Por debajo de 700px */
    @media screen and (max-width: 700px){

        body{

            font-size:12px;
            font-family: Verdana;  

        }

    }
    /* Por debajo de 400px */
    @media screen and (max-width: 400px){

        body{

            font-size:10px;

        }

    }

#main-header {
	background: #fff;
	color: black;
        width: 100%; /* hacemos que la cabecera ocupe el ancho completo de la página */
	left: 0; /* Posicionamos la cabecera al lado izquierdo */
	top: 0; /* Posicionamos la cabecera pegada arriba */
	/*position: fixed; /* Hacemos que la cabecera tenga una posición fija */
        border-bottom: solid 1px #ccc;
        border-top: solid 1px #ccc;
}	

#main-header a {
	color: black;
}

.img-header{
    padding-left: 1%;
}
.img-header:hover{
    cursor: pointer;
}

.icono-menu{
    padding-top: 1%;
    padding-left: 1%;
    padding-right: 1%;
    padding-bottom: 1%;
}

.icono-menu:hover{
    opacity: 0.5;
    cursor: pointer;
}

nav {
	float: right;
        
}
	nav ul {
		/*margin: 0;
		padding: 0;*/
		list-style: none;
		/*padding-right: 1%;*/
                
	}
	
		nav ul li {
			display: inline-block;
                        /*padding-top: 5%;*/
                        
		}
			
			nav ul li a {
				/*border-left: solid 1px;*/
                                display: block;
				text-decoration: none;
                                padding-top: 50%;
                                padding-left: 20%;
                                padding-right: 20%;
			}

                        
				

.banner_principal{
    width: 90%;
    text-align: center;
    margin-left: 5%;
    margin-top: 5%;
}

.footer{
    width: 100%;
    text-align: center;
    /*margin-bottom: 4%;*/
}

.imagen-pelicula-uno-home{
    width: 280px; 
    height: 280px;
}

.imagen-pelicula-uno-home::before{
    width: 280px; 
    height: 280px;
    padding: 0;
    content: " ";
    display: block; 
}

.imagen-pelicula-uno-home::after{
    width: 280px; 
    height: 280px;
    box-sizing: border-box;
}

.imagen-pelicula-uno-home:hover{
    
    transform: scale(1.10);
    transition: transform 0.3s ease 0s;
    
}
.imagen-pelicula-dos-home{
    top: 0;
    left: 0;
    width: 566px; 
    height: 280px;
}

.imagen-pelicula-dos-home:hover{
    
    transform: scale(1.05);
    transition: transform 0.3s ease 0s;
    
}

.imagen-pelicula-tres-home{
    top: 0;
    left: 0;
    width: 1144px; 
    height: 280px;
}

.imagen-pelicula-tres-home:hover{
    
    transform: scale(1.05);
    transition: transform 0.3s ease 0s;
    
}

#redes-sociales{
        /*background: #fff;*/
	color: black;
        width: 100%; /* hacemos que la cabecera ocupe el ancho completo de la página */
	left: 0; /* Posicionamos la cabecera al lado izquierdo */
        /*border-bottom: solid 1px #ccc;*/
        /*border-top: solid 1px #ccc;
        border-bottom: solid 1px #ccc;*/
        text-align: center;
}

section{
    float: left;
    right: 0;
}
    section ul {
                    margin: 0;
                    padding: 0;
                    list-style: none;
                    right: 0;

            }

                    section ul li {
                            /*display: inline;*/
                            padding-top: 10%;
                            float: left;
                            right: 0;
                            
                            
                    }
                    

                            section ul li a {
                                    /*display: block;*/
                                    /*padding: 0% 0% 0% 0%;*/
                                    /*text-decoration: none;*/
                                    right: 0;
                            }

                                    section ul li a:hover {
                                            opacity: .5;
                                            cursor: pointer;
                                    }
.distribuidoras{
    background-color: #fff;
    text-align: center;
    width: 100%;
    border-top: solid 1px #ccc;
    border-bottom: solid 1px #ccc;
}

.img-distribuidoras{
    padding-left: 5%;
    padding-top: 1%;
    padding-bottom: 1%;
    padding-right: 5%;
    width: 90%
}



.ficha-tecnica{
    width: 100%;
    font-size: 12px;
    text-align: justify;
    padding-left: 10%;
    font-weight: normal;
    font-family: Verdana;
    color: #000;
    padding-top: 25%;
}

.sinopsis{
    width: 100%;
    font-size: 12px;
    text-align: justify;
    padding-left: 10%;
    font-weight: normal;
    font-family: Verdana;  
    color: #000;
    
}

.comentario{
    width: 100%;
    font-size: 14px;
    text-align: center;
    padding: 0% 10%;
    font-weight: normal;
    font-family: Verdana;  
    font-weight: bold;
    font-size: 12px;
    color: #000;
}

.contenedor-ficha{
    width: 47%;
    max-height: 46.5em;
    min-height: 46.5em;
    background-color: #ddf8ef;
    margin-top: 2.5%;
    margin-left: 3%;
    float: left;
    
    
}

.contenedor-horarios{
    width: 48%;
    max-height: 46.5em;
    min-height: 46.5em;
    background-color: #ddf8ef;
    float: left;
    margin-top: 2.5%;
    text-align: left;
    padding-left: 10%;
    font-family: Verdana;  
    text-transform: uppercase;
    
    
}

.titulo-pelicula{
    
    color: #000;
    text-transform: uppercase;
    font-family: Verdana;  
    font-size: 20px;
    text-align: right;
    min-width: 100px;
    position: absolute;
    background-color: #fff;
    margin-left: -10%;
    padding: 1% 5% 1% 5%;
    margin-top: 5%;

}

.titulos-detalle{
    background-color: #fff;
    color: #000;
    font-size: 14px;
    padding: 1% 1% 1% 1%;
    /*font-weight: bold;
    width: 30%;*/
    font-family: Verdana;  
}

.contenedor-main-ficha{
    /*border-top: solid 3px #000;*/
    /*border-bottom: solid 1px #000;*/
    /*border-right: solid 3px #000;*/
    /*border: solid 3px #000;*/
    min-height: 1000px;
}

.cartel{
/*    width: 480px;
    height: 6.3em;
    _height: 730px;*/
    /*border-bottom: solid 1px #000;*/
    
}
.trailer{
    background-color: #fff;
    color: #000;
    font-size: 14px;
    font-family: Verdana;
    /*font-weight: bold;*/
    padding: 1%;
}

.trailer:hover{
    opacity: 0.5;
    cursor: pointer;
}

.boletos{
    background-color: #fff;
    color: #000;
    font-size: 14px;
    padding: 1% 1% 1% 1%;
    /*font-weight: bold;*/
    margin-top: 20%;
    width: 250px;
    font-family: Verdana;  
    
}

.btncompra{
    background-color: #fff;
    color: #000;
    font-size: 12px;
    border: 0;
    padding: 1% 1% 1% 1%;
    /*font-weight: bold;*/
    font-family: Verdana;  
}
.btncompra:hover{
    opacity: .5;
    cursor: pointer;
}
#ubicacion{
    background-color: #ddf8ef;
    color: #000;
    margin: 2% 1% 3% 1%;
    /*padding-left: 2%;*/
    padding-top: 5%;
    /*padding-right: 2%;*/
    height: auto;
    overflow: hidden;
    font-family: verdana;
    font-size: 14px;
    text-align: justify;
}

#contacto{
    background-color: #ddf8ef;
    color: #000;
    margin: 2% 1% 3% 1%;
    /*padding-left: 2%;*/
    padding-top: 5%;
    /*padding-right: 2%;*/
    height: auto;
    overflow: hidden;
    font-family: verdana;
    font-size: 14px;
    text-align: justify;
}

.mapa{
    padding-left: 12%; 
    height:300px;  
    width:600px;
    border: 0;
    padding-bottom: 5%;
}
.etiqueta{
    font-weight: bold;
    
}
.texto{
    color: #000;
    font-size: 12px;
}

.texto-bold{
    color: #000;
    font-size: 12px;
    font-weight: bold;
}

#forma-contacto{
    background-color: #ddf8ef;
    color: #000;
    font-family: verdana;
    font-size: 14px;
    margin: 3% 2% 3% 2%;
    padding-left: 2%;
    padding-top: 2%;
    padding-right: 2%;
    padding-bottom: 2%;
    height: auto;
    overflow: hidden;
}
.cartel-fondo{
    width: 90%;
    text-align: center;
    margin-left: 5%;
    margin-top: 5%;
    margin-bottom: 5%;
    background-color: red;
    height: 300px;
}
.contenedor-main
{
    background-image: url("/imagenes/Micrositio61M-Background.jpg");
    padding-top: 35%;
}
.ubicacion{
    width: 90%;
}
.ubicacion-td{
    width: 25%;
    padding-left: 5%;
    text-align: center;
}
.ubicacion-td-der{
    padding-left: 5%;
}

.cineteca{
    background-color: #fff;
    padding: 1% 8% 1% 8%;
    font-size: 20px;
}
.fondo-blanco{
    background-color: #fff;
    padding-bottom: 5%;
    padding-top: 5%;
    
}