/*golobal*/
*{ 
  margin: 0;
  padding: 0;
}

.row{
    margin: 0;
}

a:hover {
    text-decoration: none;
}

li{
    list-style: none;
}

.p-05{
    padding: 5px;
}
.p-10{
    padding: 10px;
}
.pl-10{
    padding-left: 10px;
}
.pr-10{
    padding-right: 10px;
}
.pb-10{
    padding-bottom: 10px;
}
.pt-10{
    padding-top: 10px;
}

.p-20{
    padding: 20px;
}
.pl-20{
    padding-left: 20px;
}
.pr-20{
    padding-right: 20px;
}
.pb-20{
    padding-bottom: 20px;
}
.pt-20{
    padding-top: 20px;
}

.p-30{
    padding: 30px;
}
.pl-30{
    padding-left: 30px;
}
.pr-30{
    padding-right: 30px;
}
.pb-30{
    padding-bottom: 30px;
}
.pt-30{
    padding-top: 30px;
}

.p-40{
    padding: 40px;
}
.pl-40{
    padding-left: 40px;
}
.pr-40{
    padding-right: 40px;
}
.pb-40{
    padding-bottom: 40px;
}
.pt-40{
    padding-top: 40px;
}


.m-10{
    margin: 10px;
}
.ml-10{
    margin-left: 10px;
}
.mr-10{
    margin-right: 10px;
}
.mb-10{
    margin-bottom: 10px;
}
.mt-10{
    margin-top: 10px;
}

.m-20{
    margin: 20px;
}
.ml-20{
    margin-left: 20px;
}
.mr-20{
    margin-right: 20px;
}
.mb-20{
    margin-bottom: 20px;
}
.mt-20{
    margin-top: 20px;
}

.m-30{
    margin: 30px;
}
.ml-30{
    margin-left: 30px;
}
.mr-30{
    margin-right: 30px;
}
.mb-30{
    margin-bottom: 30px;
}
.mt-30{
    margin-top: 30px;
}

.m-40{
    margin: 40px;
}
.ml-40{
    margin-left: 40px;
}
.mr-40{
    margin-right: 40px;
}
.mb-40{
    margin-bottom: 40px;
}
.mt-40{
    margin-top: 40px;
}

.br-xs{
    border-radius: 5px;
}
.br-s{
    border-radius: 10px;
}
.br-m{
    border-radius: 20px;
}
.br-l{
    border-radius: 20px;
}
.br-xl{
    border-radius: 20px;
}


.bg-w{
    background-color: #fff;
}
.bg-gray{
    background-color: #ebebeb;
}

.bg-main{
    background-color: var(--main-color);
}
.bg-pri{
    background-color: var(--primary-color);
}
.bg-second{
    background-color: var(--second-color);
}
.bg-orange{
    background-color: var(--orange-p-color);
}
.bg-red{
    background-color: var(--red-color);
}

.color-main{
    color: var(--main-color);
}
.color-pri{
    color: var(--primary-color);
}
.color-orange{
    color: var(--orange-color);
}
.color-red{
    color: var(--red-color);
}
.color-black{
    color: #666;
}


.g-w-100{
    width: 100%;
}
.g-w-50{
    width: 50%;
}

@keyframes rotate-circle {
  from {
    transform: rotate(0deg) translateX(-150%);
  }
  to {
    transform: rotate(359deg) translateX(-150%);
  }
}

@keyframes rotate-circle-counter {
  from {
    transform: rotate(0deg) translateX(350%);
  }
  to {
    transform: rotate(-359deg) translatex(350%);
  }
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}