/*Reset Page*/
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, font, 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{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}
ol, ul{list-style:none;}
blockquote, q{quotes:none;}
:focus{outline:0;}
ins{text-decoration:none;}
del{text-decoration:line-through;}
table{border-collapse:collapse;border-spacing:0}

@font-face {
    font-family: 'IranSansLight';
    src: url('/fonts/IRANSansWebFaNum.eot?#') format('eot'), /* IE6�8 */
    url('/fonts/IRANSansWebFaNum.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('/fonts/IRANSansWebFaNum.woff2') format('woff2'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('/fonts/IRANSansWebFaNum.ttf') format('truetype'); /* Saf3�5, Chrome4+, FF3.5, Opera 10+ */
}
@font-face {
  font-family: PeydaRegular;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/PeydaWeb-Regular.woff') format('woff');
}

@font-face {
  font-family: Peyda;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/PeydaWeb-Medium.woff') format('woff');
}
@font-face {
  font-family: PeydaSemiBold;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/PeydaWeb-SemiBold.woff') format('woff');
}
@font-face {
  font-family: DemiBold;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/PeydaWeb-Bold.woff') format('woff');
}
@font-face {
  font-family: Bold;
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/fonts/PeydaWeb-ExtraBold.woff') format('woff');
}


/************Font Awesome**********/
@font-face{font-family:'FontAwesome';src:url('../fonts/fontawesome-webfont.eot?v=4.7.0');src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-1x{font-size:1.5em}.fa-1-2x{font-size:1.2em}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}
.fa-search:before{content: "\f002";}
.fa-phone:before{content: "\f095";}
.fa-close:before{content: "\f00d";}
.fa-instagram:before{content: "\f16d";}
.fa-telegram:before{content: "\f2c6";}
.fa-facebook:before{content: "\f09a";}
.fa-location:before{content:"\f041";}
.fa-calendar:before{content: "\f133"}
.fa-user:before{content:"\f007"}
.fa-tags:before{content: "\f02c";}
.fa-basket:before{content: "\f290";}
.fa-sign-out:before{content: "\f08b";}
.fa-unlock-alt:before{content: "\f13e";}
.fa-chevron-right:before{content: "\f054";}
.fa-Mail:before{content: "\f0e0";}
.fa-down:before{content: "\f0dd"}
.fa-bars:before{content: "\f0c9";}
.fa-whatsapp:before{content:"\f232";}
.fa-user-o:before{content: "\f2c0";}
.fa-shopping-basket:before{content: "\f291";}
.fa-heart-o:before{content:"\f08a";}
.fa-cart-plus:before{content:"\f217";}
.fa-arrows-h:before{content: "\f07e";}
.fa-tag:before{content:"\f02b"}
.fa-heart:before{content:"\f004"}
.fa-heart-o:before{content:"\f08a"}
.fa-camera:before{content: "\f030"}
.fa-arrow-up:before{content: "\f062";}
.fa-eye:before{content: "\f06e";}
.fa-angle-left:before {content:"\f104";}
.fa-angle-down:before {content:"\f107";}
.fa-angle-right:before{content:"\f105";}
.fa-paint-brush:before{content:"\f1fc";}
.fa-angle-up:before{content:"\f106";}
.fa-mobile:before {content: "\f10b";}
.fa-envelope:before{content: "\f0e0";}

a:link{color:#333;text-decoration:none;-webkit-transition:all 1s ease 0s;-moz-transition:all 1s ease 0s;-o-transition:all 1s ease 0s;transition:all 1s ease 0s;}
a:visited{color:#333;text-decoration:none;}
a:hover{color:#9f2c98}

a.Click:link{color:#91278f !important;text-decoration:none;-webkit-transition:all 1s ease 0s;-moz-transition:all 1s ease 0s;-o-transition:all 1s ease 0s;transition:all 1s ease 0s;}
a.Click:visited{color:#91278f;text-decoration:underline;}
a.Click:hover{color:#000 !important;}

.FloatLeft{float:left;}
.FloatRight{float:right;}
.Peyda-Regular{font-family:Peyda-Regular}
.Justify{text-align:justify;}
.Center{text-align:center !important;margin:0 auto;display:block}
.Centerimg{margin-left:auto;margin-right:auto;display:block;}
.Clear{clear:both;}
.BYekan{font-family:BYekan !important}
.LTR{text-align:left}
.RTL{text-align:right}
.D-LTR{direction:ltr}
.cursor-po{cursor:pointer}
.D-RTT{direction:rtl}
.Gold{color:#c19c51}
.GoldL{color:#ddd15d}
.Yellow{color:#ddd15d}
.white{color:white}
.Black{color:#333333}
.Red{color:red}
.Red2{color:#b2001a}
.Blue{color:#000080}
.Blue2{color: #0b88cc}
.Green{color:#4caf50}
.Gray-Light{color:#817f80}
.Block{display:block}
.Gray{color:#858585;}
.VA{vertical-align:middle}
.VAB{vertical-align:text-bottom}
.Free10{height:10px}
.Free15{height:15px}
.Free20{height:20px}
.Free50{height:50px}
.Pointer{cursor:pointer;}
.Bold{font-weight:bold}
.samaltxt{font-size:13px}
.Mediumtxt{font-size:18px}
.Largetxt{font-size:25px}
.Italic{font-style:italic}
.X16{font-size:16px;}
.X18{font-size:18px;}
.X20{font-size:20px;}
.X22{font-size:22px;}
.X24{font-size:24px;}
.X26{font-size:26px;}
.X28{font-size:28px;}
.X30{font-size:30px;}
.absolute{position:absolute}
.w100{width:100%}
.w100img img{width:100% !important}
.w50{width:50% !important;}
.w45{width:45% !important;}
.w60{width:60% !important;}
.w80{width:80% !important;}
.w20{width:20% !important;}
.w30{width:33.3333% !important;}
.w24{width:24.4%}
.lignH1{line-height:1em}
.fl{float:left;margin-right:1%;margin-bottom:1%;}
.fr{float:right;margin-left:1%;margin-bottom:1%;}
.f50{width:49% !important;}
.f30{width:32.3333% !important}
.f70{width:69% !important}
.img2{width:49% !important;float:right;margin:2% .5% !important;}
.img3{width:32.3333% !important;float:right;margin:2% .5% !important;}
.img4{width:24% !important;float:right;margin:2% .5% !important;}

html, body{width:100%;min-height:100%;}
body{background:#fff;color:#424242;font-size:18px;line-height:1.5;overflow-x:hidden;direction:rtl;font-family:IranSansLight;}

::-moz-selection{background:#9e9fb1;}
::selection {background:#9e9fb1}

#header{background:#333;position:relative;width:100%;padding:.5% 0;top:0%;z-index:10000000000;-webkit-transition: all 1s;transition: all 1s;}
#header div#logo{width:70%;padding:.25% 1.5% .25% 0;-webkit-transition: all 1s;transition: all 1s;}
#header div#logo img{float:right;width:6.5%;-webkit-transition: all 1s;transition: all 1s;}

div.divlng{position:absolute;right:1%;top:10%;}
div.divTel{direction:ltr;}
div.divTel a{color:#efcd88;letter-spacing: 1px;font-family:DemiBold;font-size:1.2em;font-weight:bold}
div.divTel a span{font-size:.7em}
div.divTel{position: absolute;left:5%;top:50%;transform:translateY(-50%);display:flex}
div.divTel .divTelIn{font-size:.7em}
div.divTel i{background:#c19c51;border-radius:100px;padding:12px 12px 10px 10px;color:#fff;font-size:1.3em;margin-top:10%}
div.divTel P{font-size:.8em;color:#fff;text-align: center;font-family:PeydaSemiBold}


.divBanners{position:relative;}
        .divBanners h1, .divedutrain .divedutrain2 #divedutrain2de {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translateX(-50%) translateY(-50%);
            color: #fff;
        }
.divBanners .shadowb {
    position: absolute;
    top: 0;
    background: #0000005e;
    width: 100%;
    height: 100%
}

.divBanners h1 {
    font-size: 1.6em
}

.backE {
    background: #fcfcfc
}
div.divBox h2{color:#c19c51}

div.divBox {
    margin: 1% 0;
    box-shadow: 0 3px 6px rgba(146,146,146,.2);padding:2%;border-radius:10px;background:#fff;
}

div#divAll div.divServices1 {
    width: 100%;
    background: #fff;
    position: relative;
    z-index: 10000000
}

div#divAll div.divServices1 h4 {
    float: left;
    font-size: 1.1em
}

div#divAll div.divServices1 div.divline {
    position: absolute;
    background: #000;
    width: .3%;
    height: 100%;
    left: 49.5%
}

div#divAll div.divServices1 div.divline img,div#divAll div.divServices2 div.divline img {
    position: absolute;
    left: 50%;
    top: 7%;
    max-width: none!important;
    transform: translateX(-50%)
}

div#divAll div.divServices1 div.divImg {
    width: 48%;
    float: left
}

.gallery-item img,div#divAll div#divCat div.divCatIn img,div#divAll div#divContent-contact div#divLoaction div#divForm img,div#divAll div#divSlide img,div#divAll div.divServices1 div.divImg img,div#divAll div.divServices2 div.divImg img,div#divDesignProduct2 div#divimgDesgin div#divImg div.divTagPrice div.divTagImgPrice img,div.divArticles img,div.divDoKhH img,div.divKindCat img {
    width: 100%;
    display: block
}

div#divAll div.divServices1 div.divComment {
    width: 49%;
    float: right;
    padding: 2% 0
}

div#divAll div.divServices1 div.divComment p {
    text-align: justify;
    padding-right: 2%;
    line-height: 2em;
    font-size: .9em;
    padding-top: 1%
}

div#divAll div.divServices2 {
    width: 100%;
    background: #000;
    position: relative;
    z-index: 100000000000
}

div#divAll div.divServices2 h4 {
    color: #fff;
    font-size: 1.1em
}

div#divAll div.divServices2 div.divline {
    position: absolute;
    background: #fff;
    width: .3%;
    height: 100%;
    left: 49.5%
}

div#divAll div.divServices2 div.divImg {
    width: 48%;
    float: right
}

div#divAll div.divServices2 div.divComment {
    width: 48%;
    float: left;
    padding: 2% 0
}

div#divAll div.divServices2 div.divComment p {
    text-align: justify;
    padding-left: 2%;
    line-height: 2em;
    font-size: .9em;
    color: #fff;
    padding-top: 1%
}

div#divAll div.divService-c1,div#divAll div.divService-c2 {
    width: 100%;
    margin: 0 auto .5%;
    position: relative;background:#fff;box-shadow:0 3px 6px rgba(146,146,146,.2);margin-bottom:5%;
}

div#divAll div.divService-c1 div.divServiceIMG {
    width:15%;
    float: right;
    border: 2px solid #c6892c;
    border-radius: 20px;
    padding: .7%;margin:-2% 2% 0 2%;
}

div#divAll div.divService-c1 div.divServiceIMG img,div#divAll div.divService-c2 div.divServiceIMG img {
    width: 100%;
    display: block;
    border-radius: 20px
}

div#divAll div.divService-c1 div.divServiceCOM {
     border-radius: 20px;
    right: 2%;
    background: #fff;
    border-radius: 20px;
    right: 2%;
    background: #fff;
    padding: 4% 3%
}

div#divAll div.divService-c1 div.divServiceCOM h2,div#divAll div.divService-c2 div.divServiceCOM h2 {
    color: #c6892c!important;
    font-size: 24px!important;
    line-height: 1.8;
    margin-bottom: 10px
}

div#divAll div.divService-c1 div.divServiceCOM p,div#divAll div.divService-c2 div.divServiceCOM p {
    color: #606060;
    font-size: 1em;
    line-height: 1.8!important;
    text-align: justify
}

div#divAll div.divService-c2 div.divServiceIMG {
    width:15%;
    float: left;
    border: 2px solid #c6892c;
    padding: .7%;
    border-radius: 20px;margin:-2% 2% 0 2%;
}

div#divAll div.divService-c2 div.divServiceCOM {
     border-radius: 20px;
    background: #fff;
    border-radius: 20px;
    background: #fff;
    padding:2% 2%
}

div.divAbout{width:100%;background:#fde193;}
div.divAbout .divAboutIn{width:50%;margin:0 auto;padding:2% 0}
div.divAbout .divAboutIn p{text-align:justify;color:#000 !important;line-height:2em;font-size:.9em}
div.divAbout .divAboutIn img{float:left}


/*SearchBox*/
#Searchbox{float:right;width:39%;margin:.7% 1% 0 0}
.textfield__field {position: relative;transition: all 0.5s ease;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-ms-transition: all 0.5s ease;-o-transition: all 0.5s ease;}
.textfield__field i{font-size:.8em;color:#ccc;}
.textfield__field label {color:rgba(0,0,0,.87); font-size:1em; cursor: auto; font-weight: normal; right:0;margin: 0; text-align: left; position: absolute; top:7px; line-height: 30px;transition: all 0.5s ease;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-ms-transition: all 0.5s ease;-o-transition: all 0.5s ease;}
.textfield__field.is-dirty .textfield__input, .textfield__input {padding:2% 1%;font-family:'IranSansLight';width:100%; font-size:.9em;color:#fff;background:transparent;border:1px solid #efcd88;border-radius:10px}
.textfield__field.is-focused:after{position:absolute;bottom:1px;left:0;width: 100%; content: ''; height: 1px; }
.textfield__field.is-focused .textfield__input {background:#fff;box-shadow: 0 1px 1px rgb(0 0 0 / 14%), 0 4px 4px rgb(0 0 0 / 10%);border: 1px solid var(--color-neutral-200);}
.search-field .submit-btn {font-size:1.2em;position:absolute;left:2%;top:55%;transform:translateY(-50%);color:#9e9fb1}
.autocomplete-items {position:absolute;z-index:999;top:100%;left:0%;right: 0; background: #f0f0f0; overflow: auto; max-height: 200px; border-top: none; }
.autocomplete-items div { padding: 6px 8px; cursor: pointer; font-size: 20px; }
.autocomplete-items div:hover { background-color: #dce2e6; }
.autocomplete-active { background-color: #dce2e6; color: #4a4a4a; }
.autocomplete-open{position: absolute; border: 1px solid #4a4a4a; border-top: none; z-index: 99; top: 100%; left: 0; right: 0; padding-bottom: 10px; background: #f0f0f0; }
.autocomplete-open div{padding: 10px; cursor: pointer; font-size: 20px; }
.autocomplete-open div:hover{background-color:#dce2e6}
.textfield__input::placeholder {color: #fff;font-family:IranSansLight;font-size:.8em;opacity:.8}

div.divContent-Back{background: url('/Images/back.png');direction:rtl !important;}

#divMenuIntro {position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);z-index:100000000;width:100%}
#divMenuIntro h1{text-align:center;color:#231b59;font-size:3.5em;color:white;font-family:PlayfairDisplay-Regular;letter-spacing:.1em;}
#divMenuIntro div.divIntroMenu {width:100%;position: absolute;top:70%;left: 50%;transform: translateX(-50%) translateY(-50%);text-align:center}
#divMenuIntro div.divIntroMenuIn{text-align:center;margin:0 auto;padding:1% 3%;display:inline-block}
#divMenuIntro img#intro-logo{width:20%}
#divMenuIntro div.divIntroMenuIn a{color:#231b59}
#divMenuIntro div.divIntroMenuIn:hover a{color:#fff}
#divMenuIntro div.divIntroMenuIn:hover{background:#e7d694;color:#fff}
#divMenuIntro div#divSocialintro{position:absolute;bottom:5%;left: 50%;transform: translateX(-50%);}
#divMenuIntro div#divSocialintro img {filter: gray; /* IE5+ */-webkit-filter: grayscale(1);-webkit-transition: all .8s ease-in-out;}
#divMenuIntro div#divSocialintro img:hover {filter: none;-webkit-filter: grayscale(0);-webkit-transform: scale(1.01);}

div#divAll div.divCategory3{float:right;width:24.5%;margin:.25% .25%;position:relative}
div#divAll div.divCategory3 img{width:100%;display:block}
div#divAll div.divCategory3 div.divTitle{position:absolute;bottom:0%;right:0%;width:100%;padding: 1%;padding-top: 11%;box-shadow: inset 1px -50px 50px -30px #000000c4;}
div#divAll div.divCategory3 div.divTitle a{color:white;font-size:1.2em}

div.divSendp a{width:100%;text-align:center;padding:3% 0;font-size:.9em}

/* Shine */
span.figure{margin:0;padding:0;overflow:hidden;}
span.figure:hover+span{bottom:-36px;opacity:1;}
.hover14 span.figure{position:relative;}
.hover14 span.figure::before{position:absolute;top:0;left:-75%;z-index:2;display:block;content:'';width:50%;height:100%;background:-webkit-linear-gradient(left,rgba(255,255,255,0) 0%,rgba(255,255,255,.3) 100%);background:linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);-webkit-transform:skewX(-25deg);transform:skewX(-25deg);}
.hover14 span.figure:hover::before{-moz-animation:shine .2s;-webkit-animation:shine .2s;animation:shine 1.5s;}
@-webkit-keyframes shine{100% {left:125%;}}

#phonefix{position:fixed;bottom:2%;left:2%;z-index:1000;}

/*Cat Home*/
:root {
    font-size: 16px;
    --heading-color:#111;
    --background-color: #fff;}
.HomeCat {
    background-color: var(--background-color);
    display: flex;
    justify-content: center;
    align-items: center;padding:1%;flex-wrap:wrap;
}
.HomeCatwa {flex-wrap:initial !important}


.HomeCat .container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;width:14%;margin:1% 1%;
}

.HomeCat2{padding:1% 5% !important}
.HomeCat2 .container {width:12%;margin:1% 1.5%;}

.HomeCat .circle {
  background:/*linear-gradient(43deg, rgb(255 255 255) 0%, #f3866199 50%, #f17b3b 100%);*/linear-gradient(43deg, rgb(255, 255, 255) 0%, rgba(225, 223, 223, 0.67) 50%, rgba(191, 191, 191, 0.75) 100%);
  width:100%;
  height:100%;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.7s;
}

.HomeCat2 .circle {border-radius:7%}


.HomeCat .container:hover > .circle {
  transform: scale(1.1);
}

.HomeCat img {
  width: 90%;
  opacity: 0.9;
  transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
}

.container:hover > .circle img {
  transform: scale(1.3);
  opacity: 1;
}

.HomeCat p{
  bottom: 0;
  margin: 1rem 0 0 0;
  font-size:.8em;
  color: var(--heading-color);font-weight:700;
}

.Toman{font-size:.7em;}
.Backgray{background:#f3f3f3}

.divCommentTop{margin:1% 5%;padding:1%;border-radius:7px;font-size:.88em;line-height:1.8em;box-shadow:0 1px 8px rgb(0 0 0 / 20%), 0 0px 7px rgb(0 0 0 / 0%);}

.divProducts{display:flex}
.divProducts .divProduct .divTitle{min-height:50px;font-size:1em}
.divProducts .divProduct{width: 25%;font-size: .8em;box-shadow:0px 4px 24px 0px rgba(0,0,0,.1);margin: .7%;padding: .5% 1%;border-radius: 7px;}
.divProducts .divProduct img{width:100%;}

.divContent{padding:1% 5%;}
.divContent .divContentR{width:18%;float:right;box-shadow:0px 4px 24px 0px rgba(0,0,0,.1);padding:1% 1%} 
.divContent .divContentR li{font-size:.9em;border-bottom:1px solid #f3f3f3;line-height:3em} 
.divContent .divContentL{width:80%;float:left;box-shadow:0px 4px 24px 0px rgba(0,0,0,.1)}
.divContent .divContentL2{width:100%;float:none !important;box-shadow:0px 4px 24px 0px rgba(0,0,0,.1)}

.divProductsa{display:flex;flex-wrap:wrap;}
.divProductIn{width:19%;margin:.5%;padding: .5% 1%;border-radius: 7px;border:solid 1px #e1e1e1;font-size:.8em;-webkit-transition:all .5s ease 0s;-moz-transition:all .5s ease 0s;-o-transition:all .5s ease 0s;transition:all .5s ease 0s}
.divProductIn .divTitle{min-height:50px}
.divProductIn .divPrice{font-size:1em;font-weight:bold;text-align:left}
.divProductIn:hover{box-shadow: 0 3px 6px rgb(0 0 0 / 17%), 0 3px 6px rgb(0 0 0 / 0%)}
.divProductIn img{width:100%;}

div#divAll div.divContent2{width:90%;margin:0 auto;padding:.5% 2%;box-sizing:border-box;}
div#divAll div.divContent2 div.divContent-L{padding:1% 2%;width:100%;margin:0 auto;background:#fff;box-shadow:0 2px 48px 0 rgba(0,0,0,.08);border-radius:10px;margin-bottom:1%;}
div#divAll div.divContent2 div.divContent-L img{width:90%;margin:0 auto;display:block;}
div#divAll div.divContent2 div.divContent-L2{background:#c19c51;padding-bottom:0;}
div#divAll div.divContent2 div.divContent-L2 div.L2R{float:right;background:#fff;box-shadow:0 2px 48px 0 rgba(0,0,0,.08);border-radius:10px;margin-bottom:1%;width:50%;padding:2% 5%}
div#divAll div.divContent2 div.divContent-L2 img.L2L{float:left;width:30%;}
div#divAll div.divContent2 div.divContent-L p{text-align:justify;font-size:1em;line-height:2em}
div#divAll div.divContent2 div.divContent-R{width:23%;float:left;position:sticky;top:10%;padding:1.5% !important;}
div#divAll div.divContent2 div.divContent-R li{line-height:2.5em;font-size:.9em;}
div#divAll div.divContent2 div.divContent-RIn{margin-bottom:4%;background:#fff;padding:5% 5.5%;box-shadow:0px 8px 16px rgba(143,144,166,.2), inset 0px 2px 0px #cc9c0e, inset 0px -2px 0px #cc9c0e;border-radius:16px}
div#divAll div.divContent2 div.divContent-RIn span.Arow{font-size:1.1em;font-weight:bold;line-height:3.1em}
div#divAll div.divContent2 div.divContent-RIn span.Arow::before{background:url('/images/arow.png');margin-left:2%;width:22px;height:35px;content:' ';display:inline-block;vertical-align:middle;}
div#divAll div.divContent2 div.divContent-L .pure-material-textfield-outlined{width:100%;}
div#divAll div.divContent2 div.divContent-L .divContent-LIn h2::before{background:url('/images/arow.png');margin-left:.5%;width:22px;height:35px;content:' ';display:inline-block;vertical-align:middle;}


div#divProduct{padding:1% 0;background:#fff;}
div#divProduct div#divProductimg{float:right;padding:2%;width:26%;}
div#divProduct div#divProductimg img{width:100%;}
div#divProduct div#divProductdetail{float:left;width:73%;padding:1%;flex-direction:column}
div#divProduct div#divProductdetail div.divProductdetailIn{border-bottom:1px solid #ced0d2a1}
div#divProduct div#divProductdetail div#divStar{float:left;}
div#divProduct div#divProductdetail div#divStar i{vertical-align:bottom}
div#divProduct div#divProductdetail h1{font-size:1.3rem;line-height:1.7em;margin-bottom:1%;float:right}
div#divProduct div#divProductdetail div#divProductdetailL{float:right;width:50%;padding:0% 1% inherit;box-sizing:border-box}
div#divProduct div#divProductdetail div#divProductdetailL div#divStar a{color:#048fff;font-size:.9em;}
div#divProduct div#divProductdetail div#divProductdetailL div#divStar i{color:#f9a825;font-size:1.2em;vertical-align:middle}
div#divProduct div#divProductdetail div#divProductdetailL div#divStar{font-size:.75em}
div#divProduct div#divProductdetail div#divProductdetailL div#divColor{margin:4% 0;}
div#divProduct div#divProductdetail div#divProductdetailL div#divColor div.Color{display:inline-block;margin:3% 0;padding:3px;border-radius:100px;border:1px solid #b4b4b4}
div#divProduct div#divProductdetail div#divProductdetailL div#divColor span.Color{display:block;background:red;width:30px;height:30px;border-radius:100px;}
div#divProduct div#divProductdetail div#divProductdetailL ul#ProductProperty li{color:#817790;font-size:.8em}
div#divProduct div#divProductdetail div#divProductdetailL ul#ProductProperty li span{color:#000;font-size:.9em;font-weight:bold}

div#divProduct div#divProductdetail div#divProductdetailPrice{float:left;width:30%;padding:1% 2%;box-sizing:border-box;background:#f7f7f8;border:1px solid #efefef;border-radius:5px;box-shadow:0px 4px 24px 0px rgba(0,0,0,.1)}
div#divProduct div#divProductdetail div#divProductdetailPrice div#divPrice{color:#000;margin:3% 0;text-align:center;border-top:1px solid rgba(0,0,0,0.1);padding-top:5%;}
div#divProduct div#divProductdetail div#divProductdetailPrice div#divPrice span{font-size:1.2em;color:#000;}
div#divProduct div#divProductdetail div#divProductdetailPrice div#divPrice span.Toman{font-size:.75em;color:#333;}
div#divProduct div#divProductdetail div#divProductdetailPrice div.divPriceProperty{border-bottom:1px solid 1px solid rgb(0 0 0 / 5%);font-size:.75em;color:#000;line-height:3.5em}
div#divProduct div#divProductdetail div#divProductdetailPrice div.divPriceProperty img{width:14%;vertical-align:middle}

.divBanner{display:flex;margin:2% 9.5%}
.divBanner img{width:98%;border-radius:7px;margin:1%;}

.btnR2 {
    font-size: 1em;
    color: #fff !important;
    border-radius: 0;
    padding: .6% 2%;
    transition: all 0.7s ease-out;
    background: linear-gradient(270deg, rgb(35 221 33), #6bf76a85, rgba(34, 34, 34, 0), rgba(34, 34, 34, 0));
    background-color: rgba(0, 0, 0, 0);
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
    background-color: #01bb00;
    background-position: 1% 50%;
    background-size: 300% 300%;
    text-decoration: none;
    border: none;
    border-radius: 7px;
    font-weight: normal;
    font-family: 'IranSansLight';
    display: table;
    margin: 3% auto;
}
.btnR2:hover{color:white !important;background-position: 99% 50%;}


.shake {
  z-index: 1;
  border-radius: 5px;
  -webkit-animation-name: shake;
  animation-name: shake;
  animation: shake 5s ease both infinite;
  cursor: pointer;
  margin-left:1%;
}

@-webkit-keyframes shake {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  4% {
    -webkit-transform: translateX(-50);
    transform: translateX(-50);
  }
  8% {
    -webkit-transform: translateX(50);
    transform: translateX(50);
  }
  13.2% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  16% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }
  20% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  24% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
  32% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  50% {
    -webkit-transform: translate(0, 0) rotate(10.5deg);
    transform: translate(0, 0) rotate(10.5deg);
  }
  51% {
    -webkit-transform: translate(0, 0) rotate(-0.5deg);
    transform: translate(0, 0) rotate(-0.5deg);
  }
  52% {
    -webkit-transform: translate(0, 0) rotate(-7.5deg);
    transform: translate(0, 0) rotate(-7.5deg);
  }
  53% {
    -webkit-transform: translate(0, 0) rotate(7.5deg);
    transform: translate(0, 0) rotate(7.5deg);
  }
  54% {
    -webkit-transform: translate(0, 0) rotate(10.5deg);
    transform: translate(0, 0) rotate(10.5deg);
  }
  55% {
    -webkit-transform: translate(0, 0) rotate(-0.5deg);
    transform: translate(0, 0) rotate(-0.5deg);
  }
  56% {
    -webkit-transform: translate(0, 0) rotate(-7.5deg);
    transform: translate(0, 0) rotate(-7.5deg);
  }
  57% {
    -webkit-transform: translate(0, 0) rotate(7.5deg);
    transform: translate(0, 0) rotate(7.5deg);
  }
  58% {
    -webkit-transform: translate(0, 0) rotate(10.5deg);
    transform: translate(0, 0) rotate(10.5deg);
  }
  59% {
    -webkit-transform: translate(0, 0) rotate(-0.5deg);
    transform: translate(0, 0) rotate(-0.5deg);
  }
  60% {
    -webkit-transform: translate(0, 0) rotate(-7.5deg);
    transform: translate(0, 0) rotate(-7.5deg);
  }
  61% {
    -webkit-transform: translate(0, 0) rotate(7.5deg);
    transform: translate(0, 0) rotate(7.5deg);
  }
  62% {
    -webkit-transform: translate(0, 0) rotate(10.5deg);
    transform: translate(0, 0) rotate(10.5deg);
  }
  63% {
    -webkit-transform: translate(0, 0) rotate(-0.5deg);
    transform: translate(0, 0) rotate(-0.5deg);
  }
  64% {
    -webkit-transform: translate(0, 0) rotate(-7.5deg);
    transform: translate(0, 0) rotate(-7.5deg);
  }
  65% {
    -webkit-transform: translate(0, 0) rotate(7.5deg);
    transform: translate(0, 0) rotate(7.5deg);
  }
  66% {
    -webkit-transform: translate(0, 0) rotate(10.5deg);
    transform: translate(0, 0) rotate(10.5deg);
  }
  67% {
    -webkit-transform: translate(0, 0) rotate(-0.5deg);
    transform: translate(0, 0) rotate(-0.5deg);
  }
  68% {
    -webkit-transform: translate(0, 0) rotate(-7.5deg);
    transform: translate(0, 0) rotate(-7.5deg);
  }
  69% {
    -webkit-transform: translate(0, 0) rotate(7.5deg);
    transform: translate(0, 0) rotate(7.5deg);
  }
  70% {
    -webkit-transform: translate(0, 0) rotate(10.5deg);
    transform: translate(0, 0) rotate(10.5deg);
  }
  71% {
    -webkit-transform: translate(0, 0) rotate(-0.5deg);
    transform: translate(0, 0) rotate(-0.5deg);
  }
  72% {
    -webkit-transform: translate(0, 0) rotate(-7.5deg);
    transform: translate(0, 0) rotate(-7.5deg);
  }
  73% {
    -webkit-transform: translate(0, 0) rotate(7.5deg);
    transform: translate(0, 0) rotate(7.5deg);
  }
  74% {
    -webkit-transform: translate(0, 0) rotate(10.5deg);
    transform: translate(0, 0) rotate(10.5deg);
  }
  75% {
    -webkit-transform: translate(0, 0) rotate(-0.5deg);
    transform: translate(0, 0) rotate(-0.5deg);
  }
  76% {
    -webkit-transform: translate(0, 0) rotate(-7.5deg);
    transform: translate(0, 0) rotate(-7.5deg);
  }
  77% {
    -webkit-transform: translate(0, 0) rotate(7.5deg);
    transform: translate(0, 0) rotate(7.5deg);
  }
  78% {
    -webkit-transform: translate(0, 0) rotate(10.5deg);
    transform: translate(0, 0) rotate(10.5deg);
  }
  79% {
    -webkit-transform: translate(0, 0) rotate(-0.5deg);
    transform: translate(0, 0) rotate(-0.5deg);
  }
  80% {
    -webkit-transform: translate(0, 0) rotate(-7.5deg);
    transform: translate(0, 0) rotate(-7.5deg);
  }
  41%,
  49%,
  81%,
  100% {
    -webkit-transform: translate(0, 0) rotate(0);
    transform: translate(0, 0) rotate(0);
  }
}


div#divFooter{margin:0 auto;padding:3% 10%;background:#e5e5e5;padding-bottom:.5% !important;text-align:right;font-size:.85em}
div#divFooter img{width:5%}
.hrFooter{color:#fff;margin:1.5% 0;}
div#divFooter div#MenuFooter{width:100%;border-top:1px solid #a1863c;border-bottom:1px solid #c19c51}
div#divFooter div.divFooterIn{width:25%;float:right;}
div#divFooter h3{color:#c19c51;font-size: 1.1em !important;border-bottom: 1px solid;line-height: 3;margin-bottom: 2%;}
div#divFooter div.divFooterIn2{width:42%;margin:0 4%;float:right;}
div#divFooter div.divFooterIn2 p{color:#000;font-size:.9em;line-height:1.8em;}
div#divFooter div.divFooterIn i{color:#000;margin-left:3%;font-size:1.2em;}
div#divFooter div.divFooterIn li{line-height:1.8em;color:#000;display:flex}
div#divFooter div.divFooterIn li div.divT1{width:50%;text-align:left;}
div#divFooter div.divFooterIn li div.divT2{width:50%;}
div#divFooter div.divFooterIn li a{font-size:1em;color:#242424 !important}
div#divFooter div.divFooterIn li a:hover{padding-right:10px;opacity:1}
div#divFooter div.divFooterIn img{margin-left:5%}
div#divFooter div.divFooterIn input{border-bottom:1px solid #a1863c !important;width:60%;height:15%;color:#50748a}
div#divCopyright p{width:100%;direction:ltr !important;color:#fff;font-family:Arial;font-size:.8em;opacity:.8}
div#divCopyright{width:100%;background-color:#0f0f0f;color:white;padding:10px 0}
div#divCopyright p{font-size:12px;font-family:Arial;direction:ltr}
.fa-1x{font-size:1.7em !important;}

/*Social S*/

.flx {
  display:flex;
  justify-content: center;
  align-items: center;
}

.nshare {
  box-sizing: border-box;
  margin-top: calc(var(--nshare-spacing) * -1);
  margin-right: calc(var(--nshare-spacing) * -1);
}
.nshare-item {
  margin-right: var(--nshare-spacing);
  margin-top: var(--nshare-spacing);
}
.nshare-item,
.nshare-item:hover,
.nshare-item:active {
  text-decoration: none;
  color: inherit;
}
.nshare-item {transition: background .3s, color .3s;}
.nshare-item i {
  transition: transform .3s;
  margin: 0;
}
.nshare, .nshare-item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
.nshare-fb {background-color: var(--nshare-facebook);}
.nshare-tt {background-color: var(--nshare-twitter);}
.nshare-pt {background-color: var(--nshare-pinterest);}
.nshare-tb {background-color: var(--nshare-tumblr);}
.nshare-rd {background-color: var(--nshare-reddit);}
.nshare-vk {background-color: var(--nshare-vk);}
.nshare-ws {background-color: var(--nshare-whatsapp);}
.nshare-tlg {background-color: var(--nshare-telegram);}
.nshare-msj {background-color: var(--nshare-email);}

.nshare-fb:hover {color: var(--nshare-facebook);}
.nshare-tt:hover {color: var(--nshare-twitter);}
.nshare-pt:hover {color: var(--nshare-pinterest);}
.nshare-tb:hover {color: var(--nshare-tumblr);}
.nshare-rd:hover {color: var(--nshare-reddit);}
.nshare-vk:hover {color: var(--nshare-vk);}
.nshare-ws:hover {color: var(--nshare-whatsapp);}
.nshare-tlg:hover {color: var(--nshare-telegram);}
.nshare-msj:hover {color: var(--nshare-email);}

.nshare-item:hover i {transform: rotate(360deg);}
/*}} Fin del core {{*/

/*! Personalización */
/* Contenedor
-----------------------------------------*/
.nshare {
  --nshare-spacing: .5rem; /* separacion interna */
  padding-top:0; /* separacion superior */
  padding-bottom:0; /* separacion inferior */
}
/* Redes sociales
-----------------------------------------*/
.nshare i{color:#fff}
.nshare {
  --nshare-facebook: #1778F2;
  --nshare-twitter: #55ACEE;
  --nshare-pinterest: #F0002A;
  --nshare-tumblr: #35465C;
  --nshare-reddit: #FF4500;
  --nshare-vk: #4376A6;
  --nshare-whatsapp: #4FCE5D;
  --nshare-telegram: #0088CC;
  --nshare-email: #464EB8;
}
/* Botones
-----------------------------------------*/
.nshare-item {
  font-size: 22px; /* tamaño de iconos */
  width: 48px; /* ancho */
  height: 48px; /* alto */
  border-radius: .5rem; /* bordes redondeados */
  color: #fff; /* color */
  box-shadow: 0 3px 5px -1px rgba(0,0,0,.1),
              0 2px 5px -1px rgba(0,0,0,.05); /* sombra */
}
.nshare-item:hover {
    }
/*E*/

.divCatHome{padding:2% 10%;background:#f9f9f9}

.SecProjectHome div.divProjectR{float:right;width:18%;border-bottom-right-radius:10px;border-top-right-radius:10px}
.SecProjectHome div.divProjectR h2{color:#c19c51;text-align:center;font-size:1.3em;font-weight:bold;line-height:3.5em;}
.SecProjectHome div.divProjectR img{width:90%}
.SecProjectHome div.divProjectL{float:left;width:82%}

div.divMigrationTop{position:relative;min-height:200px;background:#000;}
div.divMigrationTop div.divMigrationOn{position:absolute;top:0;height:100%;width:100%;background:#000000a6}
div.divMigrationTop div.divMigrationOn h1{text-align:center;color:#fff;font-size:1.9em;line-height:2.1em;margin-top:5%}
div.divMigrationTop div.divMigrationOn p:before{margin:0 auto;text-align:center;display:block;content:' ';width:200px;border:1px solid #c19c51;}
div.divMigrationTop div.divMigrationOn p{text-align:center;color:#fff;font-size:.9em;line-height:2.5em}
div.divMigrationTop div.divMigrationOn img.Migrationpe{position:absolute;bottom:0;left:5%;}
div.divMigrationTop div.divMigrationOn img.Migrationmap{position:absolute;bottom:0;right:0%;}

div.Marquee{position:relative;padding:10% 0;}
div.Marquee ul{
    position: absolute;
    top: 50%;
    width: 800px;
    height: 200px;
    left: 50%;
    margin-left: -400px;
    margin-top: -130px;
}

 div.Marquee ul > li {
        width: 25%;
        list-style-type: none;
        position: absolute;
        top: 0;
        padding:15px;
        height: 150px;
        opacity: 0;
        text-align: center;
        transition: 1s opacity;
    }

 div.Marquee .active {
        opacity: 1;
    }

div.Marquee p {
        font-family: sans-serif;
        font-size: 13px;
        color: #646566;
        line-height: 1.5em;
    }

    div.Marquee strong {
        color: #fff;
        font-weight: 700;
        font-size: 60px;
        line-height: 100px;
    }


h2.BackgroundTitle{font-size:1.3em}
.BackgroundTitle::before {
    background: url('/images/BackTitle.png');
    vertical-align:middle;
    width:50px;
    height: 50px;
    display: inline-block;
    background-repeat: no-repeat;
    content: " ";
    margin-left: .5%;
}

.Box{border-radius: 10px;-webkit-box-shadow: 0px 0px 13px -3px #666666;box-shadow: 0px 0px 13px -3px #66666673;background:#fff;}
.BoxPM{margin:1.5% 0;border-radius:10px;}


/**/
 div#divAboutHome{padding:1.5% 10%}
 div#divAboutHome h1{padding:5%;color:white;font-size:1.3em}
 div#divAboutHome p{color:#fff;font-size:.9em}
 div#divAboutHome div#divAboutHomeIn1{width:40%;margin-right:10%;float:left;}
 div#divAboutHome div#divAboutHomeIn2{width:35%;margin-right:10%;float:right;}
 div#divAboutHome div#divAboutHomeIn1 img{width:60%;}
.BackgG {
    background-color: #2d3436;
    background-image: linear-gradient(315deg, #2d3436 0%, #300101 74%);
}
 .my-section {
  background-color: #f7f7f7;
  padding: 12.8rem 25.6rem;
}
.row::after {
  content: "";
  display: table;
  clear:both;
}
.col-1-of-2 {
  float: left;
  width:80%;
}
.col-1-of-2:not(:last-child) {
  margin-right: 4rem;
}
.center-text {
  text-align: center;
}
.mb-big {
  margin-bottom: 8rem;
}
.mb-small {
  margin-bottom: 2rem;
}

.primary-heading {
  display: inline-block;
  color: transparent;
  background-image: linear-gradient(to right, #ffa952, #ff8f56);
  background-clip: text;
  font-size: 3.2rem;
  font-weight: 700;
  letter-spacing: .5rem;
}

.secondary-heading {
  font-size: 1.6rem;
  letter-spacing: .25rem;
}

.composition {
  position: relative;
}

.composition:hover .composition__photo:not(:hover) {
  transform: scale(.95);
}

.composition__photo {
  width: 55%;
  /*box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, .4);*/
  border-radius: 2px;
  position: absolute;
  z-index: 10;
  transition: all .2s;
  outline-offset: -1.6rem;
}

.composition__photo:hover {
  outline:2px solid #fff;
  transform: scale(1.05) translateY(-.5rem);
  box-shadow: 0 2.5rem 4rem rgba(#000, .5);
  z-index: 20;
}

.composition__photo--p1 {
  left: 0;
  /*top: -2rem;*/
}
.composition__photo--p2 {
  right: 0;
  top: 2rem;
}
.composition__photo--p3 {
  left: 20%;
  top: 10rem;
}



/*CatHome*/
div.divBackHomeG{padding:3% 2%;background-color: transparent;background-image:radial-gradient(at center center, #747474 0%, #000000 100%)}
div.divBackHomeG h2{color:#fff}

.vc_column_containerTOP{top:0 !important;transform: initial !important;}
.vc_column_containerBOT{bottom:0 !important;transform: initial !important;}

.vc_col-lg-6 {
    width:25%;
}
.vc_column_container > .vc_column-inner {
    box-sizing: border-box;
    padding-left: 15px;
    padding-right: 15px;
    width: 100%;
}
.vc_column-inner::after, .vc_column-inner::before {
    content: " ";
    display: table;
}
.vc_row {
    margin-left: -15px;
    margin-right: -15px;
}

    .vc_row::after, .vc_row::before {
        content: " ";
        display: table;
    }
.vc_column_container {
    padding-left: 0;
    padding-right: 0;
}
.vc_col-lg-1, .vc_col-lg-10, .vc_col-lg-11, .vc_col-lg-12, .vc_col-lg-2, .vc_col-lg-3, .vc_col-lg-4, .vc_col-lg-5, .vc_col-lg-6, .vc_col-lg-7, .vc_col-lg-8, .vc_col-lg-9 {
    float: left;
}
.vc_column_container > .vc_column-inner {
    box-sizing: border-box;
    padding-left: 15px;
    padding-right: 15px;
    width: 100%;
}

.vc_column-inner::after, .vc_column-inner::before {
    content: " ";
    display: table;
}
.vc_col-lg-1, .vc_col-lg-10, .vc_col-lg-11, .vc_col-lg-12, .vc_col-lg-2, .vc_col-lg-3, .vc_col-lg-4, .vc_col-lg-5, .vc_col-lg-6, .vc_col-lg-7, .vc_col-lg-8, .vc_col-lg-9 {
    float: right;
    margin: 1% 0;
}
.vc_column_container > .vc_column-inner {
    box-sizing: border-box;
    padding-left: 15px;
    padding-right: 15px;
    width: 100%;
}
.mkdf-banner-holder {
    position: relative;
    display: inline-block;
    width: 100%;
    vertical-align: middle;
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out;
}

    .mkdf-banner-holder > a {
        position: absolute;
        display: block;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 12;
    }
    .mkdf-banner-holder .mkdf-banner-image {
        position: relative;
        display: inline-block;
        width: 100%;
        vertical-align: middle;
        overflow: hidden;
    }
    .mkdf-banner-holder:hover .mkdf-banner-image img {
        -webkit-transform: scale(1.04);
        -ms-transform: scale(1.04);
        transform: scale(1.04);
    }
    .mkdf-banner-holder .mkdf-banner-image img {
        display: block;
        -webkit-transition: .7s cubic-bezier(.39,.18,0,.85);
        -o-transition: .7s cubic-bezier(.39,.18,0,.85);
        transition: .7s cubic-bezier(.39,.18,0,.85);
    }

    .mkdf-banner-holder .mkdf-banner-image img {
        display: block;
        -webkit-transition: .7s cubic-bezier(.39,.18,0,.85);
        -o-transition: .7s cubic-bezier(.39,.18,0,.85);
        transition: .7s cubic-bezier(.39,.18,0,.85);
    }
.wp-caption, img {
    height: auto;
    max-width: 100%;
}
.mkdf-banner-holder.mkdf-banner-info-centered .mkdf-banner-text-holder {
    padding: 50px 20px;
    text-align: center;
}
.mkdf-banner-holder .mkdf-banner-text-holder {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding: 35px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 20;
    pointer-events: none;
}
.mkdf-banner-holder .mkdf-banner-text-outer{position: absolute;display: table;background:#c19c51;table-layout:fixed;bottom:-20px;padding:1% 0;left:50%;transform:translateX(-50%);width:90%;border-radius:5px;}

.mkdf-banner-holder.mkdf-banner-info-centered .mkdf-banner-text-inner {
    vertical-align: middle;
}
.mkdf-banner-holder .mkdf-banner-text-inner {
    position: relative;
    display: table-cell;
    height: 100%;
    width: 100%;
    vertical-align: bottom;padding:0 1%;
}
.mkdf-banner-holder .mkdf-banner-title.mkdf-title-highlighted {
    display: inline-block;
    width: auto;
    padding:1% 29px;
    position: relative;
    z-index: 20;
    color:#fff;
    font-size:1em;
}
.mkdf-banner-holder.mkdf-banner-highlighted-text-skin-dark .mkdf-title-highlighted {
    -webkit-transition: all .3s,color .2s .2s;
    -o-transition: all .3s,color .2s .2s;
    transition: all .3s,color .2s .2s;
}
.mkdf-banner-holder .mkdf-banner-title {
    margin: 0;
    color: #fff;font-size:.8em
}
.mkdf-banner-holder .mkdf-banner-subtitle {
    margin: 27px 0 4px;
    color:rgba(0,0,0,.87);
}
.mkdf-banner-holder .mkdf-banner-button {
    display: block;
    pointer-events: all;
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline, .mkdf-btn-outer-holder.mkdf-btn-outer-solid {
    z-index: 1;
}
.mkdf-btn-outer-holder {
    display: inline-block;
    position: relative;
}
.mkdf-btn.mkdf-btn-large {
    padding:10px 60px;
}
.mkdf-btn.mkdf-btn-outline {
    color: #000;
    background-color: transparent;
    border: 1px solid #000;
    border: 2px solid #000;
    border-top-color: rgb(0, 0, 0);
    border-right-color: rgb(0, 0, 0);
    border-bottom-color: rgb(0, 0, 0);
    border-left-color: rgb(0, 0, 0);
}
.mkdf-btn-outer-holder .mkdf-btn, .mkdf-btn-outer-holder .mkdf-btn-bottom-line, .mkdf-btn-outer-holder .mkdf-btn-left-line, .mkdf-btn-outer-holder .mkdf-btn-right-line, .mkdf-btn-outer-holder .mkdf-btn-text, .mkdf-btn-outer-holder .mkdf-btn-top-line, .mkdf-btn-outer-holder i, .mkdf-btn-outer-holder span {
    -webkit-transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
    -o-transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
    transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-top-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-top-line {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 2px;
    background-color: #000;
    z-index: 0;
    -webkit-transition: 0s .3s;
    -o-transition: 0s .3s;
    transition: 0s .3s;
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-bottom-line, .mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-right-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-bottom-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-right-line {
    -webkit-transform: translate3d(5px,5px,0);
    transform: translate3d(5px,5px,0);
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-right-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-right-line {
    position: absolute;
    top: 0;
    right: 0;
    width: 2px;
    height: 100%;
    background-color: #000;
    z-index: 0;
}
.mkdf-btn-outer-holder .mkdf-btn, .mkdf-btn-outer-holder .mkdf-btn-bottom-line, .mkdf-btn-outer-holder .mkdf-btn-left-line, .mkdf-btn-outer-holder .mkdf-btn-right-line, .mkdf-btn-outer-holder .mkdf-btn-text, .mkdf-btn-outer-holder .mkdf-btn-top-line, .mkdf-btn-outer-holder i, .mkdf-btn-outer-holder span {
    -webkit-transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
    -o-transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
    transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
}
.mkdf-banner-holder .mkdf-banner-button {
    pointer-events: all;
}
.mkdf-banner-holder.mkdf-banner-info-centered .mkdf-banner-text-holder {
    text-align: center;
}
.vc_row h2 {
    font-size: 40px;
    line-height: 1.1em;
    letter-spacing: .02em;
    text-transform: uppercase;
    font-weight: 800;
}
.mkdf-banner-holder:hover .mkdf-banner-title.mkdf-title-highlighted .mkdf-banner-title-inner .mkdf-banner-title-highlighted-item {
    left: 0px;
    right: auto;
    width: 100%;
}
.mkdf-banner-holder .mkdf-banner-title.mkdf-title-highlighted .mkdf-banner-title-inner .mkdf-banner-title-highlighted-item {
    position: absolute;
    display: block;
    height: 100%;
    top: 0;
    background-color: #000;
    width: 0;
    left: auto;
    right: -30px;
    z-index: -1;border-radius:5px;
    -webkit-transition: .5s cubic-bezier(.7,.13,.26,.88);
    -o-transition: .5s cubic-bezier(.7,.13,.26,.88);
    transition: .5s cubic-bezier(.7,.13,.26,.88);
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline:hover .mkdf-btn-left-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid:hover .mkdf-btn-left-line {
    height: 100%;
    -webkit-transition: height .2s .1s;
    -o-transition: height .2s .1s;
    transition: height .2s .1s;
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-left-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-left-line {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 2px;
    height: 0;
    background-color: #000;
    z-index: 0;
    -webkit-transition: 0s .3s;
    -o-transition: 0s .3s;
    transition: 0s .3s;
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-bottom-line, .mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-right-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-bottom-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-right-line {
    -webkit-transform: translate3d(5px,5px,0);
    transform: translate3d(5px,5px,0);
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-bottom-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-bottom-line {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 2px;
    background-color: #000;
    z-index: 0;
}

.mkdf-btn-outer-holder .mkdf-btn, .mkdf-btn-outer-holder .mkdf-btn-bottom-line, .mkdf-btn-outer-holder .mkdf-btn-left-line, .mkdf-btn-outer-holder .mkdf-btn-right-line, .mkdf-btn-outer-holder .mkdf-btn-text, .mkdf-btn-outer-holder .mkdf-btn-top-line, .mkdf-btn-outer-holder i, .mkdf-btn-outer-holder span {
    -webkit-transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
    -o-transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
    transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
}
.mkdf-btn-outer-holder .mkdf-btn, .mkdf-btn-outer-holder .mkdf-btn-bottom-line, .mkdf-btn-outer-holder .mkdf-btn-left-line, .mkdf-btn-outer-holder .mkdf-btn-right-line, .mkdf-btn-outer-holder .mkdf-btn-text, .mkdf-btn-outer-holder .mkdf-btn-top-line, .mkdf-btn-outer-holder i, .mkdf-btn-outer-holder span {
    -webkit-transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
    -o-transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
    transition: all .3s cubic-bezier(.78,.2,.21,.88),color 0s;
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-right-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-right-line {
    position: absolute;
    top: 0;
    right: 0;
    width: 2px;
    height: 100%;
    background-color: #000;
    z-index: 0;
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-bottom-line, .mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-right-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-bottom-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-right-line {
    -webkit-transform: translate3d(5px,5px,0);
    transform: translate3d(5px,5px,0);
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline:hover .mkdf-btn-top-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid:hover .mkdf-btn-top-line {
    width: 100%;
    -webkit-transition: width .4s .3s;
    -o-transition: width .4s .3s;
    transition: width .4s .3s;
}
.mkdf-btn-outer-holder.mkdf-btn-outer-outline .mkdf-btn-top-line, .mkdf-btn-outer-holder.mkdf-btn-outer-solid .mkdf-btn-top-line {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 2px;
    background-color: #000;
    z-index: 0;
    -webkit-transition: 0s .3s;
    -o-transition: 0s .3s;
    transition: 0s .3s;
}








/*//////2///////*/
.mkdf-full-width {
    position: relative;
    z-index: 100;
}
.mkdf-grid-row {
    margin-left: -15px;
    margin-right: -15px;
}
    .mkdf-grid-row::after, .mkdf-grid-row::before {
        content: " ";
        display: table;
    }
.mkdf-portfolio-list-holder {
    position: relative;
    display: inline-block;
    width: 100%;
    vertical-align: middle;
}
.mkdf-no-space.mkdf-disable-bottom-space {
    margin-bottom: 0;
}
.clearfix {
    float: none;
    clear: both;
}
.mkdf-no-space .mkdf-outer-space {
    margin: 0;
}
.clearfix::after, .clearfix::before {
    content: " ";
    display: table;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article {
    background-color: #000;
    z-index: 20;
}
.mkdf-grid-list.mkdf-four-columns .mkdf-item-space {
    width: 25%;
}
.mkdf-grid-list:not(.mkdf-one-columns) .mkdf-item-space {
    float: left;
}
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay article .mkdf-pl-item-inner {
    overflow: hidden;
}
.mkdf-portfolio-list-holder article .mkdf-pl-item-inner {
    position: relative;
    display: inline-block;
    width: 100%;
    vertical-align: middle;
}
.mkdf-portfolio-list-holder article .mkdf-pli-image {
    position: relative;
    display: inline-block;
    width: 100%;
    vertical-align: middle;
}
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay article .mkdf-pli-image img {
    -webkit-transform: scale(1.01);
    -ms-transform: scale(1.01);
    transform: scale(1.01);
    -webkit-transition: .5s cubic-bezier(.51,.37,.15,.88);
    -o-transition: .5s cubic-bezier(.51,.37,.15,.88);
    transition: .5s cubic-bezier(.51,.37,.15,.88);
}
.mkdf-portfolio-list-holder article .mkdf-pli-image img {
    display: block;
    width: 100%;
}
.wp-caption, img {
    height: auto;
    max-width: 100%;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article:hover .mkdf-pli-image img {
    -webkit-transform: translate3d(70px,70px,0);
    transform: translate3d(70px,70px,0);
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text-holder {
    padding: 20px 0 20px 20px;
}
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay .mkdf-pli-text-holder {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding: 20px;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.mkdf-portfolio-list-holder article .mkdf-pli-link {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay article .mkdf-pli-image img {
    -webkit-transform: scale(1.01);
    -ms-transform: scale(1.01);
    transform: scale(1.01);
    -webkit-transition: .5s cubic-bezier(.51,.37,.15,.88);
    -o-transition: .5s cubic-bezier(.51,.37,.15,.88);
    transition: .5s cubic-bezier(.51,.37,.15,.88);
}
.mkdf-portfolio-list-holder article .mkdf-pli-image img {
    display: block;
    width: 100%;
}
.wp-caption, img {
    height: auto;
    max-width: 100%;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text-holder {
    padding: 20px 0 20px 20px;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article.mkdf-masonry-size-small .mkdf-pli-text-holder .mkdf-pli-text-wrapper {
    width: 85%;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text-holder .mkdf-pli-text-wrapper {
    width: 65%;
    float: right;
}
.mkdf-portfolio-list-holder article .mkdf-pli-text-wrapper {
    position: relative;
    display: table;
    table-layout: fixed;
    height: 100%;
    width: 100%;
}
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay article:hover .mkdf-pli-text {
    clip-path: inset(0 0 0 0);
    -webkit-clip-path: inset(0 0 0 0);
    -webkit-transition: .5s cubic-bezier(.36,.43,.24,.95);
    -o-transition: .5s cubic-bezier(.36,.43,.24,.95);
    transition: .5s cubic-bezier(.36,.43,.24,.95);
}
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay article .mkdf-pli-text {
    clip-path: inset(0 0 0 100%);
    -webkit-clip-path: inset(0 0 0 100%);
    -webkit-transition: .2s cubic-bezier(.36,.43,.24,.95);
    -o-transition: .2s cubic-bezier(.36,.43,.24,.95);
    transition: .2s cubic-bezier(.36,.43,.24,.95);
    right: -1px;
}
.mkdf-portfolio-list-holder article .mkdf-pli-text {
    position: relative;
    display: table-cell;
    height: 100%;
    width: 100%;
    vertical-align: middle;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article.mkdf-masonry-size-small .mkdf-pli-text .mkdf-pli-text-inner {
    padding: 24px 24px 24px 50px;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-text-inner {
    background-color: #000;
    padding: 24px 24px 24px 50px;
    font-family: Montserrat,sans-serif;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-category-holder {
    text-transform: uppercase;
    font-size: 11px;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-category-holder, .mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-title-holder {
    text-align: left;
    padding: 0;
}
.mkdf-portfolio-list-holder article .mkdf-pli-text .mkdf-pli-category-holder {
    position: relative;
    display: block;
    margin: 3px 0 0;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-title-holder {
    position: relative;
    width: auto;
    background-color: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
}

.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-category-holder, .mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-title-holder {
    text-align: left;
    padding: 0;
}
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-category-holder a {
    color: #fff;
}
.mkdf-portfolio-list-holder article .mkdf-pli-text .mkdf-pli-category-holder a:last-child {
    margin: 0;
    padding: 0;
}
.mkdf-portfolio-list-holder article .mkdf-pli-text .mkdf-pli-category-holder a {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    padding: 0 6px 0 0;
    margin: 0 3px 0 0;
    z-index: 8;
    letter-spacing: 2px;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-category-holder, .mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-title-holder {
    text-align: left;
}
    .mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-title-holder .mkdf-pli-svg-cover, .mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-title-holder .mkdf-pli-title-cover {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
    }
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay .mkdf-pli-text-inner .mkdf-pli-title-cover {
    padding: 0;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-title-holder .mkdf-pli-title {
    width: 100%;
    padding-right: 20px;
}
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-excerpt, .mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-title {
    color: #fff;
}
h4 {
    font-size:1.1em;
    line-height: 25px;
    letter-spacing: .02em;
    text-transform: uppercase;
    font-weight: 800;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-title-holder .mkdf-pli-svg-cover, .mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-title-holder .mkdf-pli-title-cover {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article:hover .mkdf-pli-svg-cover {
    -webkit-transform: translate3d(5px,-5px,0);
    transform: translate3d(5px,-5px,0);
    -webkit-transition: .3s .25s;
    -o-transition: .3s .25s;
    transition: .3s .25s;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article .mkdf-pli-text .mkdf-pli-text-inner {
    background-color: #000;
    padding: 24px 24px 24px 50px;
    font-family: Montserrat,sans-serif;
}
.mkdf-portfolio-list-holder.mkdf-grid-masonry-list.mkdf-pl-gallery-overlay article.mkdf-masonry-size-small .mkdf-pli-text .mkdf-pli-text-inner {
    padding: 24px 24px 24px 50px;
}
.mkdf-portfolio-list-holder article .mkdf-pli-text {
    position: relative;
    display: table-cell;
    height: 100%;
    width: 100%;
    vertical-align: middle;
}
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay article:hover .mkdf-pli-text {
    clip-path: inset(0 0 0 0);
    -webkit-clip-path: inset(0 0 0 0);
    -webkit-transition: .5s cubic-bezier(.36,.43,.24,.95);
    -o-transition: .5s cubic-bezier(.36,.43,.24,.95);
    transition: .5s cubic-bezier(.36,.43,.24,.95);
}
.mkdf-portfolio-list-holder.mkdf-pl-gallery-overlay article:hover .mkdf-pli-text {
    clip-path: inset(0 0 0 0);
    -webkit-clip-path: inset(0 0 0 0);
    -webkit-transition: .5s cubic-bezier(.36,.43,.24,.95);
    -o-transition: .5s cubic-bezier(.36,.43,.24,.95);
    transition: .5s cubic-bezier(.36,.43,.24,.95);
}

.mkdf-grid-list.mkdf-four-columns .mkdf-item-space.mkdf-masonry-size-large-width, .mkdf-grid-list.mkdf-four-columns .mkdf-item-space.mkdf-masonry-size-large-width-height {
    width: 50%;
}

/*MEGA MENU*/
div.ruby-menu-demo-header {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0;
    z-index: 99999
}

div.ruby-menu-demo-header-bg {
    background: url(../img/bg.jpg)
}

    div.ruby-menu-demo-header-bg div.ruby-menu-demo-download > span {
        color: #efefef
    }

        div.ruby-menu-demo-header-bg div.ruby-menu-demo-download > span > span {
            color: #efefef
        }

div.ruby-menu-demo-description {
    position: relative;
    width: 980px;
    height: 160px;
    margin: 0 auto;
    padding: 0
}

    div.ruby-menu-demo-description img {
        max-width: 200px;
        float: left;
        margin: 50px 20px 0 0
    }

span.ruby-menu-demo-highlight {
    color: #333
}

div.ruby-menu-demo-bg-light, div.ruby-menu-demo-bg-dark {
    width: 980px;
    height: auto;
    position: relative;
    background: #fff;
    margin: 0 auto;
    font-family: 'Open Sans',sans-serif;
    font-size: 16px
}

div.ruby-menu-demo-bg-dark {
    background: efefef
}

div.ruby-menu-demo-bg-light-c:after, div.ruby-menu-demo-bg-dark-c:after {
    content: "";
    display: table;
    clear: both
}

div.ruby-menu-demo-cv-1 {
    float: left;
    width: 33%
}

div.ruby-menu-demo-cv-2 {
    float: left;
    width: 67%
}

div.ruby-menu-demo-cv-3 {
    float: left;
    width: 48%
}

div.ruby-menu-demo-cv-4 {
    float: left;
    width: 52%
}

div.ruby-menu-demo-cr-1 {
    float: left;
    width: 33%
}

div.ruby-menu-demo-cr-2 {
    float: left;
    width: 66%
}

div.ruby-menu-demo-cs-1 {
    float: left;
    width: 33%
}

div.ruby-menu-demo-cs-2 {
    float: left;
    width: 66%
}

div.ruby-menu-demo-cf-1, div.ruby-menu-demo-cf-2, div.ruby-menu-demo-cf-3, div.ruby-menu-demo-cf-4 {
    float: left;
    width: 25%;
    text-align: center
}

div.ruby-menu-demo-f-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    margin: 0 auto;
    padding: 22px;
    font-size: 30px;
    background: #efefef;
    color: #aaa
}

div.ruby-menu-demo-f-title {
    width: 100%;
    height: 30px;
    margin: 0 auto;
    margin-top: 20px;
    font-weight: 700;
    font-size: 18px
}

div.ruby-menu-demo-f-desc {
    font-size: 14px;
    line-height: 24px;
    color: #555;
    padding: 15px
}

div.ruby-menu-demo-cs-1 table {
    line-height: 20px
}

    div.ruby-menu-demo-cs-1 table tr, div.ruby-menu-demo-cs-1 table td {
        padding: 0;
        font-weight: 700
    }

        div.ruby-menu-demo-cs-1 table td:last-child {
            padding-top: 5px
        }

h2.ruby-menu-demo-slogan-1, h3.ruby-menu-demo-slogan-1 {
    font-size: 20px;
    font-weight: 300;
    text-transform: uppercase;
    color: #b1b1b1;
    margin: 0
}

h1.ruby-menu-demo-slogan-2, h3.ruby-menu-demo-slogan-2 {
    font-size: 36px;
    font-weight: 700;
    text-transform: none;
    color: #222;
    margin: 0
}

p.ruby-menu-demo-slogan-description, p.ruby-menu-demo-slogan-description-2 {
    font-size: 16px;
    line-height: 24px;
    color: #444;
    margin: 35px 0
}

p.ruby-menu-demo-slogan-description-2 {
    color: #666;
    font-weight: 600;
    margin: -10px 0
}

span.ruby-menu-demo-code {
    color: #888;
    text-decoration: underline
}

td.ruby-menu-demo-theme-td-1 {
    max-width: 30px;
    text-align: left;
    padding: 6px
}

td.ruby-menu-demo-theme-td-2 {
    min-width: 120px;
    text-align: left;
    padding: 6px
}

td.ruby-menu-demo-theme-td-1:hover {
    cursor: pointer
}

.ruby-menu-demo-circle {
    border-radius: 50%;
    width: 24px;
    height: 24px;
    border: 4px solid #222;
    display: inline-block;
    margin: 0
}

.ruby-menu-demo-color-1 {
    background: #1aad86
}

.ruby-menu-demo-color-2 {
    background: #0c67c2
}

.ruby-menu-demo-color-3 {
    background: #ce0661
}

.ruby-menu-demo-color-4 {
    background: #ea7500
}

.ruby-menu-demo-color-5 {
    background: #74ba27
}

.ruby-menu-demo-color-6 {
    background: #ff3264
}

.ruby-menu-demo-color-7 {
    background: #fad814
}

.ruby-menu-demo-color-8 {
    background: #ccc
}

.ruby-menu-demo-color-9 {
    background: #111;
    border-color: #ccc
}

.ruby-menu-demo-color-10 {
    background: #036de2;
    border-color: #489efd
}

.ruby-menu-demo-color-11 {
    background: #f85252;
    border-color: #444
}

.ruby-menu-demo-color-12 {
    background: #ca79d0;
    border-color: #f2def3
}

.ruby-menu-demo-color-13 {
    background: #efefef;
    border-color: #222
}

.ruby-menu-demo-color-14 {
    background: #ccc
}

div.ruby-menu-demo-download {
    position: absolute;
    width: auto;
    top: 55px;
    right: 0
}

    div.ruby-menu-demo-download .fa {
        font-size: 20px;
        margin-right: 10px
    }

    div.ruby-menu-demo-download > span {
        font-size: 16px;
        display: block;
        margin: 10px 26px
    }

        div.ruby-menu-demo-download > span > span {
            font-size: 20px;
            color: #555;
            font-weight: 700
        }

button.ruby-btn {
    background: #c19c51;
    border: 2px solid #c19c51;
    color: #fff;
    border-radius: 0;
    padding: 10px 25px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer
}

    button.ruby-btn:hover {
        background: #fff;
        color: #c19c51
    }

.switch {
    display: table-cell;
    vertical-align: middle;
    padding: 10px
}

.cmn-toggle {
    position: absolute;
    margin-left: -9999px;
    visibility: hidden
}

    .cmn-toggle + label {
        display: block;
        position: relative;
        cursor: pointer;
        outline: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

input.cmn-toggle-round + label {
    padding: 2px;
    margin-top: -10px;
    width: 40px;
    height: 20px;
    background-color: #ddd;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    border-radius: 20px
}

    input.cmn-toggle-round + label:before, input.cmn-toggle-round + label:after {
        display: block;
        position: absolute;
        top: 1px;
        left: 1px;
        bottom: 1px;
        content: ""
    }

    input.cmn-toggle-round + label:before {
        right: 1px;
        background-color: #f1f1f1;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        -ms-border-radius: 20px;
        -o-border-radius: 20px;
        border-radius: 20px;
        -webkit-transition: background .4s;
        -moz-transition: background .4s;
        -o-transition: background .4s;
        transition: background .4s
    }

    input.cmn-toggle-round + label:after {
        width: 18px;
        background-color: #fff;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        -ms-border-radius: 100%;
        -o-border-radius: 100%;
        border-radius: 100%;
        -webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.3);
        -moz-box-shadow: 0 2px 5px rgba(0,0,0,0.3);
        box-shadow: 0 2px 5px rgba(0,0,0,0.3);
        -webkit-transition: margin .4s;
        -moz-transition: margin .4s;
        -o-transition: margin .4s;
        transition: margin .4s
    }

input.cmn-toggle-round:checked + label:before, input.cmn-toggle-on + label:before {
    background-color: #8ce196
}

input.cmn-toggle-round:checked + label:after, input.cmn-toggle-on + label:after {
    margin-left: 20px
}

input.cmn-toggle-on:checked + label:before {
    background-color: #f1f1f1
}

input.cmn-toggle-on:checked + label:after {
    margin-left: 0
}

img.iphone7 {
    max-width: 350px;
    float: right;
    margin-right: 0
}

@media(min-width: 768px) and (max-width:991px) {
    body {
        overflow-x: hidden
    }

    div.ruby-menu-demo-description {
        position: relative;
        width: 760px;
        height: 160px;
        margin: 0 auto;
        padding: 0
    }

        div.ruby-menu-demo-description img {
            max-width: 200px;
            float: left;
            margin: 50px 20px 0 0
        }

    div.ruby-menu-demo-bg-light, div.ruby-menu-demo-bg-dark {
        width: 760px;
        font-size: 14px
    }

    div.ruby-menu-demo-cs-1 {
        width: 27%
    }

    div.ruby-menu-demo-cs-2 {
        width: 73%
    }

    td.ruby-menu-demo-theme-td-1 {
        max-width: 27px;
        padding: 7px
    }

    td.ruby-menu-demo-theme-td-2 {
        min-width: 100px;
        padding: 7px
    }

    .ruby-menu-demo-circle {
        width: 22px;
        height: 22px;
        border: 3px solid #222
    }

    img.iphone7 {
        max-width: 320px;
        float: right;
        margin-right: 20px
    }
}

@media(max-width: 767px) {
    div.ruby-menu-demo-header {
        width: 100%;
        height: auto
    }

    div.ruby-menu-demo-description {
        width: 100%;
        margin: 0 auto;
        margin-bottom: 220px;
        padding: 10px;
        text-align: center
    }

        div.ruby-menu-demo-description img {
            float: none;
            margin: 90px 0 0
        }

    div.ruby-menu-demo-download {
        position: relative;
        width: auto;
        top: 25px;
        right: auto;
        left: auto
    }

        div.ruby-menu-demo-download > span {
            font-size: 20px;
            margin: 25px auto
        }

            div.ruby-menu-demo-download > span > span {
                font-size: 26px
            }

    button.ruby-btn {
        padding: 14px 25px;
        font-size: 16px;
        text-transform: uppercase
    }

    div.ruby-menu-demo-bg-light.ruby-menu-demo-switches {
        display: none
    }

    div.ruby-menu-demo-bg-light, div.ruby-menu-demo-bg-dark {
        width: 100%;
        font-size: 16px;
        padding: 25px;
        margin-bottom: -100px
    }

    div.ruby-menu-demo-cv-1 {
        width: 100%
    }

    div.ruby-menu-demo-cv-2 {
        width: 100%
    }

    div.ruby-menu-demo-cv-3 {
        width: 100%
    }

    div.ruby-menu-demo-cv-4 {
        width: 100%
    }

    div.ruby-menu-demo-cr-1 {
        width: 100%
    }

    div.ruby-menu-demo-cr-2 {
        width: 100%;
        margin-top: 40px
    }

    div.ruby-menu-demo-cf-1, div.ruby-menu-demo-cf-2, div.ruby-menu-demo-cf-3, div.ruby-menu-demo-cf-4 {
        float: left;
        width: 50%;
        text-align: center
    }

    div.ruby-menu-demo-f-desc {
        margin-bottom: 30px
    }

    img.iphone7 {
        max-width: 300px;
        float: none;
        margin-right: 0 auto
    }
}


/* theme */

div.ruby-wrapper, div.ruby-wrapper.ruby-vertical {
    background: #f9f9f9;
    color: #222
}

ul.ruby-menu > li > a {
    color: #222
}

ul.ruby-menu > li > a:hover, ul.ruby-menu > li:hover > a, ul.ruby-menu > li.ruby-active-menu-item > a:hover, ul.ruby-menu > li.ruby-active-menu-item:hover > a{background:#c19c51;color:#fff}

ul.ruby-menu > li.ruby-active-menu-item > a {
    background: #efefef;
    color: #222
}

ul.ruby-menu.ruby-menu-dividers > li > a, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social > a {
    border-left: 1px solid #ddd;
    border-right: 1px solid #fff
}

ul.ruby-menu.ruby-menu-dividers > li:first-child > a, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social:last-child > a {
    border-left: none
}

ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li > a {
    border: none;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #fff
}

ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li:first-child > a {
    border-top: none
}

ul.ruby-menu.ruby-menu-dividers > li > a:hover, ul.ruby-menu.ruby-menu-dividers > li:hover > a {
    border-left: 1px solid #222;
    border-right: 1px solid #222
}

ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li > a:hover, ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li:hover > a {
    border-bottom: 1px solid #222
}

ul.ruby-menu.ruby-menu-dividers > li.ruby-active-menu-item > a {
    border-left: 1px solid #efefef;
    border-right: 1px solid #fff
}

ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li.ruby-active-menu-item > a {
    border-bottom: 1px solid #fff;
    border-left: none;
    border-right: none
}

ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li > a {
    border-left: none;
    border-right: none
}

ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li.ruby-active-menu-item > a:hover, ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li.ruby-active-menu-item:hover > a {
    border-bottom: 1px solid #222;
    border-left: none
}

ul.ruby-menu > li > ul, ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul {
    border-top: 4px solid #222
}

    ul.ruby-menu > li > ul > li > a, ul.ruby-menu > li > ul > li > ul > li > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a {
        background: #fff;
        color: #666
    }

        ul.ruby-menu > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > a:hover, ul.ruby-menu > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > a:hover, ul.ruby-menu > li > ul > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:hover {
            background: #efefef
        }

ul.ruby-menu > li.ruby-menu-mega > div, ul.ruby-menu > li.ruby-menu-mega-blog > div, ul.ruby-menu > li.ruby-menu-mega-shop > div {
    background: #fff;
    border-top: 4px solid #222
}

    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav {
        background: #efefef
    }

        ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a {
            background: #efefef;
            color: #666
        }

        ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li.ruby-active-menu-item > a {
            background: #e6e6e6
        }

        ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
            background: #fff
        }

        ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li:hover > a {
            background: #ddd
        }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul {
        background: #efefef;
        border-bottom: 1px solid #ddd
    }

        ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a {
            color: #666
        }

        ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div {
            background: #fff
        }

            ul.ruby-menu > li.ruby-menu-mega > div ul li > a, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div ul > li > a {
                color: #555
            }

                ul.ruby-menu > li.ruby-menu-mega > div ul li > a:hover, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div ul > li > a:hover {
                    color: #222
                }

    ul.ruby-menu > li.ruby-menu-mega > div ul.ruby-list-with-images li span.ruby-list-desc {
        color: #999
    }

span.ruby-c-title, span.ruby-c-title a {
    color: #222
}

    span.ruby-c-title a:hover, span.ruby-c-category, span.ruby-c-category a, span.ruby-c-date, span.ruby-c-date a {
        color: #444
    }

        span.ruby-c-category a:hover, span.ruby-c-date a:hover {
            color: #222
        }

@media(min-width: 768px) {
    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:after {
        background-color: #222
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:hover {
        color: #333
    }

    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li.ruby-active-menu-item > a:after, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li:hover > a:after {
        border-color: transparent #fff transparent transparent
    }
}

@media(max-width: 767px) {
    ul.ruby-menu > li > a {
        background: #efefef
    }

        ul.ruby-menu > li > a:hover, ul.ruby-menu > li:hover > a, ul.ruby-menu > li.ruby-active-menu-item > a:hover {
            background: #ccc;
            color: #111
        }

    ul.ruby-menu > li.ruby-active-menu-item > a {
        background: #ccc
    }

    ul.ruby-menu > li > ul > li > a, ul.ruby-menu > li > ul > li > ul > li > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a {
        background: #d1d1d1
    }

        ul.ruby-menu > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > a:hover, ul.ruby-menu > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > a:hover, ul.ruby-menu > li > ul > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:hover {
            background: #d9d9d9;
            color: #111
        }

    ul.ruby-menu > li > ul > li > ul > li > a {
        background: #e5e5e5
    }

        ul.ruby-menu > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > a:hover {
            background: #e1e1e1
        }

    ul.ruby-menu > li > ul > li > ul > li > ul > li > a {
        background: #efefef
    }

        ul.ruby-menu > li > ul > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:hover {
            background: #fff
        }

    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li.ruby-active-menu-item > a {
        background: #bcbcbc
    }

    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li:hover > a {
        background: #d9d9d9
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li.ruby-active-menu-item > a {
        background: #bcbcbc
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li:hover > a, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:hover, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li.ruby-active-menu-item > a {
        background: #d9d9d9
    }

    span.ruby-dropdown-toggle:after {
        color: #fff
    }

    ul.ruby-menu > li > a:before, ul.ruby-menu > li > ul > li > a:before, ul.ruby-menu > li > ul > li > ul > li > a:before, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:before, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:before {
        background: #333
    }

    ul.ruby-menu > li > ul > li > a:before, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:before {
        background: #555
    }

    ul.ruby-menu > li > ul > li > ul > li > a:before {
        background: #777
    }

    ul.ruby-menu > li > ul > li > ul > li > ul > li > a:before {
        background: #999
    }

    .c-hamburger span {
        background: #222
    }

        .c-hamburger span::before, .c-hamburger span::after {
            background-color: #222
        }

    .c-hamburger--htx {
        background-color: #efefef;
        color: #222
    }

        .c-hamburger--htx.is-active {
            background-color: #ddd
        }

    ul.ruby-menu > li.ruby-menu-mega > div, ul.ruby-menu > li.ruby-menu-mega-blog > div, ul.ruby-menu > li.ruby-menu-mega-shop > div {
        border-top: none
    }

    ul.ruby-menu > li > ul, ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul {
        border-top: none
    }

    ul.ruby-menu.ruby-menu-dividers > li, ul.ruby-menu.ruby-menu-dividers > li > a, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social > a, ul.ruby-menu.ruby-menu-dividers > li > a:hover, ul.ruby-menu.ruby-menu-dividers > li:hover > a {
        border: none
    }
}

/* transision */

span.ruby-dropdown-toggle {
    transition: transform .3s ease
}

    span.ruby-dropdown-toggle:after {
        transition: transform .3s ease
    }

@media(min-width: 767px) {
    ul.ruby-menu > li > a:after {
        transition: all .3s ease
    }

    ul.ruby-menu > li > ul > li > a:after, ul.ruby-menu > li > ul > li > ul > li > a:after, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:after {
        transition: all .3s ease
    }

    ul.ruby-menu > li > ul, ul.ruby-menu > li > div {
        transform: translateY(25px);
        transition: all .3s ease
    }

    ul.ruby-menu > li:hover > ul, ul.ruby-menu > li:hover > div {
        transform: translateY(0)
    }

    ul.ruby-menu.ruby-vertical > li > ul, ul.ruby-menu.ruby-vertical > li > div {
        transform: translateX(25px);
        transition: all .3s ease
    }

    ul.ruby-menu.ruby-vertical > li:hover > ul, ul.ruby-menu.ruby-vertical > li:hover > div {
        transform: translateX(0)
    }

    ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul > li > ul {
        transform: translateX(25px);
        transition: all .3s ease
    }

        ul.ruby-menu > li > ul > li:hover > ul, ul.ruby-menu > li > ul > li > ul > li:hover > ul, ul.ruby-menu > li > ul > li > ul > li > ul > li:hover > ul {
            transform: translateX(0)
        }

        ul.ruby-menu > li > ul > li.ruby-open-to-left > ul, ul.ruby-menu > li > ul > li > ul > li.ruby-open-to-left > ul, ul.ruby-menu > li > ul > li > ul > li > ul > li.ruby-open-to-left > ul {
            transform: translateX(-25px);
            transition: all .3s ease
        }

        ul.ruby-menu > li > ul > li.ruby-open-to-left:hover > ul, ul.ruby-menu > li > ul > li > ul > li.ruby-open-to-left:hover > ul, ul.ruby-menu > li > ul > li > ul > li > ul > li.ruby-open-to-left:hover > ul {
            transform: translateX(0)
        }

    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
        transform: translateY(-50px);
        transition: all .5s ease
    }

    ul.ruby-menu > li.ruby-menu-mega-blog:hover > div > ul.ruby-menu-mega-blog-nav > li.ruby-active-menu-item > div, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li:hover > div {
        transform: translateY(0)
    }

    ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
        transform: translateX(50px);
        transition: all .5s ease
    }

    ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-blog:hover > div > ul.ruby-menu-mega-blog-nav > li.ruby-active-menu-item > div, ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li:hover > div {
        transform: translateX(0)
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div {
        transform: translateY(-50px);
        transition: all .5s ease
    }

    ul.ruby-menu > li.ruby-menu-mega-shop:hover > div > ul > li.ruby-active-menu-item > div, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li:hover > div {
        transform: translateY(0)
    }

    ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-shop > div > ul > li > div {
        transform: translateX(50px);
        transition: all .5s ease
    }

    ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-shop:hover > div > ul > li.ruby-active-menu-item > div, ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-shop > div > ul > li:hover > div {
        transform: translateX(0)
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:after {
        -webkit-transition: all .4s ease;
        transition: all .4s ease
    }
}

/* main */

*, :before, :after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

div.ruby-wrapper {
    position: relative;
    width:100%;
    height: 60px;
    margin: 0 auto;
    background:#2a2a2a;padding:0.1% 0%;}

    div.ruby-wrapper ul {
        margin: 0;
        padding: 0;
        list-style: none
    }

    div.ruby-wrapper > ul {
        position: relative
    }

ul.ruby-menu > li {
    float: right;
    font-size: 14px
}

    ul.ruby-menu > li.ruby-menu-right {
        float: right
    }

    ul.ruby-menu > li > a {
        display: block;
        line-height: 50px;
        padding: 0 25px 0 15px;
        color:#fff;
        text-decoration: none;
        text-transform: uppercase
    }

        ul.ruby-menu > li > a:only-child {
            padding: 0 15px
        }

        ul.ruby-menu > li > a:hover, ul.ruby-menu > li:hover > a, ul.ruby-menu > li.ruby-active-menu-item > a:hover, ul.ruby-menu > li.ruby-active-menu-item:hover > a{background:#c19c51}

            ul.ruby-menu > li > a:only-child:after, ul.ruby-menu > li:hover > a:only-child:after {
                content: ''
            }

    ul.ruby-menu > li.ruby-active-menu-item > a {
        background: #17a47d
    }

    ul.ruby-menu > li > a .fa {
        position: relative;
        width: 24px
    }

    ul.ruby-menu > li > a > img {
        max-width: 16px;
        display: block
    }

    ul.ruby-menu > li.ruby-menu-social > a {
        padding: 0;
        width: 30px;
        padding: 0 8px;
        font-size: 16px
    }

        ul.ruby-menu > li.ruby-menu-social > a > span {
            display: none
        }

    ul.ruby-menu > li.ruby-menu-social.ruby-menu-search > a, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social.ruby-menu-search > a {
        transition: all .5s ease;
        max-height: 50px;
        width: 30px;
        transition: all .5s ease;
        transition-delay: .3s
    }

        ul.ruby-menu > li.ruby-menu-social.ruby-menu-search > a:hover, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social.ruby-menu-search > a:hover {
            width: 120px
        }

            ul.ruby-menu > li.ruby-menu-social.ruby-menu-search > a:hover > span input, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social.ruby-menu-search > a:hover > span input {
                transform: scaleY(1);
                max-width: 80px
            }

        ul.ruby-menu > li.ruby-menu-social.ruby-menu-search > a span, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social.ruby-menu-search > a span {
            display: inline
        }

        ul.ruby-menu > li.ruby-menu-social.ruby-menu-search > a > span input, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social.ruby-menu-search > a > span input {
            position: absolute;
            width: 80px;
            height: 50px;
            line-height: 50px;
            margin: 0;
            background: none;
            color: #efefef;
            border: none;
            font-family: 'Open Sans',sans-serif;
            font-size: 14px;
            font-weight: 700;
            text-transform: uppercase;
            max-width: 0;
            transform: scaleY(0);
            transition: all .5s ease;
            transition-delay: .3s
        }

            ul.ruby-menu > li.ruby-menu-social.ruby-menu-search > a > span input:focus {
                outline: none;
                color: #efefef
            }

            ul.ruby-menu > li.ruby-menu-social.ruby-menu-search > a > span input::-webkit-input-placeholder {
                color: #efefef
            }

ul.ruby-menu.ruby-menu-dividers > li > a, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social > a {
    border-left: 1px solid #111;
    border-right: 1px solid #666
}

ul.ruby-menu.ruby-menu-dividers > li:first-child > a, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social:last-child > a {
    border-left: none
}

ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li > a {
    border: none;
    border-top: 1px solid #111;
    border-bottom: 1px solid #666
}

ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li:first-child > a {
    border-top: none
}

ul.ruby-menu.ruby-menu-dividers > li > a:hover, ul.ruby-menu.ruby-menu-dividers > li:hover > a {
    border-right: 1px solid #c19c51
}

ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li > a:hover, ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li:hover > a {
    border-bottom: 1px solid #c19c51
}

ul.ruby-menu.ruby-menu-dividers > li.ruby-active-menu-item > a {
    border-right: 1px solid #17a47d
}

ul.ruby-menu.ruby-vertical.ruby-menu-dividers > li.ruby-active-menu-item > a {
    border-bottom: 1px solid #17a47d
}

ul.ruby-menu > li > ul, ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul {
    position: absolute;
    -webkit-box-shadow: 0 8px 24px -5px #ccc;
    -moz-box-shadow: 0 8px 24px -5px #ccc;
    box-shadow: 0 8px 24px -5px #ccc;
    border-top: 4px solid #c19c51
}

    ul.ruby-menu > li > ul > li, ul.ruby-menu > li > ul > li > ul > li {
        position: relative
    }

        ul.ruby-menu > li > ul > li > a, ul.ruby-menu > li > ul > li > ul > li > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a {
            display: block;
            width:220px;
            line-height: 40px;
            padding: 0 15px 0 15px;
            background: #fff;
            color: #666;
            text-decoration: none;
            font-size: 14px
        }

            ul.ruby-menu > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > a:hover, ul.ruby-menu > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > a:hover, ul.ruby-menu > li > ul > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:hover {
                background: #efefef
            }

            ul.ruby-menu > li > ul > li > a:only-child:after, ul.ruby-menu > li > ul > li > ul > li > a:only-child:after, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:only-child:after {
                content: ""
            }

            ul.ruby-menu > li > ul > li > a .fa, ul.ruby-menu > li > ul > li > ul > li > a .fa, ul.ruby-menu > li > ul > li > ul > li > ul > li > a .fa {
                position: relative;
                width: 24px
            }

ul.ruby-menu > li.ruby-menu-right > ul {
    right: 0
}

ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul {
    left: 170px;
    top: -4px;
    z-index: 100
}

    ul.ruby-menu > li > ul > li.ruby-open-to-left > ul, ul.ruby-menu > li > ul > li > ul > li.ruby-open-to-left > ul {
        left: auto;
        right: 170px
    }

ul.ruby-menu > li.ruby-menu-mega > div, ul.ruby-menu > li.ruby-menu-mega-blog > div, ul.ruby-menu > li.ruby-menu-mega-shop > div {
    position: absolute;
    width: 100%;
    height:370px !important;
    top: 50px;
    left: 0;
    background: #fff;
    border-top: 4px solid #c19c51;
    overflow: hidden;
    -webkit-box-shadow: 0 8px 24px -5px #ccc;
    -moz-box-shadow: 0 8px 24px -5px #ccc;
    box-shadow: 0 8px 24px -5px #ccc
}

    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav {
        /*position: relative;*/
        width: 200px;
        height: 100%;
        left: 0;
        top: 0;
        background: #efefef
    }

        ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li {
            font-size: 14px
        }

            ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a {
                display: block;
                line-height: 40px;
                padding: 0 15px;
                background: #efefef;
                color: #666;
                text-decoration: none
            }

            ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li.ruby-active-menu-item > a {
                background: #e6e6e6
            }

            ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
                position: absolute;
                /*width: 780px;*/width:80%;
                height: auto;
                min-height: 100%;
                right: 200px;
                top: 0;
                background: #fff
            }

            ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li:hover > a {
                background: #ddd
            }

ul.ruby-menu > li.ruby-menu-mega-shop > div {
    text-align: center;
    z-index: 999999
}

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul {
        width: 100%;
        background: #efefef;
        margin: 0 auto;
        padding: 0;
        border-bottom: 1px solid #ddd;
        font-size: 0;
        z-index: 100
    }

        ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li {
            display: inline-block;
            margin: 0
        }

            ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a {
                display: block;
                padding: 20px 15px;
                text-transform: uppercase;
                font-weight: 700;
                font-size: 14px;
                font-stretch: expanded;
                color: #666
            }

                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li:hover > a, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:hover, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li.ruby-active-menu-item > a {
                    text-decoration: none
                }

            ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a {
                position: relative;
                text-decoration: none;
                display: inline-block
            }

            ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div {
                position: absolute;
                width: 100%;
                left: 0;
                top: auto;
                margin-top: 1px;
                text-align: left;
                background: #fff;
                z-index: -1
            }

div.ruby-grid, div.ruby-grid-lined {
    position: relative;
    width: 100%;
    padding: 0;
    margin: 0
}

    div.ruby-grid > div.ruby-row {
        position: relative;
        width: 100%;
        height: auto
    }

        div.ruby-grid > div.ruby-row div.ruby-row [class^="ruby-col"] {
            margin-top: 16px
        }

        div.ruby-grid > div.ruby-row div.ruby-row:first-of-type [class^="ruby-col"] {
            margin-top: 0
        }

    div.ruby-grid.ruby-grid-lined > div.ruby-row:after {
        content: "";
        width: 100%;
        height: 1px;
        left: 0;
        bottom: 0;
        background: -webkit-linear-gradient(left,rgba(204,204,204,0) 0%,rgba(204,204,204,0.48) 24%,rgba(204,204,204,1) 50%,rgba(204,204,204,0.42) 79%,rgba(204,204,204,0) 100%)
    }

    div.ruby-grid.ruby-grid-lined > div.ruby-row:last-child:after {
        height: 0
    }

    div.ruby-grid > div.ruby-row::after {
        content: "";
        display: table;
        clear: both
    }

    div.ruby-grid > div.ruby-row [class^="ruby-col"] {
        position: relative;
        float:right;
        height: auto
    }

    div.ruby-grid > div.ruby-row > [class^="ruby-col"] {
        padding: 16px
    }

        div.ruby-grid > div.ruby-row > [class^="ruby-col"] [class^="ruby-col"] {
            padding-left: 16px
        }

            div.ruby-grid > div.ruby-row > [class^="ruby-col"] [class^="ruby-col"]:first-of-type {
                padding-left: 0
            }
    div.ruby-grid > div.ruby-row div.ruby-col-3:last-child{float:left;width:25%;}

    div.ruby-grid > div.ruby-row div.ruby-col-1 {
        width: 8.33%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-2 {
        width: 16.66%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-3 {
        width:17%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-4 {
        width: 33.33%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-5 {
        width: 41.66%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-6 {
        width: 50%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-7 {
        width: 58.33%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-8 {
        width: 66.66%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-9 {
        width: 75%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-10 {
        width: 83.33%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-11 {
        width: 91.66%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-12 {
        width: 100%
    }

    div.ruby-grid.ruby-grid-lined > div.ruby-row > div[class^="ruby-col"]:after {
        content: "";
        position: absolute;
        top: 0;
        width: 1px;
        height: 100%;
        right: 0;
        background: -webkit-linear-gradient(top,rgba(204,204,204,0) 0%,rgba(204,204,204,0.48) 24%,rgba(204,204,204,1) 50%,rgba(204,204,204,0.42) 79%,rgba(204,204,204,0) 100%)
    }

    div.ruby-grid.ruby-grid-lined > div.ruby-row > div[class^="ruby-col"]:last-child:after {
        width: 0
    }

    div.ruby-grid img {
        position: relative;
        max-width: 100%;
        height: auto;
        display: block
    }

h3.ruby-list-heading {
    font-size: 14px;
    line-height: 24px;
    font-weight: 700;
    margin: 0
}
ul.ruby-menu li.Tophead{font-size:1em;font-weight:bold;border-right:3px solid #c19c51;padding-right:5%;line-height:1.5em;margin-bottom:5%;}
ul.ruby-menu > li.ruby-menu-mega > div ul, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div ul {
    margin: 0;
    margin-top: 10px
}

    ul.ruby-menu > li.ruby-menu-mega > div ul li, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div ul > li {
        position: relative;
        font-size: 14px;
        line-height: 28px;
        display: block;
        width: 100%
    }

        ul.ruby-menu > li.ruby-menu-mega > div ul li > a, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div ul > li > a {
            text-decoration: none;
            color: #555;
            display: inline-block
        }

            ul.ruby-menu > li.ruby-menu-mega > div ul li > a:hover, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div ul > li > a:hover {
                color: #222;
                text-decoration: underline
            }

        ul.ruby-menu > li.ruby-menu-mega > div ul li .fa, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div ul > li .fa {
            position: relative;
            width: 24px
        }

    ul.ruby-menu > li.ruby-menu-mega > div ul.ruby-list-with-images li {
        height: 50px
    }

        ul.ruby-menu > li.ruby-menu-mega > div ul.ruby-list-with-images li span.ruby-list-desc {
            font-size: 11px;
            display: block;
            position: absolute;
            top: 16px;
            left: 72px;
            color: #999
        }

    ul.ruby-menu > li.ruby-menu-mega > div ul li > a > img {
        float: left;
        width: 60px;
        margin-right: 12px
    }

span.ruby-c-title, span.ruby-c-category, span.ruby-c-date {
    position: relative;
    display: block
}

    span.ruby-c-title a, span.ruby-c-category a, span.ruby-c-date a {
        text-decoration: none
    }

    span.ruby-c-title, span.ruby-c-title a {
        font-size: 14px;
        font-weight: 700;
        text-transform: capitalize;
        line-height: 20px;
        margin-top: -5px;
        color: #222
    }

        span.ruby-c-title a:hover {
            color: #444;
            text-decoration: underline
        }

    span.ruby-c-category, span.ruby-c-category a {
        font-size: 11px;
        margin: 9px 0;
        color: #444
    }

    span.ruby-c-date, span.ruby-c-date a {
        font-size: 11px;
        color: #444
    }

        span.ruby-c-category a:hover, span.ruby-c-date a:hover {
            color: #c19c51
        }

div.ruby-c-inline {
    display: block;
    position: relative;
    height: 14px;
    margin: 7px 0
}

    div.ruby-c-inline span.ruby-c-category, div.ruby-c-inline span.ruby-c-date {
        position: absolute;
        display: inline-block
    }

    div.ruby-c-inline span.ruby-c-date {
        right: 0
    }

    div.ruby-c-inline span.ruby-c-category, div.ruby-c-inline span.ruby-c-category a {
        margin: 0
    }

span.ruby-c-content {
    display: block;
    position: relative;
    top: 7px;
    font-size: 12px;
    line-height: 18px;
    text-align: justify
}

.ruby-wrapper .visible-xs {
    visibility: hidden;
    position: absolute
}

@media(min-width: 768px) {
    div.ruby-wrapper.ruby-menu-transparent {
        background: none
    }

        div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu > li.ruby-active-menu-item > a {
            background: none
        }

        div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu > li.ruby-menu-social > a {
            border: none
        }

        div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu.ruby-menu-dividers > li > a {
            border: none
        }

            div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu > li:hover > a, div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu > li > a:hover, div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu.ruby-menu-dividers > li:hover > a, div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu.ruby-menu-dividers > li > a:hover {
                background: none;
                color: #e2e2e2
            }

        div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu > li.ruby-menu-social.ruby-menu-search > a:hover, div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu > li.ruby-menu-social.ruby-menu-search:hover > a {
            background: none
        }

    div.ruby-wrapper.ruby-menu-full-width {
        width: 100%
    }

        div.ruby-wrapper.ruby-menu-full-width > ul.ruby-menu {
            width: 980px;
            margin: 0 auto
        }

    ul.ruby-menu > li > ul, ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul {
        visibility: hidden;
        opacity: 0
    }

        ul.ruby-menu > li:hover > ul, ul.ruby-menu > li > ul > li:hover > ul, ul.ruby-menu > li > ul > li > ul > li:hover > ul {
            visibility: visible;
            opacity: 1
        }

    ul.ruby-menu > li.ruby-menu-mega > div, ul.ruby-menu > li.ruby-menu-mega-blog > div, ul.ruby-menu > li.ruby-menu-mega-shop > div {
        visibility: hidden;
        opacity: 0
    }

    ul.ruby-menu > li.ruby-menu-mega:hover > div, ul.ruby-menu > li.ruby-menu-mega-blog:hover > div, ul.ruby-menu > li.ruby-menu-mega-shop:hover > div {
        visibility: visible;
        opacity: 1
    }

    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
        visibility: hidden;
        opacity: 0
    }

    ul.ruby-menu > li.ruby-menu-mega-blog:hover > div > ul.ruby-menu-mega-blog-nav > li.ruby-active-menu-item > div {
        visibility: visible;
        opacity: 1
    }

    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li:hover > div {
        visibility: visible;
        opacity: 1;
        z-index: 101
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div {
        visibility: hidden;
        opacity: 0
    }

    ul.ruby-menu > li.ruby-menu-mega-shop:hover > div > ul > li.ruby-active-menu-item > div, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li:hover > div {
        visibility: visible;
        opacity: 1
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:after {
        height: 1px;
        position: absolute;
        content: '';
        background-color: #c19c51;
        width: 0
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:before {
        top: 10px;
        left: 5%
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:after {
        bottom: 10px;
        right: 5%
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:hover, .snip1217 .current a {
        color: #333
    }

        ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:hover:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li.ruby-active-menu-item > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:hover:after, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li.ruby-active-menu-item > a:after, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li:hover > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li:hover > a:after {
            width: 90%
        }

    ul.ruby-menu > li > a:after {
        font-family: "FontAwesome";
        text-decoration: none;
        content: '\f107';
        margin-right: 5px
    }

    ul.ruby-menu > li:hover > a:after {
        -webkit-transform: rotate(-180deg);
        -moz-transform: rotate(-180deg);
        -o-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    ul.ruby-menu > li > ul > li > a:after, ul.ruby-menu > li > ul > li > ul > li > a:after, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:after {
        font-family: "FontAwesome";
        text-decoration: none;
        font-size: 16px;
        padding: 0;
        content: '\f105';
        position: absolute;
        right: 15px
    }

    ul.ruby-menu > li > ul > li:hover > a:after, ul.ruby-menu > li > ul > li > ul > li:hover > a:after, ul.ruby-menu > li > ul > li > ul > li > ul > li:hover > a:after {
        -webkit-transform: rotate(-180deg);
        -moz-transform: rotate(-180deg);
        -o-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    ul.ruby-menu > li > ul > li.ruby-open-to-left > a:after, ul.ruby-menu > li > ul > li > ul > li.ruby-open-to-left > a:after, ul.ruby-menu > li > ul > li > ul > li > ul > li.ruby-open-to-left > a:after {
        content: '\f104';
        right: auto;
        left: 10px
    }

    ul.ruby-menu > li > ul > li.ruby-open-to-left:hover > a:after, ul.ruby-menu > li > ul > li > ul > li.ruby-open-to-left:hover > a:after, ul.ruby-menu > li > ul > li > ul > li > ul > li.ruby-open-to-left:hover > a:after {
        -webkit-transform: rotate(-180deg);
        -moz-transform: rotate(-180deg);
        -o-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li.ruby-active-menu-item > a:after, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li:hover > a:after {
        content: "";
        position: absolute;
        left: 0;
        margin-top: 13px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 6px 8px 6px 0;
        border-color: transparent #fff transparent transparent;transform:rotate(180deg);
    }
}

/* responsive */

@media(max-width: 767px) {
    div.ruby-wrapper .hidden-xs {
        visibility: hidden;
        display: none
    }

    div.ruby-wrapper {
        position: absolute;
        width: 100%;
        top: 0;
        background: #111
    }

    .ruby-wrapper .visible-xs {
        visibility: visible;
        position: absolute;
        left: 0;
        top: 0
    }

    div.ruby-wrapper > ul {
        position: absolute;
        top: 50px;
        width: 100%
    }

    ul.ruby-menu > li, ul.ruby-menu > li.ruby-menu-right {
        float: none
    }

        ul.ruby-menu > li > a {
            padding: 0 65px;
            background: #c19c51
        }

            ul.ruby-menu > li > a:only-child {
                padding: 0 65px
            }

            ul.ruby-menu > li > a:hover, ul.ruby-menu > li:hover > a, ul.ruby-menu > li.ruby-active-menu-item > a:hover {
                background: #127e61
            }

        ul.ruby-menu > li.ruby-active-menu-item > a {
            background: #159572
        }

        ul.ruby-menu > li.ruby-menu-social > a > span {
            display: block
        }

        ul.ruby-menu > li > ul, ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul {
            position: relative;
            width: 100%;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            box-shadow: none;
            border-top: none
        }

            ul.ruby-menu > li, ul.ruby-menu > li > ul > li, ul.ruby-menu > li > ul > li > ul > li, ul.ruby-menu > li > ul > li > ul > li > ul > li {
                position: relative
            }

                ul.ruby-menu > li > ul > li > a, ul.ruby-menu > li > ul > li > ul > li > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a {
                    width: 100%;
                    line-height: 50px;
                    padding: 0 80px;
                    background: #d1d1d1
                }

                    ul.ruby-menu > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > a:hover, ul.ruby-menu > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > a:hover, ul.ruby-menu > li > ul > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:hover {
                        background: #d9d9d9;
                        color: #111
                    }

                ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul > li > ul {
                    left: auto;
                    top: auto;
                    z-index: auto
                }

                    ul.ruby-menu > li > ul > li.ruby-open-to-left > ul, ul.ruby-menu > li > ul > li > ul > li.ruby-open-to-left > ul {
                        left: auto;
                        right: auto
                    }

                    ul.ruby-menu > li > ul > li > ul > li > a {
                        background: #e5e5e5;
                        padding: 0 95px
                    }

                        ul.ruby-menu > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > a:hover {
                            background: #e1e1e1
                        }

                    ul.ruby-menu > li > ul > li > ul > li > ul > li > a {
                        background: #efefef;
                        padding: 0 110px
                    }

                        ul.ruby-menu > li > ul > li > ul > li > ul > li:hover > a, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:hover {
                            background: #fff
                        }

                ul.ruby-menu > li.ruby-menu-social > a {
                    border: none
                }

                ul.ruby-menu > li.ruby-menu-mega, ul.ruby-menu > li.ruby-menu-mega-blog, ul.ruby-menu > li.ruby-menu-mega-shop {
                    position: relative
                }

                    ul.ruby-menu > li.ruby-menu-mega > div, ul.ruby-menu > li.ruby-menu-mega-blog > div, ul.ruby-menu > li.ruby-menu-mega-shop > div {
                        position: relative;
                        top: auto;
                        left: auto;
                        border-top: none;
                        -webkit-box-shadow: none;
                        -moz-box-shadow: none;
                        box-shadow: none
                    }

                        ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav {
                            width: 100%;
                            height: auto;
                            left: auto;
                            top: auto
                        }

                            ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li {
                                position: relative
                            }

                                ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a {
                                    line-height: 50px;
                                    padding: 0 75px;
                                    background: #d1d1d1;
                                    color: #222
                                }

                                ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li.ruby-active-menu-item > a {
                                    background: #bcbcbc
                                }

                                ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
                                    position: relative;
                                    width: 100%;
                                    min-height: auto;
                                    left: auto;
                                    top: auto;
                                    z-index: auto
                                }

                                ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li:hover > a {
                                    background: #d9d9d9
                                }

                    ul.ruby-menu > li.ruby-menu-mega-shop > div {
                        position: relative;
                        text-align: left
                    }

                        ul.ruby-menu > li.ruby-menu-mega-shop > div > ul {
                            position: relative;
                            border: none;
                            font-size: 14px;
                            margin-bottom: -1px
                        }

                            ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li {
                                position: relative;
                                display: block;
                                margin-top: -1px
                            }

                                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a {
                                    padding: 0 80px;
                                    line-height: 50px;
                                    max-height: 50px;
                                    text-transform: none;
                                    font-weight: 400;
                                    background: #d1d1d1;
                                    color: #222;
                                    border: none
                                }

                                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li.ruby-active-menu-item > a {
                                    background: #bcbcbc
                                }

                                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li:hover > a, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:hover, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li.ruby-active-menu-item > a {
                                    background: #d9d9d9
                                }

                                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a {
                                    display: block
                                }

                                ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div {
                                    position: relative;
                                    top: 0;
                                    z-index: 9999;
                                    margin: 0
                                }

                ul.ruby-menu > li.ruby-menu-social img {
                    display: inline-table;
                    position: absolute;
                    top: 15px
                }

                ul.ruby-menu > li.ruby-menu-social > a {
                    width: 100%
                }

                ul.ruby-menu > li.ruby-menu-social .fa {
                    position: absolute;
                    top: 17px
                }

                ul.ruby-menu > li.ruby-menu-social span {
                    line-height: 50px;
                    padding: 0 25px
                }

    span.ruby-dropdown-toggle {
        position: absolute;
        width: 50px;
        height: 50px;
        max-width: 50px;
        max-height: 50px;
        left: 0;
        top: 0;
        padding: 10px 17px;
        z-index: 1000000;
        cursor: pointer
    }

        span.ruby-dropdown-toggle:after {
            font-family: "FontAwesome";
            text-decoration: none;
            content: '\f107';
            color: #fff;
            font-size: 25px;
            right: 0
        }

        span.ruby-dropdown-toggle.ruby-dropdown-toggle-rotate {
            -webkit-transform: rotate(180deg);
            -moz-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            transform: rotate(180deg)
        }

    ul.ruby-menu > li > a:before, ul.ruby-menu > li > ul > li > a:before, ul.ruby-menu > li > ul > li > ul > li > a:before, ul.ruby-menu > li > ul > li > ul > li > ul > li > a:before, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:before {
        content: "";
        width: 50px;
        height: 50px;
        background: #333;
        position: absolute;
        left: 0;
        top: 0
    }

    ul.ruby-menu > li > ul > li > a:before, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > a:before, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a:before {
        background: #555
    }

    ul.ruby-menu > li > ul > li > ul > li > a:before {
        background: #777
    }

    ul.ruby-menu > li > ul > li > ul > li > ul > li > a:before {
        background: #999
    }

    ul.ruby-menu > li > ul > li > ul > li > ul, ul.ruby-menu > li > ul > li > ul, ul.ruby-menu > li > ul, ul.ruby-menu, ul.ruby-menu > li.ruby-menu-mega > div, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div, ul.ruby-menu > li.ruby-menu-mega-blog > div, ul.ruby-menu > li.ruby-menu-mega-shop > div {
        max-height: 0;
        transform: scaleY(0);
        overflow: hidden
    }

        ul.ruby-menu > li > ul.ruby-mobile-sublevel-show, ul.ruby-menu > li > ul > li > ul.ruby-mobile-sublevel-show, ul.ruby-menu > li > ul > li > ul > li > ul.ruby-mobile-sublevel-show, ul.ruby-menu.ruby-mobile-sublevel-show, ul.ruby-menu > li.ruby-menu-mega > div.ruby-mobile-sublevel-show, ul.ruby-menu > li.ruby-menu-mega-blog > div.ruby-mobile-sublevel-show, ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div.ruby-mobile-sublevel-show, ul.ruby-menu > li.ruby-menu-mega-shop > div.ruby-mobile-sublevel-show, ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > div.ruby-mobile-sublevel-show {
            max-height: 20000px;
            transform: scaleY(1)
        }

    div.ruby-grid > div.ruby-row div.ruby-row [class^="ruby-col"] {
        margin-top: 0
    }

    div.ruby-grid > div.ruby-row div.ruby-row:first-of-type [class^="ruby-col"] {
        margin-top: 0
    }

    div.ruby-grid.ruby-grid-lined > div.ruby-row:after {
        height: 0
    }

    div.ruby-grid > div.ruby-row > [class^="ruby-col"] {
        padding: 0
    }

        div.ruby-grid > div.ruby-row > [class^="ruby-col"] [class^="ruby-col"] {
            padding-left: 0
        }

            div.ruby-grid > div.ruby-row > [class^="ruby-col"] [class^="ruby-col"]:first-of-type {
                padding-left: 0
            }

    div.ruby-grid > div.ruby-row div.ruby-col-1, div.ruby-grid > div.ruby-row div.ruby-col-2, div.ruby-grid > div.ruby-row div.ruby-col-3, div.ruby-grid > div.ruby-row div.ruby-col-4, div.ruby-grid > div.ruby-row div.ruby-col-5, div.ruby-grid > div.ruby-row div.ruby-col-6, div.ruby-grid > div.ruby-row div.ruby-col-7, div.ruby-grid > div.ruby-row div.ruby-col-8, div.ruby-grid > div.ruby-row div.ruby-col-9, div.ruby-grid > div.ruby-row div.ruby-col-10, div.ruby-grid > div.ruby-row div.ruby-col-11, div.ruby-grid > div.ruby-row div.ruby-col-12 {
        width: 100%;
        padding: 20px 30px
    }

    div.ruby-grid.ruby-grid-lined > div.ruby-row > div[class^="ruby-col"]:after {
        width: 0
    }

    div.ruby-grid img {
        position: relative;
        max-width: 100%;
        height: auto;
        display: block
    }

    div.ruby-grid > div.ruby-row::after {
        content: "";
        display: table;
        clear: both
    }

    .c-hamburger {
        display: block;
        position: relative;
        overflow: hidden;
        margin: 0;
        padding: 0;
        width: 50px;
        height: 50px;
        font-size: 0;
        text-indent: -9999px;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        box-shadow: none;
        border-radius: none;
        border: none;
        cursor: pointer;
        -webkit-transition: background .3s;
        transition: background .3s
    }

        .c-hamburger:focus {
            outline: none
        }

        .c-hamburger span {
            display: block;
            position: absolute;
            top: 24px;
            left: 8px;
            right: 8px;
            height: 3px;
            background: #fff
        }

            .c-hamburger span::before, .c-hamburger span::after {
                position: absolute;
                display: block;
                left: 0;
                width: 100%;
                height: 3px;
                background-color: #fff;
                content: ""
            }

            .c-hamburger span::before {
                top: -10px
            }

            .c-hamburger span::after {
                bottom: -10px
            }

    .c-hamburger--htx {
        background-color: #c19c51
    }

        .c-hamburger--htx span {
            -webkit-transition: background 0 .3s;
            transition: background 0 .3s
        }

            .c-hamburger--htx span::before, .c-hamburger--htx span::after {
                -webkit-transition-duration: 0.3s,.3s;
                transition-duration: 0.3s,.3s;
                -webkit-transition-delay: 0.3s,0;
                transition-delay: 0.3s,0
            }

            .c-hamburger--htx span::before {
                -webkit-transition-property: top,-webkit-transform;
                transition-property: top,transform
            }

            .c-hamburger--htx span::after {
                -webkit-transition-property: bottom,-webkit-transform;
                transition-property: bottom,transform
            }

        .c-hamburger--htx.is-active {
            background-color: #333
        }

            .c-hamburger--htx.is-active span {
                background: none
            }

                .c-hamburger--htx.is-active span::before {
                    top: 0;
                    -webkit-transform: rotate(45deg);
                    -ms-transform: rotate(45deg);
                    transform: rotate(45deg)
                }

                .c-hamburger--htx.is-active span::after {
                    bottom: 0;
                    -webkit-transform: rotate(-45deg);
                    -ms-transform: rotate(-45deg);
                    transform: rotate(-45deg)
                }

                .c-hamburger--htx.is-active span::before, .c-hamburger--htx.is-active span::after {
                    -webkit-transition-delay: 0s,.3s;
                    transition-delay: 0s,.3s
                }

    ul.ruby-menu.ruby-menu-dividers > li, ul.ruby-menu.ruby-menu-dividers > li > a, ul.ruby-menu.ruby-menu-dividers > li.ruby-menu-social > a, ul.ruby-menu.ruby-menu-dividers > li > a:hover, ul.ruby-menu.ruby-menu-dividers > li:hover > a {
        border: none
    }

    div.ruby-wrapper.ruby-menu-transparent > ul.ruby-menu > li.ruby-active-menu-item > a {
        padding-left: 45px
    }

    ul.ruby-menu > li.ruby-menu-social.ruby-menu-search > a {
        display: none
    }
}

@media(min-width: 768px) and (max-width:991px) {
    .ruby-wrapper .hidden-md {
        visibility: hidden;
        display: none
    }

   
    ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav {
        width: 170px
    }

        ul.ruby-menu > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
            width: 590px;
            left: 170px
        }

    ul.ruby-menu.ruby-vertical > li.ruby-menu-mega > div, ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-blog > div, ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-shop > div {
        width: 560px
    }

        ul.ruby-menu.ruby-vertical > li.ruby-menu-mega-blog > div > ul.ruby-menu-mega-blog-nav > li > div {
            width: 360px
        }

    span.ruby-c-date {
        display: none;
        visibility: hidden;
        opacity: 0
    }

    div.ruby-grid > div.ruby-row div.ruby-col-3-md {
        width: 25%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-4-md {
        width: 33.33%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-6-md {
        width: 50%
    }

    div.ruby-grid > div.ruby-row div.ruby-col-12-md {
        width: 100%
    }

    div.ruby-grid.ruby-grid-lined > div.ruby-row:after, div.ruby-grid.ruby-grid-lined > div.ruby-row > div[class^="ruby-col"]:after {
        background: none
    }

    ul.ruby-menu > li.ruby-menu-mega-shop > div > ul > li > a {
        padding: 20px 5px;
        font-size: 12px;
        font-stretch: condensed;
        color: #666
    }
}

.divshopserv{background:#c19c51;padding:1% 23%}
.divshopserv .divshopservin{width:16.5%;float:right;padding:0 4%}
.divshopserv .divshopservin img{width:100%;}

/*MODAL*/
.BtnModal{border-radius:7px;color:#fff;padding:.5% 2%;cursor:pointer;}
.BtnModal:hover{color:#fff}

.BtnModal2{background:#ec6502;border-radius:7px;color:#fff;padding:2% 4%;cursor:pointer;margin:0 auto;display:table;border:none;font-size:1em;font-family:IRANSansWebFaNum;}
.BtnModal2:hover{color:#fff}

.modal .w100{width:100% !important;}
.modal {
  display: none; /* Ocultar modal de forma predeterminada */
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.5);z-index:100000000000}

.modal-content {}
.modal-content .btnR2{padding:1% 5% !important}
.modal-content {
  background-color: #fefefe;
  margin: 15% auto;
  padding: 20px;
  border: 1px solid #888;
  width:30%;
  border-radius: 8px;padding:2% 3%;box-sizing:border-box;
}

.modal .close {
    color: #aaa;
    float: left;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
}

.modal .close:hover,
 .close:focus {
        color: black;
        text-decoration: none;
        cursor: pointer;
    }
/**/

div#divAll div.divContent div.divContent-L{padding:1% 2%;width:75%;float:right;background:#fff;box-shadow:0 2px 48px 0 rgba(0,0,0,.08);border-radius:10px;margin-bottom:1%;}
div#divAll div.divContent div.divContent-L img{width:90%;margin:0 auto;display:block;}
div#divAll div.divContent div.divContent-L2{background:#6ebde7;padding-bottom:0;}
div#divAll div.divContent div.divContent-L2 div.L2R{float:right;background:#fff;box-shadow:0 2px 48px 0 rgba(0,0,0,.08);border-radius:10px;margin-bottom:1%;width:50%;padding:2% 5%}
div#divAll div.divContent div.divContent-L2 img.L2L{float:left;width:30%;}
div#divAll div.divContent div.divContent-L p{text-align:justify;font-size:1em;line-height:2em}
div#divAll div.divContent div.divContent-R{width:23%;float:left;position:sticky;top:10%;padding:1.5% !important;}
div#divAll div.divContent div.divContent-R li{line-height:2.5em;font-size:.9em;}
div#divAll div.divContent div.divContent-RIn{margin-bottom:4%;background:#fff;padding:5% 5.5%;box-shadow:0px 8px 16px rgba(143,144,166,.2), inset 0px 2px 0px #c19c51, inset 0px -2px 0px #c19c51;border-radius:16px}
div#divAll div.divContent div.divContent-RIn span.Arow{font-size:1.1em;font-weight:bold;line-height:3.1em}
div#divAll div.divContent div.divContent-RIn span.Arow::before{background:url('/images/arow.png');margin-left:2%;width:22px;height:35px;content:' ';display:inline-block;vertical-align:middle;}

div#divAll div.divContent div.divContent-L .divContent-LIn h2::before{background:url('/images/arow.png');margin-left:.5%;width:22px;height:35px;content:' ';display:inline-block;vertical-align:middle;}

/*parallax*/
.parallax-inner{padding-top:18%;padding-bottom: 20%;}
.parallax-Back{position:absolute;top:0;right:0;z-index:10;width:100%;height:100%;background:#00000063}
.parallax-p{position:relative;background:url('/images/contact.jpg') repeat fixed 100%;background-size: cover;color: aliceblue;}

div#divContent-contact{width:100%;margin:0 auto;background:#000;}
div#divContent-contact div#divContent-contactIn{width:60%;margin:0 auto;}
div#divContent-contact div#divContent-contactIn h2{font-size:25px !important;line-height:1.4;font-weight:300}
div#divContent-contact div#divContent-contactIn p#p-h2{font-size:15px;text-align:center;color:#606060;padding:0% 10%;line-height:1.4}
div#divContent-contact div#divContent-contactIn h3{font-size:30px !important;color:#34343c;line-height:1.4;font-weight:300;margin-bottom:15px;}
div#divContent-contact div#divContent-contactIn p#p-h3{font-size:15px;text-align:center;color:#606060 !important;line-height:1.4}
div#divContent-contact div#divContent-contactIn div#divContact-Tel{margin:5% 0}
div#divContent-contact div#divContent-contactIn div#divContact-Tel h6{color:#b1adad;font-weight:300;font-size:1em;margin:1.5% 0%;line-height:2.5;text-align:center;}
div#divContent-contact div#divContent-contactIn div#divContact-Tel p{color:#fff;font-weight:300;font-size:.85em;text-align:center;}
div#divContent-contact div#divContent-contactIn div#divContact-Tel span{color:#fff;font-size:1.25em}
div#divContent-contact div#divContent-contactIn div#divContact-Tel div.divPart1{width:33.333%;float:left;}
div#divContent-contact div#divContent-contactIn div#divContact-Tel div.divPart2{width:33.333%;float:left;}
div#divContent-contact div#divContent-contactIn div#divContact-Tel div.divPart3{width:33.333%;float:left;}

div#divContent-contact div#divContent-contactIn div#divLoaction{width:100%}
div#divContent-contact div#divLoaction{width:100%;}
div#divContent-contact div#divLoaction div#divMap{width:60%;float:left;}
div#divContent-contact div#divLoaction div#divForm{width:40%;float:left;position:relative;}
div#divContent-contact div#divLoaction div#divForm h3{color:#fff;font-size:36px !important;font-weight:300;text-align:center;font-family:'Open-Sans' !important;line-height:2}
div#divContent-contact div#divLoaction div#divForm p{color:#fff;font-size:17px;text-align:center;font-weight:300;margin-bottom:2%;}
div#divContent-contact div#divLoaction div#divForm div#divFormIn{width:90%;height:100% !important;position:absolute;top:0;right:0;background:#616161;opacity:.7;padding:5% 5%;}
div#divContent-contact div#divLoaction div#divForm div#divFormIn .txtcontact1{width:44%;font-weight:300;float:left;font-family:'Open-Sans' !important;color:#ffffff;padding: 6px 12px;margin:1% 1%;margin-bottom:2%;background-color: rgba(255, 255, 255, 0.2);font-size: 14px;border-color:#fff;height:25px;border:1px solid #fff;border-radius:4px;}
div#divContent-contact div#divLoaction div#divForm div#divFormIn .txtcontact2{width:94%;color:#ffffff;padding: 6px 12px;margin:1% 1%;background-color: rgba(255, 255, 255, 0.2);margin-bottom:5%;font-size: 14px;border-color:#fff;height:120px;border:1px solid #fff;border-radius:4px;}
div#divContent-contact div#divLoaction div#divForm div#divFormIn .btncontact{text-align:center;margin:0 auto;display:table;font-family:'Open-Sans' !important;color:#ffffff;padding:9px 20px;background-color:transparent;font-size: 14px;border-color:#fff;border:1px solid #fff;border-radius:4px;}
div#divContent-contact div#divLoaction div#divForm img{width:100%;display:block;}



section {
  /*display: flex;*/
  justify-content: center;
}

.card {
    display: inline-block;
    background-color:#b5b5b54d;
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.04);
    border-radius: 8px;
    transition: 0.4s;
    width: 22.2%;
    margin: 1%;
}

.card:hover {
  box-shadow: none;
}
.card:hover .card-image {
  transform: translateX(0px);
  box-shadow: none;
}

.card-image {
  width: 100%;
  height: 256px;
  border-radius: 8px;
  position: relative;
  box-shadow: 16px 4px 24px 0 rgba(0, 0, 0, 0.2);
  transition: 0.4s;
  object-fit: cover;
}

.card-body {
  padding: 8px;
}

.card-title {
  font-size:1em;
  margin: 12px 0;
  transition: 0.4s;
}

.card-content {
  font-size:.85em;
  margin-bottom: 8px;
}



/* Texbox */
.pure-material-textfield-outlined {
    --pure-material-safari-helper1: rgb(var(--pure-material-primary-rgb, 33, 150, 243));
    position: relative;
    display: inline-block;
    padding-top: 6px;
    font-size: 16px;
    line-height: 1;
    overflow: hidden;
    width: 32.333%;
    margin:0 .35%;
}
.pure-material-textfield-outlined100{width:99%;margin:0 .5%;}

/* Input, Textarea */
.pure-material-textfield-outlined > input,
.pure-material-textfield-outlined > textarea {
    box-sizing: border-box;
    margin: 0;
    border: solid 1px; /* Safari */
    border-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.6);
    border-top-color: transparent;
    border-radius: 4px;
    padding: 15px 13px 15px;
    width: 100%;
    height: inherit;
    color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.87);
    background-color: transparent;
    box-shadow: none; /* Firefox */
    font-size: inherit;
    line-height: inherit;
    caret-color: rgb(var(--pure-material-primary-rgb, 33, 150, 243));
    transition: border 0.2s, box-shadow 0.2s;
}


/* Span */
.pure-material-textfield-outlined > input + span,
.pure-material-textfield-outlined > textarea + span {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    border-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.6);
    width: 100%;
    max-height: 100%;
    color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.6);
    font-size:90%;
    line-height: 15px;
    cursor: text;
    transition: color 0.2s, font-size 0.2s, line-height 0.2s;
}
/* Corners */
.pure-material-textfield-outlined > input + span::before,
.pure-material-textfield-outlined > input + span::after,
.pure-material-textfield-outlined > textarea + span::before,
.pure-material-textfield-outlined > textarea + span::after {
    content: "";
    display: block;
    box-sizing: border-box;
    margin-top: 6px;
    border-top: solid 1px;
    border-top-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.6);
    min-width: 10px;
    height: 8px;
    pointer-events: none;
    box-shadow: inset 0 1px transparent;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.pure-material-textfield-outlined > input + span::before,
.pure-material-textfield-outlined > textarea + span::before {
    margin-right: 4px;
    border-left: solid 1px transparent;
    border-radius: 4px 0;
}

.pure-material-textfield-outlined > input + span::after,
.pure-material-textfield-outlined > textarea + span::after {
    flex-grow: 1;
    margin-left: 4px;
    border-right: solid 1px transparent;
    border-radius: 0 4px;
}

/* Hover */
.pure-material-textfield-outlined:hover > input,
.pure-material-textfield-outlined:hover > textarea {
    border-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.87);
    border-top-color: transparent;
}

.pure-material-textfield-outlined:hover > input + span::before,
.pure-material-textfield-outlined:hover > textarea + span::before,
.pure-material-textfield-outlined:hover > input + span::after,
.pure-material-textfield-outlined:hover > textarea + span::after {
    border-top-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.87);
}

.pure-material-textfield-outlined:hover > input:not(:focus):placeholder-shown,
.pure-material-textfield-outlined:hover > textarea:not(:focus):placeholder-shown {
    border-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.87);
}

/* Placeholder-shown */
.pure-material-textfield-outlined > input:not(:focus):placeholder-shown,
.pure-material-textfield-outlined > textarea:not(:focus):placeholder-shown {
    border-top-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.6);
}

.pure-material-textfield-outlined > input:not(:focus):placeholder-shown + span,
.pure-material-textfield-outlined > textarea:not(:focus):placeholder-shown + span {
    font-size: inherit;
    line-height:60px;
}

.pure-material-textfield-outlined > input:not(:focus):placeholder-shown + span::before,
.pure-material-textfield-outlined > textarea:not(:focus):placeholder-shown + span::before,
.pure-material-textfield-outlined > input:not(:focus):placeholder-shown + span::after,
.pure-material-textfield-outlined > textarea:not(:focus):placeholder-shown + span::after {
    border-top-color: transparent;
}

/* Focus */
.pure-material-textfield-outlined > input:focus,
.pure-material-textfield-outlined > textarea:focus {
    border-color: rgb(var(--pure-material-primary-rgb, 33, 150, 243));
    border-top-color: transparent;
    box-shadow: inset 1px 0 var(--pure-material-safari-helper1), inset -1px 0 var(--pure-material-safari-helper1), inset 0 -1px var(--pure-material-safari-helper1);
    outline: none;
}

.pure-material-textfield-outlined > input:focus + span,
.pure-material-textfield-outlined > textarea:focus + span {
    color: rgb(var(--pure-material-primary-rgb, 33, 150, 243));
}

.pure-material-textfield-outlined > input:focus + span::before,
.pure-material-textfield-outlined > input:focus + span::after,
.pure-material-textfield-outlined > textarea:focus + span::before,
.pure-material-textfield-outlined > textarea:focus + span::after {
    border-top-color: var(--pure-material-safari-helper1) !important;
    box-shadow: inset 0 1px var(--pure-material-safari-helper1);
}

/* Disabled */
.pure-material-textfield-outlined > input:disabled,
.pure-material-textfield-outlined > input:disabled + span,
.pure-material-textfield-outlined > textarea:disabled,
.pure-material-textfield-outlined > textarea:disabled + span {
    border-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38) !important;
    border-top-color: transparent !important;
    color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38);
    pointer-events: none;
}

.pure-material-textfield-outlined > input:disabled + span::before,
.pure-material-textfield-outlined > input:disabled + span::after,
.pure-material-textfield-outlined > textarea:disabled + span::before,
.pure-material-textfield-outlined > textarea:disabled + span::after {
    border-top-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38) !important;
}

.pure-material-textfield-outlined > input:disabled:placeholder-shown,
.pure-material-textfield-outlined > input:disabled:placeholder-shown + span,
.pure-material-textfield-outlined > textarea:disabled:placeholder-shown,
.pure-material-textfield-outlined > textarea:disabled:placeholder-shown + span {
    border-top-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38) !important;
}

.pure-material-textfield-outlined > input:disabled:placeholder-shown + span::before,
.pure-material-textfield-outlined > input:disabled:placeholder-shown + span::after,
.pure-material-textfield-outlined > textarea:disabled:placeholder-shown + span::before,
.pure-material-textfield-outlined > textarea:disabled:placeholder-shown + span::after {
    border-top-color: transparent !important;
}

/* Faster transition in Safari for less noticable fractional font-size issue */
@media not all and (min-resolution:.001dpcm) {
    @supports (-webkit-appearance:none) {
        .pure-material-textfield-outlined > input,
        .pure-material-textfield-outlined > input + span,
        .pure-material-textfield-outlined > textarea,
        .pure-material-textfield-outlined > textarea + span,
        .pure-material-textfield-outlined > input + span::before,
        .pure-material-textfield-outlined > input + span::after,
        .pure-material-textfield-outlined > textarea + span::before,
        .pure-material-textfield-outlined > textarea + span::after {
            transition-duration: 0.1s;
        }
    }
}

/*Sucsess Icon*/
.checkmark {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    display: block;
    stroke-width: 2;
    stroke: #4bb71b;
    stroke-miterlimit: 10;
    box-shadow: inset 0px 0px 0px #4bb71b;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
    position:relative;
    top: 5px;
    right: 5px;
   margin: 0 auto;
}
.checkmark__circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: #4bb71b;
    fill: #fff;
    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
 
}

.checkmark__check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes scale {
    0%, 100% {
        transform: none;
    }

    50% {
        transform: scale3d(1.1, 1.1, 1);
    }
}

@keyframes fill {
    100% {
        box-shadow: inset 0px 0px 0px 30px #4bb71b;
    }
}
/*Line Chart Step*/
.c-checkout-steps{display: -webkit-box;display: -ms-flexbox;display: flex;margin: 30px auto 18px;list-style: none;padding: 0;color: #a0a0a0;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;width: 783px;font-size: 13px;font-size: .929rem;line-height: 1.692;}
.c-checkout-steps li.is-completed{color:#e5b365}
.c-checkout-steps li{position: relative;z-index: 1;}
.c-checkout-steps li.is-active .c-checkout-steps__item, .c-checkout-steps li.is-active::before{background-color:#e5b366;}
.c-checkout-steps__item{position: relative;text-align: center;border-radius: 100%;width: 20px;height: 20px;background-color: #d0d0d0;z-index: 1}
.c-checkout-steps__item::before{position: absolute;top: -25px;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);content: attr(data-title);white-space: nowrap;}
.c-checkout-steps li::before{content: "";position: absolute;width: 372px;height: 3px;border-radius: 3.5px;background-color: #d0d0d0;top: 50%;left: 10px;z-index: 0;-webkit-transform: translateY(-50%);transform: translateY(-50%);}
.c-checkout-steps li:first-child::before{display:none}