/*--------------------------------------------------
PURE STUDIO html/css template - style.css

URL:gozawi.com
SUPPORT: wtxinc@gmail.com
CODE: SIP001S

CSS overwiev:

1. CSS Reset
2. Font Face
3. Basic Styles
4. Home
5. Menu
6. Sections
7. Columns
8. Wrappers
9. Services
10.Pricing
11.Design Promo
12.Who we are
13.Skills
14.Blog
15.Selected Works
16.Isotope
17.Clients
18.Contact
19.Widget Bottom
20.Bottom Section
21.Sidebar
22.Shortcodes
23.Responsive

---------------------------------------------------*/
  
/****************************************************************************
1. CSS Reset
****************************************************************************/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address,
big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl,
dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas,
details, embed,  figure, figcaption, footer, header, hgroup,  menu, nav, output, ruby, section, summary, time, mark, audio,
video {	margin: 0; 	padding: 0;	border: 0;	font-size: 100%;	font: inherit;	vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none;}
blockquote, q {	quotes: none;}
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table {	border-collapse: collapse; border-spacing: 0; }

/****************************************************************************
2. Font Face
****************************************************************************/

@font-face {
    font-family: 'EntypoRegular';
    src: url('../fonts/entypo-webfont.eot');
    src: url('../fonts/entypo-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/entypo-webfont.woff') format('woff'),
         url('../fonts/entypo-webfont.ttf') format('truetype'),
         url('../fonts/entypo-webfont.svg#EntypoRegular') format('svg');
    font-weight: normal;
    font-style: normal;
	
}

