/* ExtraSmall devices (tablets, 767px and down) */
@media (max-width: 767px) {
    .logo-home { margin: 20px 0 20px 10px; font-size: 16px;}
    .navbar-default .navbar-toggle .icon-bar {background-color: #002e5b;}
    .intro-pattern .text-slider.new {width: 95%;}
.is-sticky .navbar-default .navbar-toggle .icon-bar {background-color: #fff;}
.sec-event .event-box {margin: 50px auto 20px;}
.heading-common {font-size: 30px;}
.sec-event::before{content: none;}
.sec-event .line.big {
    margin: 5px auto;
    display: block;
    width: 82px;
}
.sec-event .event-box .event-hover {opacity: 1;}
#owl-team.owl-theme .owl-controls .owl-buttons div{position: static;margin-top: 20px;}
.section-title.new p {line-height: 28px !important;}
.sec-event{padding: 50px 0;}
.sec-event .heading-line span{
    font-size: 30px;
    margin: 20px 0;
    line-height: 30px;
}
.sec-event .heading-line{margin-bottom: 0;}
    .navbar-top .social-icon {margin-left: 0;text-align: center;}

    .flexslider{ text-align:center;}

    #home .section-title h1 {
        font-size: 24px !important;
        line-height: 36px;
        margin:0 0 10px 0;
        padding:0 0 10px 0;
        border-color: #666;
        letter-spacing:0;
        font-weight: 600;
    }
    #home p.lead {
        font-size: 16px;
        line-height: 21px;
        margin: 0 0 25px;
    }
    .fullscreen-slider-arrow {
        bottom: 10px;
        margin-top: 0;
        top: auto;
        width: 23px;
        overflow: hidden;
    }
    #slider_left {
        left: 18px;
    }
    #slider_right {
        right: 18px;
    }

    .navbar .show-menu {
        display: block;
    }
    .navbar-default .navbar-collapse, .navbar-default .navbar-form {
        border-color: #000;
    }
    .navbar-collapse {
        max-height: none;
        padding: 0;
    }
    .navbar-nav {
        margin: 0;
    }
    .navbar .nav > li {
        float: none;text-align: center;
    }
    .navbar .nav > li > a {
        padding: 0 20px;
        line-height: 40px;
        border-bottom: 1px solid #333;
        font-size: 12px;
        padding: 0 13px;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus{
        color:#fff;
    }

    .section-content {
        padding: 30px 0;
    }
    .section-title .line {
        display: none;
    }
    /*.section-title h1 {
        font-size: 48px;
        line-height: 50px;
        margin: 0 0 8px;
        padding: 4px 0 5px 0;
    }*/
    /*.section-content h1 {
    border-bottom: 1px solid #DEDEDE;
    border-top: 1px solid #DEDEDE;
    margin: 30px 0;
    font-size: 30px;
}*/
.section-program .line.big , .sec-team .line.big{
    width: 42px;
    margin: 5px auto;
    display: block;
}
.section-program div span, .sec-team div span {
    font-size: 30px;
    margin: 20px 0;
    line-height: 30px;
}
.section-program div.mybutton span {
    font-size: 16px ;
}
.team-block {
    padding: 35px;
    margin: 36px 15px 0;
}
#event-modal .line.big {width: 55px;margin: 5px 0;}
#event-modal .heading-line {margin-bottom: 0px;}
.section-program .pro-box {margin: 30px auto;}
    .section-title .lead {
        margin: 25px 0 0 0;
    }
    .element-line {
        margin-top: 40px;
    }

    #ajaxpage .section-title h1 {
        font-size: 40px;
    }
    .mybutton.ultra a,
    .mybutton.ultra button,
    .mybutton2.ultra a,
    .mybutton2.ultra button{
        font-size: 13px;
        line-height: 40px;
    }
    .mybutton.ultra a span,
    .mybutton.ultra button span,
    .mybutton2.ultra a span,
    .mybutton2.ultra button span {
        padding: 0 25px;
    }

    .flexslider {
        text-align: center;
    }

    .pricing-5-col .pricing-box {
        width: 100%;
        margin: 0;
    }
    .pricing-5-col .pricing-box .pricing-featured {
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        position: relative;
        margin: 0;
    }
    .pricing-5-col .pricing-box ul {
        border-right: solid 1px #eee;
    }
    .call-number {
        font-size: 40px;
        line-height: 65px;
        font-weight: 600;
    }

    .timeline-content #timeline .timeline-item, .timeline-content #timeline .timeline-item:nth-child(2n) {
        clear: both;
        float: none;
        margin-bottom: 0;
        width: 100%;
    }
    .timeline-content #timeline .timeline-item .post, .timeline-content #timeline .timeline-item:nth-child(2n) .post {
        margin: 140px 0 25px 0;
    }
    .timeline-content #timeline .timeline-item .post-info, .timeline-content #timeline .timeline-item:nth-child(2n) .post-info {
        left: 0;
        right: 0;
        margin: 0;
        top: -105px;
        width: 100%;
        background: none;
    }
    .timeline-content #timeline .timeline-item .post-info h5 {
        position: absolute;
        right: 0;
        top: 50px;
        font-size: 13px;
        text-align: right;
        margin: 0;
    }
    .timeline-content #timeline .timeline-item .post-info h5.info-date {
        left: 0;
        right: auto;
        text-align: left;
    }
    .timeline-content #timeline .timeline-item .post-info h5.info-date small{
        font-size: 100%;
    }
    .timeline-content #timeline .timeline-item .post-arrow, .timeline-content #timeline .timeline-item:nth-child(2n) .post-arrow {
        display: none;
    }

    #filters a {
        clear: both;
        display: block;
        margin: 12px auto;
        width: 80%;
    }
    #filters a span {
        width: 100%;
    }
    #portfolio-wrap .portfolio-item {
        width: 100%;
    }
    .project-media, .project-description {
        margin: 40px 0 0 0;
        text-align:center;
    }

    #map_canvas {
        height: 350px;
    }

    .navbar-top .navbar-brand {
        color: #ffffff;
    }
    .navbar-top .navbar-collapse{background: transparent;}

}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .flexslider{ text-align:center;}
    #portfolio-wrap .portfolio-item {
        width: 50%;
    }
    .project-description{ text-align:center;}
    .navbar .nav > li > a{ padding:0 12px;}

    #home .section-title h1 {
        font-size: 18px;
        line-height:25px;
        font-weight: 600;
    }


}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {

    .flexslider{ text-align:left;}

    #home .section-title h1 {
        font-family: ralewayL;
        font-size: 30px;
        font-weight: 400;
        line-height: 45px;
        margin: 15px 0;
    }
    .project-description{ text-align:inherit;}
    .navbar .nav > li > a{ padding:0 15px;}
    .mybutton a, .mybutton button {
        -webkit-perspective: 1000px;
        -moz-perspective: 1000px;
        perspective: 1000px;
        letter-spacing: 0;
    }
    .mybutton a span, .mybutton button span {
        -webkit-transition: -webkit-transform 0.3s;
        -moz-transition: -moz-transform 0.3s;
        transition: transform 0.3s;
        -webkit-transform-origin: 50% 0;
        -moz-transform-origin: 50% 0;
        transform-origin: 50% 0;
        -webkit-transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        transform-style: preserve-3d;
    }
    .mybutton a:hover span, .mybutton button:hover span {
        -webkit-transform: rotateX(90deg) translateY(-22px);
        -moz-transform: rotateX(90deg) translateY(-22px);
        transform: rotateX(90deg) translateY(-22px);
    }
    .csstransforms3d .mybutton a span::before, .csstransforms3d .mybutton button span::before {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        height: 100%;
        content: attr(data-hover);
        -webkit-transition: background 0.3s;
        -moz-transition: background 0.3s;
        transition: background 0.3s;
        -webkit-transform: rotateX(-90deg);
        -moz-transform: rotateX(-90deg);
        transform: rotateX(-90deg);
        -webkit-transform-origin: 50% 0;
        -moz-transform-origin: 50% 0;
        transform-origin: 50% 0;
    }
    .mybutton2 a, .mybutton2 button {
        overflow: hidden;
        margin: 0 15px;
    }
    .mybutton2 a span, .mybutton2 button span {
        display: block;
        -webkit-transition: -webkit-transform 0.3s;
        -moz-transition: -moz-transform 0.3s;
        transition: transform 0.3s;
    }
    .mybutton2 a:hover span, .mybutton2 button:hover span {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        transform: translateX(100%);
    }
    .mybutton2 a::before{
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
        width: 100%;
        height: 100%;
        color: #fff;
        content: attr(data-hover);
        -webkit-transition: -webkit-transform 0.3s;
        -moz-transition: -moz-transform 0.3s;
        transition: transform 0.3s;
        -webkit-transform: translateX(-25%);
    }
    .mybutton2 a:hover::before{
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        transform: translateX(0%);
    }

}

@media (max-width: 1200px) {
    .item_top {
        top: 0;
        opacity: 1;
    }
    .item_left {
        left: 0px;
        opacity: 1;
    }
    .item_right {
        right: 0px;
        opacity: 1;
    }
    .item_bottom {
        bottom: 0;
        opacity: 1;
    }
    .item_fade_in {
        opacity: 1;
        right: 0px;
    }
    .parallax {
        background-attachment: scroll !important;
        background-position: center top !important;
        height: auto;
        margin: 0 auto;
        width: 100%;
    }
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    #portfolio-wrap .portfolio-item {
        width: 25%;
    }
    .pricing-box li h1 {
        font-size: 60px;
    }
}

@media (max-width: 480px) {
    .section-program .pro-box {width: 100%;}
.section-program .pro-box .mybutton {
    width: 225px;
    bottom: 7px;
}

}