/* Demo site CSS. Not mobile first, not semantic, not optimized, made for 20 minutes, mess */
html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, ol, ul, li, form, fieldset, legend, label, table, header, footer, nav, section, figure {
  margin: 0;
  padding: 0; 
  list-style: none;
}
figure {
  display: block;
}
html {
  /*overflow-y: scroll;*/
}



* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body {
  color: #282B30;

  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -moz-font-feature-settings: "liga", "kern";

}
/* Install font */
@font-face {
font-family:"Soft Marshmallow";
src:url("../fonts/Soft_Marshmallow.eot?") format("eot"),
url("../fonts/Soft_Marshmallow.woff") format("woff"),
url("../fonts/Soft_Marshmallow.ttf") format("truetype"),
url("../fonts/Soft_Marshmallow.svg#SoftMarshmallow") format("svg");
font-weight:normal;font-style:normal;
}
.site-logo {
  -webkit-text-stroke: 5px #ff00c0;
  color: #fff;
  font-family: "Soft Marshmallow";
  font-size: 60px;
  font-weight: bold;
  text-transform: capitalize;
}
section#portfolio {
  padding-top: 30px;
}
.sec-title{
	-webkit-text-stroke: 5px #ff00c0;
  color: #fff;
  font-family: "Soft Marshmallow";
  font-size: 60px;
  font-weight: bold;
  text-transform: capitalize;
}
/** reset styling **/

.firebugResetStyles {

    z-index: 2147483646 !important;

    top: 0 !important;

    left: 0 !important;

    display: block !important;

    border: 0 none !important;

    margin: 0 !important;

    padding: 0 !important;

    outline: 0 !important;

    min-width: 0 !important;

    max-width: none !important;

    min-height: 0 !important;

    max-height: none !important;

    position: fixed !important;

    transform: rotate(0deg) !important;

    transform-origin: 50% 50% !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    background: transparent none !important;

    pointer-events: none !important;

    white-space: normal !important;

}

style.firebugResetStyles {

    display: none !important;

}



.firebugBlockBackgroundColor {

    background-color: transparent !important;

}



.firebugResetStyles:before, .firebugResetStyles:after {

    content: "" !important;

}

/**actual styling to be modified by firebug theme**/

.firebugCanvas {

    display: none !important;

}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.firebugLayoutBox {

    width: auto !important;

    position: static !important;

}



.firebugLayoutBoxOffset {

    opacity: 0.8 !important;

    position: fixed !important;

}



.firebugLayoutLine {

    opacity: 0.4 !important;

    background-color: #000000 !important;

}



.firebugLayoutLineLeft, .firebugLayoutLineRight {

    width: 1px !important;

    height: 100% !important;

}



.firebugLayoutLineTop, .firebugLayoutLineBottom {

    width: 100% !important;

    height: 1px !important;

}



.firebugLayoutLineTop {

    margin-top: -1px !important;

    border-top: 1px solid #999999 !important;

}



.firebugLayoutLineRight {

    border-right: 1px solid #999999 !important;

}



.firebugLayoutLineBottom {

    border-bottom: 1px solid #999999 !important;

}



.firebugLayoutLineLeft {

    margin-left: -1px !important;

    border-left: 1px solid #999999 !important;

}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.firebugLayoutBoxParent {

    border-top: 0 none !important;

    border-right: 1px dashed #E00 !important;

    border-bottom: 1px dashed #E00 !important;

    border-left: 0 none !important;

    position: fixed !important;

    width: auto !important;

}



.firebugRuler{

    position: absolute !important;

}







.overflowRulerX > .firebugRulerV {

    left: 0 !important;

}

.firebugResetStyles {

    z-index: 2147483646 !important;

    top: 0 !important;

    left: 0 !important;

    display: block !important;

    border: 0 none !important;

    margin: 0 !important;

    padding: 0 !important;

    outline: 0 !important;

    min-width: 0 !important;

    max-width: none !important;

    min-height: 0 !important;

    max-height: none !important;

    position: fixed !important;

    transform: rotate(0deg) !important;

    transform-origin: 50% 50% !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    background: transparent none !important;

    pointer-events: none !important;

    white-space: normal !important;

}

style.firebugResetStyles {

    display: none !important;

}



.firebugBlockBackgroundColor {

    background-color: transparent !important;

}



.firebugResetStyles:before, .firebugResetStyles:after {

    content: "" !important;

}

/**actual styling to be modified by firebug theme**/

.firebugCanvas {

    display: none !important;

}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.firebugLayoutBox {

    width: auto !important;

    position: static !important;

}



.firebugLayoutBoxOffset {

    opacity: 0.8 !important;

    position: fixed !important;

}



.firebugLayoutLine {

    opacity: 0.4 !important;

    background-color: #000000 !important;

}



.firebugLayoutLineLeft, .firebugLayoutLineRight {

    width: 1px !important;

    height: 100% !important;

}



