﻿/* Custom styling for the Bootstrap website. 
These styles do not ship with Bootstrap. 
Some are overrides of existing Bootstrap styles, while others are new styles not existing in Bootstrap.
In the starting CSS document, styles are based on custom classes not in Bootstrap.
*/

/* below styles are the default -- take effect at resolutions <768 px */

@font-face {
     font-family: myFirstFont;
     src: url(font/Zienab.ooo.ttf);
     
}

@font-face {
     font-family: mysecoundFont;
     src: url(font/Far_Arash.ttf);
     
}
@font-face {
     font-family: mythreeFont;
     src: url(font/Far_Nazanin.ttf);
     
}
@font-face {
     font-family: myfourFont;
     src: url(font/Parastoo.ttf);
     
}
@font-face {
	font-family: myfiveFont;
	src: url(font/AdobeArabic.ttf);

}
@font-face {
	font-family: mysixFont;
	src: url(font/taha.ttf);

}
@font-face {
	font-family: mysevenFont;
	src: url(font/IRRoya.ttf);

}
@font-face {
	font-family: myeightFont;
	src: url(font/DS-DIGII.ttf);

}

.font1 {
	font-size: 14px;

}
.font1 a{
	color: #9a07d6;
}
.font1 a:hover {
	color: royalblue;
}

.picture3 {
	text-align: center;
	margin-top: 4px;
	width: auto;
	height: auto;
	max-height:350px;
	max-width:400px;
}

.picture3 img {	
	margin-bottom: 5px;
	border: 6px #CCAA77 ridge;
	height: auto;
	width:auto;
	max-width:260px;
	max-height:260px;
}

.body {
	width: 200px;
	text-align: center;

}

#thumbs {    
    margin-top: 10px;
    
    
    
}

#thumbs td {
    text-align: center;
}

#thumbs img {
    border:1px solid black;
    border-radius:5px;
	display:block;	
	text-align:center;
	height:auto;
    width:auto;
    max-height:50px;
    max-width:66px;    
    box-shadow: 10px 10px 15px #999999;
    margin-left:5px;
    margin-right:5px;	
}

#thumbs a:link, #thumbs a:visited, #thumbs a:hover, #thumbs a:active {
    border: none;
    padding: 2px;
    
}

#thumbs1 td {
    text-align: center;
}


figure {
	margin: 0 10px 0 10px;	
}

/* Border and background color for the random image. */

figure img {

	height:auto;
    width:auto;
	max-height:200px;
	max-width:270px;
	border:2px solid black;
	border-radius:15px;

}


.logo {
	text-align: center;
}
.tagline {
	color: #602F8D;
	font-family: Georgia, serif;
	font-style: italic;
	font-size: 1.5em;
	text-align: center;
	padding-top: 1em;
}

.link a {
	text-decoration: none;
	color: #3333FF;
	font-size: 0.8em;
}
.link a:hover {
	color: red;
	text-decoration: underline;
}


/* footer styling for all resolutions */

.siteinfo {

	text-align: center;
	padding: 3em 0;
	border-top: 1px solid #ddd;
}
.siteinfo a {
	text-decoration: none;
	color: #999;
	font-size: 0.8em;
}
.siteinfo a:hover {
	color: #602F8D;
	text-decoration: underline;
}

/* Chapter 2 challenge/solution: styling thumbnails and modals */

.btn-primary { 
    background-color: #602F8D; 
    border-color: #602F8D; 
}  
.btn-primary:hover, 
.btn-primary:focus,  
.btn-primary:active { 
    background-color: #53297A; 
} 
.modal-body .pull-left { 
    padding-right: 1em; 
} 
.modal-body .pull-right { 
    padding-left: 1em; 
} 
.modal-footer { 
    clear: both; 
} 

/* panel styling for the home page */


/* form styles */
.form-group button {
	margin-top: 10px;
}

form .col-sm-2,
form .col-sm-10 {
	padding: 10px 0;
	margin: 0;
}
/* Small devices (tablets, 768px and up) 

Greater than 768 px, push logo left and tagline right. Alter 
tagline font size, alignment, and padding for larger dimensions.

*/
@media (min-width: 768px) {  
	.logo {
		text-align: left;
	}
	.tagline {
		font-size: 2em;
		text-align: right;
		padding-top: 1.6em;
	}
	form {
		width: 750px;
		margin: 0 auto;
	}

}


/*

*/


.card .icon {
	font-size: 75px;
	line-height: 75px;
}
.card .icon ~ h3 {
	margin-top: 5px;
	margin-bottom: 0px;
}

