/*----------- CSS by BMestudio 2012 -----------*/
/*-----------start GLOBALS-----------*/
body{
    font-family: "Trebuchet MS", Arial, sans-serif;
    background: url(../img/bg.jpg) no-repeat center 0 #000;
    color:#000;  
    font-size:1em;  
}

a{
    color:#777;
}

/*inicio FONTS*/
.regular{
    font-family: 'Open Sans', sans-serif;
    font-weight: 400
}

.light{
    font-family: 'Open Sans', sans-serif;
    font-weight: 300
}

.bold{
    font-family: 'Open Sans', sans-serif;
    font-weight: 700
}

.regular-italic{
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-style: italic
}

.light-italic{
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    font-style: italic
}

.bold-italic{
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-style: italic
}
/*fin FONTS*/

/*start BUTTONS*/
.btn{
    border:none;
    cursor:pointer;
    background-color:transparent;
    padding: 8px 15px;
    text-align:center;
    color: #fff;
    font-size:1.1em;
}

.btn:hover{
    opacity: 0.8;
    -moz-opacity: 0.8;
    filter:alpha(opacity=8);
}

.red{
    background-color:#d10000;
}
.black{
    background-color:#000;
}

.back{
    padding-left:40px;
    -webkit-transition:All 0.5s ease-out;
    -moz-transition:All 0.5s ease-out;
    -o-transition:All 0.5s ease-out;
    -webkit-transform: translate(0, 0px);
    -moz-transform: translate(0, 0px);
    -o-transform: translate(0, 0px);
}
.back:hover{    
    -webkit-transform: translate(-5px, 0px);
    -moz-transform: translate(-5px, 0px);
    -o-transform: translate(-5px, 0px);
}
/*end BUTTONS*/

/*start TITLES*/
.title{
    font-size:2em;
    margin-bottom:15px;
}
/*end TITLES*/

/*start EDITOR*/
/*end EDITOR*/

/*start PAGINATOR*/
    .paginator{
        overflow: hidden;
        position: relative;
        width:100%;
        background-color:#e5e5e5;
        padding:10px 0;
    }
        .paginator ul{
            overflow:hidden;
            display: inline-block;
            text-align:center;
            width:100%;
        }
        .paginator ul li{
            display: inline-block;
            margin-left: 5px;
            font-weight: normal;
        }
        .paginator ul li:first-child{
            margin-left: 0;
            border:none;
        }
        .paginator ul li a,
        .paginator ul li strong{
            padding: 7px 10px;
            color:#777;
            text-align: center;
            display: inline-block;
            font-size:1em;
        }
        .paginator ul li.txt a{
            background-color:#bdbdbd;
        }
        .paginator ul li.current strong{
            background-color: #878787;
            color:#fff;
        }
        .paginator ul li a:hover{
            background-color:#d10000;
            color:#fff;
        }
/*end PAGINATOR*/

/*start FORM*/
form input,
form textarea{
    border:1px solid #d6d6d6;
    color:#9a9898;
    padding: 5px;
    background:#fff;
}
/*end FORM*/

#wrap{
    background-color:#fff;
    margin:50px auto;
    box-shadow: 0 0 10px #000;
    padding:20px 0;   
    overflow: hidden;
    position: relative; 
}

section{
    overflow: hidden;
}
/*-----------end GLOBALS-----------*/

