﻿/*
Theme Name: Azita Madani
Author: Azita Madani
Designer: Mahsa Mirzapour
*/
@font-face {
  font-family: 'XeroSansBold';
  src: url('../fonts/XeroSansBold.eot?#') format('eot'),  /* IE6–8 */
       url('../fonts/XeroSansBold.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url('../fonts/XeroSansBold.ttf') format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
}
*{
    padding: 0;
    margin: 0;
}
html{
	width:100%;
	height:100%;
	overflow:hidden; background-color:#365e68 !important;
}
body{
    font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
    background: #365e68 url('/data/_themes/c9kb5nh/img/bg.jpg') no-repeat center  fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover; overflow:hidden !important
}
a{
    text-decoration: none;
    -moz-transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    transition: all .3s ease-out; color: #fff !important
}

.insta{
position:absolute;
right:10px;
bottom:5px;
width:40px !important;
}
nav{
	text-align:center;
	margin-top:15px;
	position:relative;
	z-index:1000; padding-right:20px !important
}
nav ul li{
	display:inline-block;margin-left:-2px
}
nav ul li a{
	font-family:'Fjalla One';
	color:#333;
	font-size:14pt;
	padding:8px;
	font-weight:bold;
}
nav ul li a{
	color:#333;	opacity:0.6;
}
nav ul li a:hover{
	color:#D4C894;
	background:#617e86;
	opacity:0.9;
	text-decoration:none; border-radius:5px
}
.pic{
	margin-top:12px;box-shadow: -20px 10px 30px rgba(0, 0, 0, 0.45); margin-bottom:80%
}
.name{
	margin-top:10px;
	width:200px; padding-bottom:20px
}
.instagram{
text-align:center;
}

.footer{
	position:absolute;
	bottom:0;
	color:#444;
	font-family:'Fjalla One';
	font-weight:bold;
	font-size:10px;
}
.footer a{
	color:#333 !important;
	font-family:'Fjalla One';
	font-weight:bold;
}
.footer a:hover{
	color:#999;
	text-decoration:none;
}
.fadeInDown{
    -webkit-transition-duration: 20s;
	-moz-transition-duration: 20s;
	-ms-transition-duration: 20s;
	-o-transition-duration: 20s;
    transition-duration: 20s;
}
.fadeIn{
    -webkit-transition-duration: 20s;
	-moz-transition-duration: 20s;
	-ms-transition-duration: 20s;
	-o-transition-duration: 20s;
    transition-duration: 20s;
   -webkit-animation-delay: 1s; /* Chrome, Safari, Opera */
    -moz-animation-delay: 1s;
	-o-animation-delay: 1s;
	-ms-animation-delay: 1s;
	animation-delay: 1s;
}
.bounceIn{
    -webkit-transition-duration: 20s;
	-moz-transition-duration: 20s;
	-ms-transition-duration: 20s;
	-o-transition-duration: 20s;
    transition-duration: 20s;
   -webkit-animation-delay: 2s; /* Chrome, Safari, Opera */
    -moz-animation-delay: 2s;
	-ms-animation-delay: 2s;
	-o-animation-delay: 2s;
	animation-delay: 2s;
}
@media screen and (max-width:375px){
	nav ul li a{
		font-size:9pt !important;
                padding:5px;
	}
}
@media screen and (max-width:320px){
	nav ul li a{
		font-size:6pt !important;
                font-weight:bold; 
	}
}
@media screen and (max-width:384px){
	nav ul li a{
		font-size:12px;
	}
}
@media screen and (max-width:412px){
	nav ul li a{
		font-size:12px;
	}
}
@media screen and (max-width:414px){
	nav ul li a{
		font-size:12px;
	}
	.pic{ max-width:90% !important}
	nav{ margin-left:10px !important}
}


section{
  width: 400px;
  height: 423px;
  position: relative;
  left: 50%;
  margin-top:20px;
  margin-left: -210px;
  overflow: hidden;
  background: #223a3e;
  box-shadow: -20px 10px 30px rgba(0, 0, 0, 0.45); margin-bottom:80px
}

/*section:hover article{
  animation-play-state: paused;
}*/

article{
  position: absolute;
  left: 500px;
  background: #223a3e;
  color: #e3e3e3;
  width: 500px;
  height: 500px;
  text-align: center;
  font: 2em/1em sans-serif;
  border-box: box-sizing;
margin-left: -50px;
}

article:nth-of-type(1){
  animation: slideIn 50s linear 0s infinite;
}
article:nth-of-type(2){
  animation: slideIn 50s linear 5s infinite;
}
article:nth-of-type(3){
  animation: slideIn 50s linear 10s infinite;
}

article:nth-of-type(4){
  animation: slideIn 50s linear 15s infinite;
}
article:nth-of-type(5){
  animation: slideIn 50s linear 20s infinite;
}
article:nth-of-type(6){
  animation: slideIn 50s linear 25s infinite;
}
article:nth-of-type(7){
  animation: slideIn 50s linear 30s infinite;
}
article:nth-of-type(8){
  animation: slideIn 50s linear 35s infinite;
}
article:nth-of-type(9){
  animation: slideIn 50s linear 40s infinite;
}
article:nth-of-type(10){
  animation: slideIn 50s linear 45s infinite;
}

@keyframes slideIn{
  0% {left: 500px;}
  1% {left: 0;}
  10% {left: 0;}
  11% {left: -500px;}
  100%{left: -500px;}
}

@media screen and (max-width:384px){
section{  width: 310px!important; height: 330px!important;  margin-left: -155px!important;}

article img{
  max-width: 430px!important;
  max-height: 330px!important;
  margin-left:-88px!important;
}
}

@media screen and (max-width:414px){
section{  width: 330px; height: 350px;  margin-left: -165px;}

article img{
  max-width: 450px;
  max-height: 350px;
  margin-left:-68px;
}
}