/*-----ROW-----*/
.row:after,.row:before{display: block;content: " ";clear: both;}



/*-----BUTTON-----*/
.btn{
  line-height: 1;
  font-family: 'Cabin', sans-serif;
  -webkit-font-smoothing: antialiased;
  font-size: 14px;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
  padding: 8px 12px;
  cursor: pointer;
  background-color: transparent;
  color: #fff !important;
  border: none;
  outline: 0;
  display: inline-block; 
  position: relative; 
  border-radius: 3px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
    
}


.btn-small{padding: 6px 10px;}
.btn-full-width{width: 100%;}
.btn-block{display: block}

.btn-icon{font-size: 0; padding: 0;}
.btn-icon span{display: inline-block;}
.btn-icon span.icon{color: #fff;padding: 8px 8px;}
.btn-icon span.txt{color: #fff;padding: 8px 12px;border-left:solid 1px #fff;}
.btn-icon-small span.icon{color: #fff;padding: 6px 6px;}
.btn-icon-small span.txt{color: #fff;padding: 6px 10px;border-left:solid 1px #fff;}

.btn-primary{background-color: #2388e4; transition:0.2s;} .btn-primary:hover{background-color:;}
.btn-success{background-color: #80d138; transition:0.2s;} .btn-success:hover{background-color:;}
.btn-info{background-color:#FFB04F; transition:0.2s;} .btn-info:hover{background-color:;}
.btn-warning{background-color: #f27f8d; transition:0.2s;} .btn-warning:hover{background-color:;}
.btn-danger{background-color: #7c7a7d; transition:0.2s;} .btn-danger:hover{background-color:;}
.btn-black{background-color: #000; transition:0.2s;} .btn-danger:hover{background-color:;}

.btn-primary-o{background-color:#fff;border:1px solid #2388e4;color: #2388e4 !important; transition:0.2s;} .btn-primary-o:hover{background:#2388e4;color: #fff !important; border-color:#2388e4 !important; transition: 0.2s;} 
.btn-success-o{background-color:#fff;border:1px solid #80d138;color: #80d138 !important; transition:0.2s;} .btn-success-o:hover{background:#80d138;color: #fff !important; border-color:#80d138 !important; transition: 0.2s;}
.btn-info-o{background-color:#fff;border:1px solid #FFB04F;color: #FFB04F !important; transition:0.2s;} .btn-info-o:hover{background:#FFB04F;color: #fff !important; border-color:#FFB04F !important; transition: 0.2s;}
.btn-warning-o{background-color:#fff;border:1px solid #f27f8d;color: #f27f8d !important; transition:0.2s;} .btn-warning-o:hover{background:#f27f8d;color: #fff !important; border-color:#f27f8d !important; transition: 0.2s;}
.btn-danger-o{background-color:#fff;border:1px solid #7c7a7d;color: #7c7a7d !important; transition:0.2s;} .btn-danger-o:hover{background:#7c7a7d;color: #fff !important; border-color:#7c7a7d !important; transition: 0.2s;}
.btn-black-o{background-color:#fff;border:1px solid #000;color: #000 !important; transition:0.2s;} .btn-black-o:hover{background:#000;color: #fff !important; border-color:#000 !important; transition: 0.2s;}
.btn-blue-o{background-color:#fff;border:1px solid #2B548E;color: #2B548E !important; transition:0.2s;} .btn-blue-o:hover{background:#2B548E;color: #fff !important; border-color:#2B548E !important; transition: 0.2s;}

.btn-default-o-trans{background-color:transparent;border:2px solid #ffffff;color: #ffffff; transition:0.2s;} 
.btn-default-o-trans:hover{background:#fff; color: #000 !important; transition: all 0.3s ease-in;} 

.btn-primary-o-trans{background-color:transparent;border:1px solid #2388e4;color: #2388e4 !important; transition:0.2s;} .btn-primary-o-trans:hover{background:#2388e4;color: #fff !important; border-color:#2388e4 !important; transition: 0.2s;} 
.btn-success-o-trans{background-color:transparent;border:1px solid #80d138;color: #80d138 !important; transition:0.2s;} .btn-success-o-trans:hover{background:#80d138;color: #fff !important; border-color:#80d138 !important; transition: 0.2s;}
.btn-info-o-trans{background-color:transparent;border:1px solid #FFB04F;color: #FFB04F !important; transition:0.2s;} .btn-info-o-trans:hover{background:#FFB04F;color: #fff !important; border-color:#FFB04F !important; transition: 0.2s;}
.btn-warning-o-trans{background-color:transparent;border:1px solid #f27f8d;color: #f27f8d !important; transition:0.2s;} .btn-warning-o-trans:hover{background:#f27f8d;color: #fff !important; border-color:#f27f8d !important; transition: 0.2s;}
.btn-danger-o-trans{background-color:transparent;border:1px solid #7c7a7d;color: #7c7a7d !important; transition:0.2s;} .btn-danger-o-trans:hover{background:#7c7a7d;color: #fff !important; border-color:#7c7a7d !important; transition: 0.2s;}
.btn-black-o-trans{background-color:transparent;border:2px solid #000;color: #000 !important; transition:0.2s;} .btn-black-o-trans:hover{background:#000;color: #fff !important; border-color:#000 !important; transition: 0.2s;}
.btn-blue-o-trans{background-color:transparent;border:2px solid #2B548E;color: #2B548E !important; transition:0.2s;} .btn-blue-o-trans:hover{background:#2B548E;color: #fff !important; border-color:#2B548E !important; transition: 0.2s;}

/*-----INPUT-----*/
/* Webkit  */
input::-webkit-input-placeholder {color: #ccc;transition: color 0.5s ease;}
input:focus::-webkit-input-placeholder {color: #fff;transition: color 0.5s ease;}
textarea::-webkit-input-placeholder {color: #ccc;transition: color 0.5s ease;}
textarea:focus::-webkit-input-placeholder {color: #fff;transition: color 0.5s ease;}
/* Firefox < 19 */
input:-moz-placeholder {color: #A3A3A3;transition: all 0.5s ease;}
input:focus:-moz-placeholder {color: #fff;transition: all 0.5s ease;}
textarea:-moz-placeholder {color: #A3A3A3;transition: all 0.5s ease;}
textarea:focus:-moz-placeholder {color: #fff;transition: all 0.5s ease;}
/* Firefox > 19 */
input::-moz-placeholder {color: #A3A3A3;transition: all 0.5s ease;}
input:focus::-moz-placeholder {color: #fff;transition: all 0.5s ease;}
textarea::-moz-placeholder {color: #A3A3A3;transition: all 0.5s ease;}
textarea:focus::-moz-placeholder {color: #fff;transition: all 0.5s ease;}
/* Internet Explorer 10 */
input:-ms-input-placeholder {color: #ccc;transition: color 0.5s ease;}
input:focus:-ms-input-placeholder {color: #fff;transition: color 0.5s ease;}
textarea:-ms-input-placeholder {color: #ccc;transition: color 0.5s ease;}
textarea:focus:-ms-input-placeholder {color: #fff;transition: color 0.5s ease;}


input, input[type="text"], input[type="password"],textarea{
  font-family: 'Cabin', sans-serif;
  /*-webkit-appearance:none;*/
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
  moz-osx-font-smoothing: grayscale;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
  margin: 0;
  background: #fff;
  outline: none;
  resize: none;
  box-shadow: none;}

input:focus, input[type="text"]:focus, input[type="password"]:focus,textarea:focus{
  background: #fff;
  outline: none;
  resize: none;
  box-shadow: none;
}

.input{
  position: relative;
	padding: 8px 10px;
	border-radius: 2px;
	border: 1px solid #c4c9cd;
	transition: all 0.5s ease;
  background: #fff;
  color: #030303;
  display: block;
}
.input:focus{color: #030303;border: 1px solid #030303;transition: all 0.5s ease;}
.input-full-width{width: 100%;}

.no-input-error{position: relative;}
.no-input-error .input{border-color: #da4e4e;}

.input-error{position: relative;}
.input-error .input{border-color: #da4e4e;}
.input-error:after{position: absolute;content: '';height: 6px;width: 6px;border-radius: 100%;background: #da4e4e;top: 50%;right: 10px;transform: translate(0, -50%);animation: error linear 0.2s;-webkit-animation: error linear 0.2s;-moz-animation: error linear 0.2s;-o-animation: error linear 0.2s;-ms-animation: error linear 0.2s;}
.error-txt{opacity: 1;font-size: 12px;color: #da4e4e;margin-top: 3px;}
.error-txt-animate{animation: errortxt linear 0.2s;-webkit-animation: errortxt linear 0.2s;-moz-animation: errortxt linear 0.2s;-o-animation: errortxt linear 0.2s;-ms-animation: errortxt linear 0.2s;}

.input-small{padding: 3px 10px;}
.input-inline{display: inline-block;}
.input-block{display: block;}

.input-group{line-height: 1.8;}
.input-group:after,.input-group:before{display: block;content: " ";clear: both;}

/*------CHECKBOX CUS------*/
.checkbox-cus{position: relative;}
.checkbox-cus input[type="checkbox"]:not(:checked),
.checkbox-cus input[type="checkbox"]:checked{
  position: absolute;
  left: -9999px;}

.checkbox-cus input[type="checkbox"]:not(:checked) + label,
.checkbox-cus input[type="checkbox"]:checked + label{
  position: relative;
  padding-left: 25px;
  cursor: pointer;
  color: #7c7a7d;
   -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* checkbox aspect */
.checkbox-cus input[type="checkbox"]:not(:checked) + label:before,
.checkbox-cus input[type="checkbox"]:checked + label:before {
  content: '';
  position: absolute;
  left:0; top: 0;
  width: 17px; height: 17px;
  border: 1px solid #C4C9CD;
  background: transparent;
  border-radius: 2px;
}
/* checked mark aspect */
.checkbox-cus input[type="checkbox"]:not(:checked) + label:after,
.checkbox-cus input[type="checkbox"]:checked + label:after {
  content: '';position: absolute;
  width: 10px;height: 4px;background: transparent;
  top: 6px;left: 4px;
  border: 2px solid #C4C9CD;border-top: none;border-right: none;
  -webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg);transform: rotate(-45deg);transition:all 0.4s ease;
  
}
/* checked mark aspect changes */
.checkbox-cus input[type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
}
.checkbox-cus input[type="checkbox"]:checked + label:after {
  opacity: 1;
  
}

/*-----SELECT-----*/
.custom-select{
  position: relative;
  display: inline-block;
  line-height: 1.4;
}

.custom-select select {
    font-family: 'Cabin', sans-serif;
    font-size: 14px;
   -webkit-font-smoothing: antialiased;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 8px 10px;      
    outline:none; /* remove focus ring from Webkit */
    border:1px solid #C4C9CD;
    color:#ccc;
    background:transparent;
    border-radius: 2px;
    width: 100%;
    transition: all 0.2s ease-out;

}
.custom-select select::-ms-expand {
    display: none;
}

.custom-select select:focus {
    color: #030303;
    border-color: #354350;
    transition: all 0.2s ease-in;
}

.custom-select:after{
    position:absolute;
    font-family: FontAwesome;
    content: "\f0d7"; 
    top:50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    color:#a0a0a0;
    right:8px;
    z-index: 0;
        
}

.custom-select.selected select{color: #030303;/*border-color: #030303*/}
.custom-select.selected:after{color: #030303;}


/*-----Well-----*/
[class*='well'] {
  padding: 10px;
  border-radius: 2px;
}
.well-default{background: #000;}
.well-primary{background: #2388e4;}
.well-danger{background: #7c7a7d;}
.well-success{background: #80d138;}
.well-info{background: #FFB04F;}
.well-warning{background: #f27f8d;}

.well-default-o{border: 1px solid #000;}
.well-primary-o{border: 1px solid #2388e4;}
.well-danger-o{border: 1px solid #7c7a7d;}
.well-success-o{border: 1px solid #80d138;}
.well-info-o{border: 1px solid #FFB04F;}
.well-warning-o{border: 1px solid #f27f8d;}

/*-----BADGE-----*/
[class*='badge'] {
  padding: 9px 13px;
  display: inline-block;
  border-radius: 2px;
  font-size: 20px;
  
}
.badge-default{background: #fff; color: #000;}
.badge-yellow{background: #fff; color: #E9D64F;}
.badge-green{background: #fff; color: #4CE6CF;}
.badge-red{background: #fff; color: #FF6F7F;}
.badge-brown{background: #fff; color: #9F6A3F;}
.badge-purple{background: #fff; color: #EA5AF6;}
.badge-blue{background: #fff; color: #6493B8;}


/*-----LINK-----*/
[class*='link'] {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.link-default{color: #000; text-decoration: underline;} .link-default:hover{color: #000;cursor: pointer;text-decoration: underline;}
.link-primary{color: #2388e4; text-decoration: underline;} .link-primary:hover{color: #2388e4;cursor: pointer;text-decoration: underline;}
.link-danger{color: #7c7a7d; text-decoration: underline;} .link-danger:hover{color: #7c7a7d;cursor: pointer;text-decoration: underline;}
.link-success{color: #80d138; text-decoration: underline;} .link-success:hover{color: #80d138;cursor: pointer;text-decoration: underline;}
.link-info{color: #FFB04F; text-decoration: underline;} .link-info:hover{color: #FFB04F;cursor: pointer;text-decoration: underline;}
.link-warning{color: #f27f8d; text-decoration: underline;} .link-warning:hover{color: #f27f8d;cursor: pointer;text-decoration: underline;}

.link-default-o{color: #000;} .link-default:hover{color: #000;cursor: pointer;text-decoration: underline;}
.link-primary-o{color: #2388e4;} .link-primary-o:hover{color: #2388e4;cursor: pointer;text-decoration: underline;}
.link-danger-o{color: #7c7a7d;} .link-danger-o:hover{color: #7c7a7d;cursor: pointer;text-decoration: underline;}
.link-success-o{color: #80d138;} .link-success-o:hover{color: #80d138;cursor: pointer;text-decoration: underline;}
.link-info-o{color: #FFB04F;} .link-info-o:hover{color: #FFB04F;cursor: pointer;text-decoration: underline;}
.link-warning-o{color: #f27f8d;} .link-warning-o:hover{color: #f27f8d;cursor: pointer;text-decoration: underline;}

/*-----COLOR-----*/

.c-default{color: #000;}
.c-primary{color: #2388e4;}
.c-danger{color: #7c7a7d;}
.c-success{color: #80d138;}
.c-info{color: #FFB04F;}
.c-warning{color: #f27f8d;}




/*------RADIO------*/
.radio{line-height: 1;}
.radio{position: relative;}
.radio:before{display: block;content: " ";clear: both;}
.radio:after{display: block;content: " ";clear: both;}
.radio input[type=radio]{display: none;}
.radio input[type=radio]+label{margin: 0;}
.radio label{width: 13px;height: 13px;border-radius: 100%;background: #fff;border:1px solid #7E7C7D;float: left;}
.radio input[type=radio]:checked + label {background: #7ed321;}
.radio span{float: left; margin-left: 3px;}
.radio-inline{display: inline-block; margin-right: 5px}


/*-----TABLE----*/
.table{position: relative;}
.table table{width: 100%;}
.table thead{background: #fff;}
.table thead th{color: #8b9dae;border: 1px solid #c4c9cd; font-weight: 100;position: relative;font-size: 14px;padding: 0;text-align: left;background-color: #eaeaea;}
.table thead th span{padding: 10px 8px; width: 100%;color:#000; display: block;cursor: default;}
.table thead th.has-filter span:after{position: absolute;font-family: FontAwesome;content: '\f0d8';font-size: 11px;top: 50%;right: 8px;transform: translateY(-75%); -webkit-transform: translateY(-75%);}
.table thead th.has-filter span:before{position: absolute;font-family: FontAwesome;content: '\f0d7';font-size: 11px;top: 50%;right: 8px;transform: translateY(-25%); -webkit-transform: translateY(-25%);}
.table thead th.has-filter:hover span{cursor: pointer;color: #5d5b5c;}
.table thead th.has-filter span:focus{cursor: pointer;color: #5d5b5c;}
.table table tbody tr:nth-of-type(odd) {background: #ffffff;}
.table table tbody tr:nth-of-type(even) {background: #ffffff;}
.table tbody td{border: 1px solid #c4c9cd; color: #7E7C7D;font-size: 14px;padding: 10px 8px;}


/*-----PAGINATION----*/
.pagination {position: relative;font-size: 0;line-height: 1;}
.pagination ul li{display:inline-block;}
.pagination ul li a{;padding: 6px 10px;border: 1px solid #c4c9cd;display: block;border-right: none;transition: background 0.2s ease;}
.pagination ul li.previous a{border-top-left-radius: 2px;border-bottom-left-radius: 2px;}
.pagination ul li.next a{border-right:1px solid #c4c9cd;border-top-right-radius: 2px;border-bottom-right-radius: 2px;}
.pagination ul li a:focus{color: #7E7C7D;}
.pagination ul li a:hover{background:#354350;color: #fff;transition: background 0.2s ease;}
.pagination ul li.active a{color: #fff;background:#354350;}
.pagination ul li.disable a{cursor: no-drop;color: #ccc;}
.pagination ul li.disable a:hover{cursor: no-drop; background: #fff;color: #ccc;}

.pagination-no-number {position: relative;font-size: 0;line-height: 1;}
.pagination-no-number ul li{display:inline-block;}
.pagination-no-number ul li a{;padding: 6px 10px;border: 1px solid #e0e0e0;display: block;transition: background 0.2s ease;}
.pagination-no-number ul li.previous a{/*border-top-left-radius: 2px;border-bottom-left-radius: 2px;*/}
.pagination-no-number ul li.next a{/*border-top-right-radius: 2px;border-bottom-right-radius: 2px; */margin-left: 5px;}
.pagination-no-number ul li a:focus{color: #7E7C7D;}
.pagination-no-number ul li a:hover{background:#354350;color: #fff;transition: background 0.2s ease;}
.pagination-no-number ul li.active a{color: #fff;background:#354350}
.pagination-no-number ul li.disable a{cursor: no-drop;color: #ccc;border-color: #e0e0e0;}
.pagination-no-number ul li.disable a:hover{cursor: no-drop; background: #fff;color: #ccc;border-color: #e0e0e0;}


/*-----MODAL-----*/
.modal-wrap{position: relative; margin: -20px;}
.modal-header{position: relative;padding: 20px;}
.modal-header .title{color: #0086E7;text-transform: uppercase;font-size: 18px;font-weight: 700;line-height: 1;}
.modal-header .close-event-btn{float: right;}
.modal-content{position: relative;padding: 20px;border-top:1px solid #f0f0f0;}
.modal-footer{position: relative;padding: 20px;border-top:1px solid #f0f0f0;}


/*-----TAB-----*/
.tab{position: relative;}
.tab-navigation{font-size: 0;}
.tab-navigation li{display: inline-block;}
.tab-navigation li a{position: relative;display: block;text-align: center; padding: 5px 8px;color: #ccc;cursor: pointer;}
.tab-navigation li a:hover{background:#fff;}
.tab-navigation li.active a{background:#fff;border:1px solid #ccc;border-bottom: #fff;color: #000;}
.tab-navigation li.active a:before {content: "";position: absolute;left: 0;bottom: -3px;width: 100%;height: 3px;background: #fff;}
.tab-content {background: #ffffff;}
.tab-content .content{padding: 10px;border:1px solid #ccc;min-height: 200px;}


/*-----ACCORDION-----*/
.Accordion--dafault .Accordion-paneHeader {
  margin: 0;
  border-bottom: 1px solid #7E7C7D;
}

/*.Accordion--dafault .Accordion-paneHeader p {
  transition:color 0.4s ease;
}
.Accordion--dafault .Accordion-paneHeader:hover p {
  color: #2196F3; 
  transition:color 0.4s ease;
}*/

.Accordion--dafault .Accordion-paneHeader.is-expanded p{
  color: #2196F3;  }

.Accordion--dafault .Accordion-paneHeader.is-expanded {
  border-bottom-color: #2196F3; }

.Accordion--dafault .Accordion-paneHeader::after ,.Accordion--dafault .Accordion-paneHeader::before  {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 10px;
    height: 1px;
    background-color: #7E7C7D;
    -webkit-transform-origin: 50% 50%;
        -ms-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
    -webkit-transition: all 0.25s;
            transition: all 0.25s; }

.Accordion--dafault .Accordion-paneHeader.is-expanded::after {
  -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg);
  opacity: 0; }
.Accordion--dafault .Accordion-paneHeader.is-expanded::before {
  background-color: #2196F3;
  -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
          transform: rotate(0deg); }

.Accordion-paneContent > div {
padding: 0;
padding: 10px 0;
border-bottom: 1px solid #2196F3;
}

/*-----DROPDOWN-----*/
.hideDropdown{
  display: none;
  /*-webkit-animation: hide-me .5s;
  animation: hide-me .5s;*/
}
.showDropdown{
  display: block;
   
  /*-webkit-animation: show-me .5s;
  animation: show-me .5s;*/
}


/*-----GRID-----*/

/*  COLUMN SETUP  */
[class*='col'] {
  display: block;
  float:left;
}

/*  GRID OF TWO   ============================================================================= */
.col-2-2{width: 100%;}
.col-1-2{width: 50%;}

/*  GRID OF THREE   ============================================================================= */ 
.col-3-3{width: 100%;}
.col-2-3{width: 66.66%;}
.col-1-3{width: 33.33%;}

/*  GRID OF FOUR   ============================================================================= */
.col-4-4{width: 100%;}
.col-3-4{width: 75%;}
.col-2-4{width: 50%;}
.col-1-4{width: 25%;}

/*  GRID OF FIVE   ============================================================================= */
.col-5-5{width: 100%;}
.col-4-5{width: 80%; }
.col-3-5{width: 60%; }
.col-2-5{width: 40%;}
.col-1-5{width: 20%;}

/*  GRID OF SIX   ============================================================================= */
.col-6-6{width: 100%;}
.col-5-6{width: 83.33%;}
.col-4-6{width: 66.66%;}
.col-3-6{width: 50%;}
.col-2-6{width: 33.33%;}
.col-1-6{width: 16.66%;}

/*  GRID OF SEVEN   ============================================================================= */
.col-7-7{width: 100%;}
.col-6-7{width: 85.71%;}
.col-5-7{width: 71.42%;}
.col-4-7{width: 57.14%;}
.col-3-7{width: 42.85%;}
.col-2-7{width: 28.57%;}
.col-1-7{width: 14.28%;}

/*  GRID OF EIGHT   ============================================================================= */  
.col-8-8 {width: 100%;}
.col-7-8 {width: 87.5%;}
.col-6-8 {width: 75%;}
.col-5-8 {width: 62.5%;}
.col-4-8 {width: 50%;}
.col-3-8 {width: 37.5%;}
.col-2-8 {width: 25%;}
.col-1-8 {width: 12.5%;}

/*  GRID OF NINE   ============================================================================= */
.col-8-9 {width: 100%;}
.col-8-9 {width: 88.88%;}
.col-7-9 {width: 77.88%;}
.col-6-9 {width: 66.66%;}
.col-5-9 {width: 55.55%;}
.col-4-9 {width: 44.44%;}
.col-3-9 {width: 33.33%}
.col-2-9 {width: 22.22%;}
.col-1-9 {width: 11.11%;}

/*  GRID OF TEN   ============================================================================= */
.col-10-10 {width: 100%;}
.col-9-10 {width: 90%;}
.col-8-10 {width: 80%;}
.col-7-10 {width: 70%;}
.col-6-10 {width: 60%;}
.col-5-10 {width: 50%;}
.col-4-10 {width: 40%;}
.col-3-10 {width: 30%}
.col-2-10 {width: 20%;}
.col-1-10 {width: 10%;}

/*  GRID OF ELEVEN   ============================================================================= */
.col-11-11 {width: 100%}
.col-10-11 {width: 90.90%;}
.col-9-11 {width: 81.81%;}
.col-8-11 {width: 72.72%;}
.col-7-11 {width: 63.63%;}
.col-6-11 {width: 54.54%;}
.col-5-11 {width: 45.45%;}
.col-4-11 {width: 36.36%;}
.col-3-11 {width: 27.27%;}
.col-2-11 {width: 18.18%;}
.col-1-11 {width: 9.090%;}

/*  GRID OF TWELVE   ============================================================================= */
.col-12-12 {width: 100%;}
.col-11-12 {width: 91.66%;}
.col-10-12 {width: 83.33%;}
.col-9-12 {width: 75%;}
.col-8-12 {width: 66.66%}
.col-7-12 {width: 58.33%;}
.col-6-12 {width: 50%;}
.col-5-12 {width: 41.66%;}
.col-4-12 {width: 33.33%;}
.col-3-12 {width: 25%;}
.col-2-12 {width: 16.66%;}
.col-1-12 {width: 8.33%;}


@media only screen and (max-width: 480px) {

  /*  GRID OF TWO   ============================================================================= */
  .col-2-2{width: 100%;}
  .col-1-2{width: 100%;}

  /*  GRID OF THREE   ============================================================================= */ 
  .col-3-3{width: 100%;}
  .col-2-3{width: 100%;}
  .col-1-3{width: 100%;}

  /*  GRID OF FOUR   ============================================================================= */
  .col-4-4{width: 100%;}
  .col-3-4{width: 100%;}
  .col-2-4{width: 100%;}
  .col-1-4{width: 100%;}

  /*  GRID OF FIVE   ============================================================================= */
  .col-5-5{width: 100%;}
  .col-4-5{width: 100%;}
  .col-3-5{width: 100%;}
  .col-2-5{width: 100%;}
  .col-1-5{width: 100%;}

  /*  GRID OF SIX   ============================================================================= */
  .col-6-6{width: 100%;}
  .col-5-6{width: 100%;}
  .col-4-6{width: 100%;}
  .col-3-6{width: 100%;}
  .col-2-6{width: 100%;}
  .col-1-6{width: 100%;}

  /*  GRID OF SEVEN   ============================================================================= */
  .col-7-7{width: 100%;}
  .col-6-7{width: 100%;}
  .col-5-7{width: 100%;}
  .col-4-7{width: 100%;}
  .col-3-7{width: 100%;}
  .col-2-7{width: 100%;}
  .col-1-7{width: 100%;}

  /*  GRID OF EIGHT   ============================================================================= */  
  .col-8-8 {width: 100%;}
  .col-7-8 {width: 100%;}
  .col-6-8 {width: 100%;}
  .col-5-8 {width: 100%;}
  .col-4-8 {width: 100%;}
  .col-3-8 {width: 100%;}
  .col-2-8 {width: 100%;}
  .col-1-8 {width: 100%;}

  /*  GRID OF NINE   ============================================================================= */
  .col-8-9 {width: 100%}
  .col-8-9 {width: 100%;}
  .col-7-9 {width: 100%;}
  .col-6-9 {width: 100%;}
  .col-5-9 {width: 100%;}
  .col-4-9 {width: 100%;}
  .col-3-9 {width: 100%;}
  .col-2-9 {width: 100%;}
  .col-1-9 {width: 100%;}

  /*  GRID OF TEN   ============================================================================= */
  .col-10-10 {width: 100%}
  .col-9-10 {width: 100%;}
  .col-8-10 {width: 100%;}
  .col-7-10 {width: 100%;}
  .col-6-10 {width: 100%;}
  .col-5-10 {width: 100%;}
  .col-4-10 {width: 100%;}
  .col-3-10 {width: 100%;}
  .col-2-10 {width: 100%;}
  .col-1-10 {width: 100%;}

  /*  GRID OF ELEVEN   ============================================================================= */
  .col-11-11 {width: 100%}
  .col-10-11 {width: 100%;}
  .col-9-11 {width: 100%;}
  .col-8-11 {width: 100%;}
  .col-7-11 {width: 100%;}
  .col-6-11 {width: 100%;}
  .col-5-11 {width: 100%;}
  .col-4-11 {width: 100%;}
  .col-3-11 {width: 100%;}
  .col-2-11 {width: 100%;}
  .col-1-11 {width: 100%;}

  /*  GRID OF TWELVE   ============================================================================= */
  .col-12-12 {width: 100%}
  .col-11-12 {width: 100%;}
  .col-10-12 {width: 100%;}
  .col-9-12 {width: 100%;}
  .col-8-12 {width: 100%;}
  .col-7-12 {width: 100%;}
  .col-6-12 {width: 100%;}
  .col-5-12 {width: 100%;}
  .col-4-12 {width: 100%;}
  .col-3-12 {width: 100%;}
  .col-2-12 {width: 100%;}
  .col-1-12 {width: 100%;}
}


@media only screen and (max-width: 768px) {

  /*  GRID OF TWO   ============================================================================= */
  .col-2-2{width: 100%;}
  .col-1-2{width: 100%;}

  /*  GRID OF THREE   ============================================================================= */ 
  .col-3-3{width: 100%;}
  .col-2-3{width: 100%;}
  .col-1-3{width: 100%;}

  /*  GRID OF FOUR   ============================================================================= */
  .col-4-4{width: 100%;}
  .col-3-4{width: 100%;}
  .col-2-4{width: 100%;}
  .col-1-4{width: 100%;}

  /*  GRID OF FIVE   ============================================================================= */
  .col-5-5{width: 100%;}
  .col-4-5{width: 100%;}
  .col-3-5{width: 100%;}
  .col-2-5{width: 100%;}
  .col-1-5{width: 100%;}

  /*  GRID OF SIX   ============================================================================= */
  .col-6-6{width: 100%;}
  .col-5-6{width: 100%;}
  .col-4-6{width: 100%;}
  .col-3-6{width: 100%;}
  .col-2-6{width: 100%;}
  .col-1-6{width: 100%;}

  /*  GRID OF SEVEN   ============================================================================= */
  .col-7-7{width: 100%;}
  .col-6-7{width: 100%;}
  .col-5-7{width: 100%;}
  .col-4-7{width: 100%;}
  .col-3-7{width: 100%;}
  .col-2-7{width: 100%;}
  .col-1-7{width: 100%;}

  /*  GRID OF EIGHT   ============================================================================= */  
  .col-8-8 {width: 100%;}
  .col-7-8 {width: 100%;}
  .col-6-8 {width: 100%;}
  .col-5-8 {width: 100%;}
  .col-4-8 {width: 100%;}
  .col-3-8 {width: 100%;}
  .col-2-8 {width: 100%;}
  .col-1-8 {width: 100%;}

  /*  GRID OF NINE   ============================================================================= */
  .col-8-9 {width: 100%}
  .col-8-9 {width: 100%;}
  .col-7-9 {width: 100%;}
  .col-6-9 {width: 100%;}
  .col-5-9 {width: 100%;}
  .col-4-9 {width: 100%;}
  .col-3-9 {width: 100%;}
  .col-2-9 {width: 100%;}
  .col-1-9 {width: 100%;}

  /*  GRID OF TEN   ============================================================================= */
  .col-10-10 {width: 100%}
  .col-9-10 {width: 100%;}
  .col-8-10 {width: 100%;}
  .col-7-10 {width: 100%;}
  .col-6-10 {width: 100%;}
  .col-5-10 {width: 100%;}
  .col-4-10 {width: 100%;}
  .col-3-10 {width: 100%;}
  .col-2-10 {width: 100%;}
  .col-1-10 {width: 100%;}

  /*  GRID OF ELEVEN   ============================================================================= */
  .col-11-11 {width: 100%}
  .col-10-11 {width: 100%;}
  .col-9-11 {width: 100%;}
  .col-8-11 {width: 100%;}
  .col-7-11 {width: 100%;}
  .col-6-11 {width: 100%;}
  .col-5-11 {width: 100%;}
  .col-4-11 {width: 100%;}
  .col-3-11 {width: 100%;}
  .col-2-11 {width: 100%;}
  .col-1-11 {width: 100%;}

  /*  GRID OF TWELVE   ============================================================================= */
  .col-12-12 {width: 100%}
  .col-11-12 {width: 100%;}
  .col-10-12 {width: 100%;}
  .col-9-12 {width: 100%;}
  .col-8-12 {width: 100%;}
  .col-7-12 {width: 100%;}
  .col-6-12 {width: 100%;}
  .col-5-12 {width: 100%;}
  .col-4-12 {width: 100%;}
  .col-3-12 {width: 100%;}
  .col-2-12 {width: 100%;}
  .col-1-12 {width: 100%;}
}



@keyframes error{
  0% {opacity:0;transform:   scaleX(0.00) scaleY(0.00) ;}
  100% {opacity:1;transform:  scaleX(1.00) scaleY(1.00) ;}
}
@-moz-keyframes error{
  0% {opacity:0;transform:   scaleX(0.00) scaleY(0.00) ;}
  100% {opacity:1;transform:  scaleX(1.00) scaleY(1.00) ;}
}
@-webkit-keyframes error {
  0% {opacity:0;transform:   scaleX(0.00) scaleY(0.00) ;}
  100% {opacity:1;transform:  scaleX(1.00) scaleY(1.00) ;}
}
@-o-keyframes error {
  0% {opacity:0;transform:   scaleX(0.00) scaleY(0.00) ;}
  100% {opacity:1;transform:  scaleX(1.00) scaleY(1.00) ;}
}
@-ms-keyframes error {
  0% {opacity:0;transform:   scaleX(0.00) scaleY(0.00) ;}
  100% {opacity:1;transform:  scaleX(1.00) scaleY(1.00) ;}
}
@keyframes errortxt{
  0% {opacity:0;transform:  translate(0px,5px)  ;}
  100% {opacity:1;transform:  translate(0px,0px)  ;}
}
@-moz-keyframes errortxt{
  0% {opacity:0;transform:  translate(0px,5px)  ;}
  100% {opacity:1;transform:  translate(0px,0px)  ;}
}
@-webkit-keyframes errortxt {
  0% {opacity:0;transform:  translate(0px,5px)  ;}
  100% {opacity:1;transform:  translate(0px,0px)  ;}
}
@-o-keyframes errortxt {
  0% {opacity:0;transform:  translate(0px,5px)  ;}
  100% {opacity:1;transform:  translate(0px,0px)  ;}
}
@-ms-keyframes errortxt {
  0% {opacity:0;transform:  translate(0px,5px)  ;}
  100% {opacity:1;transform:  translate(0px,0px)  ;}
}