/*-----------start LAYOUT-----------*/
/*start HEADER*/
header{
    background-color:#fff;
    padding:0 0 10px 0;
    border-bottom:7px solid #d10000;
}

    header #logo{
        display: block;
        margin-top:10px;
    }
    header #logo:hover{
        opacity: 0.8;
        -moz-opacity: 0.8;
        filter:alpha(opacity=8);
    }

    #menu li{
            display: block;
            text-align: center;
            margin-left: 3px;
            position: relative;
            float: left
        }
        #menu li:first-child{
            margin-left: 0
        }
            #menu li a{
                display: block;
                color:#939598;
                padding: 65px 10px 10px;
                font-size: 1em;
                -webkit-transition: all 0.20s ease;
                -moz-transition: all 0.20s ease;
                -o-transition: all 0.20s ease;
                transition: all 0.20s ease;
            }
            #menu a:hover, 
            #menu li.active a{
                color:#fff;
            }
                #menu li h6{
                    position: relative;
                    text-transform: uppercase;
                    z-index: 5
                }
                #menu li span{
                    display: block;
                    width: 100%;
                    height: 0;
                    -webkit-transition: all 0.5s ease;
                    -moz-transition: all 0.5s ease;
                    -o-transition: all 0.5s ease;
                    transition: all 0.5s ease;
                    position: absolute;
                    top:0;
                    left: 0;
                    z-index: 0
                }
                #menu li:hover span,
                #menu li.active span{
                    background-color:#d10000;
                    height: 95px
                }

    #newsletter{
        width:200px;
        overflow: hidden;
        margin-top:12px;
    }
        #newsletter input{
            width:156px;
            font-size:0.9em;
            font-style:italic;
        }
        #newsletter .btn{
            padding: 1px 10px;
            font-size:1.4em;
            height:29px;
        }
        #newsletter span{
            text-align:right;
            font-size:0.7em;
            display: inline-block;
            margin-top:5px;
            color:#bbb;
        }

    #socialmedia{        
        margin-top:15px;
    }
        #socialmedia li{
            float: right;
            margin-left:10px;
        }
            #socialmedia li a{
                display: block;
                width:28px;
                height:28px;
                background:url(../img/socialmedia.png) no-repeat 0 0 transparent;
                -webkit-transition:All 0.5s ease-out;
                -moz-transition:All 0.5s ease-out;
                -o-transition:All 0.5s ease-out;
                -webkit-transform: translate(0, 0px);
                -moz-transform: translate(0, 0px);
                -o-transform: translate(0, 0px);
            }
            #socialmedia li a#facebook{
                background-position: right 0;
            }
            #socialmedia li a:hover{
                -webkit-transform: translate(0, -5px);
                -moz-transform: translate(0, -5px);
                -o-transform: translate(0, -5px);
                opacity: 0.8;
                -moz-opacity: 0.8;
                filter:alpha(opacity=8);
            }
/*end HEADER*/

/*start FOOTER*/
footer{
    background-color:#d10000;
    color:#fff;
    font-size:0.8em;
    padding: 5px 0;
    line-height:3em;
}

    #developer{
            display: block;
            width: 35px;
            height: 35px;
            opacity:0.5
        }
        #developer:hover{
            -webkit-animation-name:rotater;
          -webkit-animation-duration:500ms;
          -webkit-animation-iteration-count:1;
          -webkit-animation-timing-function:ease-out;
          -moz-transform:rotate(360deg) scale(1);
          -moz-transition-duration:500ms;
          -moz-transition-timing-function: ease-out;
          opacity:1;
          filter: alpha(opacity = 100);
        }
/*end FOOTER*/
/*-----------end LAYOUT-----------*/

/*-----------start HOME-----------*/
#slider-home{
    width:1130px;
    height:346px;
    position: relative;
    padding-bottom:55px;
}
    #slider-home #cycle div{
        position: relative;
    }
        #slider-home #cycle div h2{
            position: absolute;
            right:30px;
            top:30px;
            z-index:999;
            width:400px;
            text-align:right;
            font-size:1.7em;
            line-height:1.5em;
        }

#content-home #about-home{
    padding: 15px;
    background-color:#e6e6e6;
    font-size:0.8em;
    overflow: hidden;
}
    #content-home #about-home h4{
        font-size:2em;
        margin-bottom:10px;
    }
    #content-home #about-home .editor{
        height:137px;
    }