.firebugLayoutLineTop, .firebugLayoutLineBottom {

    width: 100% !important;

    height: 1px !important;

}



.firebugLayoutLineTop {

    margin-top: -1px !important;

    border-top: 1px solid #999999 !important;

}



.firebugLayoutLineRight {

    border-right: 1px solid #999999 !important;

}



.firebugLayoutLineBottom {

    border-bottom: 1px solid #999999 !important;

}



.firebugLayoutLineLeft {

    margin-left: -1px !important;

    border-left: 1px solid #999999 !important;

}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.firebugLayoutBoxParent {

    border-top: 0 none !important;

    border-right: 1px dashed #E00 !important;

    border-bottom: 1px dashed #E00 !important;

    border-left: 0 none !important;

    position: fixed !important;

    width: auto !important;

}



.firebugRuler{

    position: absolute !important;

}



.firebugRulerH {

    top: -15px !important;

    left: 0 !important;

    width: 100% !important;

    height: 14px !important;

    background: url("data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%13%88%00%00%00%0E%08%02%00%00%00L%25a%0A%00%00%00%04gAMA%00%00%D6%D8%D4OX2%00%00%00%19tEXtSoftware%00Adobe%20ImageReadyq%C9e%3C%00%00%04%F8IDATx%DA%EC%DD%D1n%E2%3A%00E%D1%80%F8%FF%EF%E2%AF2%95%D0D4%0E%C1%14%B0%8Fa-%E9%3E%CC%9C%87n%B9%81%A6W0%1C%A6i%9A%E7y%0As8%1CT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AATE9%FE%FCw%3E%9F%AF%2B%2F%BA%97%FDT%1D~K(%5C%9D%D5%EA%1B%5C%86%B5%A9%BDU%B5y%80%ED%AB*%03%FAV9%AB%E1%CEj%E7%82%EF%FB%18%BC%AEJ8%AB%FA'%D2%BEU9%D7U%ECc0%E1%A2r%5DynwVi%CFW%7F%BB%17%7Dy%EACU%CD%0E%F0%FA%3BX%FEbV%FEM%9B%2B%AD%BE%AA%E5%95v%AB%AA%E3E5%DCu%15rV9%07%B5%7F%B5w%FCm%BA%BE%AA%FBY%3D%14%F0%EE%C7%60%0EU%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5JU%88%D3%F5%1F%AE%DF%3B%1B%F2%3E%DAUCNa%F92%D02%AC%7Dm%F9%3A%D4%F2%8B6%AE*%BF%5C%C2Ym~9g5%D0Y%95%17%7C%C8c%B0%7C%18%26%9CU%CD%13i%F7%AA%90%B3Z%7D%95%B4%C7%60%E6E%B5%BC%05%B4%FBY%95U%9E%DB%FD%1C%FC%E0%9F%83%7F%BE%17%7DkjMU%E3%03%AC%7CWj%DF%83%9An%BCG%AE%F1%95%96yQ%0Dq%5Dy%00%3Et%B5'%FC6%5DS%95pV%95%01%81%FF'%07%00%00%00%00%00%00%00%00%00%F8x%C7%F0%BE%9COp%5D%C9%7C%AD%E7%E6%EBV%FB%1E%E0(%07%E5%AC%C6%3A%ABi%9C%8F%C6%0E9%AB%C0'%D2%8E%9F%F99%D0E%B5%99%14%F5%0D%CD%7F%24%C6%DEH%B8%E9rV%DFs%DB%D0%F7%00k%FE%1D%84%84%83J%B8%E3%BA%FB%EF%20%84%1C%D7%AD%B0%8E%D7U%C8Y%05%1E%D4t%EF%AD%95Q%BF8w%BF%E9%0A%BF%EB%03%00%00%00%00%00%00%00%00%00%B8vJ%8E%BB%F5%B1u%8Cx%80%E1o%5E%CA9%AB%CB%CB%8E%03%DF%1D%B7T%25%9C%D5(%EFJM8%AB%CC'%D2%B2*%A4s%E7c6%FB%3E%FA%A2%1E%80~%0E%3E%DA%10x%5D%95Uig%15u%15%ED%7C%14%B6%87%A1%3B%FCo8%A8%D8o%D3%ADO%01%EDx%83%1A~%1B%9FpP%A3%DC%C6'%9C%95gK%00%00%00%00%00%00%00%00%00%20%D9%C9%11%D0%C0%40%AF%3F%EE%EE%92%94%D6%16X%B5%BCMH%15%2F%BF%D4%A7%C87%F1%8E%F2%81%AE%AAvzr%DA2%ABV%17%7C%E63%83%E7I%DC%C6%0Bs%1B%EF6%1E%00%00%00%00%00%00%00%00%00%80cr%9CW%FF%7F%C6%01%0E%F1%CE%A5%84%B3%CA%BC%E0%CB%AA%84%CE%F9%BF)%EC%13%08WU%AE%AB%B1%AE%2BO%EC%8E%CBYe%FE%8CN%ABr%5Dy%60~%CFA%0D%F4%AE%D4%BE%C75%CA%EDVB%EA(%B7%F1%09g%E5%D9%12%00%00%00%00%00%00%00%00%00H%F6%EB%13S%E7y%5E%5E%FB%98%F0%22%D1%B2'%A7%F0%92%B1%BC%24z3%AC%7Dm%60%D5%92%B4%7CEUO%5E%F0%AA*%3BU%B9%AE%3E%A0j%94%07%A0%C7%A0%AB%FD%B5%3F%A0%F7%03T%3Dy%D7%F7%D6%D4%C0%AAU%D2%E6%DFt%3F%A8%CC%AA%F2%86%B9%D7%F5%1F%18%E6%01%F8%CC%D5%9E%F0%F3z%88%AA%90%EF%20%00%00%00%00%00%00%00%00%00%C0%A6%D3%EA%CFi%AFb%2C%7BB%0A%2B%C3%1A%D7%06V%D5%07%A8r%5D%3D%D9%A6%CAu%F5%25%CF%A2%99%97zNX%60%95%AB%5DUZ%D5%FBR%03%AB%1C%D4k%9F%3F%BB%5C%FF%81a%AE%AB'%7F%F3%EA%FE%F3z%94%AA%D8%DF%5B%01%00%00%00%00%00%00%00%00%00%8E%FB%F3%F2%B1%1B%8DWU%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*UiU%C7%BBe%E7%F3%B9%CB%AAJ%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5J%95*U%AAT%A9R%A5*%AAj%FD%C6%D4%5Eo%90%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5%86%AF%1B%9F%98%DA%EBm%BBV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%ADV%AB%D5j%B5Z%AD%D6%E4%F58%01%00%00%00%00%00%00%00%00%00%00%00%00%00%40%85%7F%02%0C%008%C2%D0H%16j%8FX%00%00%00%00IEND%AEB%60%82") repeat-x !important;

    border-top: 1px solid #BBBBBB !important;

    border-right: 1px dashed #BBBBBB !important;

    border-bottom: 1px solid #000000 !important;

}



