@media (max-width: 800px){
    .mobileleft li a{text-align:left !important;}
    .mobileleft li{text-align:left !important;}
}

.logospoorthi{margin:7px 10px !important;}
.dropdown{
    margin: 0px 0px !important;
}
.zeropad{
    margin-top:-12px !important;
}
.bordernone td{border:0px !important }
.border0{border:0px !important;}
.width100{width:100% !important;}
.tableth th{background-color:#ccc !important; padding:3px !important;}

body{
    margin:0px auto;
    padding:0px;	
    font-family: 'Arial';
    color:black;
    line-height:26px;	
    word-wrap:break-word;
     /*background-image:url('https://goqii.com/blog/wp-content/uploads/Doctor-Consultation.jpg')*/
   background: #cdbb97;
}
    .headtext{
        margin:0px auto;
	padding:0px;	
        font-family: 'source_sans_proregular';
	color:#f7da01 !important;
	line-height:26px;	
	word-wrap:break-word;
    }

.dropprofile{    top: 11px;
    color: #FFF;}
.mydrop{    text-align: left;
    margin-top: 7px;
    top: 25px;
    left: -80px !important;}
.mydrop li{
        display: inline-block !important;
}
.subheading{
    color: #20216d !important;
    font-family: 'source_sans_prosemibold';
    /*background-image: url(../images/line.png);
    background-repeat: no-repeat;
    background-position: left bottom;*/
    padding-bottom: 10px;
    font-size: 18px;
    margin: 5px 0px;
}
.btn{
    width:auto;
    margin:3px;
}
.marginminus{margin-top:-10px !important;}
.paddingtop15{padding-top:15px !important;}
.paddingtop{
    padding-top:50px !important;
}
.logoimg{
    border-radius:0px;
}
.background-blue1{
background-color:#337ab7 !important;
}
.background-blue{
background-color:#606a86 !important;
border: 3px solid #f8f8f8 !important;
padding: 5px;
}
.tableprint{width:100%;}
.background-bluegreen{
background-color:#3fa6fe !important;
}
.background-bluesecond{
background-color:#3fa6fe !important;
}
.carddesign{
    margin: 0px 0 13px 0;
    border: 1px solid #ececec;
    border-radius: 25px;
    padding: 5px;
    color: #fff;
    font-size:18px;
    text-align: center;
}
.carddesign .color,.carddesign .color:hover{ color:#ffb300 !important; font-size:18px; text-align: center;}
.hasDatepicker{
    width: 100%;
    padding: 5px 0;
    border-radius: 4px;
    border: 1px solid #ccc;
}   
.inner-pages {
    background: #f8f8f8;
    padding: 10px 30px 30px 30px;
    height:100%;
}

* {
	box-sizing: border-box;
}


.entry-content p {
    text-align: justify;
}


.h2blue {
	color: #20216d !important;
        font-family: 'source_sans_prosemibold';
	background-image: url(../images/line.png);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding-bottom:10px; 
        font-size:22px;
        margin: 5px 0px;
}

hr{
	border-style: inset;
    border-color:#14a5e4 ; 
    border-width: 1px;
}

.removepadding {padding:0px !important;}
.removemargin {margin:0px;}
.printletter{
      border: 1px solid #dcdada;
    border-radius: 10px;
    padding: 10px;
    background-color: #fff;
    margin: 10px;
}
.textalign-right{
   text-align: right !important; 
}

.fa {margin-right: 10px;}
.btn, .fa {color:#fff !important;}

.container {
	max-width: 1200px;
}

a { color: #20216d !important; }

.dashboard-top-menu a {color:#ffe200 !important;}

.line {
	margin-top: 10px;
	padding: 0px;

}

/*#f1eeee;*/
table.block-table tr td {border:0px  !important;}
table.table tr td a.btn{ padding:2px 12px !important;}

table.table tr td {border-top: 0px; vertical-align: middle; border:1px solid #e4e2e2;}
table.table tr th {background:#e6e5e1; border:1 solid #e4e2e2; vertical-align: middle;font-family: 'ralewaylight';}
table.table tr th h4 {margin:1px;}

.table {
    width: 99% !important;
}

.form-group {margin-bottom: 0px;}

.glyphicon {margin-right: 10px;}

.row {
    margin: 0px !important;
}

.primary-bg {background:#174873 !important; color:#fff!important;}
.secondary-bg {background:#14a5e4 !important;color:#fff!important;}

/*-------------- Fonts --------------------*/


@font-face {
    font-family: 'source_sans_proregular';
    src: url('../fonts/sourcesanspro-regular-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'source_sans_prosemibold';
    src: url('../fonts/sourcesanspro-semibold-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'ralewaybold';
    src: url('../fonts/raleway-bold-webfont.woff2') format('woff2'),
         url('../fonts/raleway-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ralewayextralight';
    src: url('../fonts/raleway-extralight-webfont.woff2') format('woff2'),
         url('../fonts/raleway-extralight-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ralewaylight';
    src: url('../fonts/raleway-light-webfont.woff2') format('woff2'),
         url('../fonts/raleway-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ralewaymedium';
    src: url('../fonts/raleway-medium-webfont.woff2') format('woff2'),
         url('../fonts/raleway-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'ralewayregular';
    src: url('../fonts/raleway-regular-webfont.woff2') format('woff2'),
         url('../fonts/raleway-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'ralewaysemibold';
    src: url('../fonts/raleway-semibold-webfont.woff2') format('woff2'),
         url('../fonts/raleway-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

/*-------------- top Header Section -------------*/

.menu-button{
  width:25px;
  height:25px;
  cursor: pointer;
}

.menu1bar{
  height:5px;
  background: #fff;
  margin:3px;
  width:100%;
  display: block;
  transform: rotate(30deg) translate(5px, 1px);
  transition: 0.7s;
}

.menu2bar{height:5px;
  background: #fff;
  margin:3px;
  width:100%;
  display: block;
  transform: rotate(-30deg) translate(0px, 7px);
  transition: 0.7s;
}


.menu1bar1 {
    transform: rotate(-30deg) translate(-5px, 4px);
    transition: 0.7s;
}

.menu2bar2 {
    transform: rotate(30deg) translate(3px, 9px);
    transition: 0.7s;
}

.my-menu {
	border-right: 1px solid #e5dc1c;
}

ul.top-email-contact {
	padding: 0px;
	float: right;
	margin: 0px;
}

ul.top-email-contact li {
	display: inline;
	list-style: none;
	padding: 0 10px;
	color: #fff;

}

ul.top-email-contact li a{
	color: #fff;
	
}
.no-border{
    border:0px !important;
}
.aligntdtext{
    width: 200px;
}
/*-------------- Main Header Section -------------*/
.main-header {
    padding: 5px 2px;
    border-bottom: 1px solid #e0e0e0;
    background: #fff;
}

.header-search {
	width: 100%;
	max-width: 300px;
	float: right;
	margin-top: 13px;
}

.glyphicon-search {
    color:#242424 !important;
}

.search-button {
    background: #d4d4d4;
    height: 34px;
}

.search-button:hover {
    background: #d4d4d4;
    height: 34px;
}
/*---- avtar -----------*/
.student-avtar {
	width: 125px;
	height: 130px;
	overflow: hidden;
	margin-top:18px !important;
	text-align: center;
	margin: 0px auto;
}

.student-avtar img {
border:3px solid #e0e0e0;
}

/*--------------- dashboard ---------------------------------------------*/
.dashbord-sidebar p, .dashbord-sidebar h6, .dashbord-sidebar h5, .dashbord-sidebar h4, .dashbord-sidebar h3, .dashbord-sidebar h2, .dashbord-sidebar h1 {
	/*color: #c0c0c0;*/
      color: #ffb300;
}

.dropdown-toggle {
	cursor: pointer;
}

.dashboard-top-menu{
	background: #20216d;
	padding: 5px;
}





/*---------------- Dash Board Sidebar ---------------*/
.dashbord-sidebar{
  /*background: #242424;*/
  background:#ffb300;
  padding: 10px;
  box-sizing: border-box;
  height: 100%;
 /* margin-left: -300px;*/
  margin-left: 0px;
    overflow: auto;
}


.user-image{
	text-align: right;
	padding: 10px 0px;
}

.user-image > img {
    border: 2px solid #337ab7;
    border-radius: 50%;
    width: 10%;
}

ul.list-tabs li p {
    margin: 0px;
}

/*---------- Left List tabls ---------------*/

ul.list-tabs {
  padding: 0px;
  margin-top:15px;
  overflow: hidden;
}


ul.list-tabs li{
  list-style: none;
  text-align: left;
  margin-top: 3px; 
}



ul.list-tabs li a {
    color: #fff !important;
    display: block;
    padding: 5px 15px;
    border-radius: 6px;
    width: 100%;
    text-decoration:none;
    /*background:#3f3f3f;*/
    background: #20216d;
    cursor: pointer;
}


ul.list-tabs li a:hover{
  text-decoration:none; 
  color:#fff;
  background:#20216d;

}

.customer-tab{cursor: pointer;}

ul.tab-dropdown{
  padding-left:10px;

}

ul.customer-tab-dropdown li a {
  color: #fff !important;
    display: block;
    padding: 5px;
    width: 100%;
    text-decoration:none;
    background:#000;
}

ul.customer-tab-dropdown li{
  list-style: none;
}

ul.list-tabs li a:focus{background:#20216d;text-decoration:none;}

.logout-left-dropdown {
    text-align: center;
    margin-top: 7px;
}


/*------------ Content Area -----------
.col-sm-10.content-area {
	width:100%;
}
*/
.footerpad{
    background: #20216d;
    padding: inherit;
}

.content-area {
  overflow: show;
  background: #f8f8f8;
  height:100%;
  min-height: 548px;
 
}


/*-------------------------------- Landing page---------------------*/
.main-banner {
	text-align: center;

}

.ca-section {
	padding: 30px 0px;
}

.total-students, .total-faculties, .total-departments {
	background: #14a5e4;
	text-align: center;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-o-border-radius: 4px;
	font-color:#fff;
	padding: 15px;

}

.total-titles {
	color:#fff !important;
}

.total-figures {
	color:#fff !important;
	font-size: 124px;
	padding: 50px;
}

.footer-section .col-sm-12{
	background: #20216d;
	padding: 0px;
	color: #b1afaf;
	text-align: center;
}

/*----------------- Login Page ------------------*/
.login-page {
      background-color:#4f789a;
      display:inline-block;
      width:100%;
}
.background-color{background-color:#ffb300;}

.login-form {
    margin: 0px auto;
    float: right;
    opacity:0;
    width: 100%;
    animation-name: my-login;
    animation-fill-mode: forwards;
    animation-timing-function: linear;
    animation-duration: 0.7s;
    -webkit-animation-name: my-login;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 0.7s;
    -o-animation-name: my-login;
    -o-animation-fill-mode: forwards;
    -o-animation-timing-function: linear;
    -o-animation-duration: 0.7s;
    animation-delay: 3s;
}


@keyframes my-login {
   from{ margin-top:-500px;opacity:0;}
   to{ margin-top:150px;opacity:1;}
}

.login-form a {
    color:#fff !important;
}

.login-form .panel-body a {
    color:#000 !important;
}

.site-login-title {
    margin-top: 110px;
    padding-top:50px; 
    margin-left: 200px;
    position: relative;
    
}

.site-login-title img{
    position:absolute;
    top:0px;
    left:220px;
    
}


.login-title {
    font-size:50px;
    font-family: 'ralewaybold';
    color:#fff;
}

.sciences-title {
    font-size:50px;
    color:#fff;
    font-family: 'ralewaybold';
}

.tagline-title {
    font-size:18px;
    color:#fff;
}


/*------------- Date Picker ------------*/
#ui-datepicker-div {
    z-index:9999 !important;
}


/*------------- Flex Scroll ------------*/
.vscrollerbar {
    width: 10px;
    background-color: #8a8a8a !important;
}

#flex__1_mcontentwrapper {
    height: 100% !important;
    width: 100% !important;
}

/*---- Date of birth------------------*/
.select-dob {
    display: inline;
    float: left;
    margin-left:2px;
}

.dob-label {
    float: left;
    width: 100%;
}

#yii-debug-toolbar {
    display: none !important;
}

.dashb-link {
    cursor:pointer;
}

#attdate {
    width:30% !important;
}
#staffattdate{
    color:#000 !important;
}

/* Bootstrap Date & Time Picker -----------*/
.bootstrap-timepicker .input-group-addon {
    padding: 0px !important;
}

i.glyphicon.glyphicon-time {
    margin: 0px !important;
    padding: 2px !important;
}

.bootstrap-timepicker-widget table td input {
    width: 40px !important;
    margin: 0;
    text-align: center;
    padding: 0px;
}

.bootstrap-timepicker-widget table td {
    border: 0px !important;
}

/*--------- Left Time Picker-------------*/

.left-time-picker .dropdown-menu {
    left: inherit;
    right: 0!important;
}

.left-time-picker .bootstrap-timepicker-widget.dropdown-menu:before {
    left: inherit !important;
    right: 9px !important;
}

.left-time-picker .bootstrap-timepicker-widget.dropdown-menu:after {
    left: inherit !important;
    right: 10px !important;
}

.table-searh-input {
    max-width: 300px;padding:10px 0px;width: 100%;
}

.staff-landingpage-profile {
    border-bottom:1px solid #ccc;
    margin-bottom:10px;
}

.profile-designation {
    margin-top: 27px;
    border-left: 1px solid #ccc;
}

/*----- Add More Buttons ----*/
ul.Addmore {
    float: right !important;
}

ul.Addmore li {
    display: inline !important;
    list-style: none !important;
    padding: 0px 10px !important;
    cursor: pointer;
}

.removemargin{margin:0px !important;}

.table-responsive{
    border-radius: 6px !important;
}







/*--------------- Media queries--------------------*/

@media screen and (max-width: 768px) {
    .paddingtopbottom {
    padding: 5px 0px !important;
}
    .item blockquote{
             border-left: none !important;
    }
         .mobile-left{text-align:left !important;}
	/*.block-table tr td {
	    width: 100%;
	    float: left;
	    display: block;
	}*/
    ul.top-email-contact li{display:block;}
    ul.top-email-contact{float:none;}
    
	.bfh-datepicker-calendar > table.calendar > tbody > tr > td {
		width: initial !important;
	    float: none !important;
	    display: initial !important;
	}

        

	.avatar-right-content {
		overflow-x:scroll;
		
	}

	* {
		text-align: center;
		margin: 0px auto;
	}


	.h2blue {

	    background-position: center bottom;

	}

	.dashbord-sidebar {
		margin-left: 0px;
	}

	.menu-button {
		display: none;
	}
        
        .select-dob {
            float:none;
            width:100% !important;
        }
        
        #attdate {
        width:100% !important;
    }
    
    .header-search {
        float:none;
    }
    
    .student-avtar {
        width: auto !important;
        height: auto !important;
    }
    
    .site-login-title {
         margin-top: 0px; 
        padding-top: 50px;
        margin-left: 0px; 
        position: relative;
    }
    
    .site-login-title img {
        position: inherit;
        top: inherit;
        left: inherit;
    }
    
    @keyframes my-login {
        from{ margin-top:-500px;opacity:0;}
        to{ margin-top:0px;opacity:1;}
     }
     
     .login-page {
     background-color:#4f789a; 
     }
     
}

@media screen and (min-width:768px) and (max-width:1024px) {
    .student-avtar {
        width: auto !important;
        height: auto !important;
     }
     
     .login-title, .sciences-title {
    font-size: 38px;
     }
}

/*@media print {
    .lettersm,.col-sm-6, .col-sm-12, .col-lg-6{
        width:300px !important;
        height:300px !important;
    }
    .tableprint{
       width:100% !important;
   }
   .widthprint{width:400% !important;}

    /*.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
        float: left;
      } */
     /* .col-sm-12 {
        width: 100%;
      }
      .col-sm-11 {
        width: 91.66666666666666%;
      }
      .col-sm-10 {
        width: 83.33333333333334%;
      }
      .col-sm-9 {
        width: 75%;
      }
      .col-sm-8 {
        width: 66.66666666666666%;
      }
      .col-sm-7 {
        width: 58.333333333333336%;
      }
      .col-sm-6 {
        width: 50%;
      }
      .col-sm-5 {
        width: 41.66666666666667%;
      }
      .col-sm-4 {
        width: 33.33333333333333%;
       }
       .col-sm-3 {
         width: 25%;
       }
       .col-sm-2 {
         width: 16.666666666666664%;
       }
       .col-sm-1 {
        width: 8.333333333333332%;
       }
     
     a[href]:after {
        content: none !important;
      }
     table {
                border: solid white !important;
                border-width: 1px 0 0 1px !important;
                border-bottom-style: none;
            }

            th, td {
                border: solid white !important;
                border-width: 0 1px 1px 0 !important;
                border-bottom-style: none;
               
   }
   
   .actionclass{display:none !important;}
}*/
   
   
 
 /*--------------- Add And Remove Buttons ------------*/
.addremovebuttons{float:right;cursor:pointer;}
.addremovebuttons li{list-style:none;display:inline;padding-right:5px;}
.addremovebuttons li:hover{text-decoration:none;color:#fff;transition:0.6s;}



.update-pass-section {
        max-width: 350px;
        width: 100%;
        padding: 15px;
        margin-top:50px;
      }

      .updt-pass-submit{
        margin-top:15px;
      }
      
      
/*------Time table button -------------*/
.timetab-btn {
    white-space: normal !important;
    background-color: #337ab7 !important;
    border-color: #2e6da4 !important;
    color:#e0e0e0;
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}

.titlefont{
    font-size:38px !important;
}
.myinput, .select2-selection--single{
    background: transparent none repeat scroll 0 0 !important;
    border-color: #000 !important;
    border-style: none none solid !important;
    border-width: 0 0 1px !important;
    color: #000 !important;
    text-indent: 10px;
    width:100%;

}

.myselect{
    background: transparent none repeat scroll 0 0;
    border-color: #c9c9c9 !important;
    border-style: none none solid !important;
    border-width: 0 0 1px !important;
    color: #000 !important;
    text-indent: 10px;
    min-width:100%;
}

/* table css for mobile view as a block*/
@media only screen and (max-width: 800px) {
    .labelcolor{text-align: left;
        margin: 0;
        display: flex;}
    .lable1{display:inline-block !important;}
    .nav > li > a{text-align:left !important;}
    .select-editable input {    width: 90% !important;}
    .select-editable select{width:100% !important;}
    .panel-body{padding:0px !important;}
    .textleft{text-align: left !important;}
    .removepadding{padding:0px;}
    .select-editable {
            margin: 0 !important;
    width: 178px !important;
    height: 25px !important;
 }
    /* Force table to not be like tables anymore */
    #no-more-tables table,
    #no-more-tables thead,
    #no-more-tables tbody,
    #no-more-tables th,
    #no-more-tables td,
    #no-more-tables tr {
    display: block;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    #no-more-tables thead tr {
   
    top: -9999px;
    left: -9999px;
    color: royalblue;
    }
    table.table tr td{border:0px !important;}
     #no-more-tables td{ border-bottom: 1px solid #FFF !important; padding:5px; }
    #no-more-tables tr{border:2px solid #656565;margin-bottom:10px;padding:10px; border-radius:10px;}
    #no-more-tables td {
    /* Behave like a "row" 
    border: 1;
    border-bottom: 1px solid #eee;
    /*position: relative;
    /*padding-left: 50%;*/
     
    white-space: normal;
    text-align:left;
    }

    #no-more-tables td:before {
    /* Now like a table header */
    /*position: absolute;*/
    /* Top/left values mimic padding */
    top: 6px;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
    text-align:left;
    font-weight: bold;
    }

    /*
    Label the data
    */
    #no-more-tables td:before { content: attr(data-title); }
    }
    
    .paddingtopbottom{
        padding:35px 0px;
        text-align: center
    }
    .paddingtopbottomfooter{
        padding:3px 0px;
        text-align: center;
        color: white !important;
    }
    .paddingtopbottomfooter .p {
        margin: 0 0 3px !important;
    }
   
    /*Slider*/
    /* carousel */
#quote-carousel 
{
  
}

/* Control buttons  */
#quote-carousel .carousel-control
{
  background: none;
  color: #222;
  font-size: 2.3em;
  text-shadow: none;
  margin-top: 30px;
}
/* Previous button  */
#quote-carousel .carousel-control.left 
{
  left: -12px;
}
/* Next button  */
#quote-carousel .carousel-control.right 
{
  right: -12px !important;
}
/* Changes the position of the indicators */
#quote-carousel .carousel-indicators 
{
  right: 50%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the color of the indicators */
#quote-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
#quote-carousel .carousel-indicators .active 
{
  background: #333333;
}
#quote-carousel img
{
  width: 270px !important;
  height: 100px !important;
}
/* End carousel */

.item blockquote {
/*    border-left: none; */
    margin: 0;
}

.item blockquote img {
    margin-bottom: 10px;
}

.item blockquote p:before {
    content: "\f10d";
    font-family: 'Fontawesome';
    float: left;
    margin-right: 10px;
}



/**
  MEDIA QUERIES
*/

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 
    #quote-carousel 
    {
      margin-bottom: 0;
/*      padding: 0 40px 30px 40px;*/
    }
    
}

/* Small devices (tablets, up to 768px) */
@media (max-width: 768px) { 
    
    /* Make the indicators larger for easier clicking with fingers/thumb on mobile */
    
    #quote-carousel .carousel-indicators {
        bottom: -20px !important;  
    }
    #quote-carousel .carousel-indicators li {
        display: inline-block;
        margin: 0px 5px;
        width: 15px;
        height: 15px;
    }
    #quote-carousel .carousel-indicators li.active {
        margin: 0px 5px;
        width: 20px;
        height: 20px;
    }
}

/*slider*/



/* Hamburger */
.hamberger {
    width: 40px;
    height:auto;
    position: fixed;
    z-index: 9999999;
    top: 40px;
    right: 14px;
    background:#1ABB9C;   
    cursor:pointer;
    border-radius:4px;
    -webkit-border-radius:4px;
    -o-border-radius:4px;
    padding:5px;
    box-sizing:border-box;
}

.hamberger-ico {
    height:4px;
    background:#fff;    
    width:100%;
    margin: 5px 0px;
    border-radius:4px;
    -webkit-border-radius:4px;
    -o-border-radius:4px;
    
}

.h-ico-a, .h-ico-b, .h-ico-c {
    transition:0.7s;
}

.h-ico-aa {
    transform: rotate(43deg) translate(6px,6px);
    transition:0.7s;
}


.h-ico-cc {
    transform: rotate(-42deg) translate(6px,-7px);
    transition:0.7s;
}

.h-ico-bb {
    animation:mymenu 0.7s linear forwards;
    -webkit-animation:mymenu 0.7s linear forwards;
    -o-animation:mymenu 0.7s linear forwards;
}

@keyframes mymenu {
    to {opacity:0;}
}

@-webkit-keyframes mymenu {
    to {opacity:0;}
}
@-o-keyframes mymenu {
    to {opacity:0;}
}