/* CSS Resets */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,cite,code,del,dfn,em,img,ins,q,small,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;}article,aside,figure,figure img,figcaption,hgroup,footer,header,nav,section,video,object{display:block}a img{border:0}figure{position:relative}figure img{width:100%}img, object, embed{ max-width: 100%;}img { height: auto;}table td img, table td object, table td embed{ max-width: 100%;}table td img { height: auto;}

#dnnwrapper								{ background:#fff;}
.dnnrow									{ width: 100%;max-width: 1140px;min-width:320px;margin: 0 auto;}
.innermargin							{ margin:0 20px}
.clr									{ clear:both;}
.fleft									{ float:left}
.fright									{ float:right}
.ml20									{ margin-left:20px;}
.mr20									{ margin-right:20px; }
.fimgborder								{ border:5px #2b2b2b solid;}
.fimgborder:hover						{ border:5px #555 solid;}
.whitecolor, .whitecolor *				{ color:#fff;}
.i16									{ font-size:16px}
.i24									{ font-size:24px;}
.i32									{ font-size:32px;}
.desktophide							{ display:none}
.mobilehide								{ display: block}
.smallsidebox							{ width:24%}
.largesidebox							{ width:74%}



.dnnnav-container                   	{ width: 100%; position:relative; z-index:909; box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow:0px 0px 3px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1);}
nav                         			{ width: 100%; position: relative;padding: 10px 0; margin: 0px;list-style: none; background:#fff; border-top:1px #eee solid;}
.dnnsticky                              { position: fixed;top:0px;z-index: 999;animation: thedrop 1s 1;-moz-animation: thedrop 1s 1;-webkit-animation: thedrop 1s 1; background:#fff; border-bottom:1px #efefef solid;box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow:0px 0px 3px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1); padding:0px;}
.dnnsticky .mmmenu li a                 { -webkit-border-radius:0px;-moz-border-radius: 0px;	border-radius: 0px;}



.topbar .desktopbg						{ background:#f9f9f9}
#dnnheader								{ padding:10px 0; background:url(../images/shadowline.png) top center no-repeat}

#fonticons div							{ float:left; width:25%; padding:5px 0; font-size:16px}
.fontsocial								{ font-size:28px}
.fontsocial a							{ padding:4px; line-height:55px; background:#eee; color:#000; text-decoration:none}


ul.list1								{ margin:0px; padding:0px}
ul.list1 li								{ margin:0px; padding:0px; list-style:none;}
ul#featureslist							{ margin:0px; padding:0px;}
ul#featureslist li						{ margin:0px; padding:0px; list-style:none; margin-bottom:6px; line-height:1.2em}
ul#featureslist li strong				{ display:block; padding-bottom:5px; color:#999}
ul#featureslist li a					{ line-height:1em; color:#666; text-decoration:none}
ul#featureslist li a:hover				{ color:#ccc;}


ul#filist								{ margin:0px; padding:0 0 50px;}
ul#filist li							{ margin:0px; padding:0px; list-style:none;}
ul#filist li img						{ width:60%;}
ul#filist li:after						{ margin:0px; padding:0px; display:block; content:''; clear:both}



.sitesocial								{ height:40px;}
.sitesocial a							{ display:block; float:left; height:40px; line-height:40px; width:32px; font-size:16px; background:#f9f9f9; color:#333; text-align:center}
.sitesocial a:hover						{ background: none; color:#fff;}

#side-box								{ display:none;right:0px; bottom:40%; text-decoration:none; padding:0px; z-index:903;position: fixed; width:40px; border-bottom:1px #fff solid}
#side-box a								{ display:block; line-height:40px; text-align:center; border-top:1px #fff solid; border-left:1px #fff solid}
#side-box a:hover						{ background-color:#000}

#dnnbreadcrumb							{ background:url(../images/shadowline.png) top center no-repeat #f5f5f5; padding:10px 0; border-bottom:1px #e5e5e5 solid; line-height:40px;}

#dnncontent								{ padding-top:50px; min-height:600px; padding-bottom:30px;}
#dnncontentii							{ background:#2cb3e2; margin:0px; padding: 20px 0; border-bottom:1px #ddd solid; border-top:1px #ddd solid}
#dnncontentii .owl-controls .owl-pagination{ text-align:left}
#dnncontentii .owl-controls .owl-page span{ width:6px; height:6px; margin:0 3px}


#dnnfooter								{ background:#2765b0; padding:20px 0; font-size:12px; color:#999; clear:both}
#dnnfooter h3 span.title				{ color:#fff}
#dnnfooter .copyright					{ color:#ffffff; padding-right:10px}
#dnnfooter a.links						{ color:#ffffff; padding:0 5px; text-decoration:none}
#dnnfooter a.links:hover				{ color:#000}


/* Pane Layout */
.panebox:after							{ display:block; content:''; clear:both}
.HeaderPane								{ margin-right:3%; padding-top:18px}
.TopPane								{ float:left}
.TopLeftPane, .TopRightPane,
.BottomLeftPane,.BottomRightPane,.MainLeftPane,.MainRightPane{ width:49%;}
.Grid4TLPane							{ width:32%; margin-right:2%;}
.Grid4TCPane							{ width:32%}
.Grid4TRPane							{ width:32%;}
.Grid3MLPane, .Grid3MCPane				{ width:23.5%; margin-right:2%;}
.Grid3MCRPane, .Grid3MRPane				{ width:23.5%;}
.FooterAPane, .FooterBPane				{ width:23.5%; margin-right:2%;}
.FooterCPane, .FooterDPane				{ width:23.5%;}
.Grid4LPane,.Grid4RPane					{ width:32%;}
.Grid8RPane,.Grid8LPane					{ width:66%}
.Grid3LPane,.Grid3RPane					{ width:23.5%;}
.Grid9RPane,.Grid9LPane					{ width:74.5%}






input[type=text],
input[type=password],
textarea 								{ background: #028BFF;	-moz-box-shadow: inset 1px 1px 10px rgba(0,0,0,0.1);-webkit-box-shadow: inset 1px 1px 10px rgba(0,0,0,0.1);	box-shadow: inset 1px 1px 10px rgba(0,0,0,0.1);	border: 1px solid #ddd;	color: #373737;}
input[type=text]:focus,
textarea:focus 							{ color: #373737;border:1px red solid;}

#searchbox								{ position:relative; z-index:1000;}
#searchbox ul 							{ padding:0; margin:0;}
#searchbox li 							{ list-style-type:none; float:left}
#searchbox li a.searchicon 				{ display:block; height:50px; width:40px; background:url(../images/searchicon.png) center center no-repeat}
#searchbox ul:after 					{ content:"."; display:block; height:0; clear:both; visibility:hidden; }
#searchbox ul ul 						{ display:none; width:268px; position:absolute; right:0; background:#fff; border-bottom:3px #eec92e solid}
#searchbox ul ul li 					{ float:none; }

#searchbox span#dnn_dnnSEARCH_ClassicSearch	{ display:block; padding:20px; width:228px}
#searchbox span.searchInputContainer	{ display:block;}
#searchbox a.SkinObject:link	{ display:block;  padding:0px; position:absolute; right:20px; top:20px; background:url(../images/search.png) center center no-repeat #f5f5f5; width:30px; height:30px; border:1px #eee solid; padding:1px}
#searchbox #dnn_dnnSEARCH_txtSearch{ width:180px; height:30px; border:1px #eee solid}


/*------------------------------------------------*/
/*-----------------[BASIC STYLES]-----------------*/
/*------------------------------------------------*/
.animate-slideup,
.animate-slidedown,
.animate-slideleft,
.animate-slideright,
.animate-slideexpandup,
.animate-expandup,
.animate-fadein,
.animate-expandopen,
.animate-bigentrance,
.animate-hatch,
.animate-bounce,
.animate-pulse,
.animate-floating,
.animate-tossing,
.animate-pullup,
.animate-pulldown,
.animate-pullleft,
.animate-pullright{	height: auto;margin-top: 0px; visibility:hidden}



/* Mobile Side Menu */
#pageslide {
    /* These styles MUST be included. Do not change. */
    display: none;position: absolute;position: fixed;top: 0; height: 100%;z-index: 999999;
    /* Specify the width of your pageslide here */
    width: 260px;padding: 0px;
    /* These styles are optional, and describe how the pageslide will look */
    background-color: #333;color: #FFF;-webkit-box-shadow: inset 0 0 5px 5px #222;-moz-shadow: inset 0 0 5px 5px #222; box-shadow: inset 0 0 5px 5px #222; overflow: auto
}
            
.openmm {float: right;border: 0;padding-top:5px}
        
/* Mobile Landscape and Portrait */
@media only screen and (max-width: 767px) { #pageslide { width: 200px; }}


/**** Demos ****/

#MasonryPortfolios {}
#MasonryPortfolios .box {
  margin: 5px;
  padding: 5px;
  background: #fff;
  font-size: 12px;
  line-height: 1.4em;
  float: left; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); -moz-box-shadow:0px 0px 5px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
}
#MasonryPortfolios .box h1,#MasonryPortfolios .box h2 { margin:0px; padding:0px}
#MasonryPortfolios .box img{display: block;width: 100%;}

#MasonryPortfolios .col1 { width: 80px; }
#MasonryPortfolios .col2 { width: 180px; }
#MasonryPortfolios .col3 { width: 280px; }
#MasonryPortfolios .col4 { width: 380px; }
#MasonryPortfolios .col5 { width: 480px; }

#MasonryPortfolios .col1 img { max-width: 80px; margin-bottom:10px}
#MasonryPortfolios .col2 img { max-width: 180px; margin-bottom:10px; }
#MasonryPortfolios .col3 img { max-width: 280px; margin-bottom:10px; }
#MasonryPortfolios .col4 img { max-width: 380px; margin-bottom:10px; }
#MasonryPortfolios .col5 img { max-width: 480px; margin-bottom:10px; }

/**** Transitions ****/

.transitions-enabled.masonry,
.transitions-enabled.masonry .masonry-brick {
  -webkit-transition-duration: 0.7s;
     -moz-transition-duration: 0.7s;
      -ms-transition-duration: 0.7s;
       -o-transition-duration: 0.7s;
          transition-duration: 0.7s;
}

.transitions-enabled.masonry {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.transitions-enabled.masonry  .masonry-brick {
  -webkit-transition-property: left, right, top;
     -moz-transition-property: left, right, top;
      -ms-transition-property: left, right, top;
       -o-transition-property: left, right, top;
          transition-property: left, right, top;
}


/* disable transitions on container */
.transitions-enabled.infinite-scroll.masonry {
  -webkit-transition-property: none;
     -moz-transition-property: none;
      -ms-transition-property: none;
       -o-transition-property: none;
          transition-property: none;
}

.mediahover{ padding:20px;}
.mediahover *{ color:#fff;}
.mediahover a.btn:link{ background:none; border:2px #fff solid; color:#fff;}
.mediahover a.btn:hover{ background:#fff; border:2px #fff solid; color:#000;}
.mediahover .zoom-gallery{ position:relative; margin:-20px -20px 0;}

.view-eighth {height: 260px;margin: 0px;overflow: hidden;position: relative;text-align: center}
.view-eighth .mask{ height: 260px;position: absolute; overflow: hidden; top: 0; left: 0; right:0px; z-index:100}
.view-eighth img {display: block;  position: relative;}
.view-eighth span {display: block; padding:20px; color:#fff; font-size:48px; line-height:200px}


.view-eighth .mask {
   top: -260px;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.3s ease-out 0.5s;
   -moz-transition: all 0.3s ease-out 0.5s;
   -o-transition: all 0.3s ease-out 0.5s;
   -ms-transition: all 0.3s ease-out 0.5s;
   transition: all 0.3s ease-out 0.5s;
}

.view-eighth:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   top: 0px;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
   -webkit-animation: bounceY 0.9s linear;
   -moz-animation: bounceY 0.9s linear;
   -ms-animation: bounceY 0.9s linear;
   animation: bounceY 0.9s linear;
}

blockquote.bigTitle {font-size:50px;line-height: 60px;margin-bottom:0;font-weight:300;padding:0;border:none;text-align: center; padding:10%; color:#2765B0; font-style:strong; text-transform:uppercase; text-shadow:0px 5px 5px #ffffff; font-family:'TitilliumText22LBold', Arial, Helvetica, sans-serif}



.purchaseskin{ margin:0px; padding:40px 0; color:#fff}
.purchaseskin h1{ color:#fff;}
.purchaseskin  .col-md-4{ text-align: right;}
.purchaseskin a.btn{ color:#fff; border:2px #fff solid; margin:30px 0 0; padding:15px 20px 15px 15px; font-size:24px; text-transform:uppercase}
.purchaseskin a.btn:hover{ background:#fff; color:#000}