.elementor-961 .elementor-element.elementor-element-a166349{--display:flex;--min-height:200px;}.elementor-961 .elementor-element.elementor-element-b31909b{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-961 .elementor-element.elementor-element-18aaf80{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-961 .elementor-element.elementor-element-18aaf80:not(.elementor-motion-effects-element-type-background), .elementor-961 .elementor-element.elementor-element-18aaf80 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#181818;}.elementor-961 .elementor-element.elementor-element-3bcc4ec{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-961 .elementor-element.elementor-element-8a27951{width:var( --container-widget-width, 100% );max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:20px 30px 0px 0px;--container-widget-width:100%;--container-widget-flex-grow:0;z-index:5;font-family:"iranyekan", Sans-serif;font-weight:900;color:#FFFFFF;}.elementor-961 .elementor-element.elementor-element-f1322f8{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-961 .elementor-element.elementor-element-e2d985c > .elementor-widget-container{margin:0px 40px 0px 0px;}.elementor-961 .elementor-element.elementor-element-e2d985c.elementor-element{--align-self:flex-start;}.elementor-961 .elementor-element.elementor-element-071e24a{margin:-290px 0px calc(var(--kit-widget-spacing, 0px) + 0px) -400px;}@media(max-width:1024px){.elementor-961 .elementor-element.elementor-element-a166349{--min-height:90px;}.elementor-961 .elementor-element.elementor-element-8a27951{--container-widget-width:440px;--container-widget-flex-grow:0;width:var( --container-widget-width, 440px );max-width:440px;}.elementor-961 .elementor-element.elementor-element-071e24a{margin:-280px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}}@media(max-width:767px){.elementor-961 .elementor-element.elementor-element-a166349{--min-height:90px;}.elementor-961 .elementor-element.elementor-element-b31909b{--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-961 .elementor-element.elementor-element-8a27951{padding:20px 15px 0px 0px;--container-widget-width:90%;--container-widget-flex-grow:0;width:var( --container-widget-width, 90% );max-width:90%;font-size:13px;}.elementor-961 .elementor-element.elementor-element-e2d985c{width:100%;max-width:100%;}.elementor-961 .elementor-element.elementor-element-e2d985c > .elementor-widget-container{margin:0px 15px 0px 0px;}.elementor-961 .elementor-element.elementor-element-b088471 > .elementor-widget-container{margin:0px 15px 0px 0px;}.elementor-961 .elementor-element.elementor-element-071e24a{margin:-400px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}}/* Start custom CSS for wd_popup, class: .elementor-element-e2d985c */.elementor-961 .elementor-element.elementor-element-e2d985c
     .btn {
    border-radius: 10px;
}
  :root{      --grad1: #03a9f4;      --grad2: #f441a5;      --grad3: #ffeb3b;      --grad4: #03a9f4;  }    .elementor-961 .elementor-element.elementor-element-e2d985c a{  	background: linear-gradient(90deg, var(--grad1), var(--grad2), var(--grad3), var(--grad4));  	background-size: 400%;  	z-index: 1;  	position: relative;  }  .elementor-961 .elementor-element.elementor-element-e2d985c a:hover{  	animation: animate 8s linear infinite;  }  @keyframes animate {  	0%{  		background-position: 0%;  	}  	100%{  		background-position: 400%;  	}  }
  
    .elementor-961 .elementor-element.elementor-element-e2d985c a:before{  	content: '';  	position: absolute;  	top: -5px;  	left: -5px;  	right: -5px;  	bottom: -5px;  	z-index: 0;  	background: linear-gradient(90deg, var(--grad1), var(--grad2), var(--grad3), var(--grad4));  	background-size: 400%;  	border-radius: 40px;  	opacity: 0;  	transition: 0.5s;    }  .elementor-961 .elementor-element.elementor-element-e2d985c a:hover:before{  	filter: blur(20px);  	opacity: .6;  	animation: animate 8s linear infinite;  }
 @media only screen and (max-width: 600px) {
     .btn {float:right;
     }
     }
.elementor-961 .elementor-element.elementor-element-e2d985c {
    font-family: iranyekan;
}/* End custom CSS */
/* Start custom CSS for wd_popup, class: .elementor-element-b088471 */.elementor-961 .elementor-element.elementor-element-b088471
     .btn {
    border-radius: 10px;
}
  :root{      --grad1: #03a9f4;      --grad2: #f441a5;      --grad3: #ffeb3b;      --grad4: #03a9f4;  }    .elementor-961 .elementor-element.elementor-element-b088471 a{  	background: linear-gradient(90deg, var(--grad1), var(--grad2), var(--grad3), var(--grad4));  	background-size: 400%;  	z-index: 1;  	position: relative;  }  .elementor-961 .elementor-element.elementor-element-b088471 a:hover{  	animation: animate 8s linear infinite;  }  @keyframes animate {  	0%{  		background-position: 0%;  	}  	100%{  		background-position: 400%;  	}  }
  
    .elementor-961 .elementor-element.elementor-element-b088471 a:before{  	content: '';  	position: absolute;  	top: -5px;  	left: -5px;  	right: -5px;  	bottom: -5px;  	z-index: 0;  	background: linear-gradient(90deg, var(--grad1), var(--grad2), var(--grad3), var(--grad4));  	background-size: 400%;  	border-radius: 40px;  	opacity: 0;  	transition: 0.5s;    }  .elementor-961 .elementor-element.elementor-element-b088471 a:hover:before{  	filter: blur(20px);  	opacity: .6;  	animation: animate 8s linear infinite;  }
 @media only screen and (max-width: 600px) {
     .btn {float:right;
     }
     }

.elementor-961 .elementor-element.elementor-element-b088471 {
    font-family: iranyekan;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-071e24a */html,
body {
  /* width: 100%;
  height: 100%; */
  background-color: #121215;
}

.solar-system {
  position: relative;
  width: 780px;
  height: 780px;
  margin: auto;
  overflow: hidden;
}

/* Some positioning rules that are common for all objects */
.orbit {
  border: 1px dashed #666;
}

#sun,
.orbit,
.orbit + div,
.orbit + div > div {
  position: absolute;
}

#sun,
.orbit,
.orbit + div {
  top: 50%;
  left: 50%;
}
.orbit + div > div {
  top: 0;
  left: 50%;
}

.orbit,
.orbit + div div,
#earth {
  border-radius: 50%;
}

/* Individual objects rules. They are pretty much the same for 
all objects and basically only vary in orbit size 
and planet size. And colors :) */

#sun {
  /* Positions the top-left corner of the image to be *
	/* in the middle of the box */
  height: 200px;
  width: 200px;
  background-color: #fae20a;
  margin-top: -100px;
  margin-left: -100px;
  border-radius: 50%;
  box-shadow: 0 0 84px orange;
}

#earth {
  position: absolute;
  top: 0;
  left: 50%;
  height: 50px;
  width: 50px;
  margin-left: -25px;
  margin-top: -25px;
  border-radius: 50%;
  box-shadow: 0 0 34px #3a4385;
}

.earth-orbit,
.earth-spin {
  width: 500px;
  height: 500px;
  margin-left: -250px;
  margin-top: -250px;
}

#moon {
  margin-top: -6px;
  margin-left: -6px;
  height: 12px;
  width: 12px;
  border-radius: 50%;
  background: white;
  box-shadow: 0 0 14px #3a4385;
}
.moon-orbit,
.moon-spin {
  height: 90px;
  width: 90px;
  margin-top: -45px;
  margin-left: -45px;
  border-color: #447;
}

#venus {
  margin-top: -20px;
  margin-left: -20px;
  height: 40px;
  width: 40px;
  background-color: #3498db;
  box-shadow: 0 0 34px #3a4385;
}
.venus-orbit,
.venus-spin {
  margin-top: -185px;
  margin-left: -185px;
  width: 370px;
  height: 370px;
}

#mercury {
  margin-top: -13.5px;
  margin-left: -13.5px;
  height: 25px;
  width: 25px;
  background-color: #a65e22;
  /* box-shadow: 0 0 34px #3a4385; */
}

.mercury-orbit,
.mercury-spin {
  width: 280px;
  height: 280px;
  margin-left: -140px;
  margin-top: -140px;
}

#mars {
  margin-top: -16px;
  margin-left: -16px;
  height: 32px;
  width: 32px;
  background-color: #863222;
  box-shadow: 0 0 14px #a64232;
}

.mars-orbit,
.mars-spin {
  width: 700px;
  height: 700px;
  margin-left: -350px;
  margin-top: -350px;
}

/* Spinning animations */

@keyframes spin-right {
  100% {
    transform: rotate(360deg);
  }
}

.earth-spin {
  animation: spin-right 36.5s linear infinite;
}
.moon-spin {
  animation: spin-right 3s linear infinite;
}
.venus-spin {
  animation: spin-right 22s linear infinite;
}
.mercury-spin {
  animation: spin-right 8.8s linear infinite;
}
.mars-spin {
  animation: spin-right 68.7s linear infinite;
}/* End custom CSS */