.firebugRulerV {

    top: 0 !important;

    left: -15px !important;

    width: 14px !important;

    height: 100% !important;

    background: url("data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%00%0E%00%00%13%88%08%02%00%00%00%0E%F5%CB%10%00%00%00%04gAMA%00%00%D6%D8%D4OX2%00%00%00%19tEXtSoftware%00Adobe%20ImageReadyq%C9e%3C%00%00%06~IDATx%DA%EC%DD%D1v%A20%14%40Qt%F1%FF%FF%E4%97%D9%07%3BT%19%92%DC%40(%90%EEy%9A5%CB%B6%E8%F6%9Ac%A4%CC0%84%FF%DC%9E%CF%E7%E3%F1%88%DE4%F8%5D%C7%9F%2F%BA%DD%5E%7FI%7D%F18%DDn%BA%C5%FB%DF%97%BFk%F2%10%FF%FD%B4%F2M%A7%FB%FD%FD%B3%22%07p%8F%3F%AE%E3%F4S%8A%8F%40%EEq%9D%BE8D%F0%0EY%A1Uq%B7%EA%1F%81%88V%E8X%3F%B4%CEy%B7h%D1%A2E%EBohU%FC%D9%AF2fO%8BBeD%BE%F7X%0C%97%A4%D6b7%2Ck%A5%12%E3%9B%60v%B7r%C7%1AI%8C%BD%2B%23r%00c0%B2v%9B%AD%CA%26%0C%1Ek%05A%FD%93%D0%2B%A1u%8B%16-%95q%5Ce%DCSO%8E%E4M%23%8B%F7%C2%FE%40%BB%BD%8C%FC%8A%B5V%EBu%40%F9%3B%A72%FA%AE%8C%D4%01%CC%B5%DA%13%9CB%AB%E2I%18%24%B0n%A9%0CZ*Ce%9C%A22%8E%D8NJ%1E%EB%FF%8F%AE%CAP%19*%C3%BAEKe%AC%D1%AAX%8C*%DEH%8F%C5W%A1e%AD%D4%B7%5C%5B%19%C5%DB%0D%EF%9F%19%1D%7B%5E%86%BD%0C%95%A12%AC%5B*%83%96%CAP%19%F62T%86%CAP%19*%83%96%CA%B8Xe%BC%FE)T%19%A1%17xg%7F%DA%CBP%19*%C3%BA%A52T%86%CAP%19%F62T%86%CA%B0n%A9%0CZ%1DV%C6%3D%F3%FCH%DE%B4%B8~%7F%5CZc%F1%D6%1F%AF%84%F9%0F6%E6%EBVt9%0E~%BEr%AF%23%B0%97%A12T%86%CAP%19%B4T%86%CA%B8Re%D8%CBP%19*%C3%BA%A52huX%19%AE%CA%E5%BC%0C%7B%19*CeX%B7h%A9%0C%95%E1%BC%0C%7B%19*CeX%B7T%06%AD%CB%5E%95%2B%BF.%8F%C5%97%D5%E4%7B%EE%82%D6%FB%CF-%9C%FD%B9%CF%3By%7B%19%F62T%86%CA%B0n%D1R%19*%A3%D3%CA%B0%97%A12T%86uKe%D0%EA%B02*%3F1%99%5DB%2B%A4%B5%F8%3A%7C%BA%2B%8Co%7D%5C%EDe%A8%0C%95a%DDR%19%B4T%C66%82fA%B2%ED%DA%9FC%FC%17GZ%06%C9%E1%B3%E5%2C%1A%9FoiB%EB%96%CA%A0%D5qe4%7B%7D%FD%85%F7%5B%ED_%E0s%07%F0k%951%ECr%0D%B5C%D7-g%D1%A8%0C%EB%96%CA%A0%A52T%C6)*%C3%5E%86%CAP%19%D6-%95A%EB*%95q%F8%BB%E3%F9%AB%F6%E21%ACZ%B7%22%B7%9B%3F%02%85%CB%A2%5B%B7%BA%5E%B7%9C%97%E1%BC%0C%EB%16-%95%A12z%AC%0C%BFc%A22T%86uKe%D0%EA%B02V%DD%AD%8A%2B%8CWhe%5E%AF%CF%F5%3B%26%CE%CBh%5C%19%CE%CB%B0%F3%A4%095%A1%CAP%19*Ce%A8%0C%3BO*Ce%A8%0C%95%A12%3A%AD%8C%0A%82%7B%F0v%1F%2FD%A9%5B%9F%EE%EA%26%AF%03%CA%DF9%7B%19*Ce%A8%0C%95%A12T%86%CA%B8Ze%D8%CBP%19*Ce%A8%0C%95%D1ae%EC%F7%89I%E1%B4%D7M%D7P%8BjU%5C%BB%3E%F2%20%D8%CBP%19*Ce%A8%0C%95%A12T%C6%D5*%C3%5E%86%CAP%19*Ce%B4O%07%7B%F0W%7Bw%1C%7C%1A%8C%B3%3B%D1%EE%AA%5C%D6-%EBV%83%80%5E%D0%CA%10%5CU%2BD%E07YU%86%CAP%19*%E3%9A%95%91%D9%A0%C8%AD%5B%EDv%9E%82%FFKOee%E4%8FUe%A8%0C%95%A12T%C6%1F%A9%8C%C8%3D%5B%A5%15%FD%14%22r%E7B%9F%17l%F8%BF%ED%EAf%2B%7F%CF%ECe%D8%CBP%19*Ce%A8%0C%95%E1%93~%7B%19%F62T%86%CAP%19*Ce%A8%0C%E7%13%DA%CBP%19*Ce%A8%0CZf%8B%16-Z%B4h%D1R%19f%8B%16-Z%B4h%D1R%19%B4%CC%16-Z%B4h%D1R%19%B4%CC%16-Z%B4h%D1%A2%A52%CC%16-Z%B4h%D1%A2%A52h%99-Z%B4h%D1%A2%A52h%99-Z%B4h%D1%A2EKe%98-Z%B4h%D1%A2EKe%D02%5B%B4h%D1%A2EKe%D02%5B%B4h%D1%A2E%8B%96%CA0%5B%B4h%D1%A2E%8B%96%CA%A0e%B6h%D1%A2E%8B%96%CA%A0e%B6h%D1%A2E%8B%16-%95a%B6h%D1%A2E%8B%16-%95A%CBl%D1%A2E%8B%16-%95A%CBl%D1%A2E%8B%16-Z*%C3l%D1%A2E%8B%16-Z*%83%96%D9%A2E%8B%16-Z*%83%96%D9%A2E%8B%16-Z%B4T%86%D9%A2E%8B%16-Z%B4T%06-%B3E%8B%16-Z%B4T%06-%B3E%8B%16-Z%B4h%A9%0C%B3E%8B%16-Z%B4h%A9%0CZf%8B%16-Z%B4h%A9%0CZf%8B%16-Z%B4h%D1R%19f%8B%16-Z%B4h%D1R%19%B4%CC%16-Z%B4h%D1R%19%B4%CC%16-Z%B4h%D1%A2%A52%CC%16-Z%B4h%D1%A2%A52h%99-Z%B4h%D1%A2%A52h%99-Z%B4h%D1%A2EKe%98-Z%B4h%D1%A2EKe%D02%5B%B4h%D1%A2EKe%D02%5B%B4h%D1%A2E%8B%96%CA0%5B%B4h%D1%A2E%8B%96%CA%A0e%B6h%D1%A2E%8B%96%CA%A0e%B6h%D1%A2E%8B%16-%95a%B6h%D1%A2E%8B%16-%95A%CBl%D1%A2E%8B%16-%95A%CBl%D1%A2E%8B%16-Z*%C3l%D1%A2E%8B%16-Z*%83%96%D9%A2E%8B%16-Z*%83%96%D9%A2E%8B%16-Z%B4T%86%D9%A2E%8B%16-Z%B4T%06-%B3E%8B%16-Z%B4T%06-%B3E%8B%16-Z%B4h%A9%0C%B3E%8B%16-Z%B4h%A9%0CZf%8B%16-Z%B4h%A9%0CZf%8B%16-Z%B4h%D1R%19f%8B%16-Z%B4h%D1R%19%B4%CC%16-Z%B4h%D1R%19%B4%CC%16-Z%B4h%D1%A2%A52%CC%16-Z%B4h%D1%A2%A52h%99-Z%B4h%D1%A2%A52h%99-Z%B4h%D1%A2EKe%98-Z%B4h%D1%A2EKe%D02%5B%B4h%D1%A2EKe%D02%5B%B4h%D1%A2E%8B%96%CA0%5B%B4h%D1%A2E%8B%96%CA%A0e%B6h%D1%A2E%8B%96%CA%A0e%B6h%D1%A2E%8B%16-%95a%B6h%D1%A2E%8B%16-%95A%CBl%D1%A2E%8B%16-%95A%CBl%D1%A2E%8B%16-Z*%C3l%D1%A2E%8B%16-Z*%83%96%D9%A2E%8B%16-Z*%83%96%D9%A2E%8B%16-Z%B4T%86%D9%A2E%8B%16-Z%B4T%06-%B3E%8B%16-Z%B4%AE%A4%F5%25%C0%00%DE%BF%5C'%0F%DA%B8q%00%00%00%00IEND%AEB%60%82") repeat-y !important;

    border-left: 1px solid #BBBBBB !important;

    border-right: 1px solid #000000 !important;

    border-bottom: 1px dashed #BBBBBB !important;

}



