/*#1ca0de */
:root {
    --boxC:  #5a2a11;
   
      --text_yellow: #cf9549 ;
    --textC:rgb(1, 20, 64);
    --textBlue: #337ab7;
    --color_misc1: #5a2a11;
    --color_misc: #d23d2f;
  }
  @import url("https://use.fontawesome.com/releases/v5.13.0/css/all.css");
  body {
    font-family: 'Roboto', sans-serif;
    background-color: rgb(248, 248, 248);
  }
  
  #content ul {
    list-style: none;
  }
  #content ul li {
    padding-left: 15px;
  }
  #content ul li:before {
    font-family: "Font Awesome 6 Free";
    font-weight: 400;
    content: "\f0a4"" ";
    color: var(--color_misc1);
  }
  .box {
    border: 1pt solid lightgrey !important;
    border-radius: 10px !important;
    background-color: white !important;
    box-shadow: #F0F0F0 !important;
    padding: 10px !important;
    padding-top: 2px !important;
  }
  i {
    margin-right: 5px;
    color: var(--color_misc1);
    font-size: 60px;
  }
  .socialMobile a {
    display: inline;
    margin-left: 10px;
    color: white;
    text-decoration: none;
  }
  .socialMobile a i.fa-facebook {
    color: white;
  }
  .socialMobile a i {
    color: white;
    margin-right: 5px;
  }
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  span {
    color: var(--textC);
  }
  h1.media-heading {
    color: black;
    opacity: 0.8;
   
  }
  p {
    color: #000034;
    font-size:16px;
    opacity: 0.8;
    text-align: justify !important;
  }
  p.heading {
    color: #3278a9 !important;
    font-size: 24px !important;
    margin-top: 10px;
    text-indent: 0px !important;
  }
  p.heading::before {
    font-family: "Font Awesome 5 Brands";
    content: '\f35a';
    /* You should use \ and not /*/
    margin-right: 10px;
    color: black;
  }
  p.text {
    color: ;
    opacity: 0.9;
    font-size: 16px;
  }
  .departments p{text-align: center !important;}
  h3 {
    background-color: #047f49;
    padding: 5px;
    border-radius: 0px;
    font-size: 16px;
    text-align: center;
    background: rgb(255, 255, 255);
    background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(4, 127, 73, 0.9808298319327731) 50%);
    background: rgb(2, 0, 36);
    background: rgb(1, 20, 64);
   
    background: linear-gradient(90deg, var(--boxC) 0%, var(--text_yellow) 80%,var(--boxC) 100%);
    
    color:white;
    margin-top:0px !important; 
    padding:15px !important; 
    width:102%;
    margin-left: -10px;;

    
  }
  h3::after {
    content: " ===";
    font-size: 10px;
    color: white;
  }
  h3::before {
    content: "=== ";
    font-size: 10px;
    /*color: var(--color_misc);*/
    color: white;
  }
  #content h4.text,
  h4 {
    color: var(--color_misc1);
    font-family: 'Times New Roman', serif;
  }
  #content p.text {
    font-size: 12pt;
    font-family: 'Times New Roman', serif;
    color: #000000;
    background-color: transparent;
    font-weight: 400;
    font-style: normal;
    font-variant: normal;
    text-decoration: none;
    text-align: justify !important;
  }
  
  a {}
  span {}
  .ticker-a {
    color: white;
    padding-top: 5px;
  }
  .glyphicon-time {
    color: var(--color_misc) !important;
    font-weight: 800;
  }
  .ticker-i {
    color: var(--color_misc);
  }
  .ticker {
    display: inline-block;
    overflow-y: hide;
    list-style: none;
    height: 30px;
    borders: 1pt solid red;
  }
  .ticker li {
    display: inline-block;
    margin-left: 10px;
    list-style: none;
  }
  .ticker li a {
    font-size: 16px;
    color: white;
  }
  .ticker li sup {
    background-color: var(--boxC);
    color: white;
    font-size: 12px;
    padding: 2px;
    font-weight: 600;
    border-radius: 5px;
  }
  .ticker li sup::before {
    content: "New";
    font-size: 10px;
  }
  .ticker li i {
    color: white;
    font-size: 12px;
  }
  #contentSection li {
    list-style: none;
    color: black;
    margin-bottom: 10px;
    font-size: 16px !important;
  }
  #contentSection li::before {
    font-family: "Font Awesome 5 Free";
    content: '\f35a';
    /* You should use \ and not /*/
    margin-right: 10px;
    color: var(--color_misc);
  }
  dd::before {
    font-family: "Font Awesome 5 Free";
    content: '\f14a' !important;
    color: var(--color_misc);
    margin-right: 10px;
  }
  dd {
    color: black;
    margin-bottom: 10px;
    font-size: 16px !important;
  }
  dd span {
    margin-right: 10px;
    color: var(--color_misc)red;
  }
  #contentSection span.glyphicon-hand-right {
    colors: var(--color_misc) !important;
  }
  .glyphicon {
    display: none;
    color: black;
    margin-bottom: 10px;
    font-size: 18px;
    opacity: 0.9;
  }
  .more {
    background-colors: var(--boxC);
    color: var(--boxC);
    border-radius: 4px;
    padding: 2px;
    float: right;
    font-size: 12px;
    ;
  }
  .more:hover {
    background-color: grey;
    color: white;
  }
  #leftmenu p {
    background-color: var(--boxC);
    border-radius: 10px;
    padding: 10px;
    text-align: center
  }
  #leftmenu p i {
    font-size: 22px;
  }
  #leftmenu p a {
    font-size: 18px;
    font-weight: 700;
    color: white;
  }
  #leftmenu p span {
    font-size: 10px;
    color: white;
    display: block;
  }
  /**************************************************************************/
  /*********************************************************************events print****************************/
  .event-list {
    color: #337ab7;
  }
  .event_list i {
    display: inline;
  }
  .event_list h6.event_list-title a {
    color: #337ab7 !important;
    font-size: 14px !important;
  }
  .event_list h6.event_list-title span.glyphicon.glyphicon-time {
    display: inline !important;
    font-size: 12px;
  }
  .event_list h6.event_list-title i {
    display: inline;
    font-size: 12px;
  }
  .event_list-description {
    display: none;
  }
  .event_list-categories {}
  .event_list-stat {
    color: black;
  }
  /*********************************************************************events print as list****************************/
  .event-caption .event-title {
    color: white;
    font-size: 13px;
    position: absolute;
    top: 30%;
    left: 30%;
    -webkit-transform: translate(-30%, -30%);
    -ms-transform: translate(-30%, -30%);
    transform: translate(-30%, -30%);
  }
  .event-description {
    display: none;
  }
  .event-categories {}
  .event-stat {
    color: black;
  }
  .event-caption {
    background-color: var(--boxC);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    transition: .5s ease;
  }
  .thumbnail {
    position: relative;
  }
  .thumbnail:hover .event-caption {
    opacity: 0.8;
  }
  #principalpic img {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    text-aligns: center;
    font-size: 30px;
    float: left;
    font-weight: bold;
    /* Change the shape according
                  to the image */
    shape-outside: polygon();
    margin: 7px;
  }
  p.admission_p {
    position: fixed;
    top: 60px;
    right: 40px;
    background-color: red;
    border-radius: 15px;
    padding: 20px;
    clip-paths: polygon(0% 15%, 15% 15%, 15% 0%, 85% 0%, 85% 15%, 100% 15%, 100% 85%, 85% 85%, 85% 100%, 15% 100%, 15% 85%, 0% 85%);
    background-color: #8BC6EC;
    background-image: linear-gradient(135deg, #8BC6EC 0%, #4c5594 100%);
    z-index: 50000;
  }
  p.admission_p a {
    color: white;
    font-size: 18px;
    font-weight: 800;
  }
  .teaching_staff_table,
  .teaching_staff_table a,
  .teaching_staff_table span {
    color: var(--boxC);
  }
  .teaching_staff_table h4 {
    color: var(--boxC);
  }
  /*******************************research*************************/
  .recent_publications {}
  .recent_publications i {}
  .recent_publications a {
    colors: var(--textBlue);
    text-decoration: none;
  }
  .recent_publications_span {
    colors: var(--textBlue);
    font-style: italic;
  }
  .recent_publications_span i {
    color: var(--color_misc);
    font-sizes: 25px;
  }
  /*******************************research*************************/
  /*******************************econtent*************************/
  .recent_econtent {}
  .recent_econtent a {
    colors: var(--textBlue);
    text-decoration: none;
  }
  .recent_econtent i {}
  /*******************************econtent*************************/
  .topnav {
    background-colors: #333;
    overflow: hidden;
    font-size: 16px;
    borders: 1pt solid red;
  }
  /* Style the links inside the navigation bar */
  .topnav a {
    float: left;
    display: block;
    color: red;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
  }
  /* Change the color of links on hover */
  .topnav a:hover {
    background-colors: #ddd;
    color: red;
  }
  /* Add an active class to highlight the current page */
  .actives {
    background-color: #4CAF50;
    color: white;
  }
  /* Hide the link that should open and close the topnav on small screens */
  .topnav .icon {
    display: none;
  }
  #topheader {
    border-bottom: 1pt solid darkgrey;
  }
  #collegelogo {
    position: absolute;
    display: none;
    vertical-align: middle;
    margin-top: 20px;
  }
  #collegename {
    font-size: 34px;
    font-weight: 800;
    margin-top: 10px;
    text-align: center;
    color: red;
    margin-left: -40px;
  }
  #collegetagline {
    text-align: center;
    font-style: italic;
    font-weight: 600;
    letter-spacing: 7px;
    opacitys: .6 color: #212221;
    padding-top: 4px;
    borders: 3pt solid red;
    margin-left: 30px;
  }
  .carousel-inner .item {
    height: 400px;
  }
  .item img {
    position: absolute;
    top: 0;
    left: 0;
    min-height: 300px;
  }
  
  .bgTransparent {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.5);
  }
  .bgBoxHeader {
    background: #70e1f5;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #70e1f5, #ffd194);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #70e1f5, #ffd194);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  }
  .eventbox {
    width: 100%;
    height: 180px;
  }
  /* for events*/
  div.polaroid {
    width: 100%;
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin-bottom: 25px;
  }
  div.container {
    text-align: center;
    padding: 10px 20px;
    color: red;
  }
  .footer_menu_links {
    displays: none;
    list-style: none;
  }
  .footer_menu_links li a {
    text-shadow: 0px -1px 0px #000;
    font-size: 14px;
    text-decoration: none;
    margin-left: 5px;
    text-decoration: none;
    color: darkgrey;
  }
  .footer_menu_links li i {
    color: white;
    font-size: 16px;
    font-weight: 500;
    margin-right: 3px;
    text-decoration: none;
  }
  #footer {
    border: 0pt solid black;
    clear: both;
    /* background:#000 url(images/footer.gif)  ;*/
    width: 100%;
    height: auto;
    margin: 0 auto 0 auto;
    text-align: left;
    padding-bottom: 60px !important;
  }
  #footer h5 {
    color: grey;
    font-weight: 500;
  }
  #footer p {
    border: 0pt solid black;
    font: 14px Arial, "Times New Roman", Times;
    width: 400px;
    color: #FDA041;
    ;
    width: auto;
    -moz-border-radius: 20px 20px 15px 15px;
  }
  .copyright {
    margin-top: 0px;
    font: 16px Arial, "Times New Roman", Times;
    color: #fff;
    text-decorations: underline;
    color: silver;
    font-size: 16px;
    text-shadow: 2px 2px 4px #000000;
    text-align: left
  }
  #footerss a {
    border: 0pt solid black;
    color: #FFF;
    text-decoration: underline;
  }
  #footerss a:hover {
    color: #C46A00;
    text-decoration: none;
  }
  div.topmenu {
    font-size: 14px;
  }
  div.topmenu .left {
    height: inherit;
    display: inline-block;
    margin-top: 1px;
    padding-left: 5px;
  }
  div.topmenu .left li i {
    color: var(--color_misc1) !important;
    size: 12px;
    font-weight: 500;
  }
  div.topmenu .left li {
    height: inherit;
    list-style: none;
    display: inline;
    margin-right: 20px;
  }
  div.topmenu .left li a {
    height: inherit;
    list-style: none;
    display: inline;
    margin-right: 20px;
    color: white;
    text-decoration: none;
  }
  div.topmenu .right {
    height: inherit;
    display: inline-block;
    margin-top: 1px;
    padding-left: 5px;
  }
  div.topmenu .right li i {
    color: #C46A00;
    size: 12px;
    font-weight: 500;
  }
  div.topmenu .right li {
    height: inherit;
    list-style: none;
    display: inline;
    margin-right: 20px;
  }
  div.topmenu .right li a {
    height: inherit;
    list-style: none;
    display: inline;
    margin-right: 20px;
    color: white;
  }
  div.topmenu a:hover {
    color: red;
  }
  ul.topmenu {
    list-style: none;
  }
  ul.topmenu li {
    display: inline-block !important;
  }
  ul.topmenu li a {
    color: white !important;
    text-decoration: none;
  }
  ul.topmenu li a:hover {
    color: var(--boxC) !important;
  }
  ul.topmenu li i {}
  #footer h3 {
    text-align: center;
    padding: 5px;
    border-radius: 10px;
  }
  @media only screen and (max-width: 768px) {
    [class*="col-"] {
      width: 100%;
    }
    .topNav {
      height: 60px;
      border: 1pt solid red;
      display: none;
      color: #3278a9;
    }
    .topNav .right {
      display: none;
    }
    .topMenu ul li {
      display: block;
    }
    .copyright {
      margin-top: 0px;
      font: 12px Arial, "Times New Roman", Times;
      color: #fff;
      text-decorations: underline;
      color: silver;
      font-size: 12px;
      text-shadow: 2px 2px 4px #000000;
      text-align: left
    }
    #myCarousel2 {
      clip-paths: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
      height: 340px !important;
    }
  }
  #menuCon {
    background-color: #1ca0de;
  }
  /*
   .menuUl{display: block;
              height: 40px;border:1pt solid red;
              padding-top: 14px;
            }
            .menuUl li{display: inline-block}
            .menuUl li a {padding:10px 20px 10px 20px;
              text-decoration: none;color:#3278a9;}
            .menuUl li a:hover{color:red;} 
  */
  /* Add a black background color to the top navigation */
  #headerImg {
    height: 300px;
    margin-top: 31px;
  }
  .onlyMobile {
    display: none;
  }
  .noMobile {
    display: inherit
  }
  /*for galler*/
  .caption {
    color: black;
  }
  .caption p {
    color: #1ca0de;
  }
  .caption dd {
    color: #1ca0de;
  }
  .caption h5 {
    color: #1ca0de;
  }
  .caption h6 {
    color: #1ca0de;
  }
  .caption .glyphicon {
    color: red;
    font-weight: 500;
  }
  /* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
  @media screen and (max-width: 600px) {
    .topnav a:not(:first-child) {
      display: none;
    }
    .topnav a.icon {
      float: right;
      display: block;
      .onlyMobile {
        display: inherit;
      }
      .noMobile {
        display: none;
      }
      #myCarousel2 {
        clip-paths: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
        height: 340px !important;
      }
    }
    /* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
    @media screen and (max-width: 600px) {
      .topnav.responsive {
        position: relative;
      }
      .topnav.responsive a.icon {
        position: absolute;
        right: 0;
        top: 0;
      }
      .topnav.responsive a {
        float: none;
        display: block;
        text-align: left;
        border-bottom: 2pt inset grey;
      }
      .topnav.responsive a.icon {
        border-bottom: 0pt inset grey;
      }
      #headerImg {
        height: 180px;
        margin-top: 0px;
      }
      .onlyMobile {
        display: inherit;
      }
      .noMobile {
        display: none;
      }
      #myCarousel2 {
        clip-paths: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
        height: 340px !important;
      }
    }
    .arrow-down {
      float: right;
      cursor: pointer;
      display: inline-block;
      border-left: 2px solid black;
    }
    .border {
      border: 3pt solid red;
    }
    .borderg {
      border: 1pt solid green;
    }
    .menuhover {}
    /* slider css */
    / .slider-pro {
      font-family: 'Open Sans', Arial;
    }
    /* Example 1 */
    #example1 .sp-thumbnail {
      width: 100%;
      padding: 8px;
      background-color: #F0F0F0;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    #example1 .sp-thumbnail-title {
      margin-bottom: 5px;
      text-transform: uppercase;
      color: #333;
    }
    #example1 .sp-thumbnail-description {
      font-size: 14px;
      color: #333;
    }
    @media (max-width: 860px) {
      #example1 .hide-medium-screen {
        display: none;
      }
    }
    @media (max-width: 640px) {
      #example1 .sp-layer {
        font-size: 12px;
      }
      #example1 .hide-small-screen {
        display: none;
      }
    }
    @media (max-width: 500px) {
      #example1 .sp-thumbnail {
        text-align: center;
      }
      #example1 .sp-thumbnail-title {
        font-size: 12px;
        text-transform: uppercase;
      }
      #example1 .sp-thumbnail-description {
        display: none;
      }
    }
    /* Example 3 */
    #example3 .sp-selected-thumbnail {
      border: 4px solid #000;
    }
    /* Example 4 */
    #example4 .sp-slides-container {
      background-color: #F4F4F4;
    }
    #example4 h3 {
      margin: 0 0 10px 0;
    }
    #example4 p {
      margin: 0 0 30px 0;
    }
    #example4 .sp-thumbnail-container {
      width: 200px;
      height: 130px;
      overflow: hidden;
      margin-bottom: 10px;
    }
    #example4 .sp-image-text {
      background: rgba(80, 80, 80, 0.5);
      color: #FFF;
      padding: 20px;
    }
    .links {
      text-align: center;
      margin-top: 10px;
    }
    /* Example 5 */
    #example5 .sp-thumbnail-image-container {
      width: 100px;
      height: 80px;
      overflow: hidden;
      float: left;
    }
    #example5 .sp-thumbnail-image {
      height: 100%;
    }
    #example5 .sp-thumbnail-text {
      width: 170px;
      float: right;
      padding: 8px;
      background-color: #F0F0F0;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    #example5 .sp-thumbnail-title {
      margin-bottom: 5px;
      text-transform: uppercase;
      color: #333;
    }
    #example5 .sp-thumbnail-description {
      font-size: 14px;
      color: #333;
    }
    @media (max-width: 500px) {
      #example5 .sp-thumbnail {
        text-align: center;
      }
      #example5 .sp-thumbnail-image-container {
        display: none;
      }
      #example5 .sp-thumbnail-text {
        width: 120px;
      }
      #example5 .sp-thumbnail-title {
        font-size: 12px;
        text-transform: uppercase;
      }
      #example5 .sp-thumbnail-description {
        display: none;
      }
    }