@import url(https://fonts.googleapis.com/css?family=Architects+Daughter);
@import url(https://fonts.googleapis.com/css?family=Droid+Sans|Lusitana:400);
@import url(https://fonts.googleapis.com/css?family=Lato:400,300,400italic,900,700);
@import url(https://fonts.googleapis.com/css?family=Roboto:400,700);

/*Currently only on CHS*/
.app-icons-lg a, .app-icons-lg img{
    max-width:40%;
    max-height:40%;
    display: inline !important;
}

/*Currently only on MBS*/
.app-icons a, .app-icons img{
    max-width:50px;
    max-height:50px;
    display: inline !important;
}

.app-icons img{
    border:1px solid #000;
    margin:1px;
    border-radius: 5px;
}

.background
{
	background: #fff;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
}


/* BORDER ANIMATIONS Currently only on CHs */
.border {
  background: linear-gradient(90deg, #e58e1c 50%, transparent 50%), linear-gradient(90deg, #e58e1c 50%, transparent 50%), linear-gradient(0deg, #e58e1c 50%, transparent 50%), linear-gradient(0deg, #e58e1c 50%, transparent 50%);
  background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
  background-size: 30px 10px, 30px 10px, 10px 30px, 10px 30px;
  background-position: 0px 0px, 200px 100px, 0px 100px, 200px 0px;
  padding: 10px;
  animation: border-dance 4s infinite linear;
}
@keyframes border-dance {
  0% {
    background-position: 0px 0px, 300px 116px, 0px 150px, 216px 0px;
  }
  100% {
    background-position: 300px 0px, 0px 116px, 0px 0px, 216px 150px;
  }
}


.size1{
background:black;
width:100px;
height:100px;
}

.size2{
    margin:10px;
    padding:10px;
width:520px;
}


.active-animatioon {
    background-image: linear-gradient(90deg, #e58e1c 50%, transparent 50%), linear-gradient(90deg, #e58e1c 50%, transparent 50%), linear-gradient(0deg, #e58e1c 50%, transparent 50%), linear-gradient(0deg, #e58e1c 50%, transparent 50%);
    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
    background-size: 30px 10px, 30px 10px, 10px 30px, 10px 30px;
    background-position: left top, right bottom, left bottom, right   top;
    animation: border-dance 1s infinite linear;
  }
  @keyframes border-dance {
    0% {
      background-position: left top, right bottom, left bottom, right   top;
    }
    100% {
      background-position: left 30px top, right 30px bottom , left bottom 30px , right   top 30px;
    }
  }
}



/* -------------------------------------------------*/
/* Search                                           */
/* -------------------------------------------------*/
#searchButton{
    padding-bottom: 5px; padding-top: 5px; width: 42px;
}
.modal-dialog{
    width:90%;
}


html.translated-ltr .navbar, html.translated-ltr .navbar { padding-top: 39px; }


/* -------------------------------------------------*/
/* COLORS (FONTS AND BACKGROUNDS)                   */
/* -------------------------------------------------*/

.bg-clear { background-color: transparent; }
.bg-black { background-color: #000; }
.bg-darkblue { background-color: #036; }
.bg-blue { background-color: #0383c0; }
.bg-lightblue { background-color: #99ccff; }
.bg-green { background-color: #5bb75b; }
.bg-green-dark { background-color: #043b0a; } 
.bg-darkgreen { background-color: #043b0a; }
.bg-lightyellow { background-color: #fffce8; }
.bg-lightgreen { background-color: #dff0d8; }
.bg-offwhite { background-color:#ddd; }
.bg-orange { background-color: #e58e1c; }
.bg-red { background-color: #f00; }
.bg-white { background-color: #fff; }
.bg-yellow { background-color: #fff212; }
/* generic style names used to display content on multi sites */
.bg-primary { background-color: #036; } 
.bg-secondary { background-color: #0383c0; } 
.bg-tertiary { background-color: #c2d1d8; }

.fa-color { color:#0383c0; }

.text-black { color:#000 !important; }
.text-blue-dark { color: #036; }
.text-green,.text-green:visited { color: #5bb75b; }
.text-darkgreen { color: #043b0a; }
.text-offwhite { color: #f9f9f9; }
.text-orange { color: #e58e1c; }
.text-red { color: #f00; }
.text-white{ color: #fff !important; }
.text-yellow { color: #fff212 !important; }

/* generic style names used to display content on multi sites */
.text-primary { color: #f9f9f9; } 

/* -------------------------------------------------*/
/* Formatting                                       */
/* -------------------------------------------------*/
.left{
    text-align:left;
}


.size-12 { font-size: 12px; }
.size-14 { font-size: 14px; }
.size-16 { font-size: 16px; }
.size-18 { font-size: 18px; }
.size-21 { font-size: 21px; }
.size-24 { font-size: 24px; }
.size-32 { font-size: 32px; }
.size-48 { font-size: 48px; }
.size-64 { font-size: 64px; }
.size-96 { font-size: 96px; }

.feature { font-family: 'Architects Daughter', cursive; font-weight: bold; }

/* ADDED TO STYLE ONLY PANEL TITLES THAT ARE CLICKABLE */
.clickable:hover, .clickable a:hover {
	/*background-color: #3E8E3E;*/
	background-color: #0383c0;
	color: #f9f9f9;
	text-decoration: none;
}

.clickable-gray:hover, .clickable-gray a:hover {
	/*background-color: #3E8E3E;*/
	background-color: #c2d1d8;
	color: #000;
	text-decoration: none;
}

.clickable-light-gray:hover, .clickable-light-gray a:hover {
	/*background-color: #3E8E3E;*/
	background-color: #dfecf2;
	color: #000;
	text-decoration: none;
}

/* CSS Method for adding Font Awesome Chevron Icons */
 .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family:'FontAwesome';
    content:"\f077";
    float: right;
    color: inherit;
}

.panel-heading.collapsed .accordion-toggle:after {
    /* symbol for "collapsed" panels */
    content:"\f078";
}

/*
.ion-compose,.ion-compose:hover { color:#d54e21; } 
.ion-social-facebook,.ion-social-facebook:hover { color: #3b5998; }
.ion-social-twitter,.ion-social-twitter:hover { color: #00aced; }
.ion-social-googleplus,.ion-social-googleplus:hover { color: #dd4b39; }
.ion-social-instagram,.ion-social-instagram:hover { color: #517fa4; }
.ion-social-youtube,.ion-social-youtube:hover { color: #cd201f; }
.ion-social-wordpress,.ion-social-wordpress:hover { color: #d54e21; }
*/

.blue-twitter { color: #00aced; } /* used for colored twitter logo on employee directory page */

.btn-yellow { 
  color: #333333; 
  background-color: #F5EF82; 
  border-color: #ADAD0A; 
} 
 
.btn-yellow:hover, 
.btn-yellow:focus, 
.btn-yellow:active, 
.btn-yellow.active, 
.open .dropdown-toggle.btn-yellow { 
  color: #333333; 
  background-color: #F8FF36; 
  border-color: #ADAD0A; 
} 
 
.btn-yellow:active, 
.btn-yellow.active, 
.open .dropdown-toggle.btn-yellow { 
  background-image: none; 
} 
 
.btn-yellow.disabled, 
.btn-yellow[disabled], 
fieldset[disabled] .btn-yellow, 
.btn-yellow.disabled:hover, 
.btn-yellow[disabled]:hover, 
fieldset[disabled] .btn-yellow:hover, 
.btn-yellow.disabled:focus, 
.btn-yellow[disabled]:focus, 
fieldset[disabled] .btn-yellow:focus, 
.btn-yellow.disabled:active, 
.btn-yellow[disabled]:active, 
fieldset[disabled] .btn-yellow:active, 
.btn-yellow.disabled.active, 
.btn-yellow[disabled].active, 
fieldset[disabled] .btn-yellow.active { 
  background-color: #F5EF82; 
  border-color: #ADAD0A; 
} 
 
.btn-yellow .badge { 
  color: #F5EF82; 
  background-color: #333333; 
}


.btn-default.disabled {
	/* default background color is white */
	background-color: #ccc !important;
	border-color: #585858;
}

/* -------------------------------------------------*/
/* TRANSPARENCY                                     */
/* -------------------------------------------------*/
.semi-transparent { background-color: rgba(245, 245, 245, 0.4); }

.semi-transparent-green { background-color: rgba(0, 168, 89, 0.9); }

.semi-transparent-blue { background-color: rgba(0, 51, 102, 0.75); } /* was more purply blue rgba(46, 80, 159, 0.9); changed 10/24/2016  */

.semi-transparent-yellow { background-color: rgba(244, 218, 10, 0.75); }

.transparent { background-color:transparent; }

/* -------------------------------------------------*/
/* DATA TABLE
/* -------------------------------------------------*/
.directory-table{
    width:100% !important;
    
}

/* hide search box on department/team table */
.directory-table td{
    vertical-align: middle !important;
}

.directory-icons img{
    padding: 5px;
}

.dept-list #my-table_filter{
    display:none;
}

.datatable-nosearch #my-table_filter,
.datatable-nosearch #roster-table_filter{
    display:none;
}


/* -------------------------------------------------*/
/* TEAM LEADER (CMS TEAMS/CHS DEPARTMENTS)
/* -------------------------------------------------*/
.team-leader img{
    max-height:100px;
	vertical-align: middle;
	padding-right: 15px;
}
.team-leader {
    text-align: center;
}


/* -------------------------------------------------*/
/* BODY STYLES                                      */
/* -------------------------------------------------*/
body {
    /*padding-top:90px;/*90px;*/
    font-size:14px;
    line-height: 1.5;
    font-family: 'Roboto', sans-serif;
}

#announcements, #announcements p{
    font-weight: bold;
}

.sticky {
  min-height: calc(100vh - 392px); /* - 275px based on footer height lower in style sheet */
}

/*used to make panel titles and icons be on the same line*/
.panel-title-inline{
    display:inline;
}

/* a[href$='.pdf']:before{ */
/* Removed 8/26/2016, per A. Minor 
a[href$='.pdf']:after{
    margin:0 5px 0 0;  
    font:12px "FontAwesome";  
    content: " \f1c1";
	color:#a30000;
} */

/* Removed 8/26/2016, per A. Minor 
.dropdown-menu a:not([target="_blank"]):not(.btn):before{  
    margin:0 5px 0 0;  
    font:10px "FontAwesome";  
    content: "\f0c1 ";  
}*/

/*Style all links that open in a new tab*/
/* Removed 8/26/2016, per A. Minor 
.dropdown-menu a[target="_blank"]:not([href$='.pdf']):before{  
    margin:0 5px 0 0;  
    font:10px "FontAwesome";  
    content: "\f08e";  
}*/

.no-icon:before{
    content:none !important;
}

/*See more at: https://webdeveloperplus.com/css/25-incredibly-useful-css-tricks-you-should-know/#sthash.KWhRffRI.dpuf*/
#announcements hr{
    width:90%;
}

.noUnderline{
    text-decoration: none;
}

/* -------------------------------------------------*/
/* SECTION STYLES                          */
/* -------------------------------------------------*/
section,footer {
    z-index:2;
    position:relative;
}

.section-secondary{
	padding:30px 20px;
}

.panel-purple {
  border-color: #C3B1E1;
}
.panel-purple > .panel-heading {
  color: #31708f;
  background-color: #C3B1E1;
  border-color: #bce8f1;
}
.panel-purple > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #C3B1E1;
}
.panel-purple > .panel-heading .badge {
  color: #d9edf7;
  background-color: #31708f;
}
.panel-purple > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #C3B1E1;
}


/* -------------------------------------------------*/
/* NAVIGATION (DISTRICT)                            */
/* -------------------------------------------------*/

/*Try fixed resizeable header*/
.small .navbar-brand#nav-district-name {
    margin-top: 0px;
    font-size: 150%;
}
.small > li > a, .navbar-brand{
    padding: 15px;
}

nav, img{
  transition: all 0.5s;
  -moz-transition: all 0.5s; /* Firefox 4 */
  -webkit-transition: all 0.5s; /* Safari and Chrome */
  -o-transition: all 0.5s; /* Opera */
}

.large{
	min-height:70px;
}
.small{
	min-height:10px;
}

/* .navbar-brand */
.large div a img {
	height:70px;/*auto;*/
}

/* .navbar-brand */
.small div a img {
	height:45px;/*auto;*/
	margin-top: 25px;
}

.inline_list li{
    display:inline;
    margin:10px;
}


.small .info {
	display: none;
}

.noDisplay {
	display: none;
}

.section-breadcrumb{
	margin-top: 94px ;
}

.dropdown-menu li { /* adjusts spacing between items in the navigation dropdown menus */
    line-height: 1.2; 
	padding-top: 0px;
	padding-bottom: 0px;
}

.dropdown-menu li > a:hover { /* color of dropdown links when hovered over */
	background: none !important;
	font-weight: 700;
}

/*.dropdown-menu .btn-success#building-website,
.dropdown-menu a.btn.active#building-website { margin-top: 10px; }
*/
.nav { 
	margin-top:18px; 
}

.nav > li > a, .navbar-brand { padding: 20px 15px; }

/* students, families, staff, community, schools */
.nav, .nav-title span {
    font-family: 'Droid Sans', sans-serif; 
	font-size:125%;
}

a:hover#nav-districthome {
	text-decoration: none;
}

.navbar {
	border-radius: 0px;
	margin-bottom: 0px !important; /* removes spacing between top navbar and the first element in the body following the navbar */
	
	/* from mega-menu-customized - begin */
	margin-bottom:0 !important;
    opacity: .99;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 10 !IMPORTANT;
	/* from mega-menu-customized - end */
}

.navbar-brand {
	padding-top:2px;
	margin:0;
}

.navbar-nav {
	margin:0;
	padding:0;
    margin-top: 5px;
}

.navbar-nav li {
	padding-top:5px;
	padding-bottom:5px;
}

.navbar-nav > li > a {
	padding:10px;/*20px;*/
	font-size:18px;
	font-weight: bold;
	text-transform: uppercase;
	font-family: 'Oswald', sans-serif;
	display: inline-block;
}

.navbar-nav > li > a span {
	margin:5px 0 0 0;
	padding:0;
	font-size: 14px;
	display:block;
	font-weight: normal;
	font-family: 'Roboto', sans-serif;
	text-transform: none;
}

.pull-right#header-contact { 
	padding-right:30px; 
	margin-bottom:0px;
	margin-top:10px;
	font-size:175%;
	font-weight:300;
} 

.pull-right-not-xs, .pull-right-not-sm {
	float: right;
}

.pull-left-not-xs, .pull-left-not-sm {
	float: left;
}

.header-contact-links {
	font-size:80%;
	font-family: 'Roboto', sans-serif; 
}

.dropdown-menu li > a:hover,
    .dropdown-menu li > a:focus,
    .dropdown-submenu:hover > a { background: none; /*padding-left: -3px;*/ }

#register { 
	/*background: #f00;
	/* could try bg primary or secondary??? or add to each school style sheet as needed (cms, mbs) */
	margin-right:15px;
	padding-left:20px;
	padding-right: 20px;
	color:#fff !important;
}

/* removed 1/16/2018
#register:hover {
	background-color: #ec971f !important;
	border-color: #eb9316 !important;
}
*/

.btn-block h2 { margin-top: 20px; margin-bottom: 20px; }

.btn-block h3 { margin-top: 10px; margin-bottom: 10px; }

.btn {
	white-space: normal; /* wraps text in buttons */
}

/* -------------------------------------------------*/
/* STYLES (FONTS)                                   */
/* -------------------------------------------------*/

/* vertical align table content to middle */
table.vertical-align > tbody > tr > td { vertical-align: middle; }

.board-directory img { margin-bottom: 0px; }

.center{
    text-align:center !important;
    margin: auto;
}
.left{ text-align:left; }

.right{ text-align:right; }

.justify { text-align:justify; }

.cursor-default{
    cursor:default !important;
}
.cursor-pointer{
    cursor:pointer!important;
}

.breadcrumb {
    margin-bottom: 0px;
    text-transform: uppercase;
    border-radius: 0;
    padding:8px 0;
    display: inline-block;
}



/* -------------------------------------------------*/
/* Message bar                                      */
/* -------------------------------------------------*/

.section-messages{
    background-color: #fff;
    padding: 2px;
    overflow: hidden;
    position: relative;
    height: 2em;
}

.section-messages strong {
    font-size: 1.5em;
    line-height: 1em;
    width: 100%;
    height: 100%;
    margin: 0;
    text-align: center;
    position: absolute;
}

.section-messages .scroll {
    
    /* Starting position */
    -moz-transform:translateX(100%);
    -webkit-transform:translateX(100%);	
    transform:translateX(100%);
    /* Apply animation to this element */	
    -moz-animation: section-messages 25s linear infinite;
    -webkit-animation: section-messages 25s linear infinite;
    animation: section-messages 25s linear infinite;
}
/* Move it (define the animation) */
@-moz-keyframes section-messages {
    0%   { -moz-transform: translateX(100%); }
    100% { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes section-messages {
    0%   { -webkit-transform: translateX(100%); }
    100% { -webkit-transform: translateX(-100%); }
}
@keyframes section-messages {
 0%   { 
     -moz-transform: translateX(60%); /* Firefox bug fix */
     -webkit-transform: translateX(60%); /* Firefox bug fix */
     transform: translateX(60%); 		
 }
 100% { 
    -moz-transform: translateX(-100%); /* Firefox bug fix */
    -webkit-transform: translateX(-100%); /* Firefox bug fix */
    transform: translateX(-100%); 
 }
}


/* -------------------------------------------------*/
/* end Message bar                                  */
/* -------------------------------------------------*/
/* -------------------------------------------------*/
/* A/B Calendar on CHS and CMS                      */
/* -------------------------------------------------*/
.ab {
    height: 1em;	
    width: 200px;
    overflow: hidden;
    position: relative;
}
.ab strong {
    font-size: 1em;
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0;
    line-height: 1em;
    text-align: center;
    /* Starting position */
    -moz-transform:translateX(100%);
    -webkit-transform:translateX(100%);	
    transform:translateX(100%);
    /* Apply animation to this element */	
    -moz-animation: example1 15s linear infinite;
    -webkit-animation: example1 15s linear infinite;
    animation: ab 15s linear infinite;
}
/* Move it (define the animation) */
@-moz-keyframes ab {
    0%   { -moz-transform: translateX(100%); }
    100% { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes ab {
    0%   { -webkit-transform: translateX(100%); }
    100% { -webkit-transform: translateX(-100%); }
}
@keyframes ab {
 0%   { 
     -moz-transform: translateX(100%); /* Firefox bug fix */
     -webkit-transform: translateX(100%); /* Firefox bug fix */
     transform: translateX(100%); 		
 }
 100% { 
    -moz-transform: translateX(-100%); /* Firefox bug fix */
    -webkit-transform: translateX(-100%); /* Firefox bug fix */
    transform: translateX(-100%); 
 }
}
/* -------------------------------------------------*/
/* END A/B Calendar on CHS and CMS                  */
/* -------------------------------------------------*/


.slogan { 
	padding:20px; 
	text-align: center;
}
  
.section-breadcrumb {
	padding:0px;
}

/* -------------------------------------------------*/
/* styles from here down have not been categorized  */
/* -------------------------------------------------*/

a[href$='#ourschools']{
    margin:auto;
    text-align:center;
} 

/* removes extra space below the support services parent rights panel group */
.panel-group#accordion-parentrights { margin-bottom: 0px; }

.panel-heading {
    cursor: pointer;
}


.panel-heading a { text-decoration: none;}

.panel-body {
	word-wrap:break-word; /* wraps text, especially in right-nav panels that are narrow */
}

.grow { transition: all .2s ease-in-out; }
.grow:hover { 
	transform: scale(2); 
	z-index: 100; 
}

blockquote { 
    font-size: inherit; 
}

blockquote footer { 
    padding-top: 5px; 
    padding-bottom: 0px; 
    text-align: right; 
    font-size: 100%; 
}

.vertical-align {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

/* responsive embedded video iframe */
.responsiveVideo {
    position: relative;
    padding-bottom: 50%; /* 56.25%;*/
    padding-top: 35px;
    height: 0;
    overflow: hidden;
    z-index: 100;
}

/* responsive embedded google calendar and video iframe */
.responsiveVideo iframe {
	position: absolute; 
	top:0; 
	left: 0; 
	width: 100%; 
	height: 100%;
}

.slogan h1 {
	font-size:50px;
	margin-bottom:25px;
}

.slogan p,
.slogan li { 
	font-size:18px;
}

.slogan a { margin-top:20px; }

h1,h2,h3,h4,h5 {
	text-transform: uppercase;
	font-family: 'Oswald', sans-serif;
}

/* -------------------------------------------------*/
/* JUMBOTRON (STYLES AND BACKGROUNDS)               */
/* -------------------------------------------------*/

.jumbotron {
	margin:0 0 !important;
    width:100%;
    height:100%;
    background-size:cover;
}

.jumbotron h1 { 
    font-size: 40px; 
}

/* used on about our district page */
.jumbotron ul#default { font-size: 21px; } /* to match default bootstrap jumbotron p font size */

.jumbotron .panel-body p {
    font-size: 14px; !important 
}

#school-splash{
    background-color: transparent;
}


/* -------------------------------------------------*/
/* DIRECTORY                                           */
/* -------------------------------------------------*/

.img-empdir,.img-empdir-dept {
  position: relative;
  width: 72px;
  overflow: hidden;
}

.img-empdir img, .img-empdir-dept img {
  width: 100%;
  height: auto;
}


/* -------------------------------------------------*/
/* FOOTER                                           */
/* -------------------------------------------------*/

footer{
	text-align:center;
	padding: 20px 0px;
	font-size: 110%;
}

footer p {
	font-size: 90%;
	margin-top: 10px;
}

footer a:hover { 
	color: #ddd;
	text-decoration: none;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}

footer .blogger-hover:hover { color: #ff9334; }
.panel-body > .blogger-hover:hover { color: #ff9334; }

footer .edublogs-hover:hover { color: #00B2D9; }

footer .facebook-hover:hover { color: #ddd; }
.panel-body > .facebook-hover:hover { color: #3b5998; }

footer .instagram-hover:hover { color: #ce2f93; }

.twitter-hover:hover,
.panel-body > .twitter-hover:hover { color: #00aced; }

footer .wordpress-hover:hover,
.panel-body > .wordpress-hover:hover { color: #d54e21; }

.panel-body > .facebook-hover,
.panel-body > .twitter-hover,
.panel-body > .wordpress-hover { color:#00a859; }

/* -------------------------------------------------*/
/* MEDIA QUERIES                                    */
/* -------------------------------------------------*/

/*content now extends larger screens*/
@media (min-width: 1500px) {
  .container {
    width: 1470px;
  }
}

@media (min-width: 1900px) {
  .container {
    width: 1770px;
  }
}

@media (max-width: 1005px) {
	.jumbotron p {
		padding-left:15px;
		padding-right:15px;
	}
	
	.panel-group {
		padding-left:15px;
		padding-right:15px;
	}
}

@media (min-width: 1200px)
.container {
    width: 1170px;
}

@media(max-width:990px) {
    
	.navbar {
		position: relative;
	}   
     
	.navbar-brand{
		margin-top: -10px !important; 
		margin-bottom: 5px !important; 
		padding-top: 0px;
		padding-bottom: 5px;
	}
    
	.navbar-header { 
        float:none; 
    }
	
	.navbar-left, .navbar-right{ 
        float:none !important; 
    }

	.navbar-toggle { 
        display:block; 
    }

	.navbar-collapse {
		border-top:1px solid transparent;
		box-shadow:inset 0 1px 0 rgba(255,255,255,0.1);
	}

	.navbar-fixed-top {
		top:0;
		border-width:0 0 1px;
	}

	.navbar-collapse.collapse { 
        display:none !important; 
    }

	.navbar-nav {
		float:none;
		margin-top:7.5px;
	}

	.navbar-nav > li { 
        float:none; 
    }

	.navbar-nav > li > a {
		padding-top:10px;
		padding-bottom:10px;
		border-right:none;
	}
	
	.navbar-nav > li li { 
        padding-left:30px; 
    }

	.collapse.in { 
        display:block !important; 
    }
	
	.section-breadcrumb{
        margin-top:0px !important;
    }
	
	.carousel-control.left {
	  left: 0px;
	}
	.carousel-control.right {
	  right: 0px;
	}
	
	.jumbotron p {
		padding-left:15px;
		padding-right:15px;
	}
	
	.panel-group {
		padding-left:15px;
		padding-right:15px;
	}
	
	.footer-nav {
		float: none;
		margin-left:auto;
		margin-right:auto;
		text-align:center;
	}
	
	footer p#address{ 
        text-align:left; 
    }
	
	.social-links {
		float: none;
		margin-left:0;
		margin-right:0;
		text-align:center;
		padding-left:0;
	}
	
}  /* END: @media(max-width:990px) */

@media(max-width:768px) {
    
	.pull-right-not-xs {
		float: none;
	}
	
	.pull-right-xs {
		float: right;
	}
	
	.jumbotron {
		min-height:300px;
        margin:0 !important;
	}
	
	.jumbotron h1 { 
        font-size:40px; 
    }

	.jumbotron img {
        padding:0 0;
	}
    
    .small div a img {
	height:70px;
	margin-top: auto;
    }
	
	.dropdown-menu li { /* adjusts spacing between items in the navigation dropdown menus */
		line-height: 2; /* allows more space for mobile sites */
	}

	.jumbotron p {
		padding-left:15px;
		padding-right:15px;
	}
	
	.panel-group {
		padding-left:15px;
		padding-right:15px;
	}
	
	.carousel-control.left {
	  left: 0px;
	}
	.carousel-control.right {
	  right: 0px;
	}
	
	.demo-3 figure:hover img,figure.hover img {
		-webkit-transform: none;
		-ms-transform:none;
		transform:none
	}
	.demo-3 figure:hover figcaption,figure.hover figcaption {
		-webkit-transform:none;
		-ms-transform:none;
		transform:none
	}
    
    .welcome{
        margin:0px;
        padding:0;
    }
    .well{
        margin:0;
        border-radius:0;
        border:none;
    }
    
    /*Trying to make small screens look better*/
    .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12{
        padding-right:0px;
        padding-left: 0px;
    }
    .container{
        padding-right:0px;
        padding-left: 0px;
    }
    .jumbotron{
        padding:0px;
    }
    .row{
        margin-right:0px;
        margin-left:0px;
    }
    .section-breadcrumb{
        padding:5px;
    }
	.panel-group { 
		padding-left: 0px; 
		padding-right: 0px;
		padding-top: 5px;
	}
	
    footer .text-left{
        text-align:center;
    }
    .container{
        width: auto;
        margin:auto !important;
    }
    
}

@media(max-width:450px) {
    
    .slogan{
        padding: 5px;
    }
    .slogan h1{
        font-size: 2em;
    }
    #btn-vsp{
        font-size: 1em;
    }
    
}

/* -------------------------------------------------*/
/* Twitter                                          */
/* -------------------------------------------------*/
#twitter-header a{
    color:#fff;
}
 .twitter-feed{
    width:100%;
    margin:auto;
}

.twitter-feed .slick-prev:before,.twitter-feed .slick-next:before{
    display:none;
}

.profile{
    color:#fff;
}

.profile img{
    margin:20px auto auto;
    border-radius:50%;
}

.profile table{
    margin:5px auto 5px;
}
.profile table td{
    padding-left:5px;
}

.tweet{
    color:#fff;
    border:1px solid;
    border-radius:5px;
    padding:5px;
}
.tweet a{
    color:#5F6A6A;
}
.tweet img, .tweet video{
    max-height:300px;
    margin:auto;
}

/*Sports pages style timeline*/

#timeline{
    
}

.twitter-slide{
    display:none;
}

/* -------------------------------------------------*/
/* RSS                                              */
/* -------------------------------------------------*/

.feed .slick-prev:before,.feed .slick-next:before{
    display:none;
}

.item{
    text-align:left;
    color:#fff;
    border-radius:5px;
    padding:10px;
    margin:5px;
}
.item a{
    color:#5F6A6A;
}
.item p{
    margin:0;
}

.item img{
    width: 50% !important;
    height: auto;
    margin:auto;
}

/* -------------------------------------------------*/
/* Directory                                        */
/* -------------------------------------------------*/
.directory-container{
    background:#fff;
}


/*Toggle Switches  */

.switch-field {
  font-family: "Lucida Grande", Tahoma, Verdana, sans-serif;
  padding: 40px;
    overflow: hidden;
}

.switch-title {
  margin-bottom: 6px;
}

.switch-field input {
  display: none;
}

.switch-field label {
  float: left;
}

.switch-field label {
  display: inline-block;
  width: 60px;
  background-color: #e4e4e4;
  color: rgba(0, 0, 0, 0.6);
  font-size: 14px;
  font-weight: normal;
  text-align: center;
  text-shadow: none;
  padding: 6px 14px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
  -webkit-transition: all 0.1s ease-in-out;
  -moz-transition:    all 0.1s ease-in-out;
  -ms-transition:     all 0.1s ease-in-out;
  -o-transition:      all 0.1s ease-in-out;
  transition:         all 0.1s ease-in-out;
}

.switch-field label:hover {
    cursor: pointer;
}

.switch-field input:checked + label {
  background-color: #A5DC86;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.switch-field label:first-of-type {
  border-radius: 4px 0 0 4px;
}

.switch-field label:last-of-type {
  border-radius: 0 4px 4px 0;
}



/* -------------------------------------------------*/
/* ACCESSIBILITY                                    */
/* -------------------------------------------------*/
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}



/* -------------------------------------------------*/
/* Video Library                                    */
/* -------------------------------------------------*/

#video-library p{
    font-size:1em !important;
	text-align: left;
	padding-left: 10px;
	padding-right: 10px;
}

.video-title { 
	text-align: center;
	padding-left: 10px;
	padding-right: 10px;
}

#video-library .slick-prev:before,#video-library .slick-next:before{
    color:#036;
    font-size:30px !important;
}

#video-library .slick-prev {
    left: -40px;
}
#video-library .slick-next{
    right: -30px;
}

.slide {
    display:none;
}

@media(max-width:600px) {
	#video-library .slick-prev,#video-library .slick-next{
		display:none !important;
	}
}


/* -------------------------------------------------*/
/* Youtube Lazy Load                                */
/* Goes with JS in JS.php                           */
/* -------------------------------------------------*/
/* https://webdesign.tutsplus.com/tutorials/how-to-lazy-load-embedded-youtube-videos--cms-26743*/
.youtube {
    background-color: #000;
    margin-bottom: 15px; /* less space between video and video title text */
    position: relative;
    padding-top: 56.25%;
    overflow: hidden;
    cursor: pointer;
}
.youtube img {
    width: 100%;
    top: -16.84%;
    left: 0;
    opacity: 0.7;
}
.youtube .play-button {
    width: 90px;
    height: 60px;
    background-color: #333;
    box-shadow: 0 0 30px rgba( 0,0,0,0.6 );
    z-index: 1;
    opacity: 0.8;
    border-radius: 6px;
}
.youtube .play-button:before {
    content: "";
    border-style: solid;
    border-width: 15px 0 15px 26.0px;
    border-color: transparent transparent transparent #fff;
}
.youtube img,
.youtube .play-button {
    cursor: pointer;
}
.youtube img,
.youtube iframe,
.youtube .play-button,
.youtube .play-button:before {
    position: absolute;
}
.youtube .play-button,
.youtube .play-button:before {
    top: 50%;
    left: 50%;
    transform: translate3d( -50%, -50%, 0 );
}
.youtube iframe {
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
}

/* -------------------------------------------------*/
/* Cool HR Styles                                   */
/* -------------------------------------------------*/
/* https://codepen.io/ibrahimjabbari/pen/ozinB*/
hr.style1{
	border-top: 1px solid #8c8b8b;
    clear:both;
}


hr.style2 {
	border-top: 3px double #8c8b8b;
    clear:both;
}

hr.style3 {
	border-top: 1px dashed #8c8b8b;
    clear:both;
}

hr.style4 {
	border-top: 1px dotted #8c8b8b;
    clear:both;
}

hr.style5 {
	background-color: #fff;
	border-top: 2px dashed #8c8b8b;
    clear:both;
}


hr.style6 {
	background-color: #fff;
	border-top: 2px dotted #8c8b8b;
    clear:both;
}

hr.style7 {
	border-top: 1px solid #8c8b8b;
	border-bottom: 1px solid #fff;
    clear:both;
}


hr.style8 {
	border-top: 1px solid #8c8b8b;
	border-bottom: 1px solid #fff;
    clear:both;
}
hr.style8:after {
	content: '';
	display: block;
	margin-top: 2px;
	border-top: 1px solid #8c8b8b;
	border-bottom: 1px solid #fff;
    clear:both;
}

hr.style9 {
	border-top: 1px dashed #8c8b8b;
	border-bottom: 1px dashed #fff;
    clear:both;
}

hr.style10 {
	border-top: 1px dotted #8c8b8b;
	border-bottom: 1px dotted #fff;
    clear:both;
}


hr.style11 {
	height: 6px;
	background: url(https://ibrahimjabbari.com/english/images/hr-11.png) repeat-x 0 0;
    border: 0;
    clear:both;
}


hr.style12 {
	height: 6px;
	background: url(https://ibrahimjabbari.com/english/images/hr-12.png) repeat-x 0 0;
    border: 0;
    clear:both;
}

hr.style13 {
	height: 10px;
	border: 0;
	box-shadow: 0 10px 10px -10px #8c8b8b inset;
    clear:both;
}


hr.style14 { 
  border: 0; 
  height: 1px; 
  background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); 
    clear:both;
}


hr.style15 {
	border-top: 4px double #8c8b8b;
	text-align: center;
    clear:both;
}
hr.style15:after {
	content: '\002665';
	display: inline-block;
	position: relative;
	top: -15px;
	padding: 0 10px;
	background: #f0f0f0;
	color: #8c8b8b;
	font-size: 18px;
}

hr.style16 { 
  border-top: 1px dashed #8c8b8b; 
    clear:both;
} 
hr.style16:after { 
  content: '\002702'; 
  display: inline-block; 
  position: relative; 
  top: -12px; 
  left: 40px; 
  padding: 0 3px; 
  background: #f0f0f0; 
  color: #8c8b8b; 
  font-size: 18px; 
}


hr.style17 {
	border-top: 1px solid #8c8b8b;
	text-align: center;
    clear:both;
}
hr.style17:after {
	content: '§';
	display: inline-block;
	position: relative;
	top: -14px;
	padding: 0 10px;
	background: #fff;
	color: #8c8b8b;
	font-size: 18px;
	-webkit-transform: rotate(60deg);
	-moz-transform: rotate(60deg);
	transform: rotate(60deg);
}


hr.style18 { 
  height: 30px; 
  border-style: solid; 
  border-color: #8c8b8b; 
  border-width: 1px 0 0 0; 
  border-radius: 20px; 
  clear:both;
} 
hr.style18:before { 
  display: block; 
  content: ""; 
  height: 30px; 
  margin-top: -31px; 
  border-style: solid; 
  border-color: #8c8b8b; 
  border-width: 0 0 1px 0; 
  border-radius: 20px; 
}





#google_translate_element{
    display:inline-block;
}
#google_translate_element span{
    display:none;
}
#google_translate_element *{
    max-height: 25px;
}
div#google_translate_element div.goog-te-gadget-simple{background-color:#337ab7;border:none}
div#google_translate_element div.goog-te-gadget-simple a.goog-te-menu-value span{color:white}
div#google_translate_element div.goog-te-gadget-simple a.goog-te-menu-value span:hover{color:#ffffff}