.overflowRulerX > .firebugRulerV {

    left: 0 !important;

}



.overflowRulerY > .firebugRulerH {

    top: 0 !important;

}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.fbProxyElement {

    position: fixed !important;

    pointer-events: auto !important;

}


.overflowRulerY > .firebugRulerH {

    top: 0 !important;

}



/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.fbProxyElement {

    position: fixed !important;

    pointer-events: auto !important;

}

/*code {
  background: #F8F8F8;
  padding: .1em .4em;
  color: #c82829;
  font-size: 14px;
}*/
code, pre {
  font-family:  Menlo, Monaco, monospace;
  font-size: 12px;
  line-height: 1.45;
  color: #333;
  tab-size: 4;
}
pre {
  padding: 0;
  margin: 0;
  overflow: auto;
  
  word-wrap: normal;

  text-rendering: auto;
  -webkit-font-smoothing: auto;
}
code {
  padding: 0;
  padding: 3px 5px;
  margin: 0;
  background: #f2f2f2;
  border-radius: 2px;
}
pre code {
  background: none;
  padding: 0;
  border-radius: 0;

  
}
h3 code {
  font-size: 22px;
  font-weight: normal;
  padding: 6px 10px;
}
h3 code.default {
  font-size: 12px;
  padding: 0;
  background: none;
  opacity: 0.7;
}