#content-home #departments-home,
#content-home #departments-home li{
    overflow: hidden;
}
    #content-home #departments-home li a{
        overflow: hidden;
        display: block;
        position: relative;        
        -webkit-transition:All 0.5s ease-out;
        -moz-transition:All 0.5s ease-out;
        -o-transition:All 0.5s ease-out;
        -webkit-transform: translate(0, 0px);
        -moz-transform: translate(0, 0px);
        -o-transform: translate(0, 0px);
    }
    #content-home #departments-home li a:hover{;
        -webkit-transform: translate(0, -5px);
        -moz-transform: translate(0, -5px);
        -o-transform: translate(0, -5px);
    }
        #content-home #departments-home li a img{
            width:100%;
        }
        #content-home #departments-home li a .caption{
            width:100%;
            color:#fff;
            position: absolute;
            left:0;
            bottom:1px;        
            background-color: rgba(209, 16, 0, 0.8);
            font-size:1.3em;
        }
            #content-home #departments-home li a .caption h5{
                display: block;
                padding: 20px 15px;
            }
/*-----------end HOME-----------*/

/*-----------start ABOUT-----------*/
#about,
#rosario{
    font-size:0.8em;
}    

aside{
    background-color:#e3e3e3;
    position: relative;
    padding: 85px 20px 30000px;    
    margin-bottom:-30000px;
    height:100%;
}
    aside .icon{
        position: absolute;
        left:0;
        top:20px;
        display: block;
        background-color: transparent;
        padding: 10px 10px 7px 20px;
        background-color:#d10000;
    }
        aside .icon span{
            display: block;
            width:30px;
            height:30px;
            background: url(../img/icons.png) no-repeat 0 0 transparent
        }
    aside .editor ul{
        padding: 0;
        width:100%;
    }
        aside .editor ul li{
            padding-bottom:10px;
            margin-bottom:10px;
            border-bottom: 1px solid #b6b6b6;
            padding-left:15px;
            background:url(../img/item.png) no-repeat 0 5px transparent;
            display: block;
            width:95%;
        }

#text img{
    margin-bottom:9px;
    margin-right:25px;
}
#text .editor h2{
    margin-top:55px;
}
/*-----------end ABOUT-----------*/

/*-----------start ROSARIO-----------*/
aside .icon #links{
    background-position: right 0;
}
#rosario .editor ul li{
    background-position: 0 10px;
}
    #rosario .editor ul li a{
        color:#000;
        text-decoration:none;
    }
    #rosario .editor ul li a:hover{
        opacity: 0.7;
        -moz-opacity: 0.7;
        filter:alpha(opacity=7);
    }
/*-----------end ROSARIO-----------*/

/*-----------start CONTACT-----------*/
#contact .span9{
    padding-top:60px;
    background:url(../img/bg-contact.jpg) no-repeat right bottom;   
    height:610px;
}
#contact .title{
    margin-bottom:20px;
}

#contact form{
    overflow: hidden;
}
    #contact form input,
    #contact form textarea{
        width:97%;
        margin-bottom:15px;
        padding: 15px 5px;
        font-style:italic;
        color:#ccc;
        font-family:'Open Sans';
    }
    #contact form textarea{
        height:130px;
    }

#contact #info-contact .editor{
    font-size:0.9em;
    color:#777;
}
    #contact #info-contact .editor strong{
        color:#d10000;
    }
/*-----------end CONTACT-----------*/

/*-----------start DEPARTMENT-----------*/
#departments{
    position: relative;
}
/*start BLOCK*/
#block{
    display: none;
    padding: 20px 0 12px;
    background-color:#d10000;
    margin-top:50px;
    margin-bottom:-50px;
}
#deptos #block{
    display: block;
}

    #block #filter{
        margin-top:3px;
    }
        #block select{
            width:220px;
            background-color:#fff;
            padding: 10px 0;
        }
    #block #docs li{
        float: left;
        margin-left: 10px;
        background: url(../img/pen.png) no-repeat right 0 transparent;
        padding-right: 43px;
        height: 42px;
        width:140px;
        font-size:0.8em;
        line-height:1.2em;
        text-align:right;
    }
        #block #docs li a{
            color:#fff;
        }
        #block #docs li a:hover{
            text-decoration:underline;
        }
