@charset "utf-8";
/* CSS Document */
body{ margin:0; background-color: #f8f8f8; font-family: 'Roboto', sans-serif;}
html {  scroll-behavior: smooth;}
.logo{ padding:20px 0 0 100px; display:inline-block; font-size:36px;}
.logo{font-weight:100;}
.logo pre{display:inline-block;}
.logo span{
  color:#000;
  animation:blink 1s infinite;}
  
@keyframes blink {
  from {color:#000;}
  to {color:#FFF;}
}
.img-blink-eye{ height:600px; background-repeat:no-repeat; background-size:contain; width:400px; animation:eyeblink 3s infinite;}
@keyframes eyeblink {
  0% {background-image:url(../_images/2.png);}
  6% {background-image:url(../_images/1.png);}
  10% {background-image:url(../_images/2.png);}
  100% {background-image:url(../_images/2.png);}
}
.heartwrapper{height:55px; width:55px; }
.heart-fraznaqvi{display:inline-block;  animation:heart 1s infinite;}
.thought-wrapper{ margin-top:100px;}
.skills{ margin:50px 0;}
.skills img{ width:300px;}
.thought-wrapper span{ font-size:36px; font-family:"MS Serif", "New York", serif}
@keyframes heart {
  from {height:55px; width:55px;}
  to {height:50px; width:50px;}
}
.titleforme-wrapper{width:700px; float:right; margin-top:50px; display:inline-block;}
.titleforme{ font-size:36px; font-weight:100; display:inline-block; }
header .menu-wrapper{ float:right; display:inline-block;}
header .menu-wrapper nav{ padding:50px 0;}
header .menu-wrapper nav ul li{ display: inline-block;}
header .menu-wrapper nav ul li a{ text-decoration:none; color:#383838; font-size:14px; padding:10px; letter-spacing:2px; font-weight:600;}
header .menu-wrapper nav ul li a:hover{ color:#ca1466; transition:all .5s; border-bottom:solid #383838;}
#active{color:#ca1466; border-bottom:solid #383838;}
.content-wrapper{ padding:0 100px; display:inline-block;}
.content-wrapper .content-left{ max-width:800px; display:inline-block;}
.content-wrapper .content-left .contact-form{ padding: 30px 0 0 0;}
.content-wrapper .content-left .contact-form .block{ padding: 30px 0 0 0;}
.content-wrapper .content-left .contact-form label{ font-size:18px; font-weight:900; display:block;}
.content-wrapper .content-left .contact-form .block input{ width:100%; padding:12px 10px; font-size:18px; margin:5px 0; border-radius:5px; border:solid 1px #999999; background:none;}
.content-wrapper .content-left .contact-form .block input:focus{outline:none; box-shadow:0 0 7px -2px #ca1466;}
.content-wrapper .content-left .contact-form .block select{ width:100%; padding:12px 10px; font-size:18px; margin:10px 0; border-radius:5px; border:solid 1px #999999; background:none;}
.content-wrapper .content-left .contact-form .block select:focus{outline:none; box-shadow:0 0 7px -2px #ca1466;}
.content-wrapper .content-left .contact-form .block textarea{ width:100%; padding:10px; font-size:18px; margin:10px 0; height:150px; border-radius:5px; border:solid 1px #999999; background:none;}
.content-wrapper .content-left .contact-form .block textarea:focus{outline:none; box-shadow:0 0 7px -2px #ca1466;}
.content-wrapper .content-left h2, .content-wrapper .centered h2{ font-size:46px; font-weight:900; letter-spacing: 3px;}
.content-wrapper .content-right{float:right; display:inline-block; max-width:400px;}
.content-wrapper .centered{ }
.margin-top-100{margin-top:100px;}
.content-wrapper .centered h3{ font-size:24px; text-align:center; font-style:italic;}
p{ line-height:35px; font-size:17px; font-weight:100; padding:0 0 0 10px;}
strong{ font-weight:900;}
.block{ display:block;}
.all-wrapper{ margin:0 auto}
.content-wrapper .content-left .contact-form .block input[type=submit]{ width:150px; background-color:#ca1466; color:#FFF; float:right;}
.popup-wrapper{ background:rgba(255,255,255,.95);display:none; width:100%; height:100%; position:fixed; z-index:100;}
.popup{ display:block; margin:0 auto; margin-top:200px; background:none; }
.second-level-wrapper{ text-align:center;}
.second-level-wrapper .popped-image-wrapper .caption{ font-size:20px; background:#9C6; color:#FFF;}
.image-toggle{ width:50px; height:50px; border-radius:10px; color:#FFF; background:#ca1466; font-size:36px; margin:50px;}
.waiting{
	 width:100px; height:100px;
	 border-radius:100px;
	-webkit-animation-name: openmenuanimation; /* Safari 4.0 - 8.0 */
  -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
  -webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
  animation-name: openmenuanimation;
  animation-duration: 10s;
  animation-iteration-count: infinite;}
 .sent{ width:100px; height:50px; border:solid #0F6; border-width:0 0 20px 20px; border-radius:0 0 0 20px; transition:all .3s;}
  .events-list-wrapper{ }
  .events-list-wrapper .event-wrapper{ display:inline-block; width:210px; padding:50px;}
  .events-list-wrapper .event-wrapper .calander{width:200px; height:200px; background:#FFF; border:solid 1px #CCCCCC; border-radius:3px 3px 15px 15px; border-bottom-width:6px; padding:5px 0 0 0;}
  .events-list-wrapper .event-wrapper .calander .calander-hook{ width:15px; height:15px; border-radius:10px; display:block; margin:0 auto; background:#000;}
  .events-list-wrapper .event-wrapper .calander .full-date .date{ font-size:120px; text-align:center; color:#ca1466;}
  .events-list-wrapper .event-wrapper .calander .full-date .month-year{ font-size:24px; text-align:center; color:#999;}
  .events-list-wrapper .event-wrapper .event-name{ font-size:24px; margin:20px 0; }
  .events-list-wrapper .event-wrapper .event-location{ font-size:14px; color:#333;}
  .shajra-wrapper{}
  .shajra-wrapper .name-wrapper{display:inline-block; padding:30px 2px;}
  .shajra-wrapper .name-wrapper .name-arrow-left{display:table-cell; width:0; height:0; border-left: 30px solid transparent; border-top: 35px solid #ca1466; border-bottom: 35px solid #ca1466; border-right: 0px solid #ca1466;}
   .shajra-wrapper .name-wrapper .name{display:table-cell; background:#ca1466; padding:20px; color:#FFF; font-size:20px;}
  .shajra-wrapper .name-wrapper .name-arrow-right{display:table-cell; width:0; height:0; border-left: 30px solid #ca1466; border-top: 35px solid transparent; border-bottom: 35px solid transparent; border-right: 0px solid #ca1466;}
  .shajra-wrapper .name-wrapper .name-arrow-left-green{display:table-cell; width:0; height:0; border-left: 30px solid transparent; border-top: 35px solid #95B33C; border-bottom: 35px solid #95B33C; border-right: 0px solid #95B33C;}
   .shajra-wrapper .name-wrapper .name-green{display:table-cell; background:#95B33C; padding:20px; color:#FFF; font-size:20px;}
  .shajra-wrapper .name-wrapper .name-arrow-right-green{display:table-cell; width:0; height:0; border-left: 30px solid #95B33C; border-top: 35px solid transparent; border-bottom: 35px solid transparent; border-right: 0px solid #95B33C;}
  .shajra-wrapper .name-wrapper .name-arrow-left-red{display:table-cell; width:0; height:0; border-left: 30px solid transparent; border-top: 35px solid #F20642; border-bottom: 35px solid #F20642; border-right: 0px solid #F20642;}
   .shajra-wrapper .name-wrapper .name-red{display:table-cell; background:#F20642; padding:20px; color:#FFF; font-size:20px;}
  .shajra-wrapper .name-wrapper .name-arrow-right-red{display:table-cell; width:0; height:0; border-left: 30px solid #F20642; border-top: 35px solid transparent; border-bottom: 35px solid transparent; border-right: 0px solid #F20642;}
  .menu-with-detail{ text-align:center;}
  .menu-with-detail ul li{display:inline-block;}
  .menu-with-detail ul li .linkwrapper{width:250px; padding:0 25px; text-align:left; margin-top:50px}
  .menu-with-detail ul li .linkwrapper a{font-size:24px; color:#000; text-decoration:none; font-weight:900;}
  .menu-with-detail ul li .linkwrapper a:hover{ color:#ca1466;}
  .menu-with-detail ul li .linkwrapper .about-link{ padding:20px 0; font-size:14px; font-style:italic; line-height:20px;}
  footer { text-align:center; padding:100px; font-size:14px;}
  footer a{  text-decoration:none; color:#ca1466;}
  .popup-wrapper .message-status{ display:block; text-align: center; font-size: 38px; margin-top:50px;}
 .media-layout-wrapper .media-buttons-wrapper .media-button{ border:solid 1px #ca1466>; border-radius: 10px 10px 0 0; padding:10px; background:#ca1466; 
 color:#FFF; cursor:pointer;}
 .media-layout-wrapper .media-content{ background:#FFF; padding:40px; text-align:center;}
  .image-wrapper{ border: solid 2px #E7E7E7; display:inline-block; padding:2px; width:300px; margin:10px 20px;}
  .image-wrapper:hover{ transition: all .1s; box-shadow: 0 0 10px -2px #000000;}
   .image-wrapper .galleryimage{ width:300px; height:250px;}
  .image-wrapper .caption-wrapper{ padding:20px 0;}
  .image-wrapper .caption-wrapper .caption{ color:#666; background:#F7F7F7; padding:10px; text-align:center; font-weight:900; font-size:18px; text-transform:uppercase;}
  .block{display:block;}
  .inline-block{display:inline-block;}
  .floated-right{ float:right;}
  .download-icon-wrapper{ padding:20px; text-align:center;}
  .download-icon-wrapper .upperbox{ background:#ca1466; width:5px; height:20px;}
  .download-icon-wrapper .arrow-pointer{ margin-top:-4px; border-bottom: solid 10px white; border-top: solid 20px #ca1466; border-left: solid 15px #ffffff; border-right: solid 15px white;
  -webkit-animation-name: downloadanimation; /* Safari 4.0 - 8.0 */
  -webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
  -webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
  animation-name: downloadanimation;
  animation-duration:2s;
  animation-iteration-count: infinite;
  }
  .download-icon-wrapper .basket{  border: 5px solid #999; width:50px; height:20px; position:absolute; border-top:0; position:absolute; margin:-15px 0 0 -14px; border-radius:5px;}
 .download-icon-wrapper .download-icon-animation{
  height:50px;}
  .close-icon-wrapper{ padding:35px; margin-right:10px;}
  .close-icon-wrapper .bar{background:#ca1466; width:2px; height:50px;}
  .transform1{transform:rotate(45deg);}
  .transform2{transform:rotate(-45deg);}
 .media-active-button{color:#ca1466 !important; background:#FFF !important;}
 .select-wrapper{background:url(../_images/shahwilayat.jpg) 0px 0px; background-size:cover;
 }
 .selectwrapperanimation{-webkit-animation-name: bgoverlayanimation; /* Safari 4.0 - 8.0 */
  -webkit-animation-duration: 40s; /* Safari 4.0 - 8.0 */
  -webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
  animation-name: bgoverlayanimation;
  animation-duration:40s;
  animation-iteration-count: infinite;}
 .select-wrapper .cover-overlay{padding:1px 20px; background:rgba(114, 255, 8, 0.4);}
 .select-wrapper .cover-overlay nav ul{ margin:8px;}
 .select-wrapper .cover-overlay nav ul li{ display:inline-block; padding:1px; margin:12px 0;} 
  .select-wrapper .cover-overlay nav ul li a{
	font-size:12px;
	padding: 10px;
	background: rgba(255,255,255,1);
	border-radius: 6px;
	text-decoration: none;
	color: rgba(0,153,0,1);
}
 .scroll-menu{ background:#009999; background-size:cover; position:fixed; padding:5px; z-index:100;}
.scroll-menu ul{ margin:0}
.scroll-menu ul li{ display:inline-block; padding:12px 0;}
.scroll-menu ul li a{ padding:10px; text-decoration:none; border: solid 1px #FFFFFF; color:#fff;border-radius:5px; font-size:12px;}
.scroll-menu ul li a:hover{  background:#FFFFFF; color:#333333;}
  .select-wrapper .cover-overlay nav ul li a:hover{ transition:all .5; opacity:.8; background:rgba(0,0,0,1); }
   
  @-webkit-keyframes openmenuanimation {
  0%  {border:solid #FFCC33; border-width:0 5px 0 0;}
  33%  {border:solid #FFCC33; border-width: 0 0 5px 0; }
  66%  {border:solid #FFCC33; border-width:0 0 0 5px;}
  100%  {border:solid #FFCC33; border-width:5px 0 0 0;}
  from {transform:rotate(7200deg);}
    to {transform:rotate(0deg);}
  }
  @-webkit-keyframes bgoverlayanimation{
  0%  {background:url(../_images/shahwilayat.jpg) 0px 0px; }
  50%  {background:url(../_images/shahwilayat.jpg) 0px -200px;  }
  100%  {background:url(../_images/shahwilayat.jpg) 0px 0px; }
  }
@-webkit-keyframes downloadanimation {
  0%{margin-top:-4px;}
  15%{margin-top:-17px;}
  25%{margin-top:-4px;}
  60%{margin-top:-17px;}
  80%{margin-top:-4px;}
  100%{margin-top:-4px;}
  }


@media (min-width: 1536px){
	.all-wrapper{ width:1519px;}
	}
@media (min-width: 1024px ) and (max-device-width: 1100px) {
	.all-wrapper{ width:1024px;}
	.content-wrapper .content-left{ max-width:600px;}
	.content-wrapper .content-right{ max-width:300px;}
	}
@media (min-width: 1100px ) and (max-device-width: 1200px) {
	.all-wrapper{ width:1104px;}
	.content-wrapper .content-left{ max-width:650px;}
	.content-wrapper .content-right{ max-width:340px;}
	}
@media (min-width: 1200px ) and (max-device-width: 1300px) {
	.all-wrapper{ width:1204px;}
	.content-wrapper .content-left{ max-width:700px;}
	.content-wrapper .content-right{ max-width:400px;}
	}
@media (min-width: 1300px ) and (max-device-width: 1400px) {
	.all-wrapper{ width:1300px;}
	.content-wrapper .content-left{ max-width:700px;}
	.content-wrapper .content-right{ max-width:300px;}
	}
@media (min-width: 1400px ) and (max-device-width: 1536px) {
	.all-wrapper{ width:1404px;}
	.content-wrapper .content-left{ max-width:800px;}
	.content-wrapper .content-right{ max-width:500px;}
	}