.docs p {
  margin: 0;
  padding-bottom: 12px;
  padding-top: 12px;
}
.docs h1 {
  margin-bottom: 32px;
}
.docs h1 a {
  text-decoration: none;
}
.docs h1 a:hover {
  text-decoration: underline;
}
.docs h2 {
  margin: 0;
  margin: 36px 0 12px;
}
.docs h3 {
  margin: 0;
  margin: 24px 0 8px 0;
  font-size: 22px;
  line-height: 28px;
}
.docs ul,
.docs ol {
  margin-top: 8px;
  margin-bottom: 8px;
}
.docs li {
  margin: 0;
  padding: 4px 0;
}

.docs-menu {
  position: absolute;
  width: 160px;
  left: 0;
  top: 106px;
  
}

.docs-menu ul {
  list-style: none;
  margin: 0;
  padding: 25px 0;

  border-top: 1px solid #CCC;
  border-bottom: 1px solid #CCC;
}

.docs-menu__ad {
  padding: 25px 10px;
  border-bottom: 1px solid #CCC;
  font-size: 13px;
  line-height: 17px;
  position: relative;
}
.docs-menu a {
  text-decoration: none;
  width: 100%;
}
a.docs-logo {
  font-weight: 600;
  font-size: 20px;
  margin-bottom: 0;
  text-decoration: none;
}
.docs-menu li {
  list-style: none;
  margin: 0;
  padding:0;
}
a.docs-menu__item--active {
  color: #222;
  font-weight: normal;
}

