/*blue : #4a2189   /  yellow  : #5dbee8  */
body {
	font-size: 1.6rem;
	text-align: justify;
}
p, li {
	direction: rtl;
}
li {
	margin-bottom: 20px;
}
.container{
	direction: rtl;
}
.navbar-brand {
	position: absolute;
	height: 80px;
}

@media only screen and (max-width: 1300px) {
  .navbar-brand {
	right: -40px;
  }
}
.navbar-brand > img {
	height: 76px;
}
.navbar .navbar-nav .nav-link {
	padding: 10px 10px;
	font-weight: normal;
	font-size: 21px;
	transition: .5s;
}
.navbar-light .navbar-nav .nav-link {
	color: #4a2189;
}
.navbar .dropdown-toggle::after {
	margin-left: 0px;
	margin-right: 8px;
}
.navbar .nav-item .dropdown-menu {
	direction: rtl;
	text-align: right;
}
h1 {
	color: #4a2189;
	text-align: center;
}
#hero_text {
	text-align: center;
}
.hero_logo {
	height: 160px;
}
.hero_logo_assoc {
	max-height: 156px;
    max-width: 300px;
}
/***modal**/
#modal-container {
  position: fixed;
  display: table;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  transform: scale(0);
  z-index: 1;
}
#modal-container.one {
  transform: scaleY(0.01) scaleX(0);
  animation: unfoldIn 1s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-container.one .modal-background .modal {
  transform: scale(0);
  animation: zoomIn 0.5s 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-container.one.out {
  transform: scale(1);
  animation: unfoldOut 1s 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-container.one.out .modal-background .modal {
  animation: zoomOut 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-container .modal-background {
  display: table-cell;
  background: rgba(0, 0, 0, 0.8);
  text-align: center;
  vertical-align: middle;
}
#modal-container .modal-background .modal {
  background: #4a2189;
  padding: 50px;
  display: inline-block;
  border-radius: 3px;
  font-weight: 300;
  position: relative;
  max-height: 200px;
}
#modal-container .modal-background .modal h2 {
  font-size: 38px;
    line-height: 34px;
    margin-bottom: 40px;
	color: #5dbee8;
}
#modal-container .modal-background .modal p {
  font-size: 22px;
  line-height: 22px;
  color: #fff;
}
#modal-container .modal-background .modal .modal-svg {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  border-radius: 3px;
}
#modal-container .modal-background .modal .modal-svg rect {
  stroke: #fff;
  stroke-width: 2px;
  stroke-dasharray: 778;
  stroke-dashoffset: 778;
}

@keyframes unfoldIn {
  0% {
    transform: scaleY(0.005) scaleX(0);
  }
  50% {
    transform: scaleY(0.005) scaleX(1);
  }
  100% {
    transform: scaleY(1) scaleX(1);
  }
}
@keyframes unfoldOut {
  0% {
    transform: scaleY(1) scaleX(1);
  }
  50% {
    transform: scaleY(0.005) scaleX(1);
  }
  100% {
    transform: scaleY(0.005) scaleX(0);
  }
}