/*end BLOCK*/

/*start MODAL*/
#modal_regl,#modal_cond{
    position: absolute;
    left:0;
    top:-120%;
    background-color: rgba(0, 0, 0, 0.8);
    height:80%;
    z-index:999;
    padding: 10%;
    display: none;
}
#deptos #modal_cond,#deptos #modal_regl{
    display: block;
}
    #modal_cond > div, #modal_regl > div{
        background-color:#fff;
        padding: 40px
    }
        .scroll{
            height:300px;
            width:100%;
            overflow: hidden;
        }            
            #modal_regl .editor,#modal_cond .editor{
                padding-right:20px;
                font-size:0.9em;
            }
        #modal_regl .btn,#modal_cond .btn{
            margin-top:40px;
        }
/*end MODAL*/

/*start LIST*/
#department li#no-result {
    height: 400px;
}
#department .title{
    margin: 10px 0 30px;
}

#list-view{
    margin-bottom:3%;
}
    #list-view li{
        overflow: hidden;
    }
        #list-view li img{
            width:100%;
            margin-bottom:10px;
        }
        #list-view li .editor{            
            height:65;
        }
            #list-view li .editor h3{
                color:#d10000;
            }
/*end LIST*/

/*start DETAIL*/
#department-detail{
    padding: 40px 60px;
}
    #department-detail .btn{
        margin-bottom:35px;
    }
    #department-detail h2{
        color:#d10000;
        margin-bottom:20px;
        font-size:1.2em;
    }

    #slider-deptos,
    #slider-deptos #cycle{
        width:492px;
        height:431px;
        position: relative;
    }
            #slider-deptos img{
                width:100%;
            }
            #slider-deptos .arrows{
                display: block;
                width:35px;
                height:61px;
                z-index:9;
                position: absolute;
                top:185px;
                background:url(../img/arrows.png) no-repeat 0 0 transparent;
            }
            #slider-deptos .arrows#next{
                background-position: right 0;
                right:0;
            }
            #slider-deptos .arrows#prev{
                left:0;
            }

    #gmap{
        width:100%;
        height: 200px;
        margin-bottom:20px;
    }

    #right .editor ul{
        -moz-column-count: 2;
        -moz-column-gap: 50px;
        -moz-column-width: 45%;
        -webkit-column-count: 2;
        -webkit-column-gap: 50px;
        -webkit-column-width: 45%;
    }
        #right h3{
            color:#d10000;
        }
        #right .editor ul{
            padding: 0;
            list-style:none;
            font-size:0.9em
        }
/*end DETAIL*/

/*start RESERVE*/
#reserve{
    margin-top:50px;
    background-color:#eee;
    padding: 20px;
    display: none;
    overflow: hidden;
}    
    #reserve .title a{
        padding: 4px 10px 8px;
        background-color:#d10000;
        color:#fff;
        display: inline-block;        
    }
#reserve form > div{
    margin-bottom:10px;
    padding-bottom:10px;
    border-bottom:1px dotted #ccc;
    overflow: hidden;
}
    #reserve form > div h3{
        margin-bottom:10px;
    }
    #reserve form > div > div{
        padding: 0 15px;
    }
        #reserve form > div input, #reserve form > div textarea{
            float: left;
            width:98%;
            margin-bottom:5px;
        }
        #reserve form > div textarea{
            height: 150px
        }
        #reserve form > div > div{
            margin-bottom:10px;
        }
/*end RESERVE*/
/*-----------end DEPARTMENT-----------*/