.codepen-embed {
  margin-left: -30px;
  padding: 16px 30px;
  width: 100%;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  background-color: #f8f8f8;
  height: 600px;
  
}
.codepen-embed--disabled {
  height: auto;
}
.codepen-embed p {
  margin-bottom: 0;
}

.docs .highlight {
  border-radius: 2px;
  margin-left: -30px;
padding: 16px 30px;
width: 100%;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
margin-bottom: 26px;
}




/* Syntax highlighter styles (for docs) */
.highlight { background-color: #f8f8f8 }
.c { color: #888; } /* Comment */
.err { color: #a61717; background-color: #e3d2d2 } /* Error */
.k { color: #a71d5d; } /* Keyword */
.o { color: #000000; } /* Operator */
.cm { color: #888; } /* Comment.Multiline */
.cp { color: #888; font-weight: bold;} /* Comment.Preproc */
.c1 { color: #888;  } /* Comment.Single */
.cs { color: #888; font-weight: bold; } /* Comment.Special */
.gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
.ge { color: #000000; } /* Generic.Emph */
.gr { color: #aa0000 } /* Generic.Error */
.gh { color: #888 } /* Generic.Heading */
.gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
.go { color: #888888 } /* Generic.Output */
.gp { color: #555555 } /* Generic.Prompt */
.gs { font-weight: bold } /* Generic.Strong */
.gu { color: #aaaaaa } /* Generic.Subheading */
.gt { color: #aa0000 } /* Generic.Traceback */
.kc { color: #0086b3; } /* Keyword.Constant */
.kd { color: #a71d5d; } /* Keyword.Declaration */
.kn { color: #000000; font-weight: bold } /* Keyword.Namespace */
.kp { color: #000000; font-weight: bold } /* Keyword.Pseudo */
.kr { color: #000000; font-weight: bold } /* Keyword.Reserved */
.kt { color: #795da3; } /* Keyword.Type */
.m { color: #009999 } /* Literal.Number */
.s { color: #df5000 } /* Literal.String */
.na { color: #a71d5d } /* Name.Attribute */
.nb { color: #0086B3 } /* Name.Builtin */
.nc { color: #795da3; } /* Name.Class */
.no { color: #a71d5d } /* Name.Constant */
.nd { color: #3c5d5d; font-weight: bold } /* Name.Decorator */
.ni { color: #800080 } /* Name.Entity */
.ne { color: #990000; font-weight: bold } /* Name.Exception */
.nf { color: #990000; font-weight: bold } /* Name.Function */
.nl { color: #990000; font-weight: bold } /* Name.Label */
.nn { color: #555555 } /* Name.Namespace */
.nt { color: #0086b3 } /* Name.Tag */
.nv { color: #a71d5d } /* Name.Variable */
.ow { color: #000000; font-weight: bold } /* Operator.Word */
.w { color: #bbbbbb } /* Text.Whitespace */
.mf { color: #009999 } /* Literal.Number.Float */
.mh { color: #009999 } /* Literal.Number.Hex */
.mi { color: #009999 } /* Literal.Number.Integer */
.mo { color: #009999 } /* Literal.Number.Oct */
.sb { color: #df5000 } /* Literal.String.Backtick */
.sc { color: #df5000 } /* Literal.String.Char */
.sd { color: #df5000 } /* Literal.String.Doc */
.s2 { color: #df5000 } /* Literal.String.Double */
.se { color: #df5000 } /* Literal.String.Escape */
.sh { color: #df5000 } /* Literal.String.Heredoc */
.si { color: #df5000 } /* Literal.String.Interpol */
.sx { color: #df5000 } /* Literal.String.Other */
.sr { color: #009926 } /* Literal.String.Regex */
.s1 { color: #df5000 } /* Literal.String.Single */
.ss { color: #990073 } /* Literal.String.Symbol */
.bp { color: #888 } /* Name.Builtin.Pseudo */
.vc { color: #a71d5d } /* Name.Variable.Class */
.vg { color: #a71d5d } /* Name.Variable.Global */
.vi { color: #a71d5d } /* Name.Variable.Instance */
.il { color: #009999 } /* Literal.Number.Integer.Long */


.language-css .k {
  color: #0086b3;
}
.language-css .nt {
  color: #63a35c;
}

.demo-gallery img
{
border-radius:15px;
}


/*body.open-sans {
  font-family: "open-sans";
}
.futura-pt {

}
.futura-pt p {
  font-family: "adelle";
}
.futura-pt h1, .futura-pt h2 {
  font-family: "futura-pt";
  text-transform: uppercase;
}
.futura-pt h3 {
  font-weight: bold;
}
*/


img {
  width: auto;
  max-width: 100%;
  height: auto;
  border: 0;
}


.video {
  width: 100%%;
  margin: 0 0 24px 0;
}
.video__container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  padding-top: 35px;
  height: 0;
  overflow: hidden;
}
.video__container iframe {
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}
.video-desc {
  width: 100%;
  max-width: 740px;
  margin: 12px auto;
}



.row--heading {
  position: relative;
}
.section--head p {
  text-align: left;
  font-size: 26px;
  line-height: 32px;
  margin-bottom: 24px;

   font-size: 19px;
  line-height: 29px;
  
}


.section--head .github-button {
  position: absolute;
  right:0;
  top:0;
}
.row--nav {
  text-align: center;
  font-size: 32px;
  line-height: 1.1; 
}
.navigation {
  width: 100%;
  background: #F7F7F7;
  position: relative;
  padding: 30px 0;
}
.navigation a {
  text-decoration: none;
  border-bottom: 1px solid #92ABCD;
}

a.twitter-nav-link {
  border: 0;
  margin: 0 0.2em;
}
.twitter-nav-link span {
  border-bottom: 1px solid #92ABCD;
}
.navigation a:hover,
.twitter-nav-link:hover span {
  border-bottom-color: #C00;
}
.twitter-nav-link:before {
  content: '';
  background: url('../test/twitter.svg');
  display: inline-block;
  width: 0.8em;
  height: 0.8em;
  background-size: 0.7em 0.7em;
  background-repeat: no-repeat;
  background-position: 0 0.1em;
  margin-right: 0.1em;
}


span.highlight {
  background:rgb(246, 243, 226);
}
.title-block p {
    font-size: 22px;
  line-height: 28px;
  max-width: 600px;
  margin-bottom: 24px;

}

ul.text-list {
  color: #444;
}
.section--head p,
.title-block p {
  color: #666;
}




.title-block p {
  font-size: 19px;
  line-height: 29px;
}






.docs {
  margin-top: 60px;
}



.row--docs {
  max-width: 960px;
  padding-left: 210px;
}
.row--heading {
  margin-top: 0;
  margin-bottom: 0;
}
.row--footer {
  text-align: center;
  padding: 132px 0;
}
.row--wide {
  max-width: 1000px;
}
.row--video {
  max-width: 1160px;
}

.row--wide img {
  float: left;
  margin: 0 12px 12px 0;
  width: 200px;
}
img.img--with_border {
  border: 1px solid #DDD;
  border-radius: 2px;
}
.img-desc {
  margin-left: 212px;
}




/*.main-wrapper {
  background: none;
	width: 100%;
  padding-top: 0;
  
}
.content-wrap {
  


}*/


/* clearfix */
.row:after{
  content: " "; 
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}
.row--large {
  margin-bottom: 48px;
}


.section--head h1 a {
  vertical-align: super;
  font-size: 14px;
  text-decoration: none;
}

/*p.intro {
  margin-top: 24px;
  font-size: 18px;
  line-height: 24px;
}*/







.col-50 {
  width: 48%;
  float: left;
}
.col-50:nth-child(1) {
  margin-right: 4%;
}
.col-img {
  width: auto;
  max-width: 100%;
  height: auto;
}

.style-select {
  width: 100%;
  float: left;
}
.style-select .radio {
  position: relative;
  margin-bottom: 12px;
  display: block;
  float: left;
  width: 100%;
}
.style-select label {
  padding-left: 24px;
  position: relative;
  display: block;
  cursor: pointer;
}
.style-select input {
  position: absolute;
  left:0;
  top:0;
  width:24px;
  height:24px;
  overflow:hidden;
  margin:0;
  padding:0;
  border:0;
  outline:0;
  opacity:0;
  cursor: pointer;
  
}
.style-select input + label:before {
  content: '';
  position: absolute;
  left:0;
  top:4px;
  background: none;
  border-radius: 50%;
  width:16px;
  height:16px;
  box-sizing: border-box;
  border: 2px solid rgba(0,0,0,0.6);
}
.radio:hover label:before {
  border-color: #3169B3;
}
.style-select input:checked + label:before {
  border-color: #3169B3;
}
.style-select input:checked + label:after {
  content: '';
  position: absolute;
  left: 5px;
  top: 9px;
  width:6px;
  height: 6px;
  background: #3169B3;
  border-radius: 50%;
}

/*.section--developers {
  color: #FFF;
  background: #222;
  background: #1f1f1f;
  padding: 80px 0;
}
.section--developers a {
  color:#FFFFFF;
}
.section--developers p,
.section--developers  ul.text-list {
  color: #ddd;
}
.section--developers .section--head p,
.section--developers .title-block p {
  color: #ddd;
}*/

.row--modules ul {
  list-style: none;
  margin-left: 0;
  /*color: rgba(255, 255, 255, 0.8);*/
}
.row--modules span {
  font-wight:600;
  border-left:5px solid #FFF;
  padding-left:5px;
  margin-left:-10px;
}

.size-chart {
  width: 100%;
  display: inline-block;
}

.size-chart div {
  height: 21px;
  float: left;
  font-size: 13px;
  padding: 4px;
  line-height: 1;
}

.block__ui-separated {
  position: relative;
}
.block__ui-separated .col-50 {
  position: absolute;
  left: 0;
  top:12px;
}
.block__ui-separated img {
  float: right;
  max-width: 450px;
}


.demo-gallery {
  width: 100%;
  height: auto;
  float: left;
}
.demo-gallery a {
  display: block;
  float: left;
  line-height: 0;
  margin-bottom: 30px;
  padding: 0 15px;
  width: 50%;
}


a.demo-gallery__img--main {
  width: auto;
  height: auto;
}

.ukraine-flag {
  width: 21px;
  height: 14px;
  position: relative;
  background: #ffcc00;
  top: 1px;
  display: inline-block;
}
.ukraine-flag:before {
 content:'';
 position: absolute;
 width: 21px;
 height: 7px;
 left:0;
 top:0;
 background: #0066cc;
}

.demo-gallery figure {
  display: none;
}
.demo-gallery__title {
  line-height: 14px;
  font-size: 14px;
  opacity: 0.8;
  margin-top: 5px;
  width: 100%;
  float: left;
}

.share-buttons h2 {
  text-align: center;
  border: 0;
  
}
.share-buttons {
  text-align: center;
  position: relative;
  margin: 0 0 24px;
}
.share-buttons a {
  -moz-border-radius: 2px;
  border-radius: 2px;
  display: inline-block;
  padding: 10px 20px;
  margin: 10px;
  color: #FFF;
  text-decoration: none;
  background: #5AAF63;
  font-size: 16px;
  line-height: 22px;
  cursor: pointer;
}
.share-buttons a:hover {
  opacity: 0.7;
}
#tweet {
  background: #0096c4;
}
#like {
  background: #3b5998;
}
#gplus {
  background: #d34836;
}



@media screen and (max-width: 1000px) {

 

  .row--wide {
    max-width: 800px;
  }
  .row--wide img {
    float: none;
  }
  .img-desc {
    margin-left: 0;
  }
 

  .row--docs {
    max-width: 800px;
    padding-left: 30px;

  }
  
  .section--head {
    margin-top:0;
    padding: 30px 0;
  }

  .docs {
    margin-top: 48px;
  }

  .docs-menu {
    position: relative;
    margin: 15px 0;
    left:0;
    top:0;
  }
  .docs-menu  ul {
    position: relative;
  }
  .docs-menu__ad {
    display: none;
  }

  .row--nav {
    font-size: 24px;
    line-height: 1.1; 
  }

}



@media screen and (max-width: 650px) {
   h1 {
    font-size: 40px;
  }
  .block__ui-separated .col-50 {
    position: relative;
    top: 0;
  }
  .block__ui-separated img {
    max-width: 100%;
    width: 100%;
    float: left;
  }
}

@media screen and (max-width: 450px) {
  

  .col-50:nth-child(1) {
    margin-right: 0;
  }
  .row--wide img {
    margin-bottom: 6px;
  }
  .col-50 {
    width: 100%;
    margin-bottom: 12px;
  }
  .row {
    padding: 0 18px;
  }
  .docs .highlight,
  .codepen-embed {
    padding-left: 18px;
    padding-right: 18px;
    margin-left: -18px;
  }
 
  .docs {
    margin-top: 32px;
  }
  .section--head {
    margin-top:0;
    padding: 24px 0;
  }
  .row--nav {
    font-size: 18px;
    line-height: 26px; 
  }


}

@media screen and (max-width: 700px) {

  .row--nav {
    font-size: 18px;
    line-height: 26px; 
  }

 /* .demo-gallery {
    max-width: 500px;
  } */
  a.demo-gallery__img--main {
    width: 164px;
  }
  .section--head p {
    font-size: 18px;
    line-height: 24px;
  }
}

/*@media screen and (max-width: 490px) {
  .demo-gallery a {
    width: 100px;
    margin: 0 4px 4px 0;
  }
  a.demo-gallery__img--main {
    width: 137px;
  }
}
*/


@media screen and (max-width: 450px) {
  a.demo-gallery__img--main {
    width: 127px;
  }
}


@media screen and (max-width: 350px) {
  a.demo-gallery__img--main {
    width: 109px;
  }
}

.title-background {
  font-family: "Soft Marshmallow";
  color:white;
  text-transform: none;
  -webkit-text-stroke-width:10px;
  -webkit-text-stroke-color:#ff00c0;
  position: absolute;
  z-index: 0;
}

.title {
  font-family: "Soft Marshmallow";
  color:white;
  text-transform: none;
  position: absolute;
  z-index: 1;
}

.navbar-default .navbar-collapse, .navbar-default .navbar-form {
  border-color: #000 !important;
}