@import "bootstrap/bootstrap.min.css";
@import "bootstrap/bootstrap-responsive.min.css";
@import "jquery/jquery-ui-1.9.1.custom.min.css";
@import "epiechart/jquery.easy-pie-chart.css";
@import "fullcalendar/fullcalendar.css";
@import "pnotify/jquery.pnotify.default.css";
@import "fancybox/jquery.fancybox.css";
@import "uniform/uniform.css";
@import "select/select.css";
@import "tagsinput/jquery.tagsinput.css";
@import "multiselect/multiselect.css";
@import "jbreadcrumb/BreadCrumb.css";
@import "validation/validationEngine.jquery.css";
@import "stepywizard/jquery.stepy.css";
@import "mcustomscrollbar/mCustomScrollbar.css";
@import "media/mediaelementplayer.min.css";
@import "cleditor/cleditor.css";
@import "shbrush/shCoreDefault.css";
@import "shbrush/shThemeDefault.css";
@import "filetree/jqueryFileTree.css";
@import "../js/plugins/plupload/jquery.plupload.queue/css/jquery.plupload.queue.css";
@import "icons.css";
@import "styling.css";
@import "stylesheet.css";
@import "mystyles.css";

html { height: 100%; }
body { min-height: 100%; font-family: 'Helvetica Neue','Helvetica',Arial,sans-serif; font-size: 11px; position: relative; background: url('../img/backgrounds/bg_default.jpg') left top repeat;}


/*~Smartphones (portrait and landscape)~*/
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {    
    .block, .block-fluid{ overflow: hidden; overflow-x: scroll; }
    .errorContainer{width: 319px; margin-top: 50px;}
        .errorContainer h1{font-size: 110px;}
        .errorContainer h2{font-size: 16px;}
            
}

/*~Smartphones (landscape)~*/
@media only screen and (min-width : 321px) {
    
}

/*~Smartphones (portrait)~*/
@media only screen and (max-width : 320px) {
    .errorContainer{width: 319px; margin-top: 50px;}
        .errorContainer h1{font-size: 110px;}
        .errorContainer h2{font-size: 16px;}    
    
    /* timeline */
    .timeline{background-position: 10px 10px;}
    .timeline .event{padding-left: 50px;}
    .timeline .event .icon{left: 2px;}
    .timeline .event .date{display: none;}    
    .timeline .event .body .text.video{width: 140px !important; height: 80px !important;}
    .timeline .event .body .text.map{width: 140px !important; height: 100px !important;}                
    /* eof timeline */
}

/*~Bootstrap fix~*/
@media only screen and (max-width: 767px) {
    body{padding: 0px;}
    .block, .block-fluid{ overflow: hidden; overflow-x: auto; }
    .video{padding-top: 0;}    
        .errorContainer{width: 319px; margin-top: 50px;}
        .errorContainer h1{font-size: 110px;}
        .errorContainer h2{font-size: 16px;}    
     
    /* timeline */
    .timeline .event .body .text.video{width: 200px; height: 113px;}
    .timeline .event .body .text.map{width: 200px; height: 150px;}            
    /* eof timeline */
}
@media only screen and (min-width: 768px) {
    /* timeline */
    .timeline .event .body .text.video{width: 300px; height: 169px;}
    .timeline .event .body .text.map{width: 300px; height: 200px;}    
    /* eof timeline */
}
/*~iPads (portrait and landscape)~*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    
}

/*~ ~*/
@media only screen and (max-width : 1025px) {
    .fc-header-right{display: none;}
    .footer .left{display: none;}
}

/*~Desktops and laptops~*/
@media only screen and (min-width : 1025px) {
    /* timeline */
    .timeline .event .body .text.video{width: 400px; height: 225px;}
    .timeline .event .body .text.map{width: 400px; height: 300px;}
    /* eof timeline */
}
.add-ons
{
	background-color: #EEEEEE;
    border: 1px solid #CCCCCC;
    display: inline-block;
    font-size: 11px;
    font-weight: normal;
    height: 20px;
    line-height: 20px;
    min-width: 16px;
    padding: 3px 5px 5px;
    text-align: center;
    text-shadow: 0 1px 0 #FFFFFF;
    width: auto;
	border-radius: 0px 4px 4px 0px
}