/*-----------start MEDIA QUERIES-----------*/
/*start IPHONE*/
@media (min-width: 320px) and (max-width: 479px) { 
    /*start HEADER*/   
    header #logo{
        width:200px;
        margin:10px auto auto;
        text-align: center;
    }
        header #logo img{
            width:200px;
        }

    nav{
        width:280px;
        margin:auto
    }
    
    #menu{
        margin:20px 0;
        display: inline-block;
        width:100%;
        text-align: center;
    }
        #menu li:first-child{
            display: none;
        }
        #menu li{
            float: none;
            display: inline-block;
        }
            #menu li a{
                padding: 0px;
                font-size:0.65em;
            }
                #menu li span{
                    display: none;
                }
                    #menu li:hover a,
                    #menu li.active a{
                        color:#d10000;
                    }
    #socialmedia,
    #newsletter{
        margin-top:0;
    }
    #newsletter.fr{
        float: left;
        width:185px;
    }
        #newsletter input{
            width:135px;
        }
        #newsletter span{
            width:180px;
        }
    /*end HEADER*/ 

    /*start FOOTER*/ 
    footer p.fl{
        font-size:0.8em;
        text-align: center;
        width:100%;
        float: none;
        display: block;
        line-height:1.6em;
        margin-bottom:15px;
    }
    #developer{
        float: none;
        width:31px;
        margin:auto;
        display: block;
    }
    /*end FOOTER*/

    /*start HOME*/ 
    #slider-home{
        display: none;
    }
    /*end HOME*/

    /*start ABOUT*/
    aside{
        padding: 85px 20px 20px;
        margin-bottom: 20px;        
    }
    /*end ABOUT*/

    /*start ROSARIO*/
    #slider-rosario{
        display:none;
    }
    #text .editor{
        font-size:0.8em;
    }
        #text .editor h2{
            margin-top:0;
        }
    /*end ROSARIO*/

    /*start CONTACT*/
    #contact .span3{
        display:none;
    }    
    #contact .span9{
        background:none;
        padding:0;
        height:auto;
    }
    #contact form input, 
    #contact form textarea{
        width:95%;
    }
    /*end CONTACT*/

    /*start DEPARTMENT*/
    #block #filter{
        float:none;
        width:100%;
        overflow: hidden;
        margin-bottom:10px;
    }
        #block #filter form{
            width:280px;
            margin:auto;
        }
            #block #filter form select{
                width:280px;
                margin-bottom:10px;
            }
            #block #filter form button{
                float: right; 
            }
    #block #docs{
        background-color:#b50000;
        padding: 15px 0;
    }
    #block #docs,
    #block #docs ul{
        display: inline-block;
        width:100%;
        text-align: center;
    }
        #block #docs li{
            float: none;
            display:inline-block;
            font-size:0.9em;
            width:100px;
        }

    #list-view li{
        margin-bottom:10px;
        padding-bottom:10px;
        border-bottom:1px dotted #ccc;
    }

    #department-detail{
        padding: 0;
    }
        #slider-deptos, 
        #slider-deptos #cycle{
            width:280px;
            height:245px;
            margin:auto;
        }        
        #slider-deptos{
            margin-bottom:20px;
        }
        #slider-deptos .arrows{
            top:95px;
        }

    .paginator ul li a{
        font-size:0.8em;
        padding: 5px;
    }
    /*end DEPARTMENT*/

    /*--start IPHONE 4*/
    @media
        only screen and (-webkit-min-device-pixel-ratio : 1.5),
        only screen and (min-device-pixel-ratio : 1.5) {
    }
    /*--end IPHONE 4*/
}
/*end IPHONE*/