@keyframes zoomIn {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes zoomOut {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
/***hero animation ***/
.spinner {
  position: relative;
  width: 600px;
  height: 600px;
}
.spinner:before, .spinner:after {
  content: "";
  display: block;
  position: absolute;
  border-width: 5px;
  border-style: solid;
  border-radius: 50%;
}

/* spinner-1 styles */
@-webkit-keyframes rotate-animation {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(80deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes rotate-animation {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(80deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes rotate-animation2 {
  0% {
    transform: rotate(-80deg);
  }
  50% {
    transform: rotate(15deg);
  }
  100% {
    transform: rotate(-80deg);
  }
}
@-webkit-keyframes anti-rotate-animation {
  0% {
    transform: rotate(100deg);
  }
  50% {
    transform: rotate(160deg);
  }
  100% {
    transform: rotate(100deg);
  }
}
@keyframes anti-rotate-animation2 {
  0% {
    transform: rotate(70deg);
  }
  50% {
    transform: rotate(120deg);
  }
  100% {
    transform: rotate(70deg);
  }
}
.spinner.spinner-1:before, .spinner.spinner-2:before {
  width: 420px;
    height: 420px;
    border-bottom-color: #ffffff00;
    border-right-color: #5dbee8;
    border-top-color: rgba(33, 57, 102, 0);
    border-left-color: rgba(33, 57, 102, 0);
    top: -7px;
    left: 92px;
  -webkit-animation: rotate-animation 6s linear 0s infinite;
          animation: rotate-animation 6s linear 0s infinite;
}
.spinner.spinner-1:after, .spinner.spinner-2:after {
  width: 460px;
    height: 460px;
    border-bottom-color: #5dbee8;
    border-right-color: #ffffff00;
    border-top-color: rgba(33, 57, 102, 0);
    border-left-color: rgba(33, 57, 102, 0);
    top: -33px;
    left: 73px;
  -webkit-animation: anti-rotate-animation 6s linear 0s infinite;
          animation: anti-rotate-animation 6s linear 0s infinite;
}
.spinner.spinner-2:before {
  width: 440px;
    height: 440px;
    border-bottom-color: #ffffff00;
    border-right-color: #4a2189;
    top: -20px;
    left: 89px;
  -webkit-animation: rotate-animation2 4s linear 0s infinite;
  animation: rotate-animation2 4s linear 0s infinite;
}
.spinner.spinner-2:after {
	width: 480px;
    height: 480px;
    border-bottom-color: #4a218900;
    border-right-color: #4a2189;
    top: -42px;
    left: 63px;
  -webkit-animation: anti-rotate-animation2 3s linear 0s infinite;
          animation: anti-rotate-animation2 3s linear 0s infinite;
}
.spinner .circle {
	width: 400px;
    height: 400px;
    background-color: #4a2189;
    border-radius: 50%;
    margin: 100px auto;
	position: relative;
}

@-webkit-keyframes rotate-circle {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.spinner .circle .ancient_img {
    z-index: 1;
    animation-name: rotate-circle;
    animation-duration: 120s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	mix-blend-mode: unset;
    opacity: 1;
    width: 100%;
}
.spinner .circle .ancient_txt {
    font-family: 'ArabCodeWeek Title', 'Playball', cursive !important;
	color: #fff;
	position: absolute;
    top: 27%;
    left: 26%;
    font-size: 42px;
    text-align: center;
    display: inline-block;
    width: 200px;
}
.hand_robot {
	max-height: 400px;
    max-width: 100%;
    position: absolute;
    z-index: 2;
	right: -222px;
    top: 200px;
    transform: rotate(79deg);
    display: inline-block;
}
.im {
	max-height: 400px;
    max-width: 100%;
    position: absolute;
    z-index: 2;
    left: -228px;
    top: 23px;
    display: inline-block;
}
.im3 {
	max-height: 223px;
    max-width: 100%;
    position: absolute;
    z-index: 3;
    right: 153px;
    top: 10px;
    display: inline-block;
}
.im2 {
	max-height: 200px;
    max-width: 100%;
    position: absolute;
    z-index: 4;
    right: 26px;
    top: 73px;
    display: inline-block;
}
.im1 {
	max-height: 140px;
    max-width: 100%;
    position: absolute;
    z-index: 5;
    right: -41px;
    top: 181px;
    display: inline-block;
}
#particles-js {
	position:absolute;
	width: 100%;
    height: 100%;
}
@keyframes zoom-in-zoom-out {
  0% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(1.5, 1.5);
  }
  100% {
    transform: scale(1, 1);
  }
}
@keyframes MoveUpDown {
  0%, 100% {
    bottom: 145px;
    right: 7px;
  }
  50% {
    bottom: 165px;
    right: 15px;
  }
}

@keyframes float {
  0% {
    /*box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);*/
    transform: translatey(0px);
  }
  50% {
    /*box-shadow: 0 25px 15px 0px rgba(0,0,0,0.2);*/
    transform: translatey(-20px);
  }
  100% {
    /*box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);*/
    transform: translatey(0px);
  }
}
.hero {
	overflow-x: clip;
}
.ai_chipset_img {
	position: absolute;
    bottom: 145px;
    right: 7px;
    width: 100px;
	/*animation: zoom-in-zoom-out 30s ease-out infinite, float 6s ease-in-out infinite;*/
	animation: float 6s ease-in-out infinite;
	display:none !important;
}
/**competition goals***/
.ag-format-container {
  width: 1142px;
  margin: 0 auto;
}

.ag-courses_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;

  padding: 50px 0;
}
.ag-courses_item {
  -ms-flex-preferred-size: calc(33.33333% - 30px);
  flex-basis: calc(33.33333% - 30px);

  margin: 0 15px 30px;

  overflow: hidden;

  border-radius: 28px;
}

.ag-courses-item_title {
  min-height: 60px;
    margin: 10px 0 10px;
	padding-top: 0;
    overflow: hidden;
    font-weight: normal;
    font-size: 36px;
    color: #4a2189;/*#4a2189;*/
    z-index: 2;
    position: relative;
}
.ag-courses-item_date-box {
  font-size: 20px;
  color: #bfbebe;/*#FFF;*/

  z-index: 2;
  position: relative;
}
.ag-courses-item_date {
  font-weight: normal;
  color: #f9b234;

  -webkit-transition: color .5s ease;
  -o-transition: color .5s ease;
  transition: color .5s ease
}
.ag-courses-item_link {
  display: block;
  padding: 30px 20px;
  background-color: #fff;

  overflow: hidden;

  position: relative;
}
.ag-courses-item_link:hover,
.ag-courses-item_link:hover .ag-courses-item_date {
  text-decoration: none;
  color: #FFF;
}
.ag-courses-item_link:hover .ag-courses-item_date-box {
  text-decoration: none;
  color: #FFF;
}
.ag-courses-item_link:hover .ag-courses-item_bg {
  -webkit-transform: scale(10);
  -ms-transform: scale(10);
  transform: scale(10);
}

.ag-courses-item_link:hover .ag-courses-item_title {
    min-height: 60px;
    margin: 10px 0 10px;
	padding-top: 0;
    font-size: 30px;
    color: #4a2189;
}
.ag-courses_item:nth-child(5n) .ag-courses-item_link:hover .ag-courses-item_title {
    color: #c29c5b;
}

.ag-courses-item_bg {
  height: 128px;
  width: 128px;
  background-color: #3ca4d2;

  z-index: 1;
  position: absolute;
  top: -75px;
  right: -75px;

  border-radius: 50%;

  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}
.ag-courses_item:nth-child(2n) .ag-courses-item_bg {
  background-color: #d2a5e2;
}
.ag-courses_item:nth-child(3n) .ag-courses-item_bg {
  background-color: #db8f60;
}
.ag-courses_item:nth-child(4n) .ag-courses-item_bg {
  background-color: #b04049;
}
.ag-courses_item:nth-child(5n) .ag-courses-item_bg {
  background-color: #4a2189;
}
.ag-courses_item:nth-child(6n) .ag-courses-item_bg {
  background-color: #e5b5d2;
}



@media only screen and (max-width: 979px) {
  .ag-courses_item {
    -ms-flex-preferred-size: calc(50% - 30px);
    flex-basis: calc(50% - 30px);
  }
  .ag-courses-item_title {
    font-size: 24px;
  }
}

@media only screen and (max-width: 767px) {
  .ag-format-container {
    width: 96%;
  }

}
@media only screen and (max-width: 639px) {
  .ag-courses_item {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
  }
  .ag-courses-item_title {
    min-height: 72px;
    line-height: 1;

    font-size: 24px;
  }
  .ag-courses-item_link {
    padding: 22px 40px;
  }
  .ag-courses-item_date-box {
    font-size: 16px;
  }
}
/*** timeline ***/
.main-timeline7{direction:ltr;overflow:hidden;position:relative}
.main-timeline7 .timeline{width:50%;float:left;z-index:1;position:relative}
.main-timeline7 .timeline:after,.main-timeline7 .timeline:before{content:"";display:block;clear:both}
.main-timeline7 .timeline:before{content:"";width:40px;height:90%;background:#727cb6;position:absolute;top:10%;right:-20px}
.main-timeline7 .timeline:last-child:before{height:0}
.main-timeline7 .timeline-icon{width:80px;height:80px;border-radius:50%;background:#727cb6;overflow:hidden;text-align:center;position:absolute;top:0;right:-40px;z-index:3}
.main-timeline7 .timeline-icon:before{content:"";width:60px;height:60px;border-radius:50%;background:#fff;border:2px solid #727cb6;box-shadow:0 0 0 4px #a5afe4;margin:auto;position:absolute;top:0;left:0;bottom:0;right:0}
.main-timeline7 .timeline-icon i{font-size:35px;color:#303a3b;line-height:80px;z-index:1;position:relative}
.main-timeline7 .year{white-space: nowrap;direction:rtl;display:block;padding:0 60px 0 30px;font-size:30px;color:#303a3b;text-align:right;border-bottom:2px solid #303a3b;z-index:2;position:relative}
.main-timeline7 .year:before{content:"";display:block;width:30px;height:30px;border-radius:50%;background:#727cb6;border:5px solid #fff;box-shadow:0 0 0 4px #727cb6;margin:auto;position:absolute;bottom:-15px;left:4px}
.main-timeline7 .year:after{content:"";border-left:10px solid #303a3b;border-top:10px solid transparent;border-bottom:10px solid transparent;position:absolute;bottom:-11px;left:50px}
.main-timeline7 .timeline-content{padding:18px 60px 18px 40px;text-align:right;position:relative;z-index:1}
.main-timeline7 .timeline-content:after,.main-timeline7 .timeline-content:before{content:"";width:80px;height:150px;border-radius:50%;background:#ebebeb;/*#fff;*/position:absolute;top:-7%;right:15px;z-index:-1}
.main-timeline7 .timeline-content:after{left:auto;right:-95px}
.main-timeline7 .timeline:last-child .timeline-content:after,.main-timeline7 .timeline:last-child .timeline-content:before{width:0;height:0}
.main-timeline7 .title{font-family: 'ArabCodeWeek Text', 'Playball', sans-serif !important;font-size:26px;font-weight:normal !important;color:#727cb6;margin-top:0}
.main-timeline7 .description{font-family: 'ArabCodeWeek Text', 'Playball', sans-serif;font-size:18px;color:#555656;line-height:25px;text-align: justify;}
.main-timeline7 .timeline:nth-child(2){margin-top:140px}
.main-timeline7 .timeline:nth-child(even){margin-bottom:80px}
.main-timeline7 .timeline:nth-child(odd){margin:-140px 0 0}
.main-timeline7 .timeline:first-child,.main-timeline7 .timeline:last-child:nth-child(even){margin:0!important}
.main-timeline7 .timeline:nth-child(2n) .timeline-icon,.main-timeline7 .timeline:nth-child(2n):before{right:auto;left:-20px;background:#e77e21}
.main-timeline7 .timeline:nth-child(2n) .timeline-icon{left:-40px}
.main-timeline7 .timeline:nth-child(2n) .year{padding:0 30px 0 60px;text-align:left}
.main-timeline7 .timeline:nth-child(2n) .year:before{left:auto;right:4px}
.main-timeline7 .timeline:nth-child(2n) .year:after{border-left:none;border-right:10px solid #303a3b;right:50px}
.main-timeline7 .timeline:nth-child(2n) .timeline-content{padding:18px 40px 18px 60px;text-align:left}
.main-timeline7 .timeline:nth-child(2n) .timeline-content:before{left:-95px}
.main-timeline7 .timeline:nth-child(2n) .timeline-content:after{left:15px}
.main-timeline7 .timeline:nth-child(2n) .timeline-icon:before{border-color:#e77e21;box-shadow:0 0 0 4px #f1a563}
.main-timeline7 .timeline:nth-child(2n) .year:before{background:#e77e21;box-shadow:0 0 0 4px #e77e21}
.main-timeline7 .timeline:nth-child(2n) .title{color:#e77e21}
.main-timeline7 .timeline:nth-child(3n) .timeline-icon,.main-timeline7 .timeline:nth-child(3n):before{background:#008b8b}
.main-timeline7 .timeline:nth-child(3n) .timeline-icon:before{border-color:#008b8b;box-shadow:0 0 0 4px #50b5b4}
.main-timeline7 .timeline:nth-child(3n) .year:before{background:#008b8b;box-shadow:0 0 0 4px #008b8b}
.main-timeline7 .timeline:nth-child(3n) .title{color:#008b8b}
.main-timeline7 .timeline:nth-child(4n) .timeline-icon,.main-timeline7 .timeline:nth-child(4n):before{background:#ed687c}
.main-timeline7 .timeline:nth-child(4n) .timeline-icon:before{border-color:#ed687c;box-shadow:0 0 0 4px #f798a8}
.main-timeline7 .timeline:nth-child(4n) .year:before{background:#ed687c;box-shadow:0 0 0 4px #ed687c}
.main-timeline7 .timeline:nth-child(4n) .title{color:#ed687c}
@media only screen and (max-width:990px){.main-timeline7 .timeline{width:100%}
.main-timeline7 .timeline:nth-child(even),.main-timeline7 .timeline:nth-child(odd){margin:0}
.main-timeline7 .timeline:before,.main-timeline7 .timeline:nth-child(2n):before{width:30px;height:100%;left:25px}
.main-timeline7 .timeline-icon,.main-timeline7 .timeline:nth-child(2n) .timeline-icon{left:0}
.main-timeline7 .timeline:nth-child(2n) .year,.main-timeline7 .year{direction:rtl;text-align:left;padding:0 30px 0 100px}
.main-timeline7 .timeline:nth-child(2n) .year:before,.main-timeline7 .year:before{left:auto;right:4px}
.main-timeline7 .year:after{left:auto;right:50px;border-right:10px solid #303a3b;border-left:none}
.main-timeline7 .timeline-content .description{directionrtl;color:#666}
.main-timeline7 .timeline-content,.main-timeline7 .timeline:nth-child(2n) .timeline-content{directionrtl;text-align:right;padding:18px 40px 18px 100px}
.main-timeline7 .timeline-content:after,.main-timeline7 .timeline-content:before{width:0;height:0}
}
/***competitions boxes ***/
.service .service-item h4 {
	font-family: 'ArabCodeWeek Text', 'Playball', sans-serif !important;
	font-weight: normal !important;
}
.service .serv_item:nth-child(1) .service-item {
	background-color: #4a2189 !important;
}
.service .serv_item:nth-child(1) .service-item .fas {
	color: #4a2189 !important;
}
.service .serv_item:nth-child(1) .service-item h4 {
	color: #4a2189 !important;
}
.service .serv_item:nth-child(1) .service-item:hover .fas {
	color: #4a2189 !important;
}
.service .serv_item:nth-child(1) .service-item:hover h4 {
	color: #4a2189 !important;
}
/*
.service .serv_item:nth-child(1) .service-item a.btn-primary {
	background-color: #fff !important;
	color: #4a2189 !important;
}*/
.service .serv_item:nth-child(1) .service-item:hover a.btn-primary {
	background-color: #fff !important;
	color: #4a2189 !important;
}
.service .serv_item .service-item {
	background-color: #fff !important;
}
.service .serv_item .service-item .fas {
	color: #4a2189 !important;
}
.service .serv_item .service-item h4 {
	color: #4a2189 !important;
}
.service .serv_item .service-item a.btn-primary {
	background-color: #4a2189 !important;
	color: #fff !important;
}
.service .serv_item .service-item:hover a.btn-primary {
	background-color: #fff !important;
	color: #4a2189 !important;
}
/*** tables ***/

.competition_details table th {
  background-color: #daeff1;
  font-weight: 300;
}
.competition_details table tr:nth-child(2n) td {
  background-color: white;
}
.competition_details table tr:nth-child(2n+1) td {
  background-color: #edf7f8;
}
.competition_details table td[rowspan]:nth-child(2n) {
  background-color: white;
}
.competition_details table td[rowspan]:nth-child(2n+1) {
  background-color: #edf7f8;
}
.competition_details table td[rowspan], table tr.last td {
  border-bottom: 2px solid;
}

@media screen and (max-width: 500px) {
  td:first-child {
    background-color: #c8e7ea;
    border-bottom: 1px solid #91ced4;
    border-radius: 0px 0px 0 0;
    position: relative;
    top: 0;
    transform: translateY(0);
    width: 100%;
  }
  td:not(:first-child) {
    margin: 0;
    padding: 5px 1em;
    width: 100%;
  }
  td:not(:first-child):before {
    font-size: 0.8em;
    padding-top: 0.3em;
    position: relative;
  }
  td:last-child {
    padding-bottom: 1rem !important;
  }

  tr {
    background-color: white !important;
    border: 1px solid #6cbec6;
    border-radius: 0px;
    box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1);
    margin: 0.5rem 0;
    padding: 0;
  }

}
.breadcrumb-item+.breadcrumb-item::before {
    float: right;
    padding: 0 0.5rem;
    color: #6c757d;
}
.p4 {
	margin-left: 4px;
	margin-right: 4px;
}
.bg-light, .nav-bar {
    background-color: #ffffff !important;
	background-image: url(../img/background2.jpg);
}
.nav-bar {
    border: 0;
    background-position: 0 -125px;
}