﻿body
{
    margin:0px;
    padding:0px;
    background-color:#ffffff;
}
header
{
    width:100%;/*100% her monitöre uygun*//*genişlik*/
    height:100px;
    /*position:relative;*/
    float:left;
    background-color:#ffffff;
}
.header-continer
{
    width:250px;
    height:100px;
    float:left;
    background-color:#ffffff;
    position:absolute;
    top:10px;
    left:120px;
}
.header-continer-two
{
    width:190px;
    height:120px;
    float:right;
    background-color:#ffffff;
    position:absolute;
    top:10px;
    right:50px;
}
.logo
{
    width:100px;
    height:100px;
    margin:10px 0px;
    float:left;
    position:absolute;
    left:120px;
}
.logo2
{
    width:100px;
    height:130px;
    float:right;
    position:absolute;
    right:0px;
}
/*içerik*/
#section
{
    width:100%;
    height:auto;
    float:left;
}
.section-container1
{
    width:200px;
    height:500px;
    position:absolute;
    top:130px;
    left:200px;
    margin:0 auto; 
    background-image: url(../image/1pen.jpg);
    color:transparent;
    border-radius:10px 10px;
    box-shadow:0 0 0 100px inset,0 0 5px grey;
    transition:box-shadow 1s;    
}
.section-container1::after
{
  white-space:pre; 
  font:15pt 'sigmar one';
  color:white;
  border:2px solid;
  text-align:center;
  display: flex;
  justify-content: center;
  align-items: center;
  transition:opacity 1s .5s;
}
.section-container1:hover
{
    box-shadow:0 0 0 5px inset,0 0 5px #43A047,0 0 10px #43A047 inset;
    transition:box-shadow 1s;
}
.section-container1:hover::after
{
    opacity:0;
    transition:opacity .5s;
}
.section-container1-container
{
    width:200px;
    height:50px;
    position:absolute;
    top:440px;
    margin:0 auto;
    /*background:radial-gradient(#43A047,#0A3C47 110px);
    background:radial-gradient(#ffffff,#000000 110px);
    background:radial-gradient(#ffffff,#bebbbb 110px);*/
}
.section-container1-container a
{
    text-decoration:none;
    text-align:center;
    font-size:20px;
    font-family:Arial;
    color:#43A047;  
    width:200px;
    float:left;
    height:50px;
    line-height:50px;
    transition:ease-in 0.5s;
}
.section-container1-container a:hover
{
    width:200px;
    height:50px;
    color:#43A047;
}
.section-container2
{
    width:200px;
    height:500px;
    position:absolute;
    top:130px;
    left:420px;
    margin:0 auto;
    background-image:url(../image/2pen.jpg); 
    color:transparent;
    border-radius:10px 10px;
    box-shadow:0 0 0 100px inset,0 0 5px grey;
    transition:box-shadow 1s; 
    align-items:center;   
}
.section-container2::after
{
  white-space:pre; 
  font:15pt 'sigmar one';
  color:white;
  border:2px solid;
  transition:opacity 1s .5s;
  text-align:center;
}
.section-container2:hover
{
    box-shadow:0 0 0 5px inset,0 0 5px #43A047,0 0 10px #43A047 inset;
    transition:box-shadow 1s;
}
.section-container2:hover::after
{
    opacity:0;
    transition:opacity .5s;
}
.section-container2-container
{
    width:200px;
    height:50px;
    position:absolute;
    top:440px;
    margin:0 auto;
    /*background:radial-gradient(#43A047,#0A3C47 110px);
    /*background:radial-gradient(#ffffff,#000000 110px);*/
    /*background:radial-gradient(#ffffff,#bebbbb 110px);*/
}
.section-container2-container a
{
    /*padding:10px 20px;*/
    text-decoration:none;
    text-align:center;
    font-size:20px;
    font-family:Arial;
    color:#43A047;
    width:200px;
    float:left;
    height:50px;
    line-height:50px;
    transition:ease-in 0.5s;
}
.section-container2-container a:hover
{
    width:200px;
    height:50px;
    color:#43A047;
}
.section-container3
{
    width:200px;
    height:500px;
    position:absolute;
    top:130px;
    left:640px;
    margin:0 auto;
    background-image:url(../image/3pen.jpg);
    color:transparent;
    border-radius:10px 10px;
    box-shadow:0 0 0 100px inset,0 0 5px grey;
    transition:box-shadow 1s; 
    align-items:center;   
}
.section-container3::after
{
  white-space:pre; 
  font:15pt 'sigmar one';
  color:white;
  border:2px solid;
  transition:opacity 1s .5s;
  text-align:center;
}
.section-container3:hover
{
    box-shadow:0 0 0 5px inset,0 0 5px #43A047,0 0 10px #43A047 inset;
    transition:box-shadow 1s;
}
.section-container3:hover::after
{
    opacity:0;
    transition:opacity .5s;
}
.section-container3-container
{
    width:200px;
    height:50px;
    position:absolute;
    top:440px;
    margin:0 auto;
}
.section-container3-container a
{
    text-decoration:none;
    text-align:center;
    font-size:20px;
    font-family:Arial;
    color:#43A047;
    width:200px;
    float:left;
    height:50px;
    line-height:50px;
    transition:ease-in 0.5s;
}
.section-container3-container a:hover
{
    width:200px;
    height:50px;
    color:#43A047;
}
.section-container4
{
    width:200px;
    height:500px;
    position:absolute;
    top:130px;
    left:860px;
    margin:0 auto;
    background-image:url(../image/4pen.jpg);
    color:transparent;
    border-radius:10px 10px;
    box-shadow:0 0 0 100px inset,0 0 5px grey;
    transition:box-shadow 1s; 
    align-items:center;   
}
.section-container4::after
{
  white-space:pre; 
  font:15pt 'sigmar one';
  color:white;
  border:2px solid;
  transition:opacity 1s .5s;
  text-align:center;
}
.section-container4:hover
{
    box-shadow:0 0 0 5px inset,0 0 5px #43A047,0 0 10px #43A047 inset;
    transition:box-shadow 1s;
}
.section-container4:hover::after
{
    opacity:0;
    transition:opacity .5s;
}
.section-container4-container
{
    width:200px;
    height:50px;
    position:absolute;
    top:440px;
    margin:0 auto;
    /*background:radial-gradient(#43A047,#0A3C47 110px);*/
    /*background:radial-gradient(#ffffff,#000000 110px);*/
    /*background:radial-gradient(#ffffff,#bebbbb 110px);*/
}
.section-container4-container a
{
    /*padding:10px 20px;*/
    text-decoration:none;
    text-align:center;
    font-size:20px;
    font-family:Arial;
    color:#43A047;
    width:200px;
    float:left;
    height:50px;
    line-height:50px;
    transition:ease-in 0.5s;
}
.section-container4-container a:hover
{
    width:200px;
    height:50px;
    color:#43A047;
}
.section-container5
{
    width:200px;
    height:500px;
    position:absolute;
    top:130px;
    left:1080px;
    margin:0 auto;
    background-image:url(../image/5pen.jpg);
    color:transparent;
    border-radius:10px 10px;
    box-shadow:0 0 0 100px inset,0 0 5px grey;
    transition:box-shadow 1s; 
    align-items:center;    
}
.section-container5::after
{
  white-space:pre; 
  font:15pt 'sigmar one';
  color:white;
  border:2px solid;
  transition:opacity 1s .5s;
  text-align:center;
}
.section-container5:hover
{
    box-shadow:0 0 0 5px inset,0 0 5px #43A047,0 0 10px #43A047 inset;
    transition:box-shadow 1s;
}
.section-container5:hover::after
{
    opacity:0;
    transition:opacity .5s;
}
.section-container5-container
{
    width:200px;
    height:50px;
    position:absolute;
    top:440px;
    margin:0 auto;
    /*background:radial-gradient(#43A047,#0A3C47 110px);*/
    /*background:radial-gradient(#ffffff,#000000 110px);*/
    /*background:radial-gradient(#ffffff,#bebbbb 110px);*/
}
.section-container5-container a
{
    /*padding:10px 20px;*/
    text-decoration:none;
    text-align:center;
    font-size:20px;
    font-family:Arial;
    color:#43A047;
    width:200px;
    float:left; 
    height:50px;
    line-height:50px;
    transition:ease-in 0.5s;
}
.section-container5-container a:hover
{ 
    width:200px;
    height:50px;
    color:#43A047;
}
#footer
{
    width:100%;
    height:160px;
    /*background-color:#4e4646;*/
    /*background-color:#0A3C47;*/
    /*background-color:#000000;*/
    background-color:#43A047;
    position:absolute; 
    top:660px;
    float:left;
}
.footer-text-header
{
    text-decoration:none;
    text-align:left;
    font-family:Arial;
    font-size:15px;
    color:#ffffff;
    list-style:none;
    /*position:absolute;
    left:200px;*/
}
.footer-text
{
    text-decoration:none;
    text-align:left;
    font-family:Arial;
    font-size:15px;
    color:#ffffff;
    list-style:none;
    /*position:absolute;
    top:35px;
    left:200px;*/
}
.footer-text-header-two
{
    text-decoration:none;
    text-align:left;
    font-family:Arial;
    font-size:15px;
    color:#ffffff;
    list-style:none;
    /*position:absolute;
    top:85px;*/
}
.footer-text-two
{
    text-decoration:none;
    text-align:left;
    font-family:Arial;
    font-size:15px;
    color:#ffffff;
    list-style:none;
    /*position:absolute;
    top:115px;
    left:200px;*/
}
.logo-social-media-ins
{
    width:64px;
    height:64px;
    float:right;
    position:absolute;
    top:15px;
    right:15px;
}
.logo-social-media-ins :hover
{
    background-color:#808080;
    border-radius:100%;    
}
.logo-social-media-facebook
{
    width:64px;
    height:64px;
    float:right;
    position:absolute;
    top:15px;
    right:75px;
}
.logo-social-media-facebook:hover
{
    background-color:#808080;
    border-radius:100%; 
}
.logo-social-media-twitter
{
    width: 64px;
    height: 64px;
    float: right;
    position: absolute;
    top: 15px;
    right: 135px;
}
.logo-social-media-twitter:hover
{
    background-color:#808080;
    border-radius:100%; 
}
.logo-social-media-linked
{
    width: 64px;
    height: 64px;
    float: right;
    position: absolute;
    top: 15px;
    right: 197px;
}
.logo-social-media-linked:hover
{
    background-color:#808080;
    border-radius:100%; 
}
.marka
{
    position:absolute;
    top:140px;
    right:15px;
    color:#ffffff;
    font-family:Arial;
    font-weight:bold;
}