/*start IPAD VERTICAL*/
 @media (min-width: 480px) and (max-width: 767px) {   
    /*start HEADER*/   
    header #logo{
        width:200px;
        margin:10px auto auto;
        text-align: center;
    }
        header #logo img{
            width:200px;
        }

    nav{
        width:460px;
        margin:auto
    }
    #menu{
        margin:20px 0;
        display: inline-block;
        width:100%;
        text-align: center;
    }
        #menu li:first-child{
            display: none;
        }
        #menu li{
            float: none;
            display: inline-block;
        }
            #menu li a{
                padding: 8px;
                font-size:0.9em;
            }
                #menu li span{
                    display: none;
                }                    
                    #menu li:hover a,
                    #menu li.active a{
                        color:#d10000;
                    }
    #socialmedia,
    #newsletter{
        margin-top:0;
    }
    #newsletter.fr{
        float: left;
        width:185px;
    }
        #newsletter input{
            width:135px;
        }
        #newsletter span{
            width:180px;
        }
    /*end HEADER*/ 

    /*start FOOTER*/ 
    footer p.fl{
        font-size:0.8em;
        text-align: center;
        width:100%;
        float: none;
        display: block;
        line-height:1.6em;
        margin-bottom:15px;
    }
    #developer{
        float: none;
        width:31px;
        margin:auto;
        display: block;
    }
    /*end FOOTER*/

    /*start HOME*/ 
    #slider-home{
        display: none;
    }
    /*end HOME*/ 

    /*start ABOUT*/
    aside{
        padding: 85px 20px 20px;
        margin-bottom: 20px;        
    }
    /*end ABOUT*/  

    /*start ROSARIO*/
    #slider-rosario,
    #slider-rosario img{
        width:440px;
        height:167px;
    }  
    #text .editor{
        font-size:0.8em;
    }
        #text .editor h2{
            margin-top:15px;
        }
    /*end ROSARIO*/

    /*start CONTACT*/
    #contact .span3{
        display:none;
    }    
    #contact .span9{
        background:none;
        padding:0;
        height:auto;
    }
    #contact form input, 
    #contact form textarea{
        width:97%;
    }
    /*end CONTACT*/

    /*start DEPARTMENT*/
    #block #filter{
        float:none;
        width:100%;
        overflow: hidden;
        margin-bottom:10px;
    }
        #block #filter form{
            width:312px;
            margin:auto;
        }
    #block #docs{
        background-color:#b50000;
        padding: 15px 0;
    }
    #block #docs,
    #block #docs ul{
        display: inline-block;
        width:100%;
        text-align: center;
    }
        #block #docs li{
            float: none;
            display:inline-block;
        }

    #list-view li{
        margin-bottom:10px;
        padding-bottom:10px;
        border-bottom:1px dotted #ccc;
    }

    #department-detail{
        padding: 0;
    }
        #slider-deptos, 
        #slider-deptos #cycle{
            width:440px;
            height:386px;
            margin:auto;
        }        
        #slider-deptos{
            margin-bottom:20px;
        }
        #slider-deptos .arrows{
            top:160px;
        }
    /*end DEPARTMENT*/
 }
 /*end IPAD VERTICAL*/

 /*start IPAD HORIZONTAL*/
@media (min-width: 768px) and (max-width: 980px){
     /*start HEADER*/         
        header #logo img{
            width:228px;
        } 
        #menu{
            margin:20px 0;
            float: right;
        }
                #menu li a{
                    font-size:0.8em;
                    padding:40px 10px 10px
                }
                #menu li:hover span,
                #menu li.active span{
                    height:70px;
                }
        #newsletter.fr{
            width:185px;
        }
            #newsletter input{
                width:135px;
            }
            #newsletter span{
               width:180px;
            }
    /*end HEADER*/ 

    /*start FOOTER*/ 
    footer p.fl{
        font-size:0.8em;
        line-height:3em;
    }
    /*end FOOTER*/

    /*start HOME*/ 
    #slider-home,
    #slider-home img{
        width:684px;
        height:209px;
    }
    /*end HOME*/

    /*start CONTACT*/
    #contact .span3 img{
        width:100%;
    }    
    #contact .span9{
        background:none;
    }
    #contact form input, 
    #contact form textarea{
        width:95%;
    }
    /*end CONTACT*/

    /*start DEPARTMENT*/
    #department-detail{
        padding: 0;
    }
        #slider-deptos, 
        #slider-deptos #cycle{
            width:280px;
            height:245px;
            margin:auto;
        }        
        #slider-deptos{
            margin-bottom:20px;
        }
        #slider-deptos .arrows{
            top:95px;
        }
    /*end DEPARTMENT*/
}
/*end BIG SCREEN*/
/*-----------end MEDIA QUERIES-----------*/