.card {
	background: #fff;
	box-shadow: 0 32px 44px -24px rgba(0, 0, 0, 0.23), 0 20px 25px 0px rgba(0, 0, 0, 0.12), 0 15px 10px -10px rgba(0, 0, 0, 0.2);
	border-radius: 6px;
	margin-bottom: 30px;
	-webkit-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
	-moz-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
	-o-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
	-ms-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
	transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
}
.card:not(.card-plain):not(.card-price):hover {
	-webkit-transform: scale(1.03);
	-moz-transform: scale(1.03);
	-o-transform: scale(1.03);
	-ms-transform: scale(1.03);
	transform: scale(1.03);
	box-shadow: 0 26px 50px -10px rgba(0, 0, 0, 0.38), 0 10px 20px 0px rgba(0, 0, 0, 0.2), 0 15px 10px -10px rgba(0, 0, 0, 0.2);
}
.card .subtitle-black {
	color: #141414;
}
.card a {
	opacity: .85;
}
.card:hover .header {
	opacity: 1;
}
.card h2 {
	margin-top: 0;
}
.card img {
	max-width: 100%;
}
.card .header img {
	border-radius: 4px;
}
.card .image-header,
.card .header img {
	width: 100%;
	border-radius: 4px 4px 0 0;
}
.card .image-header.image-full,
.card .header img.image-full {
	border-radius: 4px;
}
.card .row .image-header,
.card .row .header img {
	width: 100%;
	border-radius: 4px;
}
.card .btneeeeee {
	margin-top: 15px;
}
.card > img {
	border-radius: 4px;
}
.card .title {
	margin-bottom: 5px;
	color: #333333;
}
.card .description {
	font-size: 13px;
}

.card-member {
	display: block;
	text-align: center;
	margin-bottom: 20px;
}
.card-member .content {
	padding: 25px;
}
.card-member > img {
	background: none repeat scroll 0 0 transparent;
	height: auto;
	width: 120px;
	margin: 0 auto;
}

.card-white {
	background: #FFFFFF;
}

.card-plain {
	border-radius: 0;
	box-shadow: none;
	background: none;
}
.card-plain .image-header {
	border-radius: 4px;
}
.card p {
	min-height: 0;
}

.avatar2 {
	vertical-align: middle;
	max-height: 200px;
	max-width: 200px;
	height:auto;
	width:auto;
	margin-right: 5px;
	border-radius: 10%;
}





/*

*/

.info-icon {
	text-align: center;
}
.info-icon .icon {
	font-size: 50px;
	line-height: 50px;
	color: #c5a47e;
	margin-bottom: 10px;
}
.info-icon .description {
	margin-top: 15px;
	color: #777777;
}
/*

*/

.single-video-post {
  position: relative;
  z-index: 1;
  overflow: hidden;
  margin-bottom: 30px; }
  .single-video-post img {
    -webkit-transition-duration: 2000ms;
    transition-duration: 2000ms;
    width: 100%; }
  .single-video-post .videobtn {
    position: absolute;
    width: auto;
    height: auto;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
    .single-video-post .videobtn a {
      display: block;
      width: 70px;
      height: 40px;
      border-radius: 5px;
      background-color: #ee002d;
      color: #fff;
      text-align: center;
      line-height: 40px;
      font-size: 18px; }
      .single-video-post .videobtn a:hover, .single-video-post .videobtn a:focus {
        background-color: #152535;
        color: #fff; }
  .single-video-post:hover img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2); }

/* :: 9.0 Footer Area */
.footer-area {
	position: relative;
	z-index: 1;
	width: 100%;
	background-color: #0a3837; }
.footer-area .footer-widget-area {
	position: relative;
	z-index: 1; }
.footer-area .footer-widget-area .footer-logo {
	margin-bottom: 30px; }
.footer-area .footer-widget-area .widget-title {
	display: block;
	margin-bottom: 30px;
	color: #fff; }
.footer-area .footer-widget-area .list {
	position: relative;
	z-index: 1; }
.footer-area .footer-widget-area .list li {
	display: block; }
.footer-area .footer-widget-area .list li a {
	display: block;
	padding: 5px 0;
	color: rgba(255, 255, 255, 0.5); }
.footer-area .footer-widget-area .list li a:hover, .footer-area .footer-widget-area .list li a:focus {
	color: #fff; }
.footer-area .bottom-footer-area {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100px; }
.footer-area .bottom-footer-area p {
	color: #00b5d6;
	margin-bottom: 0; }
.footer-area .bottom-footer-area p a {
	color: #fff; }
.footer-area .bottom-footer-area p a:hover, .footer-area .bottom-footer-area p a:focus {
	color: #fff; }
.footer-area a:hover{
	color: #ff5854;

}