@font-face {
    font-family: 'OpenSansLight';
    src: url('../fonts/OpenSans-Light-webfont.eot');
    src: url('../fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-Light-webfont.woff') format('woff'),
         url('../fonts/OpenSans-Light-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansLightItalic';
    src: url('../fonts/OpenSans-LightItalic-webfont.eot');
    src: url('../fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
         url('../fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansRegular';
    src: url('../fonts/OpenSans-Regular-webfont.eot');
    src: url('../fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-Regular-webfont.woff') format('woff'),
         url('../fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansItalic';
    src: url('../fonts/OpenSans-Italic-webfont.eot');
    src: url('../fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-Italic-webfont.woff') format('woff'),
         url('../fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansSemibold';
    src: url('../fonts/OpenSans-Semibold-webfont.eot');
    src: url('../fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-Semibold-webfont.woff') format('woff'),
         url('../fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansSemiboldItalic';
    src: url('../fonts/OpenSans-SemiboldItalic-webfont.eot');
    src: url('../fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
         url('../fonts/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-SemiboldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansBold';
    src: url('../fonts/OpenSans-Bold-webfont.eot');
    src: url('../fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-Bold-webfont.woff') format('woff'),
         url('../fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansBoldItalic';
    src: url('../fonts/OpenSans-BoldItalic-webfont.eot');
    src: url('../fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
         url('../fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansExtrabold';
    src: url('../fonts/OpenSans-ExtraBold-webfont.eot');
    src: url('../fonts/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-ExtraBold-webfont.woff') format('woff'),
         url('../fonts/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansExtraboldItalic';
    src: url('../fonts/OpenSans-ExtraBoldItalic-webfont.eot');
    src: url('../fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
         url('../fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
         url('../fonts/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansExtraboldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

/****************************************************************************
3. BASIC STYLES
****************************************************************************/

html { height: 100%; overflow-x:hidden; }

h1,h2,h3,h4,h5,h6{  }
h1{ font-size:72px; line-height:72px; }
h2{ font-size:48px; line-height:48px; }
h3{ font-size:38px; }
h4{ font-size:24px; }
h5{ font-size:18px; }
h6{ font-size:14px; }

.font150px { font-size:150px; }
.font90px { font-size:90px; }
.font72px { font-size:72px; }
.font48px { font-size:48px; }
.font36px { font-size:36px; }
.font30px { font-size:30px; }
.font24px { font-size:24px; }
.font18px { font-size:18px; }
.font14px { font-size:14px; }
.font13px { font-size:13px; }
.font11px { font-size:11px; }

.line-height36px { line-height:36px; }

.font { font-family: "OpenSansLight", Arial, Helvetica,sans-serif; }
.bold { font-family: "OpenSansBold", Arial, Helvetica,sans-serif; }
.italic { font-family: "OpenSansItalic", Arial, Helvetica,sans-serif; }
.icon { font-family: "EntypoRegular", Arial, Helvetica,sans-serif; }

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }

a {text-decoration: none; }
a:focus { outline: 0px none; }
a:hover, a:active { outline: 0px none; }

.hidden { display:none; }
.width-100 { width:100%; }
.pretty-photo-video { height:300px; }

.clearfix:before, .clearfix:after { content: ""; display: table; } 
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
.clear {clear:both; }

.line { width:100%; height:1px; margin:60px 0; }

.button { padding: 15px 25px; }

.border { border-width:1px; border-style:solid; }

.margin-top-5px { margin-top:5px; display:table; }
.margin-top-20px { margin-top:20px; }
.margin-top-30px { margin-top:30px; }
.margin-top-40px { margin-top:40px; }
.margin-top-60px { margin-top:60px; }
.margin-top-100px { margin-top:100px; }
.margin-right-10px  { margin-right:10px; }

.margin-bottom-10px { margin-bottom:10px; }
.margin-bottom-20px { margin-bottom:20px; }
.margin-bottom-30px { margin-bottom:30px; }

.float-left { float:left; }
.float-right { float:right; }

#preloader { position:absolute; top:0; left:0; right:0; bottom:0; z-index:99; }
#status { width:200px; height:200px; position:absolute; left:50%; top:50%; background-image:url(../images/status.gif);  background-repeat:no-repeat; background-position:center; margin:-100px 0 0 -100px; }

/****************************************************************************
4. HOME
****************************************************************************/

.home-wrapper { width:100%; height:590px; background: url(../images/home.jpg) 50% 0 fixed; text-align:center; padding: 120px 0 0 0; position:relative; }
.home-wrapper h1 { margin: 20px 0; line-height:62px; }
.home-wrapper h5 { margin: 60px 0; }

.home-wrapper-photo { width:230px; height:230px; background: url(../images/avatar.jpg) 50% 100%; margin:0 auto; position:relative;
border-radius: 150px;
-webkit-border-radius: 150px;
-moz-border-radius: 150px;
 }

.home-wrapper .icon-background { width:90px; height:90px; position:absolute; bottom:-10%; left:-10%;
border-radius: 150px;
-webkit-border-radius: 150px;
-moz-border-radius: 150px;
}
.home-wrapper .icon-background .icon { margin:0 auto; margin-top:20px; display:table; }
.home-wrapper .detail { position:absolute; top:8%; left:50%; } 

/****************************************************************************
5. MENU
****************************************************************************/

.menu { width:100%; padding: 15px 0; z-index:999; display:table; float:left;  }
.desktop-menu { float:right; display:block; }
.desktop-menu li { float:left; margin:0 13px 0 0; padding: 15px 0; }
.desktop-menu li a { padding: 15px 10px; }

.menu .logo { margin-top:11px; margin-left:10px; }

.mobile-menu-list { text-align:center; display:none; }
.mobile-menu-list li { padding:10px 0; }

.mobile-button  { display:none; margin-right:10px; cursor:pointer; margin-top:10px; }

/****************************************************************************
6. SECTIONS
****************************************************************************/

.normal-section { padding:150px 0 100px 0; display:table; width:100%; }
.section-center { max-width:960px; margin:0 auto; position:relative; }
.section-center h1 { margin:0 auto; display:table; margin-bottom:100px; }

/****************************************************************************
7. COLUMNS
****************************************************************************/

.one-half{ width:48%; }
.one-third{ width:30.66%; }
.two-third{ width:65.33%; }
.one-fourth{ width:22%; }
.three-fourth{ width:74%; }
.one-fifth{ width:16.8%; }
.two-fifth{ width:37.6%; }
.three-fifth{ width:58.4%; }
.four-fifth{ width:67.2%; }
.one-sixth{ width:13.33%; }
.five-sixth{ width:82.67%; }
.one-half,.one-third,.two-third,.three-fourth,.one-fourth,.one-fifth,.two-fifth,.three-fifth,.four-fifth,.one-sixth,.five-sixth{ position:relative; margin-right:4%; float:left; }
.last{ margin-right:0 !important; clear:right; }

/****************************************************************************
8. WRAPPERS
****************************************************************************/

.wrapper-1 { background: url(../images/wrappers/1.jpg) 50% 50% fixed; }
.wrapper-2 { background: url(../images/wrappers/2.jpg) 50% 50% fixed; }
.wrapper-3 { background: url(../images/wrappers/3.jpg) 50% 90% fixed; }
.wrapper-4 { background: url(../images/wrappers/4.jpg) 50% 10% fixed; }
.wrapper-5 { background: url(../images/wrappers/5.jpg) 50% 10% fixed; }
.wrapper-6 { background: url(../images/wrappers/6.jpg) 50% 10% fixed; }

.wrapper-hover { width:100%; height:100%; background-color: rgba(29,29,51,.5); padding:150px 0 100px 0; display:table; }
.section-with-hover { padding:0 !important; }
.section-with-hover h2 { margin:0 auto; display:table; }

.header-background { width:100%; padding: 35px 0; margin:0 0 5px 0; position:relative; }
.header-background h2 { margin:0 auto; display:table; }
.video-wrapper { width:100%; height:400px; }

.wrapper-icon {
-moz-border-radius: 75px / 75px 75px 75px 75px;
-webkit-border-radius: 75px / 75px 75px 75px 75px;
border-radius: 75px / 75px 75px 75px 75px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
width:150px; height:150px; position:absolute; right:-70px; top:0;
}
.wrapper-icon .icon { margin:0 auto; padding-top:40px; display:table; z-index:500; }
.header-background  .detail { position:absolute; bottom:-200px; right:-30px; z-index:100; }

.p-wrapper { text-align:center; margin-top:50px; }
.p-button { text-align:center; width:120px; margin-left:90px; margin-right:90px; }
.wrapper-detail { position:absolute; bottom:-190px ; left:45%; }

/****************************************************************************
9. SERVICES
****************************************************************************/

.service .icon-background { width:150px; height:150px; margin:0 auto; cursor:pointer;
border-radius: 150px;
-webkit-border-radius: 150px;
-moz-border-radius: 150px;
}
.service .icon-background .icon { margin:0 auto; padding-top:45px; display:table; }
.service h5 { margin:0 auto; margin-top:30px; margin-bottom:30px; display:table; }
.service p { text-align:center; }

/****************************************************************************
10. PRICING
****************************************************************************/

.pricing .name { text-align:center; padding:15px 0; }
.pricing .price { margin:0 auto; margin-top:40px; display:table; }
.pricing .monthly { margin:0 auto; margin-bottom:30px; margin-top:8px; display:table; }
.pricing  .line { margin:10px 0; }
.pricing .feature { margin:0 auto; display:table; }
.pricing .button { margin:0 auto; margin-top:40px; display:table; width:100%; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; text-align:center; }

/****************************************************************************
11. DESIGN PROMO
****************************************************************************/

.design-promo-hover { min-height:500px; display:block !important; }
.design-promo { position:relative; }
.design-promo-background { position:absolute; background: url(../images/design-promo.png); top:0; z-index:100; }
.design-promo-work { position:absolute; background: url(../images/design-promo.png); top:56px; left:22px; z-index:150; width:619px; max-height:398px }
.design-promo .icon-background { width:150px; height:150px; position:absolute; top:0; left:-30px; z-index:200;
border-radius: 150px;
-webkit-border-radius: 150px;
-moz-border-radius: 150px;
}
.design-promo .icon-background .icon { margin:0 auto; padding-top:45px; display:table; }
.design-promo .detail { position:absolute; z-index:250; top:130px; }

/****************************************************************************
12. WHO WE ARE
****************************************************************************/

.team .team-photo { width:225px; height:150px; margin: 0 0 20px 0;  
-moz-border-radius: 25px / 25px 25px 25px 25px;
-webkit-border-radius: 25px / 25px 25px 25px 25px;
border-radius: 25px / 25px 25px 25px 25px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
 }
.team span { margin: 0 0 20px 0; display:table; }
.team .social { position:absolute; top:130px; right:-5px; }
.team .social li { height:25px; width:25px; float:right; margin: 0 0 0 1px; }
.team .social li img { height:16px; width:16px; margin:0 auto; display:table; margin-top:5px; }

.award { margin: 30px 0 0 0; display:table; }
.first-award { margin:0 !important; }
.award .promo { padding: 0 5px; }

.award-header .icon-background { width:150px; height:150px; margin:0 auto; margin-top:30px;
border-radius: 150px;
-webkit-border-radius: 150px;
-moz-border-radius: 150px;
}
.award-header .icon-background .icon { margin:0 auto; padding-top:45px; display:table; }
.award-header .icon-break { width:100%; height:50px; position:absolute; top:0; }
.award-header h3 { margin:0 auto; display:table; }

/****************************************************************************
13. SKILLS
****************************************************************************/

.skill { -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; padding:15px; }
.skill h5 { margin-bottom:10px; }
.skill-show { float:left; width:100%; margin: 10px 0 0 0; }
.skill-box { float:left; color:#fff; padding: 1px 7px;   }
.skill-tringle { float:left; width: 0px; height: 0px; border-style: solid; border-width: 13px 0 13px 13px; }
.skill-detail { right:-48px !important; }

/****************************************************************************
14. BLOG 
****************************************************************************/

.blog-meta a { text-decoration:underline; }
.blog-meta { margin-top:10px; display:table; }
.blog-news img { margin: 15px 0; width:470px; height:235px; }
.blog-news .button { margin-top:30px; display:table; float:right; padding-right:80px; padding-left:80px; }

.more-blog-posts { position:relative; }
.more-blog-posts .icon-background { width:150px; height:150px; position:absolute; top:-80px; left:0; border-width:10px;  
border-radius: 150px;
-webkit-border-radius: 150px;
-moz-border-radius: 150px;
}
.more-blog-posts .icon-background .icon { margin:0 auto; padding-top:45px; display:table; }
.more-blog-posts .line-cover { position:absolute; width:150px; height:30px; top:-90px; }
.more-blog-posts h4 { margin-left:180px; }
.more-blog-posts p { margin-top:80px; }

.blog-page img { margin: 15px 0; width:710px; height:335px; }
.blog-page .button { margin-top:30px; display:table; float:right; padding-right:80px; padding-left:80px; }

.blog-page { display:table; }

.more-blog-posts ul { margin-left: 340px; margin-top:-27px; }
.more-blog-posts ul li { float:left; border-width:1px; border-style:solid; padding:5px 0px ; margin-left: 15px; margin-bottom:15px; }
.more-blog-posts ul li a { padding:5px 11px; height:100%; }
.more-blog-posts .more-comments { margin-left:400px; }

.comment-info { margin-bottom:20px; }
.comments li { margin-bottom:40px; }
.comment-reply { margin-left:80px; }

/****************************************************************************
15. SELECTED WORKS
****************************************************************************/

.home-slider { height:430px; margin-top:60px; }
.home-slider h4 { margin-bottom:30px; }
.home-slider .icon { position:absolute; top:-18px; right:10px; }

.portfolio-container { display:table; margin-top:60px; width:100% !important; }
.portfolio-item { width:33.33%; float:left; position:relative; }
.portfolio-item img { width:100%; height:210px; }
.portfolio-item-content { text-align:center; padding: 15px 0; }

.portfiolio-filters li  { float:left; white-space: nowrap; margin: 0 5px 5px 0; }
.portfiolio-filters li a { padding: 5px 10px; }

.portfolio-item .mask { width:100%; height:100%; text-align:center; position:absolute; top:0; 
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
transition: all 0.3s linear;
}

.portfolio-item .icon {
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
transition: all 0.3s linear;
margin:0 auto; display:table; 
}

.portfolio-item:hover .mask  {
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
}

.portfolio-item:hover .icon {
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
margin-top:80px;
}

.portfolio-item .mask a { width:100%; height:100%; display:table; position:relative; }
.portfolio-item-content-again { position:absolute; bottom:0; width:100%; text-align:center; padding-bottom:15px; padding-top:23px; }

/****************************************************************************
16. ISOTOPE
****************************************************************************/

.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}


/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

/****************************************************************************
17. CLIENTS
****************************************************************************/

.client {  line-height: 200px; }
.client img { margin:0 auto; display:table; }
.client-padding-30px { padding-top:30px; }

/****************************************************************************
18. CONTACT
****************************************************************************/

.contact .social { position:absolute; top:-55px; right:0; }
.contact .social li { height:45px; width:45px; float:right; margin: 0 0 0 1px; }
.contact .social li img {  margin:0 auto; display:table; margin-top:10px; }

#map { width:100%; height:320px; }

.contact-form input[type=text] { width:100%; padding:15px 10px; margin-bottom:20px; outline:none; box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; webkit-appearance: none; -webkit-border-radius: 0; }
.contact-textarea { width:100%; height:200px; outline:none; box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; webkit-appearance: none; -webkit-border-radius: 0; padding: 20px 10px; margin-top:2px; }
.contact-form input[type=submit] { border: none; outline:none; cursor:pointer; width:150px;  display:table; margin-top:10px; webkit-appearance: none; -webkit-border-radius: 0; }
.submit-wrapper { position:relative; }
.submit-wrapper .button { -webkit-appearance: none; -webkit-border-radius: 0;  }

.input-wrapper { position:relative; }
.contact-error { display:table; padding:5px 10px 5px 10px; top:-10px; right:0; position:absolute; }
.form-detail { position:absolute; top:15px; right:0; }

.name-error, .email-error, .topic-error, .message-error { 
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity:0;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
-ms-transition: all 0.5s linear;
transition: all 0.5s linear;

}
.error-display {
-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=1)";
filter: alpha(opacity=1);
opacity:1;
-webkit-transition: all 0.5s linear;
-moz-transition: all 0.5s linear;
-o-transition: all 0.5s linear;
-ms-transition: all 0.5s linear;
transition: all 0.5s linear;
}

/****************************************************************************
19. WIDGET BOTTOM
****************************************************************************/

.widget-section-padding { padding: 60px 0 !Important; }
.flickr li { list-style-type:none; float:left; width:80px; margin: 0 10px 10px 0; display:table; }

/****************************************************************************
20. BOTTOM SECTION
****************************************************************************/

.bottom-section h1 { margin-bottom:0; }
.bottom-choose { margin:0 auto; display:table; margin-top:10px; }
.bottom-section .footer { margin:0 auto; display:table; padding-top:60px; }
.bottom-section .button { width:120px; text-align:center; }
.bottom-section .float-right { margin-right:-130px; }
.bottom-section .float-left { margin-left:-130px; }

.bottom-section .z-index-fix { z-index:100; }

/****************************************************************************
21. SIDEBAR
****************************************************************************/

.sidebar  h5 { margin: 30px 0; }

.search { position:relative; margin-bottom:30px; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;  }
.search-button { position:absolute; right:0; background:none; border:none; outline:none; webkit-appearance: none; -webkit-border-radius: 0; margin-top:8px; cursor:pointer; }
.search-field { width:100%; border-width:1px; border-style:solid; outline:none; padding: 15px 35px 15px 15px; box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; webkit-appearance: none; -webkit-border-radius: 0;  }

.tags { display:table; }
.tags li { float:left; padding: 3px 0; margin:0 10px 10px 0 !important; }
.tags li a { padding: 3px 7px; }

/****************************************************************************
22. SHORTCODES
****************************************************************************/

.toogle-swith { display:table; width:100%; height:50px; padding: 0 15px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; margin-bottom:10px; }
.toogle-swith a { width:100%; height:50px; display:table; }
.toogle-swith .icon { float:right; margin-top:7px; } 
.toogle-swith .toogle-text { margin-top:13px; float:left; }
.toogle-swith .toogle-content { float:left;  margin:10px 0; display:none; }

.alert { width:100%; padding:0 15px; }
.alert a { width:100%; padding: 20px 15px; display:table; }

.info-block { padding:10px 10px 20px; }
.info-block .button { margin-right:-10px; margin-top:20px; }

/****************************************************************************
23. RESPONSIVE
****************************************************************************/

@media all and (max-width:959px ) {
.mobile-button  { display:block; }
.desktop-menu  { display:none; }
.section-center { padding-left:10px; padding-right:10px; }
}

@media all and (max-width: 950px) {
.team { float:none; margin:0 auto !important ; display:table; padding-top:60px; }
.team .social { top:190px; }
}

@media all and (max-width: 800px) {
.one-half,.one-third,.two-third,.three-fourth,.one-fourth,.one-fifth,.two-fifth,.three-fifth,.four-fifth,.one-sixth,.five-sixth{ width:100%; }
.team { float:none; margin:0 auto !important ; display:table; padding-top:60px; width:22%; }
.team .social { top:190px; }
.widget-section-padding .one-half { margin-top:30px; }
.contact .social { position:relative; margin-top:80px; display:table; }
.design-promo, .home-slider .icon, .wrapper-detail { display:none; }
.bottom-section .float-right, .bottom-section .float-left { margin:0 auto; float:none; display:table; }
.p-button { margin:0 auto; display:table; float:none; margin-top:30px; }
.wrapper-icon, .header-background .detail { display:none; }
.blog-page img { margin: 15px 0; width:470px; height:235px; }
.sidebar { margin-top:60px; }
.more-blog-posts ul { margin-left:0; margin-top:70px; }
.more-blog-posts .more-comments { margin-left:0; }
.award-header { margin-bottom:30px; }
.home-wrapper  { height:600px; }
}

@media all and (max-width: 700px) {
.portfolio-item { width:50%; }
#map { height:150px; }
.home-wrapper h1 { font-size:48px; line-height:48px; }
}

@media all and (max-width: 500px) {
.portfolio-item { width:100%; }
.home-wrapper h1 { font-size:46px; line-height:46px; }
.blog-news img { width: 225px; height: 150px; }
.blog-news .button { float:left; }
.blog-page img { width: 225px; height: 150px; }
.blog-page .button { float:left; }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
.name-error, .email-error, .topic-error, .message-error { position:relative; z-index:100; float:right; width:300px; margin-top:-1px; }
}